History: CssStylesDev
Preview of version: 19
Overview
This page describes all used/defined CSS styles. Theme makers can use this page as the Tiki styles reference guide 😊. Of couse all developers must pay attention to update this page if something is changed. And theme makers can subscribe to be notified on page changes... 😊
Btw, when style for link is defined of course other pseudo classes can (and should 😊 be used/defined too.
Table Of Contents
Table of contents
General Layout Styles
The tiki application is enclosed as a whole in tiki-main. tiki-main contains three divs: tiki-top, tiki-mid and tiki-bot that will be used for the header, application and footer.
tiki-mid contains a 3-column table, the columns are called (ids) leftcolumn, centercolumn and rightcolumn. Finally centercolumn contains tiki-center where the main area of the application is displayed.
| CSS code | Description |
| -+div#tiki-main+- | This div encloses the whole Tiki application |
| 3 divs inside tiki-main | |
| -+div#tiki-top+- | This is the header |
| -+div#tiki-mid+- | This is the middle |
| -+div#tiki-bot+- | And this is the footer |
| The three columns indide tiki-mid | |
| -+td#leftcolumn+- | |
| -+td#rightcolumn+- | |
| -+td#centercolumn+- | |
| The central div inside centercolumn | |
| -+div#tiki-center+- | |
Boxes
Boxes are used to present a box with a title bar and content, they are used for modules and they are also used in the rankings, admin screen, {-+BOX+-} wiki plugin etc.
The box class is used for modules while the cbox class is used for other boxes. (what other boxes??). Simple box generated by wiki '^' syntax.
| CSS code | Description |
| Box used in module | |
| div.box | Boxes used for modules: They are divided into title and data. |
| div.box-title | Modules boxes title |
| div.box-data | Modules boxes data |
| td.module | When modules display a numbered list of items each item is enclosed in a cell with the following style (included in div.box-data) |
| .linkmodule | Links in modules |
| Box not used in module | |
| div.cbox | Boxes not used for modules: They are divided into title and data. |
| div.cbox-title | Title of boxes not used in modules |
| div.cbox-data | Data of boxes not used in modules |
| .cboxtlink | Links in the title of boxes not used in modules |
| Box in box not used in module | |
| div.simplebox | a box with a margin and a border (ex: in user preferences) |
Menus
| CSS code | Description |
| div.separator | Extendable menu line(included in div.box-data) |
| .linkmenu | Link in menu line |
| .separator | Link in menu line that can expand |
| .flip | Link in the box-title if the menu can be flipped |
Tables
Wiki
| CSS code | Description |
| div.wikitext | box where the wiki page text is displayed |
| page-bar | page bar where the actions are displayed ("history", "edit",....) |
| div.button2 | button in the page bar |
| linkbut | link in button2 |
File gals
Image gals
| CSS code | Description |
| .normal | table containing the articles list |
| td.heading | table heading cell |
| td.even, td.odd | cell |
Blogs
| CSS code | Description |
| .bloglist | table containing the blogs list |
| td.bloglistheading | table heading cell |
| td.bloglistnameeven, td.bloglistnameodd | blog name cell |
| td.bloglistdescriptioneven, td.bloglistdescriptionodd | blog description cell |
| ... | ... |
Articles
| CSS code | Description |
| .normal | table containing the articles list |
| td.heading | table heading cell |
| td.even, td.odd | cell |
Forums
| CSS code | Description |
| .forumstable | table containing the forums list |
| td.forumheading | table heading cell |
| td.forumstableeven, td.forumstableodd | forum name cell |
| td.forumstableinfoeven, .forumstableinfoodd | forum information cell |
FAQs
Calendar
| .Cal0, .Cal1, .Cal2 | Used for status : 0 = unconfirmed, 1 = confirmed, 2 = cancelled / note that the usage of the :before pseudo-class maybe not supported by old browsers |
| .caltitle | No idea what it is |
| .caltab, a.caltab and a.caltab:hover | Tabs and included link when unactive |
| .caltabon, a.caltabon and a.caltabon:hover | Tabs and included links when that tab is active |
| div#tab, div#tabcal, div#tabnav, div.tabcal, div.tabnav | Look for the content of tabs zone (beetween buttons and the calendar) |
| .calcheckbox | Style for checkbox div. Background-color is required, even if set to 'none'. |
| .caltoggle | Style for the 'check / uncheck all' checkbox |
| div#opaque | used for the div used around overlib, in case div.box has no background defined (mainly used in boreal and matrix) |
| .calfocus, .calfocus a, .calfocuson, .calfocuson a | styles for title of each days, with .calfocuson when the focus is on that day |
| .Calwiki, .Calwiki a, .Calwiki:before and same families for .Calblog, .Calgal, .Calart, .Calforum, .Caldir, .Calfgal, .Calfaq, .Calquiz, .Caltrack, .Calsurv, .Calnl, .Caleph, .Calchart | One style and family of pseudo classes for each tiki-item. |
| .viewmodeon, .viewmodeoff | Style of the links to change mode (week, month) |
| .calweb | The look for the small "w" that appears when there is anurl on the event |
| .calprio1 to .calprio9 | Reproduced the 9 levels from sourceforge for priorities |
| mose | |
...
P.S.
Please continue this page...
History
| Information | Version | |||||
|---|---|---|---|---|---|---|
| drsassafras Mass search and replace | 31 | |||||
| drsassafras Mass search and replace | 30 | |||||
| drsassafras Mass search and replace | 29 | |||||
| Gary Cunningham-Lee Content replaced by link to themes.tw.o. | 28 | |||||
| Michael Davey | 27 | |||||
| Michael Davey | 26 | |||||
| Michael Davey | 25 | |||||
| Michael Davey | 24 | |||||
| bapajan | 23 | |||||
| Oliver Hertel | 22 | |||||
| sylvie greverend | 20 | |||||
| sylvie greverend | 19 | |||||
| Bryan Pfaffenberger | 18 | |||||
| sylvie greverend | 17 | |||||
| sylvie greverend | 16 | |||||
| sylvie greverend | 15 | |||||
| sylvie greverend | 14 | |||||
| Marc Laporte | 9 | |||||