Difference between revisions of "Themes"
m (Formatting, links...) |
|||
| Line 1: | Line 1: | ||
| + | == Change Theme == | ||
| + | |||
| + | In order to change what theme you currently use, you'll need to go to the [[Titan Settings#Global Settings|Global Settings]] (the cog in the upper right corner of the app), and choose [[File:ChoiceTheme.PNG|40px]] your CSS file. | ||
| + | |||
| + | == Create == | ||
| + | Titan uses [http://doc.qt.io/qt-4.8/ Qt 4.8], and it supports [http://doc.qt.io/qt-4.8/stylesheet-syntax.html most of the common CSS syntax.] The basics of CSS (which Qt 4.8 supports) can be found here: https://www.w3schools.com/Css/ | ||
| + | |||
In order to create themes, you must have the base CSS file that is included with every download of Titan. | In order to create themes, you must have the base CSS file that is included with every download of Titan. | ||
| − | The base theme has little comments on what each | + | The base theme has little comments on what each Qt element does, but a fully commented base theme is kept up to date by Bl4ckNeon and can be found here: https://paste.ee/p/7uDFN#25KlTTFEkDiDsVmIpCnxUNhMct3583wn |
The base theme is a great starting point if you are looking to fully customize and change the Titan layout or if you want to change a single element. | The base theme is a great starting point if you are looking to fully customize and change the Titan layout or if you want to change a single element. | ||
The easiest way to make a theme is to use notepad++ (or your favorite advanced text editor/IDE) and find and replace all of the default colors (stated at the very top of the CSS file). | The easiest way to make a theme is to use notepad++ (or your favorite advanced text editor/IDE) and find and replace all of the default colors (stated at the very top of the CSS file). | ||
| − | For a more | + | For a more in-depth theme, it requires going tag by tag and editing/adding properties. |
| − | + | == Share == | |
If you would like your theme to be officially endorsed and even possibly shipped with Titan then the following must be present: | If you would like your theme to be officially endorsed and even possibly shipped with Titan then the following must be present: | ||
| − | + | # The background property for "QPushButton#hamburger_logo:hover" must be #0C9BDC (official Titan blue) | |
| + | # The background property for "QPushButton#hamburger_logo_exit:hover" must be #52c175 | ||
| − | + | When you got your CSS file ready, you'll need to [[Contact Us|get in touch]] with the team, and they will assess your work.<br /> | |
| + | If that's too much, you could always just share your work on public routers! | ||
Latest revision as of 10:53, 7 July 2017
Change Theme
In order to change what theme you currently use, you'll need to go to the Global Settings (the cog in the upper right corner of the app), and choose 
your CSS file.
Create
Titan uses Qt 4.8, and it supports most of the common CSS syntax. The basics of CSS (which Qt 4.8 supports) can be found here: https://www.w3schools.com/Css/
In order to create themes, you must have the base CSS file that is included with every download of Titan.
The base theme has little comments on what each Qt element does, but a fully commented base theme is kept up to date by Bl4ckNeon and can be found here: https://paste.ee/p/7uDFN#25KlTTFEkDiDsVmIpCnxUNhMct3583wn
The base theme is a great starting point if you are looking to fully customize and change the Titan layout or if you want to change a single element.
The easiest way to make a theme is to use notepad++ (or your favorite advanced text editor/IDE) and find and replace all of the default colors (stated at the very top of the CSS file). For a more in-depth theme, it requires going tag by tag and editing/adding properties.
If you would like your theme to be officially endorsed and even possibly shipped with Titan then the following must be present:
- The background property for "QPushButton#hamburger_logo:hover" must be #0C9BDC (official Titan blue)
- The background property for "QPushButton#hamburger_logo_exit:hover" must be #52c175
When you got your CSS file ready, you'll need to get in touch with the team, and they will assess your work.
If that's too much, you could always just share your work on public routers!
