CssCleaning

Goal: clean the CSS files and the templates to:

• have smaller CSS files to minimize bandwidth
• be able to modify easily a CSS file
• reduce the need of individual tpl files per theme
• unify the Tiki layout
• unify used styles

Some points to keep in mind

• become XHTML Strict 1.0 compliant
• get WAI compliant

• div.box
• div.box-title (in div.box)
• div.box-data (in div.box)

The box width is limited (a module that appears in the middle column will have a limited size — it needs to be defined in CSS in some way). If the box style should be changed in the center column (for example then module placed on wiki page) the following CSS code may be used

#centercolumn div.box {}
// or
div.wikitext div.box {}
// to select module placed on wiki page by {MODULE} wiki plugin

Every box should have an unique ID because the module can be duplicated. ID is needed when theme author wants to define something special for a module.

These tables must be used each time a list of content with attribute is displayed.
They will be used in Wiki pages list, Wiki last changes, Wiki rankings, stats, orphan pages, file galleries list, image gals list, blogs list, articles list, etc.

• table.normal
• th : for a heading cell (WAI compliance: <th scope="col">)
• td.even : for a long text cell on an even line
• td.odd : "" odd line
• td.evenNumber : for a number
• td.oddNumber
• td.evenAction : for an actions list
• td.oddAction:

To be able to customize each table, a table id will be added <table class="normal" id="listPages"> a clear convention name for the id must be defined This way, each cell can be customized according to #listPages td.even{} All the "style="text-align:right"" will be removed and replaced with <td class="evenNumber"> or <td class="oddNumber"> Question: Do we need more distinction in a cell: a long text is left justified, but a number can be right or center, a username can be left or center, an actions lists is nowrap. Will it be more powerful to have "<td class=even"><span class="action">... </span></td>" for each type of an attribute With this representation it will not be possible to represent differently an even column and an odd column

1. Every element in form (input fields) should have IDs, too
2. IDs are not required bcouse names are already set (which is unique identify element) but CSS code becomes CSS2...
   Copy to clipboard

   // select input field named 'description' in form of class normal
   // and identified as 'wikiedit'...
   td.normal#wikiedit input[name="description"] {}

• all the local menus (generally just under the title) are merged as
  Copy to clipboard

  <a class="linkbut">menu1</a><a class="linkbut">menu2</a>

  • The sequence "[menu1 | menu2]" are converted to the previous
  • Some class links that has already there have been replaced (link, gallink, bloglink, fgallink, forumbutlink)
  • Advice: linkbot can be a box with background / border and padding: a margin will separate the item
  • Some classes used have been replaced
  • Improvement: it is easier to have all these buttons as a div