@sandlada/material-design-css 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +6 -3
- package/prebuild-color-green.css +58 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sandlada/material-design-css",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"description": "A ready-made npm package for a collection of css styles in the material design style.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Sandlada & Kai-Orion",
|
|
@@ -27,7 +27,9 @@
|
|
|
27
27
|
"./shape.css": "./shape.css",
|
|
28
28
|
"./shape": "./shape.css",
|
|
29
29
|
"./typography.css": "./typography.css",
|
|
30
|
-
"./typography": "./typography.css"
|
|
30
|
+
"./typography": "./typography.css",
|
|
31
|
+
"./prebuild-color-green.css": "./prebuild-color-green.css",
|
|
32
|
+
"./prebuild-color-green": "./prebuild-color-green.css"
|
|
31
33
|
},
|
|
32
34
|
"style": "index.css",
|
|
33
35
|
"files": [
|
|
@@ -35,6 +37,7 @@
|
|
|
35
37
|
"color.css",
|
|
36
38
|
"motion.css",
|
|
37
39
|
"shape.css",
|
|
38
|
-
"typography.css"
|
|
40
|
+
"typography.css",
|
|
41
|
+
"prebuild-color-green.css"
|
|
39
42
|
]
|
|
40
43
|
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
@layer material-design-system.color.variable {
|
|
2
|
+
:root {
|
|
3
|
+
--md-sys-color-primary-palette-key-color: light-dark(#49835a, #49835a);
|
|
4
|
+
--md-sys-color-secondary-palette-key-color: light-dark(#687c6b, #687c6b);
|
|
5
|
+
--md-sys-color-tertiary-palette-key-color: light-dark(#547e88, #547e88);
|
|
6
|
+
--md-sys-color-neutral-palette-key-color: light-dark(#737872, #737872);
|
|
7
|
+
--md-sys-color-neutral-variant-palette-key-color: light-dark(#717971, #717971);
|
|
8
|
+
--md-sys-color-background: light-dark(#f6fbf3, #101510);
|
|
9
|
+
--md-sys-color-on-background: light-dark(#181d18, #dfe4dc);
|
|
10
|
+
--md-sys-color-surface: light-dark(#f6fbf3, #101510);
|
|
11
|
+
--md-sys-color-surface-dim: light-dark(#d7dbd4, #101510);
|
|
12
|
+
--md-sys-color-surface-bright: light-dark(#f6fbf3, #353a35);
|
|
13
|
+
--md-sys-color-surface-container-lowest: light-dark(#ffffff, #0a0f0b);
|
|
14
|
+
--md-sys-color-surface-container-low: light-dark(#f0f5ed, #181d18);
|
|
15
|
+
--md-sys-color-surface-container: light-dark(#ebefe7, #1c211c);
|
|
16
|
+
--md-sys-color-surface-container-high: light-dark(#e5eae2, #262b26);
|
|
17
|
+
--md-sys-color-surface-container-highest: light-dark(#dfe4dc, #313631);
|
|
18
|
+
--md-sys-color-on-surface: light-dark(#181d18, #dfe4dc);
|
|
19
|
+
--md-sys-color-surface-variant: light-dark(#dde5da, #414941);
|
|
20
|
+
--md-sys-color-on-surface-variant: light-dark(#414941, #c1c9bf);
|
|
21
|
+
--md-sys-color-inverse-surface: light-dark(#2d322d, #dfe4dc);
|
|
22
|
+
--md-sys-color-inverse-on-surface: light-dark(#eef2ea, #2d322d);
|
|
23
|
+
--md-sys-color-outline: light-dark(#717971, #8b938a);
|
|
24
|
+
--md-sys-color-outline-variant: light-dark(#c1c9bf, #414941);
|
|
25
|
+
--md-sys-color-shadow: light-dark(#000000, #000000);
|
|
26
|
+
--md-sys-color-scrim: light-dark(#000000, #000000);
|
|
27
|
+
--md-sys-color-surface-tint: light-dark(#306a43, #97d5a5);
|
|
28
|
+
--md-sys-color-primary: light-dark(#306a43, #97d5a5);
|
|
29
|
+
--md-sys-color-on-primary: light-dark(#ffffff, #00391a);
|
|
30
|
+
--md-sys-color-primary-container: light-dark(#b2f1bf, #14512d);
|
|
31
|
+
--md-sys-color-on-primary-container: light-dark(#14512d, #b2f1bf);
|
|
32
|
+
--md-sys-color-inverse-primary: light-dark(#97d5a5, #306a43);
|
|
33
|
+
--md-sys-color-secondary: light-dark(#506353, #b6ccb8);
|
|
34
|
+
--md-sys-color-on-secondary: light-dark(#ffffff, #223526);
|
|
35
|
+
--md-sys-color-secondary-container: light-dark(#d2e8d3, #384b3c);
|
|
36
|
+
--md-sys-color-on-secondary-container: light-dark(#384b3c, #d2e8d3);
|
|
37
|
+
--md-sys-color-tertiary: light-dark(#3a656f, #a2ced9);
|
|
38
|
+
--md-sys-color-on-tertiary: light-dark(#ffffff, #01363f);
|
|
39
|
+
--md-sys-color-tertiary-container: light-dark(#beeaf6, #204d56);
|
|
40
|
+
--md-sys-color-on-tertiary-container: light-dark(#204d56, #beeaf6);
|
|
41
|
+
--md-sys-color-error: light-dark(#ba1a1a, #ffb4ab);
|
|
42
|
+
--md-sys-color-on-error: light-dark(#ffffff, #690005);
|
|
43
|
+
--md-sys-color-error-container: light-dark(#ffdad6, #93000a);
|
|
44
|
+
--md-sys-color-on-error-container: light-dark(#93000a, #ffdad6);
|
|
45
|
+
--md-sys-color-primary-fixed: light-dark(#b2f1bf, #b2f1bf);
|
|
46
|
+
--md-sys-color-primary-fixed-dim: light-dark(#97d5a5, #97d5a5);
|
|
47
|
+
--md-sys-color-on-primary-fixed: light-dark(#00210d, #00210d);
|
|
48
|
+
--md-sys-color-on-primary-fixed-variant: light-dark(#14512d, #14512d);
|
|
49
|
+
--md-sys-color-secondary-fixed: light-dark(#d2e8d3, #d2e8d3);
|
|
50
|
+
--md-sys-color-secondary-fixed-dim: light-dark(#b6ccb8, #b6ccb8);
|
|
51
|
+
--md-sys-color-on-secondary-fixed: light-dark(#0d1f12, #0d1f12);
|
|
52
|
+
--md-sys-color-on-secondary-fixed-variant: light-dark(#384b3c, #384b3c);
|
|
53
|
+
--md-sys-color-tertiary-fixed: light-dark(#beeaf6, #beeaf6);
|
|
54
|
+
--md-sys-color-tertiary-fixed-dim: light-dark(#a2ced9, #a2ced9);
|
|
55
|
+
--md-sys-color-on-tertiary-fixed: light-dark(#001f25, #001f25);
|
|
56
|
+
--md-sys-color-on-tertiary-fixed-variant: light-dark(#204d56, #204d56);
|
|
57
|
+
}
|
|
58
|
+
}
|