The xtgem_template.css file uses a system of variables and four commands to allow you to adjust colors from the panel/template tool (current template)
In the css of the template the variables are used like this :
.class_name {css_operator:/*$variable_name*/#hex_value/*e*/;}You will find the definitions at the bottom of the xtgem_template.css file
NOTE:
The whole variable and command definitions area MUST be enclosed in css comment tags
/*. . . . . .*/The definitions for the initial value variable name and title for the colors are set between
{{base}}
. . . . . .
{{/end}}
{{base}}
Title:
$name:#hex color value;
Title:
$name:#hex color value;
{{/end}}The command definitions for the automatically adjusted complimentary colors are set between
{{mix}}
. . . . . .
{{/end}}
{{mix}}
$new_name:command $base_name adjustment % ... ...;
{{/end}}The commands are:
lighten
Create a new color variable by lightening a existing color variable by a percentage
darken
Create a new color variable by darkening a existing color variable by a percentage
saturate
Create a new color variable by adjusting the saturation of a existing color variable by a percentage
color_adjust
Create a new color variable by adjusting a existing color variables hue saturation and lightness by given percentages
Here is a stripped down template for test purposes rename your current Xtgem_template.css to something else and copy this to a blank text file named xtgem_template.css
Here are a set of <div> tags with the classes set
copy them to a code block on a test page
