PDA

View Full Version : Changing flat colors theme



napy8gen
03-02-2016, 12:31 AM
This instructions is for intermediate user to change our flat colors theme. Not the gradient one.

There are 6 stylevars to do for block colors.
And multiple links colors but easy to search.
and 2 none stylevars to do in additional.css

1. Style variable properties.
You need to copy and paste to the following stylevars.
Go to style manager> style name> style variable editor>
Use the search box.

1. Blockhead_background
2. forumhead_background
3. navbar_tab_selected_background
4. threadlisthead_background
5. postbithead_background
6. control_content_background

------
2. Use the same search box in style variable editor to search for: link
Change all the links colors listed.

------
Style manager> style name> edit templates> CSS templates> additional.css
3. Use Firefox so you can have search in template box, search for:
If you don't have Firefox, you can copy out all the code, and then paste it in notepad and do the search.
You can search for the colors if in above stylevars you have copied the original colors code. That is much easier search. For example red color theme, it used #9e0b0f as for darker red background colors and links. You can just look for the colors code.

1. search for : /*--- down arrow --*/
you will see this, the colors depend on which style you edited:
Edit the border top color carefully.


/*--- down arrow --*/.navtabs li.selected a.navtab:after { top: 100%;left: 50%;border: solid transparent; content: " ";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(0, 166, 81, 0);border-top-color: #9e0b0f; border-width: 8px;margin-left: -8px;}

2.input[type="submit"], button[type="submit"]
you will see this, the colors depend on which style you edited:
Edit the background color carefully

input[type="submit"], button[type="submit"] { background: #9e0b0f none;}