Wiki source code of CSS API Selectors
Last modified by Vincent Massol on 2024/02/26 17:55
Show last authors
author | version | line-number | content |
---|---|---|---|
1 | {{velocity}} | ||
2 | $xwiki.ssx.use("Skins.ColibriClean") | ||
3 | {{/velocity}} | ||
4 | |||
5 | {{velocity}} | ||
6 | {{html}}#info("This page is a work in progress. Thank you!"){{/html}} | ||
7 | {{/velocity}} | ||
8 | |||
9 | == Public vs non public CSS classes == | ||
10 | |||
11 | * what class must absolutely exist and also to ensure we don't use non public classes in document content or in templates (non skin templates); | ||
12 | * The private (internal) vs API (public) list of classes would allow to separate CSS classes in 2 categories : | ||
13 | ** the ones with an agreed behavior that all skins must define, and that application (extensions, etc.) developers can rely on. (like we do with hidden, buttonswrapper, clearfloats, etc.) -> those are APIs | ||
14 | ** the ones that are used to "make the skin work" and for which we allow ourselves to change their behavior, remove them, not define them in all skins, etc. -> those are private, and the extension developers must not rely on them. | ||
15 | |||
16 | == (% class="comment" %) Questions (%%) == | ||
17 | |||
18 | * (% class="comment" %) Structure on id, class? displayed alphabetical | ||
19 | * (% class="comment" %) Structure on general, layout, panels, etc? | ||
20 | * (% class="comment" %) Structure on which classes are used by which skins: colibri, toucan, all ? | ||
21 | * (% class="comment" %) We introduce all classes and ids generated by the templates or used in the actual skins? | ||
22 | |||
23 | == CSS ID == | ||
24 | |||
25 | * #rightPanels, #leftPanels, #editPanels (panels, layout) | ||
26 | * [[#xwikimaincontainer>>CSSAPISelectors_xwikimaincontainer]] (layout) | ||
27 | * #xwikimaincontainerinner (layout) | ||
28 | * #headerglobal (layout) | ||
29 | * #actionmenu (layout, menu) | ||
30 | * #contentcontainer (layout) | ||
31 | * #contentcontainerinner (layout) | ||
32 | * #contentcolumn (layout) | ||
33 | * //#mainContentArea// (layout) - introduces for Colibri | ||
34 | * #xwikicontent (layout) | ||
35 | * #footerglobal (layout) | ||
36 | |||
37 | == CSS Classes == | ||
38 | |||
39 | * .clearfloats (general) | ||
40 | * .hidden (general) | ||
41 | * .invisible (general) | ||
42 | * .loading (general) WYSWYG, GWT | ||
43 | * .separator (general) actionMenu, breadcrumbs, tags, document-info | ||
44 | * .itemCount (general) docExtraTabs, archive panel, document-info | ||
45 | * .active (general) panel li, | ||
46 | * .padded | ||
47 | |||
48 | * .button (buttons) | ||
49 | * .buttonwrapper (buttons) | ||
50 | |||
51 | * .panel (panels) | ||
52 | * .xwikipaneltitle, .collapsed .xwikipaneltitle (panels) | ||
53 | * .xwikipanelcontents, .collapsed .xwikipanelcontents (panels) | ||
54 | |||
55 | * .hideleft, .hideright, .hidelefthideright (layout) | ||
56 | * .leftsidecolumns (layout) | ||
57 | * .main (layout) | ||
58 | * .content (layout) | ||
59 | * .alleditcontent (layout) | ||
60 | |||
61 | * .rightmenu, .leftmenu (menu) | ||
62 | * .topmenuentry (menu) | ||
63 | * .submenu (menu) | ||
64 | * .editinfo (menu) | ||
65 | |||
66 | == Not Used == | ||
67 | |||
68 | * #body | ||
69 | * .viewbody, .editbody | ||
70 | * .layoutsection | ||
71 | * .headerspace | ||
72 | * .content |