Titan's appearance is controlled by the stylesheet. Branding Titan involves changing the stylesheet to display different background images and table colours; we suggest that you choose 4 colours to be used throughout. If you have experience of CSS then you can change the stylesheet in any way you want, however, our method ensures ease of use, so is recommended for people new to the system and CSS.
What CAN be altered using the stylesheet:
|
What CAN'T be altered using the stylesheet:
|
The default colours used in Titan are listed below:
| Colour1: | #3366CC | |
| Colour2: | #0099CC | |
| Colour3: | #008080 | |
| Colour4: | #529C98 |
If you look at the stylesheet you will see comments - /* this is a comment */ - labelling the elements that use Colour1 - Colour4. You need to replace the current colour code with the new one you have chosen. A page displaying the Hexadecimal colour codes is available here.
For example, to change the background colour of an object labelled as Colour1 from blue (#3366CC) to gray (#808080):
background-color: #3366CC; /* Colour1 */
would be changed to:
background-color: #808080; /* Colour1 */
Every instance of /* Colour1 */ within the stylesheet needs to be updated. This also applies to /* Colour2 */, /* Colour3 */ and /* Colour4 */. Once you have decided upon the colours you want to use, you need to replace every instance of them within the stylesheet. To see the changes, download the zip file of this site, modify the stylesheet CSSSheet.css as explained above, and view the demonstration page.
As well as changing the background colour of the tables, you can control the text colour and link colours. The Stylesheet element that controls specific text and link colours is noted in brackets next to each piece of text in the demonstration page.
For example:
| Text (.TableHdrColAtr0) |
So to change the text displayed in this cell you would need to change the .TableHdrColAtr0 element in the stylesheet.