@flodesk/grain 9.1.4 → 9.1.6

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.
Files changed (6) hide show
  1. package/es/styles/colors/core.css +20 -20
  2. package/es/styles/colors/theme.css +20 -20
  3. package/es/styles/variables.css +1 -1
  4. package/es/variables/colors.js +22 -22
  5. package/es/variables/vars.js +1 -1
  6. package/package.json +1 -1
package/es/styles/colors/core.css CHANGED
@@ -43,27 +43,27 @@
43
43
  --fadeA2: 17%;
44
44
  --fadeA1: 10%;
45
45
 
46
- --grn-color-whiteFade10: hsl(var(--H) 7% var(--wfS) / var(--fadeA10));
47
- --grn-color-whiteFade9: hsl(var(--H) 7% var(--wfS) / var(--fadeA9));
48
- --grn-color-whiteFade8: hsl(var(--H) 7% var(--wfS) / var(--fadeA8));
49
- --grn-color-whiteFade7: hsl(var(--H) 7% var(--wfS) / var(--fadeA7));
50
- --grn-color-whiteFade6: hsl(var(--H) 7% var(--wfS) / var(--fadeA6));
51
- --grn-color-whiteFade5: hsl(var(--H) 7% var(--wfS) / var(--fadeA5));
52
- --grn-color-whiteFade4: hsl(var(--H) 7% var(--wfS) / var(--fadeA4));
53
- --grn-color-whiteFade3: hsl(var(--H) 7% var(--wfS) / var(--fadeA3));
54
- --grn-color-whiteFade2: hsl(var(--H) 7% var(--wfS) / var(--fadeA2));
55
- --grn-color-whiteFade1: hsl(var(--H) 7% var(--wfS) / var(--fadeA1));
46
+ --grn-color-lightFade10: hsl(var(--H) 7% var(--wfS) / var(--fadeA10));
47
+ --grn-color-lightFade9: hsl(var(--H) 7% var(--wfS) / var(--fadeA9));
48
+ --grn-color-lightFade8: hsl(var(--H) 7% var(--wfS) / var(--fadeA8));
49
+ --grn-color-lightFade7: hsl(var(--H) 7% var(--wfS) / var(--fadeA7));
50
+ --grn-color-lightFade6: hsl(var(--H) 7% var(--wfS) / var(--fadeA6));
51
+ --grn-color-lightFade5: hsl(var(--H) 7% var(--wfS) / var(--fadeA5));
52
+ --grn-color-lightFade4: hsl(var(--H) 7% var(--wfS) / var(--fadeA4));
53
+ --grn-color-lightFade3: hsl(var(--H) 7% var(--wfS) / var(--fadeA3));
54
+ --grn-color-lightFade2: hsl(var(--H) 7% var(--wfS) / var(--fadeA2));
55
+ --grn-color-lightFade1: hsl(var(--H) 7% var(--wfS) / var(--fadeA1));
56
56
 
57
- --grn-color-blackFade10: hsl(var(--H) 20% var(--bfS) / var(--fadeA10));
58
- --grn-color-blackFade9: hsl(var(--H) 20% var(--bfS) / var(--fadeA9));
59
- --grn-color-blackFade8: hsl(var(--H) 19% var(--bfS) / var(--fadeA8));
60
- --grn-color-blackFade7: hsl(var(--H) 18% var(--bfS) / var(--fadeA7));
61
- --grn-color-blackFade6: hsl(var(--H) 17% var(--bfS) / var(--fadeA6));
62
- --grn-color-blackFade5: hsl(var(--H) 16% var(--bfS) / var(--fadeA5));
63
- --grn-color-blackFade4: hsl(var(--H) 15% var(--bfS) / var(--fadeA4));
64
- --grn-color-blackFade3: hsl(var(--H) 15% var(--bfS) / var(--fadeA3));
65
- --grn-color-blackFade2: hsl(var(--H) 15% var(--bfS) / var(--fadeA2));
66
- --grn-color-blackFade1: hsl(var(--H) 15% var(--bfS) / var(--fadeA1));
57
+ --grn-color-darkFade10: hsl(var(--H) 7% var(--bfS) / var(--fadeA10));
58
+ --grn-color-darkFade9: hsl(var(--H) 7% var(--bfS) / var(--fadeA9));
59
+ --grn-color-darkFade8: hsl(var(--H) 7% var(--bfS) / var(--fadeA8));
60
+ --grn-color-darkFade7: hsl(var(--H) 7% var(--bfS) / var(--fadeA7));
61
+ --grn-color-darkFade6: hsl(var(--H) 7% var(--bfS) / var(--fadeA6));
62
+ --grn-color-darkFade5: hsl(var(--H) 7% var(--bfS) / var(--fadeA5));
63
+ --grn-color-darkFade4: hsl(var(--H) 9% var(--bfS) / var(--fadeA4));
64
+ --grn-color-darkFade3: hsl(var(--H) 11% var(--bfS) / var(--fadeA3));
65
+ --grn-color-darkFade2: hsl(var(--H) 13% var(--bfS) / var(--fadeA2));
66
+ --grn-color-darkFade1: hsl(var(--H) 15% var(--bfS) / var(--fadeA1));
67
67
  }
68
68
 
69
69
  :root {
package/es/styles/colors/theme.css CHANGED
@@ -1,16 +1,16 @@
1
1
  /* light */
2
2
 
3
3
  :root, [data-theme="light"], [data-theme="dark"] [data-theme="invert"] {
4
- --grn-color-fade10: var(--grn-color-blackFade10);
5
- --grn-color-fade9: var(--grn-color-blackFade9);
6
- --grn-color-fade8: var(--grn-color-blackFade8);
7
- --grn-color-fade7: var(--grn-color-blackFade7);
8
- --grn-color-fade6: var(--grn-color-blackFade6);
9
- --grn-color-fade5: var(--grn-color-blackFade5);
10
- --grn-color-fade4: var(--grn-color-blackFade4);
11
- --grn-color-fade3: var(--grn-color-blackFade3);
12
- --grn-color-fade2: var(--grn-color-blackFade2);
13
- --grn-color-fade1: var(--grn-color-blackFade1);
4
+ --grn-color-fade10: var(--grn-color-darkFade10);
5
+ --grn-color-fade9: var(--grn-color-darkFade9);
6
+ --grn-color-fade8: var(--grn-color-darkFade8);
7
+ --grn-color-fade7: var(--grn-color-darkFade7);
8
+ --grn-color-fade6: var(--grn-color-darkFade6);
9
+ --grn-color-fade5: var(--grn-color-darkFade5);
10
+ --grn-color-fade4: var(--grn-color-darkFade4);
11
+ --grn-color-fade3: var(--grn-color-darkFade3);
12
+ --grn-color-fade2: var(--grn-color-darkFade2);
13
+ --grn-color-fade1: var(--grn-color-darkFade1);
14
14
 
15
15
  --grn-color-shade1: var(--grn-color-shadeTone1);
16
16
  --grn-color-shade2: var(--grn-color-shadeTone2);
@@ -30,16 +30,16 @@
30
30
  /* dark */
31
31
 
32
32
  [data-theme="dark"], [data-theme="light"] [data-theme="invert"] {
33
- --grn-color-fade10: var(--grn-color-whiteFade10);
34
- --grn-color-fade9: var(--grn-color-whiteFade9);
35
- --grn-color-fade8: var(--grn-color-whiteFade8);
36
- --grn-color-fade7: var(--grn-color-whiteFade7);
37
- --grn-color-fade6: var(--grn-color-whiteFade6);
38
- --grn-color-fade5: var(--grn-color-whiteFade5);
39
- --grn-color-fade4: var(--grn-color-whiteFade4);
40
- --grn-color-fade3: var(--grn-color-whiteFade3);
41
- --grn-color-fade2: var(--grn-color-whiteFade2);
42
- --grn-color-fade1: var(--grn-color-whiteFade1);
33
+ --grn-color-fade10: var(--grn-color-lightFade10);
34
+ --grn-color-fade9: var(--grn-color-lightFade9);
35
+ --grn-color-fade8: var(--grn-color-lightFade8);
36
+ --grn-color-fade7: var(--grn-color-lightFade7);
37
+ --grn-color-fade6: var(--grn-color-lightFade6);
38
+ --grn-color-fade5: var(--grn-color-lightFade5);
39
+ --grn-color-fade4: var(--grn-color-lightFade4);
40
+ --grn-color-fade3: var(--grn-color-lightFade3);
41
+ --grn-color-fade2: var(--grn-color-lightFade2);
42
+ --grn-color-fade1: var(--grn-color-lightFade1);
43
43
 
44
44
  --grn-color-shade1: var(--grn-color-shadeTone13);
45
45
  --grn-color-shade2: var(--grn-color-shadeTone12);
package/es/styles/variables.css CHANGED
@@ -59,7 +59,7 @@
59
59
  --grn-color-fieldBorderFocus: var(--grn-color-shade9);
60
60
  --grn-color-fieldBorderDisabled: var(--grn-color-shade5);
61
61
  --grn-color-fieldBackgroundDisabled: var(--grn-color-shade2);
62
- --grn-color-backdrop: var(--grn-color-blackFade8);
62
+ --grn-color-backdrop: var(--grn-color-darkFade8);
63
63
 
64
64
  --grn-transition-leave: var(--grn-transition-slow);
65
65
  --grn-transition-hover: var(--grn-transition-fast);
package/es/variables/colors.js CHANGED
@@ -1,27 +1,27 @@
1
1
  export var colors = {
2
- whiteFades: {
3
- whiteFade10: 'whiteFade10',
4
- whiteFade9: 'whiteFade9',
5
- whiteFade8: 'whiteFade8',
6
- whiteFade7: 'whiteFade7',
7
- whiteFade6: 'whiteFade6',
8
- whiteFade5: 'whiteFade5',
9
- whiteFade4: 'whiteFade4',
10
- whiteFade3: 'whiteFade3',
11
- whiteFade2: 'whiteFade2',
12
- whiteFade1: 'whiteFade1'
2
+ lightFades: {
3
+ lightFade10: 'lightFade10',
4
+ lightFade9: 'lightFade9',
5
+ lightFade8: 'lightFade8',
6
+ lightFade7: 'lightFade7',
7
+ lightFade6: 'lightFade6',
8
+ lightFade5: 'lightFade5',
9
+ lightFade4: 'lightFade4',
10
+ lightFade3: 'lightFade3',
11
+ lightFade2: 'lightFade2',
12
+ lightFade1: 'lightFade1'
13
13
  },
14
- blackFades: {
15
- blackFade10: 'blackFade10',
16
- blackFade9: 'blackFade9',
17
- blackFade8: 'blackFade8',
18
- blackFade7: 'blackFade7',
19
- blackFade6: 'blackFade6',
20
- blackFade5: 'blackFade5',
21
- blackFade4: 'blackFade4',
22
- blackFade3: 'blackFade3',
23
- blackFade2: 'blackFade2',
24
- blackFade1: 'blackFade1'
14
+ darkFades: {
15
+ darkFade10: 'darkFade10',
16
+ darkFade9: 'darkFade9',
17
+ darkFade8: 'darkFade8',
18
+ darkFade7: 'darkFade7',
19
+ darkFade6: 'darkFade6',
20
+ darkFade5: 'darkFade5',
21
+ darkFade4: 'darkFade4',
22
+ darkFade3: 'darkFade3',
23
+ darkFade2: 'darkFade2',
24
+ darkFade1: 'darkFade1'
25
25
  },
26
26
  shadeTones: {
27
27
  shadeTone13: 'shadeTone13',
package/es/variables/vars.js CHANGED
@@ -60,7 +60,7 @@ export var vars = {
60
60
  xFast: 'xFast',
61
61
  xxFast: 'xxFast'
62
62
  },
63
- colors: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, colors.shadeTones), colors.shades), colors.fades), colors.blackFades), colors.whiteFades), colors.bases), colors.internals), colors.generics), colors.contents), colors.backgrounds), colors.borders),
63
+ colors: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, colors.shadeTones), colors.shades), colors.fades), colors.darkFades), colors.lightFades), colors.bases), colors.internals), colors.generics), colors.contents), colors.backgrounds), colors.borders),
64
64
  spaceUtils: {
65
65
  betweenFormTitleAndContent: 'betweenFormTitleAndContent',
66
66
  betweenFormContents: 'betweenFormContents',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flodesk/grain",
3
- "version": "9.1.4",
3
+ "version": "9.1.6",
4
4
  "description": "Flodesk design system",
5
5
  "module": "es/index.js",
6
6
  "author": "Flodesk",