Skip to Content

CSS API Selectors

Version 3.1 by Ecaterina Moraru (Valica) on 2020/01/28 14:37
Warning
For security reasons, the document is displayed in restricted mode as it is not the current version. There may be differences and errors due to this.

 
 Implementation
 Completed
 

Description

Failed to execute the [velocity] macro. Cause: [The execution of the [velocity] script macro is not allowed in [design:Standards.CSSAPISelectors]. Check the rights of its last author or the parameters if it's rendered from another script.]. Click on this message for details.

Failed to execute the [velocity] macro. Cause: [The execution of the [velocity] script macro is not allowed in [design:Standards.CSSAPISelectors]. Check the rights of its last author or the parameters if it's rendered from another script.]. Click on this message for details.

Public vs non public CSS classes

  • 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);
  • The private (internal) vs API (public) list of classes would allow to separate CSS classes in 2 categories :
    • 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
    • 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.

 Questions 

  •  Structure on id, class? displayed alphabetical 
  •  Structure on general, layout, panels, etc?  
  •  Structure on which classes are used by which skins: colibri, toucan, all ?  
  •  We introduce all classes and ids generated by the templates or used in the actual skins? 

CSS ID

  • #rightPanels, #leftPanels, #editPanels (panels, layout)
  • #xwikimaincontainer (layout)
  • #xwikimaincontainerinner (layout)
  • #headerglobal (layout)
  • #actionmenu (layout, menu)
  • #contentcontainer (layout)
  • #contentcontainerinner (layout)
  • #contentcolumn (layout)
  • #mainContentArea (layout) - introduces for Colibri
  • #xwikicontent (layout)
  • #footerglobal (layout)

CSS Classes

  • .clearfloats (general)
  • .hidden (general)
  • .invisible (general)
  • .loading (general) WYSWYG, GWT 
  • .separator (general) actionMenu, breadcrumbs, tags, document-info
  • .itemCount (general) docExtraTabs, archive panel, document-info
  • .active (general) panel li, 
  • .padded 
  • .button (buttons)
  • .buttonwrapper (buttons)
  • .panel (panels)
  • .xwikipaneltitle, .collapsed .xwikipaneltitle (panels)
  • .xwikipanelcontents, .collapsed .xwikipanelcontents (panels)
  • .hideleft, .hideright, .hidelefthideright (layout)
  • .leftsidecolumns (layout)
  • .main (layout)
  • .content (layout)
  • .alleditcontent (layout)
  • .rightmenu, .leftmenu (menu)
  • .topmenuentry (menu)
  • .submenu (menu)
  • .editinfo (menu)

Not Used

  • #body
  • .viewbody, .editbody
  • .layoutsection
  • .headerspace
  • .content

 

About

About

Support

Platform

User Guide

Admin Guide

Developer Guide

Projects

XWiki

Extensions

Other

Contribute

Status

Practices

Under the Hood

Get Involved

Get Connected