Extension Documentation

Alternative 'greenish' theme CSS styling
Prev Chapter 10. CSS Styling Next

Alternative 'greenish' theme CSS styling

We realise that a blue theme is not to everyone's taste so we have also supplied an alternative which is commented out in the CSS file. The details settings employed in the 'greenish theme' are displayed below. Recent changes may not be reflected in the documentation and you are advised to view the settings directly in the CSS file for the latest version.

/*************************/
/* Table look and feel   */
/* Alternative  theme    */
/*************************/
table.italtstyle { 
   border-collapse: collapse; 
   border: 1px solid #839E99; 
   background: #f1f8ee; 
   font: .9em/1.2em Georgia, "Times New Roman", Times, serif; 
   color: #033; 
}

table.italtstyle caption { 
   font-size: 1.3em; 
   font-weight: bold; 
   text-align: left; 
   padding: 1em 4px; 
}

table.italtstyle td, 
table.italtstyle th { 
   padding: 3px 3px .75em 3px; 
   line-height: 1.3em;
}

table.italtstyle th { 
   background: #839E99; 
   color: #fff; 
   font-weight: bold; 
   text-align: left; 
   padding-right: .5em; 
   vertical-align: top;
}

table.italtstyle thead th { 
   background: #2C5755; 
   text-align: center;
}

table.italtstyle tr.row0 td { 
   background: #f1f8ee;
   word-wrap: break-word;
}

table.italtstyle tr.row0 th { 
   background: #2C5755;
}

table.italtstyle tr.row1 td { 
   background: #DBE6DD;
   word-wrap: break-word;
}

table.italtstyle tr.row1 th { 
   background: #6E8D88;
}

table.italtstyle td a, 
table.italtstyle td a:link { 
   color: #325C91;
}

table.italtstyle td a:visited { 
   color: #466C8E;
}

table.italtstyle td a:hover, 
table.italtstyle td a:focus { 
   color: #1E4C94;
}

table.italtstyle th a, 
table.italtstyle td a:active { 
   color: #fff;
}

table.italtstyle tfoot th, 
table.italtstyle tfoot td { 
   background: #2C5755; 
   color: #fff;
}

table.italtstyle th + td { 
   padding-left: .5em;
}

The results of the styling is shown in the figure below.

Figure 10.4. Alternative theme styling

Alternative theme styling

The styles are applicable to the list displays available on the front end of the site. i.e. Issues List, Projects List and People List. The menu options available under the 'Advanced' tab permits the specification of the required table style to be used. All that is necessary is that the named table class is present in the 'site template' over ride file.

Prev Up Next
Chapter 10. CSS Styling Home Spearmint flavoured style.
Go To Top

Joomla! Debug Console

Session

Profile Information

Memory Usage

Database Queries