The Theme editor has three pages, an Overview page listing the theme variants and their general attributes, a Design Wizard page where page authors can specify style selectors and define style properties using a wizard, and a Design CSS page where authors can specify style rules using CSS.
The Theme editor has three pages, an Overview page listing the theme variants and their general attributes, a Design Wizard page where page authors can specify style selectors and define style properties using a wizard, and a Design CSS page where authors can specify style rules using CSS.
Authors can switch between the Design CSS and Design Wizard editors, and vice versa, while editing a theme variant. However, the conversion from the Design CSS format to Design Wizard can be lossy, for example, the CSS formatting (indentation, line breaks, etc.) may change, inline comments and custom dynamic properties will be lost. In addition, only valid CSS fragments can be converted, i.e. an invalid CSS will lock the entire Design Wizard tab.
The Attributes section contains the Device category policy control, which authors can use to associate an existing device category scheme or a custom scheme with the policy. For more information on using a custom scheme, refer to Custom device policies. The Lock and Unlock buttons are displayed if this is a collaborative project.
All variants added to a theme are listed in the Variants section. Authors can add and remove variants at any time. The Lock and Unlock buttons apply to the selected variant or variants.
The Variant Selection Criteria section can be used to define which variant is selected for use on a particular device. If the variant is targeted, authors can choose a combination of targets from the device tree and a single set of devices in a custom category scheme.
In the Variant Content section, there are options to set a Null variant and Import a parent theme variant.
On the Design Wizard page, page authors can define the style rules for a theme variant using the wizard. Style rules have a selector and a set of style properties that define the page theme. Authors can choose style categories or sub-categories for the current selection in the Selectors section from the category tree. The number and type of edit controls depend on the category selected.
Style properties include:
font families, and their weight and color;
borders with their style and width;
lists with their numbering options;
table cells and their padding and background color.
Refer to Style property categories for full details.
On the Design CSS page, authors can define the style rules for a variant using CSS. The page contains a text input control that allows page authors to enter a CSS fragment.