[All Adaptavist Apps]
This document explains how style sheets are loaded in Theme Builder 3.x...
Theme Builder 3 loads style sheets in the following order:
– flowchart –
All style sheets are loaded as resources, rather than embedding them directly in the HTML, to reduce security risks and enable caching of the CSS.
Each subsequent stylesheet can override any styles defined in previous stylesheets, for example the "Combined CSS" can override any settings in "Menu Style Sheets", "Extended CSS and "General CSS".
This read-only style sheet is included on all pages for all layouts.
It is optimised for viewing wiki pages and blog posts because these make up the vast majority of page impressions in Confluence.
The style sheet includes just enough styles to ensure that standard wiki markup (text, headings, etc), common macros and other interface elements that appear on wiki pages and blog posts will be styled properly.
You can prevent this style sheet from being included in a layout by de-selecting the "Use inbuilt CSS for this layout" option on the CSS Tab.
This read-only style sheet is included in layouts for all pages except the normal view of wiki pages and blog posts.
The style sheet contains all the extended styles required for a vast range of additional Confluence functionality such as the Dashboard, Space Admin, etc.
It's not loaded on wiki pages or blog posts in order to reduce the initial loading time of the most common entry pages (where new visitors first enter the site) in the wiki.
You can prevent this style sheet from being included in a layout by de-selecting the "Use inbuilt CSS for this layout" option on the CSS Tab.
These read-only style sheets are included for all pages in your layout.
The actual style sheets loaded (if any) depend on the "look and feel" selected for the layout in the Menus Tab.
{expand:Full list of menu style sheets}}
The following table shows which CSS file is loaded for each "look and feel" and whether it then imports any additional CSS file(s).
Look and Feel
CSS Files
aqua
skin-aqua.css
>hmenu.css
beos
skin-beos.css
>hmenu-3d.css
>hmenu.css
dark
skin-hmenu-dark.css
>hmenu.css
longhorn
skin-longhorn.css
>hmenu-extended.css
>hmenu.css
modern
skin-modern.css
>hmenu-3d.css
>hmenu.css
sample
skin-sample.css
>hmenu.css
system
skin-system.css
>hmenu-3d.css
>hmenu.css
win2k
skin-win2k.css
>hmenu-3d.css
>hmenu.css
win98
skin-win98.css
>hmenu-3d.css
>hmenu.css
xp-apps
skin-xp-apps.css
>hmenu.css
xp-apps2
skin-xp-apps2.css
>hmenu.css
xp-extended
skin-xp-extended.css
>hmenu-extended.css
>hmenu.css
xp
skin-xp.css
>hmenu.css
yp
skin-yp.css
>hmenu.css
custom
hmenu.css
custom 2D
hmenu-extended.css
>hmenu.css
custom 3D
hmenu-3d.css
>hmenu.css
none
This style sheet is customised in the Layout Manager and is actually a combination of three style sheets loaded in this order:
Each layout has it's own version of the Combined CSS which is intelligently cached for all pages viewed using that layout.
The web browser will generally cache the Combined CSS for up to a year, unless you make alterations in which case the browser will download a new version.
Note: Read important notes on Style Sheet Inheritance.
To remove the Panel CSS component, de-select the "Use panel CSS for this layout" option on the CSS Tab.
To remove the Imports component, de-select the "Merge this layout's CSS with it's parent's" and leave the Imports text box empty in the CSS Tab.
To remove the Custom CSS component, de-select the "Merge this layout's CSS with it's parent's" and leave the Custom CSS text box empty in the CSS Tab.
This style sheet is customised via the CSS Tab and is unique in that it only gets loaded if the end-user is browsing your wiki with Internet Explorer 5.5 or above.
Each layout has it's own version of the IE CSS which is intelligently cached for all pages viewed using that layout.
The web browser will generally cache the IE CSS for up to a year, unless you make alterations in which case the browser will download a new version.
Note: Read important notes on Style Sheet Inheritance.
To remove the IE CSS component, de-select the "Merge this layout's CSS with it's parent's" and leave the IE CSS text box empty in the CSS Tab.