Wiki source code of CSS API Selectors
Last modified by Vincent Massol on 2024/11/19 16:15
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 |
