better css color definition
This commit is contained in:
parent
efa04be599
commit
50a2a0c858
GPG Key ID:
24BA25B8B303B023
@ -5,7 +5,7 @@
|
|||||||
"properties": {
|
"properties": {
|
||||||
"name": {
|
"name": {
|
||||||
"type": "string",
|
"type": "string",
|
||||||
"description": "The name of the color theme as it is displayed in the control panel. Must be unique in any given instance"
|
"description": "The name of the color theme as it is displayed in web UI. Must match the file\nname of the theme file, e.g. a theme called \"example-theme\" should be located\nin a file called \"example-theme.theme.json\"\n"
|
||||||
},
|
},
|
||||||
"colors": {
|
"colors": {
|
||||||
"type": "object",
|
"type": "object",
|
||||||
@ -221,13 +221,6 @@
|
|||||||
"definitions": {
|
"definitions": {
|
||||||
"css_color": {
|
"css_color": {
|
||||||
"description": "A valid CSS color value;\nSee https://developer.mozilla.org/en-US/docs/Web/CSS/color_value\n",
|
"description": "A valid CSS color value;\nSee https://developer.mozilla.org/en-US/docs/Web/CSS/color_value\n",
|
||||||
"examples": [
|
|
||||||
"#000",
|
|
||||||
"#ff0000",
|
|
||||||
"#ffccaa88",
|
|
||||||
"rgb(10, 70, 130)",
|
|
||||||
"rgba(10, 70, 130, 0.5)"
|
|
||||||
],
|
|
||||||
"oneOf": [
|
"oneOf": [
|
||||||
{
|
{
|
||||||
"type": "string",
|
"type": "string",
|
||||||
@ -254,6 +247,54 @@
|
|||||||
"examples": [
|
"examples": [
|
||||||
"rgba(10, 70, 130, 0.5)"
|
"rgba(10, 70, 130, 0.5)"
|
||||||
]
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"const": "transparent"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"const": "currentcolor"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"enum": [
|
||||||
|
"black",
|
||||||
|
"silver",
|
||||||
|
"gray",
|
||||||
|
"white",
|
||||||
|
"maroon",
|
||||||
|
"red",
|
||||||
|
"purple",
|
||||||
|
"fuchsia",
|
||||||
|
"green",
|
||||||
|
"lime",
|
||||||
|
"olive",
|
||||||
|
"yellow",
|
||||||
|
"navy",
|
||||||
|
"blue",
|
||||||
|
"teal",
|
||||||
|
"aqua"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"enum": [
|
||||||
|
"orange"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"enum": [
|
||||||
|
"aliceblue",
|
||||||
|
"antiquewhite"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "string",
|
||||||
|
"enum": [
|
||||||
|
"rebeccapurple"
|
||||||
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@ -4,8 +4,10 @@ type: object
|
|||||||
properties:
|
properties:
|
||||||
name:
|
name:
|
||||||
type: string
|
type: string
|
||||||
description: The name of the color theme as it is displayed in the control
|
description: |
|
||||||
panel. Must be unique in any given instance
|
The name of the color theme as it is displayed in web UI. Must match the file
|
||||||
|
name of the theme file, e.g. a theme called "example-theme" should be located
|
||||||
|
in a file called "example-theme.theme.json"
|
||||||
colors:
|
colors:
|
||||||
type: object
|
type: object
|
||||||
description: Contains the values that will be used to populate the CSS variables
|
description: Contains the values that will be used to populate the CSS variables
|
||||||
@ -152,13 +154,8 @@ definitions:
|
|||||||
description: |
|
description: |
|
||||||
A valid CSS color value;
|
A valid CSS color value;
|
||||||
See https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
|
See https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
|
||||||
examples:
|
|
||||||
- "#000"
|
|
||||||
- "#ff0000"
|
|
||||||
- "#ffccaa88"
|
|
||||||
- rgb(10, 70, 130)
|
|
||||||
- rgba(10, 70, 130, 0.5)
|
|
||||||
oneOf:
|
oneOf:
|
||||||
|
# Hex Colors
|
||||||
- type: string
|
- type: string
|
||||||
format: regex
|
format: regex
|
||||||
pattern: ^(#[0-9a-fA-F]{3}(?:[0-9a-fA-F]{3}(?:[0-9a-fA-F]{2})?)?)$
|
pattern: ^(#[0-9a-fA-F]{3}(?:[0-9a-fA-F]{3}(?:[0-9a-fA-F]{2})?)?)$
|
||||||
@ -166,13 +163,55 @@ definitions:
|
|||||||
- "#000"
|
- "#000"
|
||||||
- "#ff0000"
|
- "#ff0000"
|
||||||
- "#ffccaa88"
|
- "#ffccaa88"
|
||||||
|
# RGB Colors
|
||||||
- type: string
|
- type: string
|
||||||
format: regex
|
format: regex
|
||||||
pattern: ^(rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\))$
|
pattern: ^(rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\))$
|
||||||
examples:
|
examples:
|
||||||
- rgb(10, 70, 130)
|
- rgb(10, 70, 130)
|
||||||
|
# RGBA Colors
|
||||||
- type: string
|
- type: string
|
||||||
format: regex
|
format: regex
|
||||||
pattern: ^(rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([01]|[01]?\.[0-9]{1,3})\s*\))$
|
pattern: ^(rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([01]|[01]?\.[0-9]{1,3})\s*\))$
|
||||||
examples:
|
examples:
|
||||||
- rgba(10, 70, 130, 0.5)
|
- rgba(10, 70, 130, 0.5)
|
||||||
|
# transparent
|
||||||
|
- type: string
|
||||||
|
const: transparent
|
||||||
|
# currentcolor
|
||||||
|
- type: string
|
||||||
|
const: currentcolor
|
||||||
|
# Named Colors: CSS Level 1
|
||||||
|
- type: string
|
||||||
|
enum:
|
||||||
|
- black
|
||||||
|
- silver
|
||||||
|
- gray
|
||||||
|
- white
|
||||||
|
- maroon
|
||||||
|
- red
|
||||||
|
- purple
|
||||||
|
- fuchsia
|
||||||
|
- green
|
||||||
|
- lime
|
||||||
|
- olive
|
||||||
|
- yellow
|
||||||
|
- navy
|
||||||
|
- blue
|
||||||
|
- teal
|
||||||
|
- aqua
|
||||||
|
# Named Colors: CSS Level 2
|
||||||
|
- type: string
|
||||||
|
enum:
|
||||||
|
- orange
|
||||||
|
# Named Colors: CSS Level 3
|
||||||
|
- type: string
|
||||||
|
enum:
|
||||||
|
- aliceblue
|
||||||
|
- antiquewhite
|
||||||
|
# todo: fill in the rest of level3 colors...
|
||||||
|
# see: https://developer.mozilla.org/en-US/docs/Web/CSS/named-color
|
||||||
|
# Named Colors: CSS Level 4
|
||||||
|
- type: string
|
||||||
|
enum:
|
||||||
|
- rebeccapurple
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user