Add Named Colors

This commit is contained in:
JohnHake 2019-06-24 21:36:37 -07:00
parent e198c5a0a4
commit c996bc5f56
2 changed files with 31 additions and 16 deletions

View File

@ -2,6 +2,11 @@
"name": "theme_basics",
"dark": false,
"author": "IntelliJ Platform SDK",
"editorScheme": "/Lightning.xml",
"colors": {
"basicBackground": "#E1E1E1"
},
"ui": {
"*": {
@ -12,25 +17,20 @@
"selectionInactiveBackground": "#BBE7F4",
"selectionBackgroundInactive": "#BBE7F4"
},
"Label.foreground": "#3959CC",
"Label.background": "#F6E9C9",
"Panel.background": "#E1E1E1",
"Window.border" : "4,4,4,4,E6E6E6"
"Panel.background": "basicBackground",
"Window.border": "4,4,4,4,E6E6E6"
},
"icons": {
"/actions/compile.svg": "/factory.svg",
"/actions/execute.svg": "/run.svg",
"ColorPalette": {
"Actions.Blue": "#5BC0DE",
"Actions.Red": "#D9534F",
"Actions.Yellow": "#FFEEAD",
"Actions.Grey": "#354E5A",
"Objects.Blue": "#5BC0DE",
"Objects.Red": "#D9534F",
"Objects.Yellow": "#FFEEAD",
@ -38,13 +38,10 @@
"Objects.Pink": "#FFC5E8",
"Objects.Grey": "#4694AE",
"Objects.BlackText": "#0C5800",
"#59A869": "#00C5C0FF"
}
},
"editorScheme": "/Lightning.xml",
"background": {
"image": "/austria.png",
"transparency": 10,

View File

@ -15,6 +15,30 @@ Colors are defined by six-digit RGB or eight-digit RGBA hexadecimal notation.
When learning new syntax, it is often useful to have some existing implementations for reference.
For example, refer to the [Theme description file](upsource:///platform/platform-resources/src/themes/HighContrast.theme.json) for the IntelliJ IDEA _High Contrast_ Theme.
## Defining Named Colors
Colors can always be defined individually as six-digit RGB or eight-digit RGBA hexadecimal notation.
However, Theme definitions often use the same color in multiple places.
Maintaining a Theme is more manageable if _Named Colors_ are globally defined in a `colors {}` block as part of the `*.theme.json` file.
After that, the Named Color can be used instead of a hexadecimal description of the color.
For example, defining the Named Color `basicBackground` and then using it to set the background color for panels.
(Don't be concerned with the `"ui"` syntax in the example below, it will be discussed in [Custom UI Control Colors](#custom-ui-control-colors).)
```json
{
"name": "theme_basics",
"dark": false,
"author": "IntelliJ Platform SDK",
"editorScheme": "/Lightning.xml",
"colors": {
"basicBackground": "#E1E1E1"
},
"ui": {
"Panel.background": "basicBackground"
}
}
```
## Customizing Icons
UI themes can customize the color of default IntelliJ IDEA UI icons, or substitute custom icons for the default ones.
Customization is done by adding an `"icons": {}` section to the Theme description file.
@ -26,12 +50,6 @@ The `ColorPalette` must be inserted in the `icons` section.
In the following example the `key` - the default red color (#DB5860) used for `Action` icons in the _Light_ Theme - is overridden to the `value` of a different color (#D61A26):
```json
{
"name": "Theme Basics",
"dark": false,
"author": "IntelliJ Platform SDK",
"editorScheme": "/theme_basics.xml",
"ui": {
},
"icons": {
"ColorPalette": {
"#DB5860": "#D61A26"