CSS (Cascading Style Sheets)

New in SyndeoCMS is the use of CSS for all modules, CSS can be used to change the style of the elements used in a module eg. an input field, welcome text etc.
The CSS is stored in the modules table and there are 2 versions: one for the public and one for the protected area.
On a new installation or if you migrate to SyndeoCMS 2.5 (or higher) a default CSS set is stored into the modules table.
The CSS can be used in two ways:


If you want to change the CSS for a module go to the module manager and click [edit] for the module you want to change , see Module manager .

Below is a table containing the CSS classes used for all modules:
(the numbers shown are used in pictures in the modules chapter to show the different parts)

#: Class & default CSS Description
1 .sas_module_title {
font-size: 14pt;
}
Defines the style properties for the all the welcome text in modules.
2 .sas_module_lbl1 {
font-weight: bold;
font-size: 10pt;
}
Defines properties text labels used in modules
eg. description of input fields.
3 .sas_module_text {
font-size: 10pt;
}
Defines properties for normal text in modules
4 .sas_module_lbl2 {
/* */
font-size: 10px;
}
Defines properties text labels used in modules
descriptive smaller text like 'required field'.
5 .sas_module_input {
font-size: 10pt;
}
Defines properties for all input fields used in modules
6 .sas_module_subtitle {
font-size: 14px;
font-weight: bold;
}
This class defines the style properties for modules which have sub titles.
7 .sas_module_link {
text-decoration: underline ;
font-weight: bold;
}
Defines the style properties for url links in modules.
8 .sas_row_color_odd {
background-color: #FFFFFF ;
}
Defines properties for odd rows in modules
9 .sas_row_color_even {
background-color: #C0C0FF ;
}
Defines properties for even rows in modules
10 .sas_module_error {
color : red;
}
Defines properties for error messages.
11 .sas_module_table {
width : 550px;
}
Defines properties for the main table in all modules.
The default is set to 550px because this was hard coded in previous versions. Better is to use 100% if that fits in your template.

In SyndeoCMS 3.0 you can style the forms (Mail, guestbook etc) by using the #theForm and #theForm li
in your CSS. eg:

#theForm {
background: #EEEEEE;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
}
#theForm li {
background: #e1e1e1;
}

The border radius give you round corners in modern browsers (Firefox 4.0 and IE9)
older browsers will ignore these definitions.

Go to the description for the  invidual modules to see for which part of the module the above classes are used. See Modules