Add: Additional pre-defined style colors and update style doc-page to display

This commit is contained in:
Philip Love committed 2021-05-02 10:15:13 -04:00
1 parent 04bb90ca9f
commit 226c9c2c24
2 files changed
+38 -6

No files matched your search

@@ -68,7 +68,7 @@
},
{
"style": "Table",
"text": "| Variable Value | RGB Value | Color Sample |\n| DARK | 48, 48, 54 | RGB(48, 48, 54) |\n| LIGHT | 234, 226, 222 | RGB(234, 226, 222) |\n| GREY | 150, 150, 150 | RGB(150, 150, 150) |\n| LIGHT_GREY | 247, 247, 247 | RGB(247, 247, 247) |\n| WHITE | 255, 255, 255 | RGB(255, 255, 255) |\n| BLACK | 0, 0, 0 | RGB(0, 0, 0) |\n| GOLDEN_ORANGE | 240, 162, 2 | RGB(240, 162, 2) |\n| RUSTED_RED | 204, 88, 53 | RGB(204, 88, 53) |\n| GREEN | 188, 214, 67 | RGB(188, 214, 67) |\n| RED | 223, 70, 60 | RGB(223, 70, 60) |\n| PATINATED_TURQUOISE | 27, 153, 139 | RGB(27, 153, 139) |\n| TITANIUM_YELLOW | 244, 228, 9 | RGB(244, 228, 9) |\n| MANGANESE_PURPLE | 91,80, 122 | RGB(91,80, 122) |\n| TURQUOISE | 74, 207, 217 | RGB(74, 207, 217) |\n| DARK_TURQUOISE | 2, 149, 170 | RGB(2, 149, 170) |",
"text": "| Variable Value | RGB Value | Color Sample |\n| DARK | 48, 48, 54 | RGB(48, 48, 54) |\n| LIGHT | 234, 226, 222 | RGB(234, 226, 222) |\n| GREY | 150, 150, 150 | RGB(150, 150, 150) |\n| LIGHT_GREY | 247, 247, 247 | RGB(247, 247, 247) |\n| WHITE | 255, 255, 255 | RGB(255, 255, 255) |\n| BLACK | 0, 0, 0 | RGB(0, 0, 0) |\n| GOLDEN_ORANGE | 240, 162, 2 | RGB(240, 162, 2) |\n| RUSTED_RED | 204, 88, 53 | RGB(204, 88, 53) |\n| GREEN | 188, 214, 67 | RGB(188, 214, 67) |\n| RED | 223, 70, 60 | RGB(223, 70, 60) |\n| PATINATED_TURQUOISE | 27, 153, 139 | RGB(27, 153, 139) |\n| TITANIUM_YELLOW | 244, 228, 9 | RGB(244, 228, 9) |\n| MANGANESE_PURPLE | 91,80, 122 | RGB(91,80, 122) |\n| TURQUOISE | 74, 207, 217 | RGB(74, 207, 217) |\n| DARK_TURQUOISE | 2, 149, 170 | RGB(2, 149, 170) |\n| SILVER | 191, 192, 192 | RGB(191,192,192) |\n| TRUE_GREEN | 0, 225, 0 | RGB(0,255,0) |\n| TRUE_RED | 255, 0, 0 | RGB(255,0,0) |\n| TRUE_YELLOW | 255, 255, 0 | RGB(255,255,0) |\n| TRUE_BLUE | 0, 0, 255 | RGB(0,0,255) |\n| BROWN | 121, 58, 21 | RGB(121,58,21) |\n| TRUE_ORANGE | 255, 160, 10 | RGB(255,160,10) |\n| JUNGLE_GREEN | 50, 175, 162 | RGB(50,175,162) |\n| JUNGLE_LIGHT | 165, 223, 210 | RGB(165,223,210) |\n| LIGHT_PINK | 254, 180, 200 | RGB(254,180,200) |\n| NEON_GREEN | 15, 252, 31 | RGB(15,252,31) |\n| PINK | 255, 77, 78 | RGB(255,77,78) |\n| TENKAN_GREEN | 43, 117, 55 | RGB(43,117,55) |\n| TENKAN_ORANGE | 233, 100, 34 | RGB(233,100,34) |\n| SKY_BLUE | 133, 206, 255 | RGB(133,206,255) |\n| MDA_PURPLE | 126, 71, 255 | RGB(126,71,255) |\n| PERSIAN_GREEN | 27, 153, 139 | RGB(27,153,139) |\n| ORANGE_WEB | 252, 163, 17 | RGB(252,163,17) |\n| OXFORD_BLUE | 20, 33, 61 | RGB(20,33,61) |\n| BYZANTINE_PINK | 181, 23, 158 | RGB(181,23,158) |\n| TRUE_PURPLE | 114, 9, 183 | RGB(114,9,183) |\n| ULTRAMARINE_BLUE | 67, 97, 238 | RGB(67,97,238) |\n| OCEAN_GREEN | 116, 198, 157 | RGB(116,198,157) |\n| BOTTLE_GREEN | 45, 106, 79 | RGB(45,106,79) |\n| WINDSOR_TAN | 153, 88, 42 | RGB(153,88,42) |\n| PERSIAN_PLUM | 111, 29, 27 | RGB(111,29,27) |\n| APPLE_GREEN | 128, 185, 24 | RGB(128,185,24) |\n| MIDNIGHT_GREEN | 6, 90, 96 | RGB(6,90,96) |\n| RED_ORANGE | 255, 72, 0 | RGB(255,72,0) |\n| CARIBBEAN_GREEN | 59, 206, 172 | RGB(59,206,172) |\n| CAMEL_TAN | 187, 148, 87 | RGB(187,148,87) |\n| CYBER_GRAPE | 98, 84, 160 | RGB(98,84,160) |",
"updated": 1609854356242
},
{
@@ -80,4 +80,4 @@
"text": "lineDash is used to turn the border into a dashed-line; the first value corresponds to the length of the dash while the second value defines the length of the space."
}
]
}
}
+36 -4
View File
@@ -1,12 +1,12 @@
let canvas
let PROJECTS_ARRAY
let canvas
let PROJECTS_ARRAY
let PROJECTS_SCHEMA
let SCHEMAS_BY_PROJECT = new Map()
/* New Root object*/
let UI = {
projects: {}
}
}
/* User Interface Colors */
const UI_COLOR = {
@@ -24,7 +24,39 @@ const UI_COLOR = {
TITANIUM_YELLOW: "244,228,9",
MANGANESE_PURPLE: "91,80,122",
TURQUOISE: "74,207,217",
DARK_TURQUOISE: "2,149,170"
DARK_TURQUOISE: "2,149,170",
ORANGE_WEB: "252,163,17",
OXFORD_BLUE: "20,33,61",
BYZANTINE_PINK: "181,23,158",
TRUE_PURPLE: "114,9,183",
ULTRAMARINE_BLUE: "67,97,238",
OCEAN_GREEN: "116,198,157",
BOTTLE_GREEN: "45,106,79",
WINDSOR_TAN: "153,88,42",
CAMEL_TAN: "187,148,87",
PERSIAN_PLUM: "111,29,27",
APPLE_GREEN: "128,185,24",
MIDNIGHT_GREEN: "6,90,96",
RED_ORANGE: "255,72,0",
CARIBBEAN_GREEN: "59,206,172",
SILVER: "191,192,192",
NEON_GREEN: "15,252,31",
PINK: "255,77,78",
TENKAN_GREEN: "43,117,55",
TENKAN_ORANGE: "233,100,34",
SKY_BLUE: "133,206,255",
MDA_PURPLE: "126,71,255",
PERSIAN_GREEN: "27,153,139",
CYBER_GRAPE: "98,84,160",
TRUE_GREEN: "0,225,0",
TRUE_RED: "255,0,0",
TRUE_YELLOW: "255,255,0",
TRUE_BLUE: "0,0,255",
BROWN: "121,58,21",
JUNGLE_GREEN: "50,175,162",
LIGHT_PINK: "254,180,200",
JUNGLE_LIGHT: "165,223,210",
TRUE_ORANGE: "255,160,10"
};
/* User Interface Fonts */