Customizable App Themes
With Q Alerts for Android version 9.0.0 and above, you can import pre-defined app themes.
Not only can you import new themes that we may design in the future without having to update your app, the community can also design and share new themes they may design. Keep an eye on Twitter, other social media and various Patriot websites for new themes designed by individuals in the community.
Importable Themes by QAlerts.app
To import a theme, go into the app. Tap the vertical ellipsis menu. Select "Settings". Select "Color Scheme". Choose "Custom". Then type or paste the full URL to the themes JSON file. Example: https://qalerts.app/themes/marpat.json
- 8kun.json
- discord.json
- gab.json
- gab_dark.json
- hacker.json
- marpat.json
- pink_camo.json
- qalerts_app.json
- qalerts_dark.json
- qalerts_dark_new.json
- qalerts_light.json
- qalerts_light_new.json
- qanon_pub.json
- qmap.json
- qmap_light.json
Community Designed Custom Themes
All themes are configured as JSON text files. For themes that specify a background image, the background image must be in the form of a URL that can be downloaded from a website. Example: https://some-site.com/some-folder/some-background-image.png or https://some-site.com/some-folder/some-background-image.jpg
Below is a sample theme JSON file. You can copy the contents into a text file and then modify the contents to your liking. Keep in mind, the JSON data must be saved as a text file, not a Word document or any other proprietary document format. Windows Notepad, Mac TextEdit or a similar raw text editor should be used. Then simply save it to your computer as a different filename (for example: my_rad_theme.json), upload it to a publicly reachable website and then either import into the Q Alerts app via the URL, share the link with others or both.
Documentation
COLORS: All colors must be either a hexidecimal color codes with the preceding # (example: #FF0000 is red), or a basic named color such as "white", "black", "red", "yellow", "pink", etc. For borders and background colors you can also use a value of "transparent" to make the item transparent.
androidTheme: These are themes predefined in the app. They define various Android system colors. They can not be changed by the user. You must choose from the available themes below until you find one that works with the custom theme you are designing. The names ARE cASe senSiTIve.
Theme Name | colorPrimary | colorPrimaryDark | colorAccent | colorControlHighlight | colorControlActivated | navigationBarColor | statusBarColor | textColorPrimary | textColor | colorButtonNormal |
---|---|---|---|---|---|---|---|---|---|---|
Theme.8Ch | #D50000 | #8b0000 | #2d2e52 | #ebf0ff | #000000 | #424242 | #8b0000 | #444444 | #000000 | #000000 |
Theme.Discord | #2f3237 | #26292b | #42A5F5 | #101010 | #c5c6c9 | #000000 | #26292b | #e0e0e0 | #ffffff | #FFFFFF |
Theme.Gab | #49a865 | #ffffff | #49a865 | #F5F5F5 | #49a865 | #000000 | #c0bfc0 | #444444 | #000000 | #000000 |
Theme.GabDark | #49a865 | #ff0000 | #49a865 | #101010 | #49a865 | #000000 | #000000 | #e0e0e0 | #d8d8d8 | #FFFFFF |
Theme.Hacker | #101010 | #101010 | #00EE22 | #00FF33 | #00FF33 | #101010 | #00FF33 | #FEFEFE | #00FF33 | #FFFF00 |
Theme.MarPat | #455147 | #29272f | #c8c9c1 | #101010 | #7e6355 | #000000 | #29272f | #e0e0e0 | #ffffff | #FFFFFF |
Theme.PinkCamo | #ed74a8 | #68696b | #a3a4f6 | #ffbefa | #d08aed | #68696b | #d08aed | #444444 | #000000 | #000000 |
Theme.QAlertsApp | #D50000 | #8b0000 | #d50000 | #F5F5F5 | #D50000 | #424242 | #8b0000 | #444444 | #000000 | #000000 |
Theme.QAlertsDark | #D50000 | #8b0000 | #42A5F5 | #101010 | #ebebeb | #424242 | #8b0000 | #e0e0e0 | #ebebeb | #FFFFFF |
Theme.QAlertsDarkNew | #ca0816 | #ca0816 | #42A5F5 | #308bc9 | #ebebeb | #171717 | #171717 | #ffffff | #ffffff | #ffffff |
Theme.QAlertsLight | #D50000 | #8b0000 | #d50000 | #F5F5F5 | #D50000 | #424242 | #8b0000 | #444444 | #141414 | #000000 |
Theme.QAlertsLightNew | #1e2127 | #1e2127 | #42A5F5 | #308bc9 | #ebebeb | #171717 | #171717 | #ffffff | #ffffff | #ffffff |
Theme.QAnonPub | #6c7d8e | #8b0000 | #000aeb | #ffffff | #6c7d8e | #424242 | #000000 | #444444 | #000000 | #000000 |
Theme.QMap | #178cbe | #8b0000 | #1997c6 | #2a2d36 | #cfd2da | #424242 | #2a2d36 | #e0e0e0 | #cfd2da | #FFFFFF |
Theme.QMap.Light | #178cbe | #8b0000 | #1997c6 | #f7f7f7 | #178cbe | #424242 | #2a2d36 | #444444 | #161616 | #000000 |
winBackgroundColor: The base background color for each screen within the app.
winBackgroundImage: The full URL of an optional background image that will be displayed on each screen within the app. Example: "http://www.some-site.com/some-folder/some-image.jpg".
The background image will non-proportionately scale to screen width/height according to the screen size (thus creating a stretched/scewed effect), therefore, you may want to create different themes for different device types (i.e. widescreen tablets vs. portrait display phones). For example, on a Google Pixel phone, the screen size is 1080 pixels wide x 1920 pixels tall. This is a 16:9 aspect ratio. Many/most phones use a 16:9 ratio. Therefore, whatever background image you design, it is best to make sure it's width is .5625% of the height. Example: If your image is 2048 pixels tall, it's width should be 1,152 (2048 * .5625). Due to various DPI (dots per inch) used on devices, you may want to make your image larger than the base width/height of 1080x1920. Keep in mind, this will increase file size and will thus cause slightly slower load time on the phone and use more device memory. It's all about balance.
To not use a background image, leave this setting blank. Example: "".
borderColor: Generally this is the color of the divider line when showing the list of posts. However, it could be used for other borders that are not revelent to the other more specific settings: contentBorderColor1, contentBorderColor2, referenceBorderColor1, referenceBorderColor2.
primaryTextColor: The main text color used when no other color is defined via other available settings. The majority of text content within the app uses this color.
subduedText: Text color used in various area where subdued text is desirable, such as the icons lines in the list.
todayColor: The text color that is used to display the actual post # when the post is from today.
yesterdaysColor: The text color that is used to display the actual post # when the post is from yesterday.
postNumberColorContent: The text color that is used to display the actual post # when the post is not from today or yesterday.
contentBackgroundColor1: The background color of the first content box of the post. This is where the post #, date, trip code is displayed.
contentBorderColor1: The border color of the first content box of the post. This is where the post #, date, trip code is displayed.
contentBorderWidth1: The border width of the first content box of the post. This should be in the format of #dp. Example: For a 1 pixel border width, use "1dp". This is where the post #, date, trip code is displayed.
contentBackgroundColor2: The background color of the second content box of the post. This is where the main post content is displayed.
contentBorderColor2: The border color of the second content box of the post. This is where the main post content is displayed.
contentBorderWidth2: The border width of the second content box of the post. This should be in the format of #dp. Example: For a 1 pixel border width, use "1dp". This is where the main post content is displayed.
referenceHeaderPostNumberTextColor: The text color that is used to display the post # in the first box in a referenced post section. For example: #8251669.
referenceHeaderTextColor: The text color for most other text shown in the referenced post areas.
referenceBackgroundColor1: The background color of the first content box of a referenced post. This is where the post #, date, trip code is displayed.
referenceBorderColor1: The border color of the first content box of a referenced post. This is where the post #, date, trip code is displayed.
referenceBorderWidth1: The border width of the first content box of a referenced post. This should be in the format of #dp. Example: For a 1 pixel border width, use "1dp". This is where the post #, date, trip code is displayed.
referenceBackgroundColor2: The background color of the second content box of a referenced post. This is where the main content of the referenced post is displayed.
referenceBorderColor2: The border color of the second content box of a referenced post. This is where the main content of the referenced post is displayed.
referenceBorderWidth2: The border width of the second content box of a referenced post. This should be in the format of #dp. Example: For a 1 pixel border width, use "1dp". This is where the main content of the referenced post is displayed.
navBarColor: The color for the post navigation bar that is displayed at the bottom when viewing a post. This is the bar that allows you to tap to move to the next or previous post.
navBarColorSelected: The color for the post navigation bar button when it is tapped.
navBarColorDisabled: The color for the post navigation bar button when it is disabled.
navBarTextColor: The color of the text displayed in the post navigation bar.
useDarkNavBarIcons: Most Q Alerts themes use white icons in the posts navigation bar. To use white icons, enter a value of false (no double-quotes). To use black icons, enter a value of true (no double-quotes).
useDarkPlayIcons: On older Android versions you can customize the notification sound via settings. In this screen is a play icon that let's users preview sounds. To use white icons, enter a value of false (no double-quotes). To use black icons, enter a value of true (no double-quotes).
newBackgroundImage: This is the image that is displayed to the left of posts when they are unread. You can choose from the following:
8ch-bg.png | #7374DC |
gab-bg.png | #49A865 |
hacker-bg.png | #00FF33 |
pinkcamo-bg.png | #ED74A8 |
qalerts-green-bg.png | #4CAF50 |
qanonpub-bg.png | #A6F2D9 |
qmap-bg.png | #1997C6 |
red-bg.png | #D50000 |
white-bg.png | #FFFFFF |
Did you come up with an awesome theme? Share it with us (@QAlertsApp) and everyone else on Twitter.