Notice: This Wiki is now read only and edits are no longer possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.
Difference between revisions of "Eclipse4/CSS/Bridge"
| Line 2: | Line 2: | ||
The main goal of the bridge is supporting the 3.x themes in the CSS style sheets. We can use the 3.x theme element definitions in our CSS file in one of the following ways: | The main goal of the bridge is supporting the 3.x themes in the CSS style sheets. We can use the 3.x theme element definitions in our CSS file in one of the following ways: | ||
| + | |||
| + | Important! Due to some SAC parser limitations we have to replace all 'dots' in the element ids supported by the bridge with 'dashes' | ||
* Using the ColorDefinition in the CSS file | * Using the ColorDefinition in the CSS file | ||
| Line 50: | Line 52: | ||
:[[File:Basic_overriding_of_color_definition.png]] | :[[File:Basic_overriding_of_color_definition.png]] | ||
| − | :The user can also modify the category, label or description of the definition | + | |
| + | :The user can also modify the category, label or description of the definition. Currently we don't support the globalization of labels and descriptions | ||
<source lang="css"> | <source lang="css"> | ||
ColorDefinition#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START { | ColorDefinition#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START { | ||
color: white; | color: white; | ||
category: '#org-eclipse-debug-ui-presentation'; | category: '#org-eclipse-debug-ui-presentation'; | ||
| − | label: The brand new label; | + | label: 'The brand new label'; |
| − | description: Some description; | + | description: 'Some description'; |
} | } | ||
Revision as of 09:41, 14 March 2014
The CSS bridge
The main goal of the bridge is supporting the 3.x themes in the CSS style sheets. We can use the 3.x theme element definitions in our CSS file in one of the following ways:
Important! Due to some SAC parser limitations we have to replace all 'dots' in the element ids supported by the bridge with 'dashes'
- Using the ColorDefinition in the CSS file
- The ColorDefinitions are processed as the custom color values and can be use in all color related CSS proproperties, that we support
.MPartStack.active.noFocus { swt-selected-tab-fill: '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START' '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_END' 100% 100%; }
- Using the FontDefinition in the CSS file
- The FontDefinitions are processed as the custom font family
.MPartStack.active.noFocus { swt-selected-tab-fill: '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START' '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_END' 100% 100%; font-family: '#org-eclipse-jface-bannerfont'; }
- By default all font parameters are retrieved from the FontDefinition, but user can override the font's parameters
.MPartStack.active.noFocus { swt-selected-tab-fill: '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START' '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_END' 100% 100%; font-family: '#org-eclipse-jface-bannerfont'; font-size: 7px; font-style: italic; }
- Overriding the ColorDefinition in the CSS file
ColorDefinition#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START { color: white; } .MPartStack.active.noFocus { swt-selected-tab-fill: '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START' '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_END' 100% 100%; }
- The user can also modify the category, label or description of the definition. Currently we don't support the globalization of labels and descriptions
ColorDefinition#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START { color: white; category: '#org-eclipse-debug-ui-presentation'; label: 'The brand new label'; description: 'Some description'; } .MPartStack.active.noFocus { swt-selected-tab-fill: '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_START' '#org-eclipse-ui-workbench-ACTIVE_NOFOCUS_TAB_BG_END' 100% 100%; }
