From version 1.1 >
edited by agoncal
on 2007/03/22
To version < 1.2 >
edited by agoncal
on 2007/03/22
>
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -1,67 +1,85 @@
1 1  1 CSS Files
2 2  
3 -This page helps you to understand the different css files used in xWiki, their purpose and content. xWiki skins use several css files to separe the different components of the {style:type=span|class=st}skin{style}: basic elements, layout, colors, etc.
3 +This page helps you to understand the different css files used in xWiki, their purpose and content. xWiki skins use several css files to separe the different components of the {style:type=span|class=st}skin{style}: basic elements, layout, colors, etc.
4 4  
5 5  1.1 Core files
6 +
6 6  1.1.1 style.css
7 -Is the top level style file. It's purpose is to
8 -include all the other files. It
9 -shouldn't have If there is any other css in there, it
10 -shouldn't.\\
11 -- elements.css = intended to provide general design rules
12 -regarding the html elements. For example, default font size and family for
13 -headings, underline for links, etc. It should not provide color properties.
8 +Is the top level style file. It's purpose is to include all the other files. It shouldn't have any other css in there.
14 14  \\
15 -<!--
16 -D(["mb","presentation.css\u003cbr\>- screenlayout.css \u003d the place where the general layout of the interface is specified. This file should contain rules regarding position, dimension and display mode for the major elements of the interface (header, side panels, menu, footer...)\n\u003cbr\>- presentation.css \u003d refinement of screenlayout.css. This is where borders, margins, paddings are set, font styling for objects not in elements.css or classes.css, along with some specific elements of the layout which are not affecting the general layout (where is the profile picture displayed, how is the comment auther displayed, etc.)\n\u003cbr\>- colors*.css \u003d the place where the skin gets painted. Without this file, the skin should be black and white only (except the blue links). Font color, background, border color, \u003cbr\>\u003cbr\>Special purpose files:\u003cbr\>- rss.css\n \u003d a few rules to format how profile rss is displayed\u003cbr\>- microformats.css \u003d stylesheet to format the different microformats-enabled pages (user profile, blog, calendar...)\u003cbr\>- chwSkin.css \u003d formatting for the Chart Wizard (soon to be re-released)\n\u003cbr\>- tdwSkin.css \u003d formatting of the Table Datasource Wizard (part of Chart Wizard)\u003cbr\>- print.css \u003d formatting for the @media print. Currently kind of empty and useless, it must be written once the albatross skin is ready.\n\u003cbr\>\u003cbr\>Deprecated (soon to be removed)\u003cbr\>- wiki.css \u003d it was supposed to format wiki generated syntax, like .wikilink and .heading-1-1\u003cbr\>- xwiki.css \u003d it was one of the few files holding css (stage 1)\u003cbr\>- ie.css \u003d some old hacks to make the &#39;default&#39; skin work in IE too.\n\u003cbr\>- styel1/2/3.css \u003d variants of the &#39;default&#39; skin, with green, pink and ~yellow colors.\u003cbr clear\u003d\"all\"\>- temp.css \u003d used for some tests; generally a buffer before splitting rules among the other files.\u003cbr\>\u003cbr\>\nPossibly usable files, if somebody makes the skin wizard.\u003cbr\>- customlayout.css \u003d a dynamic version of screenlayout.css, using properties defined in a skin object. Should be parsed by velocity.\u003cbr\>- customcolors.css \u003d same, but for colors.\n",1]
17 -);
18 18  
19 -//-->- classes.css = like elements.css, but formats elements having a similar
20 -semantic meaning (after all, a class should have a semantic name, and not a
21 -random id). As examples, .underline, .hidden, .sep, .wikicreatelink, or
22 -.heading-1-1. This should only contain general classes, for specific elements
23 -see
11 +1.1.1 elements.css
12 +This stylesheet is intended to provide general design rules
13 +regarding the html elements. For example, default font size and family for headings, underline for links, etc. It should not provide color properties.
14 +\\
24 24  
25 - presentation.css\\
26 -- screenlayout.css = the place where the general layout of
27 -the interface is specified. This file should contain rules regarding position,
28 -dimension and display mode for the major elements of the interface (header, side
29 -panels, menu, footer...) \\
30 -- presentation.css = refinement of
31 -screenlayout.css. This is where borders, margins, paddings are set, font styling
32 -for objects not in elements.css or classes.css, along with some specific
33 -elements of the layout which are not affecting the general layout (where is the
34 -profile picture displayed, how is the comment auther displayed, etc.) \\
35 --
36 -colors*.css = the place where the {style:type=span|class=st}skin{style}
37 -gets painted. Without this file, the {style:type=span|class=st}skin{style}
38 -should be black and white only (except the blue links). Font color, background,
39 -border color, \\
16 +1.1.1 classes.css
17 +Like elements.css, but formats elements having a similar semantic meaning (after all, a class should have a semantic name, and not a
18 +random id). As examples, .underline, .hidden, .sep, wikicreatelink, or .heading-1-1. This should only contain general classes, for specific elements see presentation.css
40 40  \\
41 41  
21 +1.1.1 screenlayout.css
22 +The place where the general layout of the interface is specified. This file should contain rules regarding position, dimension and display mode for the major elements of the interface (header, side
23 +panels, menu, footer...).
24 +\\
25 +
26 +1.1.1 presentation.css
27 +Refinement of screenlayout.css. This is where borders, margins, paddings are set, font styling for objects not in elements.css or classes.css, along with some specific elements of the layout which are not affecting the general layout (where is the profile picture displayed, how is the comment auther displayed, etc.).
28 +\\
29 +
30 +1.1.1 colors*.css
31 +Is the place where the skin gets painted. Without this file, the skin should be black and white only (except the blue links). Font color, background, border color.
32 +\\
33 +
42 42  1.1 Special purpose files
43 -- rss.css = a few rules to
44 -format how profile rss is displayed\\
45 -- microformats.css = stylesheet to format
46 -the different microformats-enabled pages (user profile, blog, calendar...)\\
47 --
48 -chwSkin.css = formatting for the Chart Wizard (soon to be re-released) \\
49 --
50 -tdwSkin.css = formatting of the Table Datasource Wizard (part of Chart
51 -Wizard)\\
52 -- print.css = formatting for the @media print. Currently kind of
53 -empty and useless, it must be written once the albatross {style:type=span|class=st}skin{style} is ready. \\
35 +
36 +1.1.1 rss.css
37 +A few rules to format how profile rss is displayed.
54 54  \\
55 55  
40 +1.1.1 microformats.css
41 +Stylesheet to format the different microformats-enabled pages (user profile, blog, calendar...).
42 +\\
43 +
44 +1.1.1 chwSkin.css
45 +Formatting for the Chart Wizard.
46 +\\
47 +
48 +1.1.1 tdwSkin.css
49 +Formatting of the Table Datasource Wizard (part of Chart Wizard).
50 +\\
51 +1.1.1 print.css
52 +Formatting for the @media print.
53 +\\
54 +
56 56  1.1 Deprecated (soon to be removed)
57 --
58 -wiki.css = it was supposed to format wiki generated syntax, like .wikilink and
59 -.heading-1-1\\
60 -- xwiki.css = it was one of the few files holding css (stage
61 -1)\\
62 -- ie.css = some old hacks to make the 'default' {style:type=span|class=st}skin{style} work in IE too. \\
63 -- styel1/2/3.css = variants of the
64 -'default' {style:type=span|class=st}skin{style}, with green, pink and
65 -~yellow colors.\\
66 -- temp.css = used for some tests; generally a
67 -buffer before splitting rules among the other files.\\
56 +1.1.1 wiki.css
57 +It was supposed to format wiki generated syntax, like .wikilink and .heading-1-1.
58 +\\
59 +
60 +1.1.1 xwiki.css
61 +It was one of the few files holding css (stage 1).
62 +\\
63 +
64 +1.1.1 ie.css
65 +Some old hacks to make the default skin work in IE too.
66 +\\
67 +
68 +1.1.1 styel1/2/3.css
69 +Variants of the 'default' skin, with green, pink and yellow colors.
70 +\\
71 +
72 +1.1.1 temp.css
73 +Used for some tests.
74 +\\
75 +
76 +1.1 Possibly usable files
77 +~~if somebody makes the skin wizard~~
78 +
79 +1.1.1 customlayout.css
80 +A dynamic version of screenlayout.css, using properties defined in a skin object. Should be parsed by velocity.
81 +\\
82 +
83 +1.1.1 customcolors.css
84 +Same, but for colors.
85 +\\

Get Connected