@flodesk/grain 10.8.1 → 10.8.2
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/es/components/autocomplete.js +3 -2
- package/es/components/autocomplete2.js +5 -5
- package/es/components/badge.js +5 -6
- package/es/components/button.js +5 -23
- package/es/components/nav.js +9 -19
- package/es/components/slider.js +6 -17
- package/es/components/spinner.js +3 -13
- package/es/components/switch.js +4 -16
- package/es/components/text-button.js +13 -12
- package/es/foundational/styles.js +4 -5
- package/es/styles/base.js +2 -12
- package/es/styles/colors/core.js +2 -12
- package/es/styles/colors/experimental.js +2 -12
- package/es/styles/colors/index.js +1 -2
- package/es/styles/colors/theme.js +2 -12
- package/es/styles/index.js +1 -2
- package/es/styles/shadows.js +2 -12
- package/es/styles/variables.js +2 -12
- package/package.json +1 -1
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import "core-js/modules/es.array.concat.js";
|
|
2
|
-
import { css } from '@emotion/react';
|
|
3
2
|
import { getColor, getRadius, getTextSize, getTransition, getWeight } from '../utilities';
|
|
4
3
|
export var capHeight = "0.74em";
|
|
5
4
|
export var lineHeightAndCapHeightOffset = "calc((var(--grn-lineHeight-global) - ".concat(capHeight, ") / 2)");
|
|
@@ -48,9 +47,9 @@ export var getClearButtonStyles = function getClearButtonStyles(_ref) {
|
|
|
48
47
|
variant = _ref$variant === void 0 ? 'neutral' : _ref$variant,
|
|
49
48
|
isActive = _ref.isActive,
|
|
50
49
|
isDisabled = _ref.isDisabled;
|
|
51
|
-
var box =
|
|
52
|
-
var icon =
|
|
53
|
-
var text =
|
|
50
|
+
var box = "\n ".concat(buttonResetStyles, ";\n ").concat(transitionStyles, ";\n\n border: none;\n padding: 0;\n border-radius: ").concat(getRadius('s'), ";\n height: ").concat(componentVars.clearButtonHeight, ";\n background-color: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:hover {\n background-color: ").concat(variant && variantStyles[variant].hover.backgroundColor, ";\n\n .Icon {\n color: ").concat(variant && variantStyles[variant].hover.iconColor, ";\n }\n }\n\n &:active {\n --border: ").concat(componentVars.strokeSize, " ").concat(variantStyles[variant].active.borderColor, ";\n background-color: transparent;\n box-shadow: inset 0 0 0 var(--border);\n }\n\n ").concat(isDisabled && "pointer-events: none; ", "\n ");
|
|
51
|
+
var icon = "\n ".concat(transitionStyles, ";\n color: ").concat(variant && variantStyles[variant].iconColor, ";\n ").concat(isActive && "color: ".concat(variant && variantStyles[variant].color), ";\n ");
|
|
52
|
+
var text = "\n color: ".concat(variant && variantStyles[variant].color, ";\n ").concat(isDisabled && "color: ".concat(getColor('disabledContent')), ";\n ");
|
|
54
53
|
var clearButtonStyles = {
|
|
55
54
|
box: box,
|
|
56
55
|
icon: icon,
|
|
@@ -113,4 +112,4 @@ export var placementStyles = {
|
|
|
113
112
|
bottom: "0"
|
|
114
113
|
}
|
|
115
114
|
};
|
|
116
|
-
export var capStyles =
|
|
115
|
+
export var capStyles = "\n font-size: ".concat(getTextSize('s'), ";\n font-weight: ").concat(getWeight('medium'), ";\n text-transform: uppercase;\n letter-spacing: 0.05em;\n");
|
package/es/styles/base.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "1inf83a",
|
|
6
|
-
styles: ":root{--grn-lineHeight-fixed:7px;--grn-lineHeight-relative:0.9em;--grn-lineHeight-global:calc(var(--grn-lineHeight-fixed) + var(--grn-lineHeight-relative));--grn-font-global:'Flodesk Sans',sans-serif;--grn-radius-button:var(--grn-radius-s);}.grn-context,.grn-context *{line-height:var(--grn-lineHeight-global);outline-color:var(--grn-color-selection);}.grn-context{font-family:var(--grn-font-global);font-size:var(--grn-text-m);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}[data-theme],.grn-context{color:var(--grn-color-content);}*,*:before,*:after{box-sizing:border-box;}.grn-link-context a{transition:var(--grn-transition-slow);text-underline-position:under;text-underline-offset:calc(2px - 0.1em);color:inherit;cursor:pointer;text-decoration-color:var(--grn-color-fade3);}.grn-link-context a:hover{transition:var(--grn-transition-fast);text-decoration-color:currentColor;}.grn-link-context a:active{transition:var(--grn-transition-xxFast);}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "1inf83a",
|
|
9
|
-
styles: ":root{--grn-lineHeight-fixed:7px;--grn-lineHeight-relative:0.9em;--grn-lineHeight-global:calc(var(--grn-lineHeight-fixed) + var(--grn-lineHeight-relative));--grn-font-global:'Flodesk Sans',sans-serif;--grn-radius-button:var(--grn-radius-s);}.grn-context,.grn-context *{line-height:var(--grn-lineHeight-global);outline-color:var(--grn-color-selection);}.grn-context{font-family:var(--grn-font-global);font-size:var(--grn-text-m);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}[data-theme],.grn-context{color:var(--grn-color-content);}*,*:before,*:after{box-sizing:border-box;}.grn-link-context a{transition:var(--grn-transition-slow);text-underline-position:under;text-underline-offset:calc(2px - 0.1em);color:inherit;cursor:pointer;text-decoration-color:var(--grn-color-fade3);}.grn-link-context a:hover{transition:var(--grn-transition-fast);text-decoration-color:currentColor;}.grn-link-context a:active{transition:var(--grn-transition-xxFast);}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zdHlsZXMvYmFzZS5qc3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRWtCIiwiZmlsZSI6Ii4uLy4uL3NyYy9zdHlsZXMvYmFzZS5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBkZWZhdWx0IGNzc2BcbiAgOnJvb3Qge1xuICAgIC0tZ3JuLWxpbmVIZWlnaHQtZml4ZWQ6IDdweDtcbiAgICAtLWdybi1saW5lSGVpZ2h0LXJlbGF0aXZlOiAwLjllbTtcbiAgICAtLWdybi1saW5lSGVpZ2h0LWdsb2JhbDogY2FsYyh2YXIoLS1ncm4tbGluZUhlaWdodC1maXhlZCkgKyB2YXIoLS1ncm4tbGluZUhlaWdodC1yZWxhdGl2ZSkpO1xuXG4gICAgLS1ncm4tZm9udC1nbG9iYWw6ICdGbG9kZXNrIFNhbnMnLCBzYW5zLXNlcmlmO1xuICAgIC0tZ3JuLXJhZGl1cy1idXR0b246IHZhcigtLWdybi1yYWRpdXMtcyk7XG4gIH1cblxuICAuZ3JuLWNvbnRleHQsXG4gIC5ncm4tY29udGV4dCAqIHtcbiAgICBsaW5lLWhlaWdodDogdmFyKC0tZ3JuLWxpbmVIZWlnaHQtZ2xvYmFsKTtcbiAgICBvdXRsaW5lLWNvbG9yOiB2YXIoLS1ncm4tY29sb3Itc2VsZWN0aW9uKTtcbiAgfVxuXG4gIC5ncm4tY29udGV4dCB7XG4gICAgZm9udC1mYW1pbHk6IHZhcigtLWdybi1mb250LWdsb2JhbCk7XG4gICAgZm9udC1zaXplOiB2YXIoLS1ncm4tdGV4dC1tKTtcbiAgICAtd2Via2l0LWZvbnQtc21vb3RoaW5nOiBhbnRpYWxpYXNlZDtcbiAgICAtbW96LW9zeC1mb250LXNtb290aGluZzogZ3JheXNjYWxlO1xuICB9XG5cbiAgW2RhdGEtdGhlbWVdLFxuICAuZ3JuLWNvbnRleHQge1xuICAgIGNvbG9yOiB2YXIoLS1ncm4tY29sb3ItY29udGVudCk7XG4gIH1cblxuICAqLFxuICAqOmJlZm9yZSxcbiAgKjphZnRlciB7XG4gICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgfVxuXG4gIC5ncm4tbGluay1jb250ZXh0IGEge1xuICAgIHRyYW5zaXRpb246IHZhcigtLWdybi10cmFuc2l0aW9uLXNsb3cpO1xuICAgIHRleHQtdW5kZXJsaW5lLXBvc2l0aW9uOiB1bmRlcjtcbiAgICB0ZXh0LXVuZGVybGluZS1vZmZzZXQ6IGNhbGMoMnB4IC0gMC4xZW0pO1xuICAgIGNvbG9yOiBpbmhlcml0O1xuICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICB0ZXh0LWRlY29yYXRpb24tY29sb3I6IHZhcigtLWdybi1jb2xvci1mYWRlMyk7XG4gIH1cblxuICAuZ3JuLWxpbmstY29udGV4dCBhOmhvdmVyIHtcbiAgICB0cmFuc2l0aW9uOiB2YXIoLS1ncm4tdHJhbnNpdGlvbi1mYXN0KTtcbiAgICB0ZXh0LWRlY29yYXRpb24tY29sb3I6IGN1cnJlbnRDb2xvcjtcbiAgfVxuXG4gIC5ncm4tbGluay1jb250ZXh0IGE6YWN0aXZlIHtcbiAgICB0cmFuc2l0aW9uOiB2YXIoLS1ncm4tdHJhbnNpdGlvbi14eEZhc3QpO1xuICB9XG5gO1xuIl19 */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var base = "\n :root {\n --grn-lineHeight-fixed: 7px;\n --grn-lineHeight-relative: 0.9em;\n --grn-lineHeight-global: calc(var(--grn-lineHeight-fixed) + var(--grn-lineHeight-relative));\n\n --grn-font-global: 'Flodesk Sans', sans-serif;\n --grn-radius-button: var(--grn-radius-s);\n }\n\n .grn-context,\n .grn-context * {\n line-height: var(--grn-lineHeight-global);\n outline-color: var(--grn-color-selection);\n }\n\n .grn-context {\n font-family: var(--grn-font-global);\n font-size: var(--grn-text-m);\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n }\n\n [data-theme],\n .grn-context {\n color: var(--grn-color-content);\n }\n\n *,\n *:before,\n *:after {\n box-sizing: border-box;\n }\n\n .grn-link-context a {\n transition: var(--grn-transition-slow);\n text-underline-position: under;\n text-underline-offset: calc(2px - 0.1em);\n color: inherit;\n cursor: pointer;\n text-decoration-color: var(--grn-color-fade3);\n }\n\n .grn-link-context a:hover {\n transition: var(--grn-transition-fast);\n text-decoration-color: currentColor;\n }\n\n .grn-link-context a:active {\n transition: var(--grn-transition-xxFast);\n }\n";
|
|
2
|
+
export default base;
|
package/es/styles/colors/core.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "3yoacj",
|
|
6
|
-
styles: ":root{--white:hsl(0 0% 100%);--H:13.85;--S:7%;--HS:var(--H) var(--S);--bfS:20%;--wfS:calc(100% - var(--bfS));}:root{--redHS:6 55%;--redL:52%;--grn-color-blue:hsl(218 74% 54%);--grn-color-red:hsl(var(--redHS) var(--redL));--grn-color-yellow:hsl(44 99% 59%);--grn-color-green:hsl(153 22% 57%);}:root,[data-experimental]{--grn-color-shadeTone13:hsl(var(--H) 20% 10%);--grn-color-shadeTone12:hsl(var(--H) 22% 11.5%);--grn-color-shadeTone11:hsl(var(--H) 15% 15%);--grn-color-shadeTone10:hsl(var(--H) 12% 21%);--grn-color-shadeTone9:hsl(var(--H) 9% 28%);--grn-color-shadeTone8:hsl(var(--H) 7% 38%);--grn-color-shadeTone7:hsl(var(--H) 5% 51%);--grn-color-shadeTone6:hsl(var(--H) 6% 70%);--grn-color-shadeTone5:hsl(var(--H) 7% 82%);--grn-color-shadeTone4:hsl(var(--H) 7% 90%);--grn-color-shadeTone3:hsl(var(--H) 7% 95%);--grn-color-shadeTone2:hsl(var(--H) 6% 97.5%);--grn-color-shadeTone1:hsl(var(--H) 6% 100%);--fadeA10:73%;--fadeA9:66%;--fadeA8:59%;--fadeA7:52%;--fadeA6:45%;--fadeA5:38%;--fadeA4:31%;--fadeA3:24%;--fadeA2:17%;--fadeA1:10%;--grn-color-lightFade10:hsl(var(--H) 7% var(--wfS) / var(--fadeA10));--grn-color-lightFade9:hsl(var(--H) 7% var(--wfS) / var(--fadeA9));--grn-color-lightFade8:hsl(var(--H) 7% var(--wfS) / var(--fadeA8));--grn-color-lightFade7:hsl(var(--H) 7% var(--wfS) / var(--fadeA7));--grn-color-lightFade6:hsl(var(--H) 7% var(--wfS) / var(--fadeA6));--grn-color-lightFade5:hsl(var(--H) 7% var(--wfS) / var(--fadeA5));--grn-color-lightFade4:hsl(var(--H) 7% var(--wfS) / var(--fadeA4));--grn-color-lightFade3:hsl(var(--H) 7% var(--wfS) / var(--fadeA3));--grn-color-lightFade2:hsl(var(--H) 7% var(--wfS) / var(--fadeA2));--grn-color-lightFade1:hsl(var(--H) 7% var(--wfS) / var(--fadeA1));--grn-color-darkFade10:hsl(var(--H) 7% var(--bfS) / var(--fadeA10));--grn-color-darkFade9:hsl(var(--H) 7% var(--bfS) / var(--fadeA9));--grn-color-darkFade8:hsl(var(--H) 7% var(--bfS) / var(--fadeA8));--grn-color-darkFade7:hsl(var(--H) 7% var(--bfS) / var(--fadeA7));--grn-color-darkFade6:hsl(var(--H) 7% var(--bfS) / var(--fadeA6));--grn-color-darkFade5:hsl(var(--H) 7% var(--bfS) / var(--fadeA5));--grn-color-darkFade4:hsl(var(--H) 9% var(--bfS) / var(--fadeA4));--grn-color-darkFade3:hsl(var(--H) 11% var(--bfS) / var(--fadeA3));--grn-color-darkFade2:hsl(var(--H) 13% var(--bfS) / var(--fadeA2));--grn-color-darkFade1:hsl(var(--H) 15% var(--bfS) / var(--fadeA1));}:root{--grn-color-warning:var(--grn-color-yellow);--grn-color-danger:var(--grn-color-red);--grn-color-success:var(--grn-color-green);--grn-color-selection:var(--grn-color-blue);}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "3yoacj",
|
|
9
|
-
styles: ":root{--white:hsl(0 0% 100%);--H:13.85;--S:7%;--HS:var(--H) var(--S);--bfS:20%;--wfS:calc(100% - var(--bfS));}:root{--redHS:6 55%;--redL:52%;--grn-color-blue:hsl(218 74% 54%);--grn-color-red:hsl(var(--redHS) var(--redL));--grn-color-yellow:hsl(44 99% 59%);--grn-color-green:hsl(153 22% 57%);}:root,[data-experimental]{--grn-color-shadeTone13:hsl(var(--H) 20% 10%);--grn-color-shadeTone12:hsl(var(--H) 22% 11.5%);--grn-color-shadeTone11:hsl(var(--H) 15% 15%);--grn-color-shadeTone10:hsl(var(--H) 12% 21%);--grn-color-shadeTone9:hsl(var(--H) 9% 28%);--grn-color-shadeTone8:hsl(var(--H) 7% 38%);--grn-color-shadeTone7:hsl(var(--H) 5% 51%);--grn-color-shadeTone6:hsl(var(--H) 6% 70%);--grn-color-shadeTone5:hsl(var(--H) 7% 82%);--grn-color-shadeTone4:hsl(var(--H) 7% 90%);--grn-color-shadeTone3:hsl(var(--H) 7% 95%);--grn-color-shadeTone2:hsl(var(--H) 6% 97.5%);--grn-color-shadeTone1:hsl(var(--H) 6% 100%);--fadeA10:73%;--fadeA9:66%;--fadeA8:59%;--fadeA7:52%;--fadeA6:45%;--fadeA5:38%;--fadeA4:31%;--fadeA3:24%;--fadeA2:17%;--fadeA1:10%;--grn-color-lightFade10:hsl(var(--H) 7% var(--wfS) / var(--fadeA10));--grn-color-lightFade9:hsl(var(--H) 7% var(--wfS) / var(--fadeA9));--grn-color-lightFade8:hsl(var(--H) 7% var(--wfS) / var(--fadeA8));--grn-color-lightFade7:hsl(var(--H) 7% var(--wfS) / var(--fadeA7));--grn-color-lightFade6:hsl(var(--H) 7% var(--wfS) / var(--fadeA6));--grn-color-lightFade5:hsl(var(--H) 7% var(--wfS) / var(--fadeA5));--grn-color-lightFade4:hsl(var(--H) 7% var(--wfS) / var(--fadeA4));--grn-color-lightFade3:hsl(var(--H) 7% var(--wfS) / var(--fadeA3));--grn-color-lightFade2:hsl(var(--H) 7% var(--wfS) / var(--fadeA2));--grn-color-lightFade1:hsl(var(--H) 7% var(--wfS) / var(--fadeA1));--grn-color-darkFade10:hsl(var(--H) 7% var(--bfS) / var(--fadeA10));--grn-color-darkFade9:hsl(var(--H) 7% var(--bfS) / var(--fadeA9));--grn-color-darkFade8:hsl(var(--H) 7% var(--bfS) / var(--fadeA8));--grn-color-darkFade7:hsl(var(--H) 7% var(--bfS) / var(--fadeA7));--grn-color-darkFade6:hsl(var(--H) 7% var(--bfS) / var(--fadeA6));--grn-color-darkFade5:hsl(var(--H) 7% var(--bfS) / var(--fadeA5));--grn-color-darkFade4:hsl(var(--H) 9% var(--bfS) / var(--fadeA4));--grn-color-darkFade3:hsl(var(--H) 11% var(--bfS) / var(--fadeA3));--grn-color-darkFade2:hsl(var(--H) 13% var(--bfS) / var(--fadeA2));--grn-color-darkFade1:hsl(var(--H) 15% var(--bfS) / var(--fadeA1));}:root{--grn-color-warning:var(--grn-color-yellow);--grn-color-danger:var(--grn-color-red);--grn-color-success:var(--grn-color-green);--grn-color-selection:var(--grn-color-blue);}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9zdHlsZXMvY29sb3JzL2NvcmUuanN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVrQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvc3R5bGVzL2NvbG9ycy9jb3JlLmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuZXhwb3J0IGRlZmF1bHQgY3NzYFxuICA6cm9vdCB7XG4gICAgLS13aGl0ZTogaHNsKDAgMCUgMTAwJSk7XG4gICAgLS1IOiAxMy44NTtcbiAgICAtLVM6IDclO1xuICAgIC0tSFM6IHZhcigtLUgpIHZhcigtLVMpO1xuICAgIC0tYmZTOiAyMCU7XG4gICAgLS13ZlM6IGNhbGMoMTAwJSAtIHZhcigtLWJmUykpO1xuICB9XG5cbiAgOnJvb3Qge1xuICAgIC0tcmVkSFM6IDYgNTUlO1xuICAgIC0tcmVkTDogNTIlO1xuXG4gICAgLS1ncm4tY29sb3ItYmx1ZTogaHNsKDIxOCA3NCUgNTQlKTtcbiAgICAtLWdybi1jb2xvci1yZWQ6IGhzbCh2YXIoLS1yZWRIUykgdmFyKC0tcmVkTCkpO1xuICAgIC0tZ3JuLWNvbG9yLXllbGxvdzogaHNsKDQ0IDk5JSA1OSUpO1xuICAgIC0tZ3JuLWNvbG9yLWdyZWVuOiBoc2woMTUzIDIyJSA1NyUpO1xuICB9XG5cbiAgOnJvb3QsXG4gIFtkYXRhLWV4cGVyaW1lbnRhbF0ge1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTEzOiBoc2wodmFyKC0tSCkgMjAlIDEwJSk7XG4gICAgLS1ncm4tY29sb3Itc2hhZGVUb25lMTI6IGhzbCh2YXIoLS1IKSAyMiUgMTEuNSUpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTExOiBoc2wodmFyKC0tSCkgMTUlIDE1JSk7XG4gICAgLS1ncm4tY29sb3Itc2hhZGVUb25lMTA6IGhzbCh2YXIoLS1IKSAxMiUgMjElKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU5OiBoc2wodmFyKC0tSCkgOSUgMjglKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU4OiBoc2wodmFyKC0tSCkgNyUgMzglKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU3OiBoc2wodmFyKC0tSCkgNSUgNTElKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU2OiBoc2wodmFyKC0tSCkgNiUgNzAlKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU1OiBoc2wodmFyKC0tSCkgNyUgODIlKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmU0OiBoc2wodmFyKC0tSCkgNyUgOTAlKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmUzOiBoc2wodmFyKC0tSCkgNyUgOTUlKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZVRvbmUyOiBoc2wodmFyKC0tSCkgNiUgOTcuNSUpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTE6IGhzbCh2YXIoLS1IKSA2JSAxMDAlKTtcblxuICAgIC0tZmFkZUExMDogNzMlO1xuICAgIC0tZmFkZUE5OiA2NiU7XG4gICAgLS1mYWRlQTg6IDU5JTtcbiAgICAtLWZhZGVBNzogNTIlO1xuICAgIC0tZmFkZUE2OiA0NSU7XG4gICAgLS1mYWRlQTU6IDM4JTtcbiAgICAtLWZhZGVBNDogMzElO1xuICAgIC0tZmFkZUEzOiAyNCU7XG4gICAgLS1mYWRlQTI6IDE3JTtcbiAgICAtLWZhZGVBMTogMTAlO1xuXG4gICAgLS1ncm4tY29sb3ItbGlnaHRGYWRlMTA6IGhzbCh2YXIoLS1IKSA3JSB2YXIoLS13ZlMpIC8gdmFyKC0tZmFkZUExMCkpO1xuICAgIC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTk6IGhzbCh2YXIoLS1IKSA3JSB2YXIoLS13ZlMpIC8gdmFyKC0tZmFkZUE5KSk7XG4gICAgLS1ncm4tY29sb3ItbGlnaHRGYWRlODogaHNsKHZhcigtLUgpIDclIHZhcigtLXdmUykgLyB2YXIoLS1mYWRlQTgpKTtcbiAgICAtLWdybi1jb2xvci1saWdodEZhZGU3OiBoc2wodmFyKC0tSCkgNyUgdmFyKC0td2ZTKSAvIHZhcigtLWZhZGVBNykpO1xuICAgIC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTY6IGhzbCh2YXIoLS1IKSA3JSB2YXIoLS13ZlMpIC8gdmFyKC0tZmFkZUE2KSk7XG4gICAgLS1ncm4tY29sb3ItbGlnaHRGYWRlNTogaHNsKHZhcigtLUgpIDclIHZhcigtLXdmUykgLyB2YXIoLS1mYWRlQTUpKTtcbiAgICAtLWdybi1jb2xvci1saWdodEZhZGU0OiBoc2wodmFyKC0tSCkgNyUgdmFyKC0td2ZTKSAvIHZhcigtLWZhZGVBNCkpO1xuICAgIC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTM6IGhzbCh2YXIoLS1IKSA3JSB2YXIoLS13ZlMpIC8gdmFyKC0tZmFkZUEzKSk7XG4gICAgLS1ncm4tY29sb3ItbGlnaHRGYWRlMjogaHNsKHZhcigtLUgpIDclIHZhcigtLXdmUykgLyB2YXIoLS1mYWRlQTIpKTtcbiAgICAtLWdybi1jb2xvci1saWdodEZhZGUxOiBoc2wodmFyKC0tSCkgNyUgdmFyKC0td2ZTKSAvIHZhcigtLWZhZGVBMSkpO1xuXG4gICAgLS1ncm4tY29sb3ItZGFya0ZhZGUxMDogaHNsKHZhcigtLUgpIDclIHZhcigtLWJmUykgLyB2YXIoLS1mYWRlQTEwKSk7XG4gICAgLS1ncm4tY29sb3ItZGFya0ZhZGU5OiBoc2wodmFyKC0tSCkgNyUgdmFyKC0tYmZTKSAvIHZhcigtLWZhZGVBOSkpO1xuICAgIC0tZ3JuLWNvbG9yLWRhcmtGYWRlODogaHNsKHZhcigtLUgpIDclIHZhcigtLWJmUykgLyB2YXIoLS1mYWRlQTgpKTtcbiAgICAtLWdybi1jb2xvci1kYXJrRmFkZTc6IGhzbCh2YXIoLS1IKSA3JSB2YXIoLS1iZlMpIC8gdmFyKC0tZmFkZUE3KSk7XG4gICAgLS1ncm4tY29sb3ItZGFya0ZhZGU2OiBoc2wodmFyKC0tSCkgNyUgdmFyKC0tYmZTKSAvIHZhcigtLWZhZGVBNikpO1xuICAgIC0tZ3JuLWNvbG9yLWRhcmtGYWRlNTogaHNsKHZhcigtLUgpIDclIHZhcigtLWJmUykgLyB2YXIoLS1mYWRlQTUpKTtcbiAgICAtLWdybi1jb2xvci1kYXJrRmFkZTQ6IGhzbCh2YXIoLS1IKSA5JSB2YXIoLS1iZlMpIC8gdmFyKC0tZmFkZUE0KSk7XG4gICAgLS1ncm4tY29sb3ItZGFya0ZhZGUzOiBoc2wodmFyKC0tSCkgMTElIHZhcigtLWJmUykgLyB2YXIoLS1mYWRlQTMpKTtcbiAgICAtLWdybi1jb2xvci1kYXJrRmFkZTI6IGhzbCh2YXIoLS1IKSAxMyUgdmFyKC0tYmZTKSAvIHZhcigtLWZhZGVBMikpO1xuICAgIC0tZ3JuLWNvbG9yLWRhcmtGYWRlMTogaHNsKHZhcigtLUgpIDE1JSB2YXIoLS1iZlMpIC8gdmFyKC0tZmFkZUExKSk7XG4gIH1cblxuICA6cm9vdCB7XG4gICAgLS1ncm4tY29sb3Itd2FybmluZzogdmFyKC0tZ3JuLWNvbG9yLXllbGxvdyk7XG4gICAgLS1ncm4tY29sb3ItZGFuZ2VyOiB2YXIoLS1ncm4tY29sb3ItcmVkKTtcbiAgICAtLWdybi1jb2xvci1zdWNjZXNzOiB2YXIoLS1ncm4tY29sb3ItZ3JlZW4pO1xuICAgIC0tZ3JuLWNvbG9yLXNlbGVjdGlvbjogdmFyKC0tZ3JuLWNvbG9yLWJsdWUpO1xuICB9XG5gO1xuIl19 */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var core = "\n :root {\n --white: hsl(0 0% 100%);\n --H: 13.85;\n --S: 7%;\n --HS: var(--H) var(--S);\n --bfS: 20%;\n --wfS: calc(100% - var(--bfS));\n }\n\n :root {\n --redHS: 6 55%;\n --redL: 52%;\n\n --grn-color-blue: hsl(218 74% 54%);\n --grn-color-red: hsl(var(--redHS) var(--redL));\n --grn-color-yellow: hsl(44 99% 59%);\n --grn-color-green: hsl(153 22% 57%);\n }\n\n :root,\n [data-experimental] {\n --grn-color-shadeTone13: hsl(var(--H) 20% 10%);\n --grn-color-shadeTone12: hsl(var(--H) 22% 11.5%);\n --grn-color-shadeTone11: hsl(var(--H) 15% 15%);\n --grn-color-shadeTone10: hsl(var(--H) 12% 21%);\n --grn-color-shadeTone9: hsl(var(--H) 9% 28%);\n --grn-color-shadeTone8: hsl(var(--H) 7% 38%);\n --grn-color-shadeTone7: hsl(var(--H) 5% 51%);\n --grn-color-shadeTone6: hsl(var(--H) 6% 70%);\n --grn-color-shadeTone5: hsl(var(--H) 7% 82%);\n --grn-color-shadeTone4: hsl(var(--H) 7% 90%);\n --grn-color-shadeTone3: hsl(var(--H) 7% 95%);\n --grn-color-shadeTone2: hsl(var(--H) 6% 97.5%);\n --grn-color-shadeTone1: hsl(var(--H) 6% 100%);\n\n --fadeA10: 73%;\n --fadeA9: 66%;\n --fadeA8: 59%;\n --fadeA7: 52%;\n --fadeA6: 45%;\n --fadeA5: 38%;\n --fadeA4: 31%;\n --fadeA3: 24%;\n --fadeA2: 17%;\n --fadeA1: 10%;\n\n --grn-color-lightFade10: hsl(var(--H) 7% var(--wfS) / var(--fadeA10));\n --grn-color-lightFade9: hsl(var(--H) 7% var(--wfS) / var(--fadeA9));\n --grn-color-lightFade8: hsl(var(--H) 7% var(--wfS) / var(--fadeA8));\n --grn-color-lightFade7: hsl(var(--H) 7% var(--wfS) / var(--fadeA7));\n --grn-color-lightFade6: hsl(var(--H) 7% var(--wfS) / var(--fadeA6));\n --grn-color-lightFade5: hsl(var(--H) 7% var(--wfS) / var(--fadeA5));\n --grn-color-lightFade4: hsl(var(--H) 7% var(--wfS) / var(--fadeA4));\n --grn-color-lightFade3: hsl(var(--H) 7% var(--wfS) / var(--fadeA3));\n --grn-color-lightFade2: hsl(var(--H) 7% var(--wfS) / var(--fadeA2));\n --grn-color-lightFade1: hsl(var(--H) 7% var(--wfS) / var(--fadeA1));\n\n --grn-color-darkFade10: hsl(var(--H) 7% var(--bfS) / var(--fadeA10));\n --grn-color-darkFade9: hsl(var(--H) 7% var(--bfS) / var(--fadeA9));\n --grn-color-darkFade8: hsl(var(--H) 7% var(--bfS) / var(--fadeA8));\n --grn-color-darkFade7: hsl(var(--H) 7% var(--bfS) / var(--fadeA7));\n --grn-color-darkFade6: hsl(var(--H) 7% var(--bfS) / var(--fadeA6));\n --grn-color-darkFade5: hsl(var(--H) 7% var(--bfS) / var(--fadeA5));\n --grn-color-darkFade4: hsl(var(--H) 9% var(--bfS) / var(--fadeA4));\n --grn-color-darkFade3: hsl(var(--H) 11% var(--bfS) / var(--fadeA3));\n --grn-color-darkFade2: hsl(var(--H) 13% var(--bfS) / var(--fadeA2));\n --grn-color-darkFade1: hsl(var(--H) 15% var(--bfS) / var(--fadeA1));\n }\n\n :root {\n --grn-color-warning: var(--grn-color-yellow);\n --grn-color-danger: var(--grn-color-red);\n --grn-color-success: var(--grn-color-green);\n --grn-color-selection: var(--grn-color-blue);\n }\n";
|
|
2
|
+
export default core;
|
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "1ety1ho",
|
|
6
|
-
styles: "[data-experimental='true']{--grn-radius-button:1000px;}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "1ety1ho",
|
|
9
|
-
styles: "[data-experimental='true']{--grn-radius-button:1000px;}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9zdHlsZXMvY29sb3JzL2V4cGVyaW1lbnRhbC5qc3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRWtCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9zdHlsZXMvY29sb3JzL2V4cGVyaW1lbnRhbC5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBkZWZhdWx0IGNzc2BcbiAgW2RhdGEtZXhwZXJpbWVudGFsPSd0cnVlJ10ge1xuICAgIC0tZ3JuLXJhZGl1cy1idXR0b246IDEwMDBweDtcbiAgfVxuYDtcbiJdfQ== */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var experimental = "\n [data-experimental='true'] {\n --grn-radius-button: 1000px;\n }\n";
|
|
2
|
+
export default experimental;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { css } from '@emotion/react';
|
|
2
1
|
import core from './core';
|
|
3
2
|
import theme from './theme';
|
|
4
3
|
import experimental from './experimental';
|
|
5
|
-
export default
|
|
4
|
+
export default [core, theme, experimental].join('\n');
|
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "tevbm6",
|
|
6
|
-
styles: ":root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--grn-color-fade10:var(--grn-color-darkFade10);--grn-color-fade9:var(--grn-color-darkFade9);--grn-color-fade8:var(--grn-color-darkFade8);--grn-color-fade7:var(--grn-color-darkFade7);--grn-color-fade6:var(--grn-color-darkFade6);--grn-color-fade5:var(--grn-color-darkFade5);--grn-color-fade4:var(--grn-color-darkFade4);--grn-color-fade3:var(--grn-color-darkFade3);--grn-color-fade2:var(--grn-color-darkFade2);--grn-color-fade1:var(--grn-color-darkFade1);--grn-color-shade1:var(--grn-color-shadeTone1);--grn-color-shade2:var(--grn-color-shadeTone2);--grn-color-shade3:var(--grn-color-shadeTone3);--grn-color-shade4:var(--grn-color-shadeTone4);--grn-color-shade5:var(--grn-color-shadeTone5);--grn-color-shade6:var(--grn-color-shadeTone6);--grn-color-shade7:var(--grn-color-shadeTone7);--grn-color-shade8:var(--grn-color-shadeTone8);--grn-color-shade9:var(--grn-color-shadeTone9);--grn-color-shade10:var(--grn-color-shadeTone10);--grn-color-shade11:var(--grn-color-shadeTone11);--grn-color-shade12:var(--grn-color-shadeTone12);--grn-color-shade13:var(--grn-color-shadeTone13);}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--grn-color-fade10:var(--grn-color-lightFade10);--grn-color-fade9:var(--grn-color-lightFade9);--grn-color-fade8:var(--grn-color-lightFade8);--grn-color-fade7:var(--grn-color-lightFade7);--grn-color-fade6:var(--grn-color-lightFade6);--grn-color-fade5:var(--grn-color-lightFade5);--grn-color-fade4:var(--grn-color-lightFade4);--grn-color-fade3:var(--grn-color-lightFade3);--grn-color-fade2:var(--grn-color-lightFade2);--grn-color-fade1:var(--grn-color-lightFade1);--grn-color-shade1:var(--grn-color-shadeTone13);--grn-color-shade2:var(--grn-color-shadeTone12);--grn-color-shade3:var(--grn-color-shadeTone11);--grn-color-shade4:var(--grn-color-shadeTone10);--grn-color-shade5:var(--grn-color-shadeTone9);--grn-color-shade6:var(--grn-color-shadeTone8);--grn-color-shade7:var(--grn-color-shadeTone7);--grn-color-shade8:var(--grn-color-shadeTone6);--grn-color-shade9:var(--grn-color-shadeTone5);--grn-color-shade10:var(--grn-color-shadeTone4);--grn-color-shade11:var(--grn-color-shadeTone3);--grn-color-shade12:var(--grn-color-shadeTone2);--grn-color-shade13:var(--grn-color-shadeTone1);}:root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--contentL:20%;--backgroundL:80%;--grn-color-floatingBackground:var(--grn-color-shade1);}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--contentL:80%;--backgroundL:20%;--grn-color-floatingBackground:var(--grn-color-shade2);}:root,[data-theme]{--grn-color-content:var(--grn-color-shade12);--grn-color-content2:var(--grn-color-fade7);--grn-color-content3:var(--grn-color-fade5);--grn-color-disabledContent:var(--grn-color-shade7);--grn-color-icon:var(--grn-color-fade6);--grn-color-background:var(--grn-color-shade1);--grn-color-background2:var(--grn-color-shade2);--grn-color-background3:var(--grn-color-shade3);--grn-color-disabledBackground:var(--grn-color-shade4);--grn-color-border:hsl(var(--HS) var(--contentL) / 12%);--grn-color-border2:hsl(var(--HS) var(--contentL) / 20%);}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "tevbm6",
|
|
9
|
-
styles: ":root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--grn-color-fade10:var(--grn-color-darkFade10);--grn-color-fade9:var(--grn-color-darkFade9);--grn-color-fade8:var(--grn-color-darkFade8);--grn-color-fade7:var(--grn-color-darkFade7);--grn-color-fade6:var(--grn-color-darkFade6);--grn-color-fade5:var(--grn-color-darkFade5);--grn-color-fade4:var(--grn-color-darkFade4);--grn-color-fade3:var(--grn-color-darkFade3);--grn-color-fade2:var(--grn-color-darkFade2);--grn-color-fade1:var(--grn-color-darkFade1);--grn-color-shade1:var(--grn-color-shadeTone1);--grn-color-shade2:var(--grn-color-shadeTone2);--grn-color-shade3:var(--grn-color-shadeTone3);--grn-color-shade4:var(--grn-color-shadeTone4);--grn-color-shade5:var(--grn-color-shadeTone5);--grn-color-shade6:var(--grn-color-shadeTone6);--grn-color-shade7:var(--grn-color-shadeTone7);--grn-color-shade8:var(--grn-color-shadeTone8);--grn-color-shade9:var(--grn-color-shadeTone9);--grn-color-shade10:var(--grn-color-shadeTone10);--grn-color-shade11:var(--grn-color-shadeTone11);--grn-color-shade12:var(--grn-color-shadeTone12);--grn-color-shade13:var(--grn-color-shadeTone13);}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--grn-color-fade10:var(--grn-color-lightFade10);--grn-color-fade9:var(--grn-color-lightFade9);--grn-color-fade8:var(--grn-color-lightFade8);--grn-color-fade7:var(--grn-color-lightFade7);--grn-color-fade6:var(--grn-color-lightFade6);--grn-color-fade5:var(--grn-color-lightFade5);--grn-color-fade4:var(--grn-color-lightFade4);--grn-color-fade3:var(--grn-color-lightFade3);--grn-color-fade2:var(--grn-color-lightFade2);--grn-color-fade1:var(--grn-color-lightFade1);--grn-color-shade1:var(--grn-color-shadeTone13);--grn-color-shade2:var(--grn-color-shadeTone12);--grn-color-shade3:var(--grn-color-shadeTone11);--grn-color-shade4:var(--grn-color-shadeTone10);--grn-color-shade5:var(--grn-color-shadeTone9);--grn-color-shade6:var(--grn-color-shadeTone8);--grn-color-shade7:var(--grn-color-shadeTone7);--grn-color-shade8:var(--grn-color-shadeTone6);--grn-color-shade9:var(--grn-color-shadeTone5);--grn-color-shade10:var(--grn-color-shadeTone4);--grn-color-shade11:var(--grn-color-shadeTone3);--grn-color-shade12:var(--grn-color-shadeTone2);--grn-color-shade13:var(--grn-color-shadeTone1);}:root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--contentL:20%;--backgroundL:80%;--grn-color-floatingBackground:var(--grn-color-shade1);}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--contentL:80%;--backgroundL:20%;--grn-color-floatingBackground:var(--grn-color-shade2);}:root,[data-theme]{--grn-color-content:var(--grn-color-shade12);--grn-color-content2:var(--grn-color-fade7);--grn-color-content3:var(--grn-color-fade5);--grn-color-disabledContent:var(--grn-color-shade7);--grn-color-icon:var(--grn-color-fade6);--grn-color-background:var(--grn-color-shade1);--grn-color-background2:var(--grn-color-shade2);--grn-color-background3:var(--grn-color-shade3);--grn-color-disabledBackground:var(--grn-color-shade4);--grn-color-border:hsl(var(--HS) var(--contentL) / 12%);--grn-color-border2:hsl(var(--HS) var(--contentL) / 20%);}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9zdHlsZXMvY29sb3JzL3RoZW1lLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFa0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL3N0eWxlcy9jb2xvcnMvdGhlbWUuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5leHBvcnQgZGVmYXVsdCBjc3NgXG4gIC8qIGxpZ2h0ICovXG5cbiAgOnJvb3QsXG4gIFtkYXRhLXRoZW1lPSdsaWdodCddLFxuICBbZGF0YS10aGVtZT0nZGFyayddIFtkYXRhLXRoZW1lPSdpbnZlcnQnXSB7XG4gICAgLS1ncm4tY29sb3ItZmFkZTEwOiB2YXIoLS1ncm4tY29sb3ItZGFya0ZhZGUxMCk7XG4gICAgLS1ncm4tY29sb3ItZmFkZTk6IHZhcigtLWdybi1jb2xvci1kYXJrRmFkZTkpO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGU4OiB2YXIoLS1ncm4tY29sb3ItZGFya0ZhZGU4KTtcbiAgICAtLWdybi1jb2xvci1mYWRlNzogdmFyKC0tZ3JuLWNvbG9yLWRhcmtGYWRlNyk7XG4gICAgLS1ncm4tY29sb3ItZmFkZTY6IHZhcigtLWdybi1jb2xvci1kYXJrRmFkZTYpO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGU1OiB2YXIoLS1ncm4tY29sb3ItZGFya0ZhZGU1KTtcbiAgICAtLWdybi1jb2xvci1mYWRlNDogdmFyKC0tZ3JuLWNvbG9yLWRhcmtGYWRlNCk7XG4gICAgLS1ncm4tY29sb3ItZmFkZTM6IHZhcigtLWdybi1jb2xvci1kYXJrRmFkZTMpO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGUyOiB2YXIoLS1ncm4tY29sb3ItZGFya0ZhZGUyKTtcbiAgICAtLWdybi1jb2xvci1mYWRlMTogdmFyKC0tZ3JuLWNvbG9yLWRhcmtGYWRlMSk7XG5cbiAgICAtLWdybi1jb2xvci1zaGFkZTE6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUxKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTI6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUyKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTM6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUzKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTQ6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU0KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTU6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU1KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTY6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU2KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTc6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU3KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTg6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU4KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTk6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU5KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTEwOiB2YXIoLS1ncm4tY29sb3Itc2hhZGVUb25lMTApO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlMTE6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUxMSk7XG4gICAgLS1ncm4tY29sb3Itc2hhZGUxMjogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTEyKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTEzOiB2YXIoLS1ncm4tY29sb3Itc2hhZGVUb25lMTMpO1xuICB9XG5cbiAgLyogZGFyayAqL1xuXG4gIFtkYXRhLXRoZW1lPSdkYXJrJ10sXG4gIFtkYXRhLXRoZW1lPSdsaWdodCddIFtkYXRhLXRoZW1lPSdpbnZlcnQnXSB7XG4gICAgLS1ncm4tY29sb3ItZmFkZTEwOiB2YXIoLS1ncm4tY29sb3ItbGlnaHRGYWRlMTApO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGU5OiB2YXIoLS1ncm4tY29sb3ItbGlnaHRGYWRlOSk7XG4gICAgLS1ncm4tY29sb3ItZmFkZTg6IHZhcigtLWdybi1jb2xvci1saWdodEZhZGU4KTtcbiAgICAtLWdybi1jb2xvci1mYWRlNzogdmFyKC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTcpO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGU2OiB2YXIoLS1ncm4tY29sb3ItbGlnaHRGYWRlNik7XG4gICAgLS1ncm4tY29sb3ItZmFkZTU6IHZhcigtLWdybi1jb2xvci1saWdodEZhZGU1KTtcbiAgICAtLWdybi1jb2xvci1mYWRlNDogdmFyKC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTQpO1xuICAgIC0tZ3JuLWNvbG9yLWZhZGUzOiB2YXIoLS1ncm4tY29sb3ItbGlnaHRGYWRlMyk7XG4gICAgLS1ncm4tY29sb3ItZmFkZTI6IHZhcigtLWdybi1jb2xvci1saWdodEZhZGUyKTtcbiAgICAtLWdybi1jb2xvci1mYWRlMTogdmFyKC0tZ3JuLWNvbG9yLWxpZ2h0RmFkZTEpO1xuXG4gICAgLS1ncm4tY29sb3Itc2hhZGUxOiB2YXIoLS1ncm4tY29sb3Itc2hhZGVUb25lMTMpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlMjogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTEyKTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTM6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUxMSk7XG4gICAgLS1ncm4tY29sb3Itc2hhZGU0OiB2YXIoLS1ncm4tY29sb3Itc2hhZGVUb25lMTApO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlNTogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTkpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlNjogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTgpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlNzogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTcpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlODogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTYpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlOTogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTUpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlMTA6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmU0KTtcbiAgICAtLWdybi1jb2xvci1zaGFkZTExOiB2YXIoLS1ncm4tY29sb3Itc2hhZGVUb25lMyk7XG4gICAgLS1ncm4tY29sb3Itc2hhZGUxMjogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlVG9uZTIpO1xuICAgIC0tZ3JuLWNvbG9yLXNoYWRlMTM6IHZhcigtLWdybi1jb2xvci1zaGFkZVRvbmUxKTtcbiAgfVxuXG4gIC8qIGxpZ2h0ICovXG5cbiAgOnJvb3QsXG4gIFtkYXRhLXRoZW1lPSdsaWdodCddLFxuICBbZGF0YS10aGVtZT0nZGFyayddIFtkYXRhLXRoZW1lPSdpbnZlcnQnXSB7XG4gICAgLS1jb250ZW50TDogMjAlO1xuICAgIC0tYmFja2dyb3VuZEw6IDgwJTtcbiAgICAtLWdybi1jb2xvci1mbG9hdGluZ0JhY2tncm91bmQ6IHZhcigtLWdybi1jb2xvci1zaGFkZTEpO1xuICB9XG5cbiAgLyogZGFyayAqL1xuXG4gIFtkYXRhLXRoZW1lPSdkYXJrJ10sXG4gIFtkYXRhLXRoZW1lPSdsaWdodCddIFtkYXRhLXRoZW1lPSdpbnZlcnQnXSB7XG4gICAgLS1jb250ZW50TDogODAlO1xuICAgIC0tYmFja2dyb3VuZEw6IDIwJTtcbiAgICAtLWdybi1jb2xvci1mbG9hdGluZ0JhY2tncm91bmQ6IHZhcigtLWdybi1jb2xvci1zaGFkZTIpO1xuICB9XG5cbiAgLyogbGlnaHQgKyBkYXJrICovXG5cbiAgOnJvb3QsXG4gIFtkYXRhLXRoZW1lXSB7XG4gICAgLS1ncm4tY29sb3ItY29udGVudDogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlMTIpO1xuICAgIC0tZ3JuLWNvbG9yLWNvbnRlbnQyOiB2YXIoLS1ncm4tY29sb3ItZmFkZTcpO1xuICAgIC0tZ3JuLWNvbG9yLWNvbnRlbnQzOiB2YXIoLS1ncm4tY29sb3ItZmFkZTUpO1xuICAgIC0tZ3JuLWNvbG9yLWRpc2FibGVkQ29udGVudDogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlNyk7XG4gICAgLS1ncm4tY29sb3ItaWNvbjogdmFyKC0tZ3JuLWNvbG9yLWZhZGU2KTtcblxuICAgIC0tZ3JuLWNvbG9yLWJhY2tncm91bmQ6IHZhcigtLWdybi1jb2xvci1zaGFkZTEpO1xuICAgIC0tZ3JuLWNvbG9yLWJhY2tncm91bmQyOiB2YXIoLS1ncm4tY29sb3Itc2hhZGUyKTtcbiAgICAtLWdybi1jb2xvci1iYWNrZ3JvdW5kMzogdmFyKC0tZ3JuLWNvbG9yLXNoYWRlMyk7XG4gICAgLS1ncm4tY29sb3ItZGlzYWJsZWRCYWNrZ3JvdW5kOiB2YXIoLS1ncm4tY29sb3Itc2hhZGU0KTtcblxuICAgIC0tZ3JuLWNvbG9yLWJvcmRlcjogaHNsKHZhcigtLUhTKSB2YXIoLS1jb250ZW50TCkgLyAxMiUpO1xuICAgIC0tZ3JuLWNvbG9yLWJvcmRlcjI6IGhzbCh2YXIoLS1IUykgdmFyKC0tY29udGVudEwpIC8gMjAlKTtcbiAgfVxuYDtcbiJdfQ== */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var theme = "\n /* light */\n\n :root,\n [data-theme='light'],\n [data-theme='dark'] [data-theme='invert'] {\n --grn-color-fade10: var(--grn-color-darkFade10);\n --grn-color-fade9: var(--grn-color-darkFade9);\n --grn-color-fade8: var(--grn-color-darkFade8);\n --grn-color-fade7: var(--grn-color-darkFade7);\n --grn-color-fade6: var(--grn-color-darkFade6);\n --grn-color-fade5: var(--grn-color-darkFade5);\n --grn-color-fade4: var(--grn-color-darkFade4);\n --grn-color-fade3: var(--grn-color-darkFade3);\n --grn-color-fade2: var(--grn-color-darkFade2);\n --grn-color-fade1: var(--grn-color-darkFade1);\n\n --grn-color-shade1: var(--grn-color-shadeTone1);\n --grn-color-shade2: var(--grn-color-shadeTone2);\n --grn-color-shade3: var(--grn-color-shadeTone3);\n --grn-color-shade4: var(--grn-color-shadeTone4);\n --grn-color-shade5: var(--grn-color-shadeTone5);\n --grn-color-shade6: var(--grn-color-shadeTone6);\n --grn-color-shade7: var(--grn-color-shadeTone7);\n --grn-color-shade8: var(--grn-color-shadeTone8);\n --grn-color-shade9: var(--grn-color-shadeTone9);\n --grn-color-shade10: var(--grn-color-shadeTone10);\n --grn-color-shade11: var(--grn-color-shadeTone11);\n --grn-color-shade12: var(--grn-color-shadeTone12);\n --grn-color-shade13: var(--grn-color-shadeTone13);\n }\n\n /* dark */\n\n [data-theme='dark'],\n [data-theme='light'] [data-theme='invert'] {\n --grn-color-fade10: var(--grn-color-lightFade10);\n --grn-color-fade9: var(--grn-color-lightFade9);\n --grn-color-fade8: var(--grn-color-lightFade8);\n --grn-color-fade7: var(--grn-color-lightFade7);\n --grn-color-fade6: var(--grn-color-lightFade6);\n --grn-color-fade5: var(--grn-color-lightFade5);\n --grn-color-fade4: var(--grn-color-lightFade4);\n --grn-color-fade3: var(--grn-color-lightFade3);\n --grn-color-fade2: var(--grn-color-lightFade2);\n --grn-color-fade1: var(--grn-color-lightFade1);\n\n --grn-color-shade1: var(--grn-color-shadeTone13);\n --grn-color-shade2: var(--grn-color-shadeTone12);\n --grn-color-shade3: var(--grn-color-shadeTone11);\n --grn-color-shade4: var(--grn-color-shadeTone10);\n --grn-color-shade5: var(--grn-color-shadeTone9);\n --grn-color-shade6: var(--grn-color-shadeTone8);\n --grn-color-shade7: var(--grn-color-shadeTone7);\n --grn-color-shade8: var(--grn-color-shadeTone6);\n --grn-color-shade9: var(--grn-color-shadeTone5);\n --grn-color-shade10: var(--grn-color-shadeTone4);\n --grn-color-shade11: var(--grn-color-shadeTone3);\n --grn-color-shade12: var(--grn-color-shadeTone2);\n --grn-color-shade13: var(--grn-color-shadeTone1);\n }\n\n /* light */\n\n :root,\n [data-theme='light'],\n [data-theme='dark'] [data-theme='invert'] {\n --contentL: 20%;\n --backgroundL: 80%;\n --grn-color-floatingBackground: var(--grn-color-shade1);\n }\n\n /* dark */\n\n [data-theme='dark'],\n [data-theme='light'] [data-theme='invert'] {\n --contentL: 80%;\n --backgroundL: 20%;\n --grn-color-floatingBackground: var(--grn-color-shade2);\n }\n\n /* light + dark */\n\n :root,\n [data-theme] {\n --grn-color-content: var(--grn-color-shade12);\n --grn-color-content2: var(--grn-color-fade7);\n --grn-color-content3: var(--grn-color-fade5);\n --grn-color-disabledContent: var(--grn-color-shade7);\n --grn-color-icon: var(--grn-color-fade6);\n\n --grn-color-background: var(--grn-color-shade1);\n --grn-color-background2: var(--grn-color-shade2);\n --grn-color-background3: var(--grn-color-shade3);\n --grn-color-disabledBackground: var(--grn-color-shade4);\n\n --grn-color-border: hsl(var(--HS) var(--contentL) / 12%);\n --grn-color-border2: hsl(var(--HS) var(--contentL) / 20%);\n }\n";
|
|
2
|
+
export default theme;
|
package/es/styles/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { css } from '@emotion/react';
|
|
2
1
|
import variables from './variables';
|
|
3
2
|
import colors from './colors';
|
|
4
3
|
import shadows from './shadows';
|
|
5
4
|
import base from './base';
|
|
6
|
-
export default
|
|
5
|
+
export default [variables, colors, shadows, base].join('\n');
|
package/es/styles/shadows.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "fm5b6e",
|
|
6
|
-
styles: ":root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--alphaRatio:0.6;}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--alphaRatio:20;}:root,[data-theme]{--c:0 0% 0%;--blurRatio:1.7;--yRatio:1.1;--spreadRatio:2;--ratioCurve:0.9;--rc1:var(--ratioCurve) * 1;--rc2:var(--ratioCurve) * 2;--rc3:var(--ratioCurve) * 3;--rc4:var(--ratioCurve) * 4;--b1:1px;--b2:calc(var(--b1) * var(--rc2) * var(--blurRatio));--b3:calc(var(--b2) * var(--rc3) * var(--blurRatio));--b4:calc(var(--b3) * var(--rc4) * var(--blurRatio));--y1:1px;--y2:calc(var(--y1) * var(--rc2) * var(--yRatio));--y3:calc(var(--y2) * var(--rc3) * var(--yRatio));--y4:calc(var(--y3) * var(--rc4) * var(--yRatio));--a1:5%;--a2:calc(var(--a1) * var(--rc2) * var(--alphaRatio));--a3:calc(var(--a2) * var(--rc3) * var(--alphaRatio));--a4:calc(var(--a3) * var(--rc4) * var(--alphaRatio));--s1:-0.1px;--s2:calc(var(--s1) * var(--rc2) * var(--spreadRatio));--s3:calc(var(--s2) * var(--rc3) * var(--spreadRatio));--s4:calc(var(--s3) * var(--rc4) * var(--spreadRatio));--shadow1:0 var(--y1) var(--b1) var(--s1) hsl(var(--c) / var(--a1));--shadow2:0 var(--y2) var(--b2) var(--s2) hsl(var(--c) / var(--a2));--shadow3:0 var(--y3) var(--b3) var(--s3) hsl(var(--c) / var(--a3));--shadow4:0 var(--y4) var(--b4) var(--s4) hsl(var(--c) / var(--a4));--grn-shadow-s:var(--shadow1),var(--shadow2);--grn-shadow-m:var(--grn-shadow-s),var(--shadow3);--grn-shadow-l:var(--grn-shadow-m),var(--shadow4);}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "fm5b6e",
|
|
9
|
-
styles: ":root,[data-theme='light'],[data-theme='dark'] [data-theme='invert']{--alphaRatio:0.6;}[data-theme='dark'],[data-theme='light'] [data-theme='invert']{--alphaRatio:20;}:root,[data-theme]{--c:0 0% 0%;--blurRatio:1.7;--yRatio:1.1;--spreadRatio:2;--ratioCurve:0.9;--rc1:var(--ratioCurve) * 1;--rc2:var(--ratioCurve) * 2;--rc3:var(--ratioCurve) * 3;--rc4:var(--ratioCurve) * 4;--b1:1px;--b2:calc(var(--b1) * var(--rc2) * var(--blurRatio));--b3:calc(var(--b2) * var(--rc3) * var(--blurRatio));--b4:calc(var(--b3) * var(--rc4) * var(--blurRatio));--y1:1px;--y2:calc(var(--y1) * var(--rc2) * var(--yRatio));--y3:calc(var(--y2) * var(--rc3) * var(--yRatio));--y4:calc(var(--y3) * var(--rc4) * var(--yRatio));--a1:5%;--a2:calc(var(--a1) * var(--rc2) * var(--alphaRatio));--a3:calc(var(--a2) * var(--rc3) * var(--alphaRatio));--a4:calc(var(--a3) * var(--rc4) * var(--alphaRatio));--s1:-0.1px;--s2:calc(var(--s1) * var(--rc2) * var(--spreadRatio));--s3:calc(var(--s2) * var(--rc3) * var(--spreadRatio));--s4:calc(var(--s3) * var(--rc4) * var(--spreadRatio));--shadow1:0 var(--y1) var(--b1) var(--s1) hsl(var(--c) / var(--a1));--shadow2:0 var(--y2) var(--b2) var(--s2) hsl(var(--c) / var(--a2));--shadow3:0 var(--y3) var(--b3) var(--s3) hsl(var(--c) / var(--a3));--shadow4:0 var(--y4) var(--b4) var(--s4) hsl(var(--c) / var(--a4));--grn-shadow-s:var(--shadow1),var(--shadow2);--grn-shadow-m:var(--grn-shadow-s),var(--shadow3);--grn-shadow-l:var(--grn-shadow-m),var(--shadow4);}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zdHlsZXMvc2hhZG93cy5qc3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRWtCIiwiZmlsZSI6Ii4uLy4uL3NyYy9zdHlsZXMvc2hhZG93cy5qc3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBkZWZhdWx0IGNzc2BcbiAgOnJvb3QsXG4gIFtkYXRhLXRoZW1lPSdsaWdodCddLFxuICBbZGF0YS10aGVtZT0nZGFyayddIFtkYXRhLXRoZW1lPSdpbnZlcnQnXSB7XG4gICAgLS1hbHBoYVJhdGlvOiAwLjY7XG4gIH1cblxuICBbZGF0YS10aGVtZT0nZGFyayddLFxuICBbZGF0YS10aGVtZT0nbGlnaHQnXSBbZGF0YS10aGVtZT0naW52ZXJ0J10ge1xuICAgIC0tYWxwaGFSYXRpbzogMjA7XG4gIH1cblxuICA6cm9vdCxcbiAgW2RhdGEtdGhlbWVdIHtcbiAgICAtLWM6IDAgMCUgMCU7XG4gICAgLS1ibHVyUmF0aW86IDEuNztcbiAgICAtLXlSYXRpbzogMS4xO1xuICAgIC0tc3ByZWFkUmF0aW86IDI7XG4gICAgLS1yYXRpb0N1cnZlOiAwLjk7XG5cbiAgICAtLXJjMTogdmFyKC0tcmF0aW9DdXJ2ZSkgKiAxO1xuICAgIC0tcmMyOiB2YXIoLS1yYXRpb0N1cnZlKSAqIDI7XG4gICAgLS1yYzM6IHZhcigtLXJhdGlvQ3VydmUpICogMztcbiAgICAtLXJjNDogdmFyKC0tcmF0aW9DdXJ2ZSkgKiA0O1xuXG4gICAgLS1iMTogMXB4O1xuICAgIC0tYjI6IGNhbGModmFyKC0tYjEpICogdmFyKC0tcmMyKSAqIHZhcigtLWJsdXJSYXRpbykpO1xuICAgIC0tYjM6IGNhbGModmFyKC0tYjIpICogdmFyKC0tcmMzKSAqIHZhcigtLWJsdXJSYXRpbykpO1xuICAgIC0tYjQ6IGNhbGModmFyKC0tYjMpICogdmFyKC0tcmM0KSAqIHZhcigtLWJsdXJSYXRpbykpO1xuXG4gICAgLS15MTogMXB4O1xuICAgIC0teTI6IGNhbGModmFyKC0teTEpICogdmFyKC0tcmMyKSAqIHZhcigtLXlSYXRpbykpO1xuICAgIC0teTM6IGNhbGModmFyKC0teTIpICogdmFyKC0tcmMzKSAqIHZhcigtLXlSYXRpbykpO1xuICAgIC0teTQ6IGNhbGModmFyKC0teTMpICogdmFyKC0tcmM0KSAqIHZhcigtLXlSYXRpbykpO1xuXG4gICAgLS1hMTogNSU7XG4gICAgLS1hMjogY2FsYyh2YXIoLS1hMSkgKiB2YXIoLS1yYzIpICogdmFyKC0tYWxwaGFSYXRpbykpO1xuICAgIC0tYTM6IGNhbGModmFyKC0tYTIpICogdmFyKC0tcmMzKSAqIHZhcigtLWFscGhhUmF0aW8pKTtcbiAgICAtLWE0OiBjYWxjKHZhcigtLWEzKSAqIHZhcigtLXJjNCkgKiB2YXIoLS1hbHBoYVJhdGlvKSk7XG5cbiAgICAtLXMxOiAtMC4xcHg7XG4gICAgLS1zMjogY2FsYyh2YXIoLS1zMSkgKiB2YXIoLS1yYzIpICogdmFyKC0tc3ByZWFkUmF0aW8pKTtcbiAgICAtLXMzOiBjYWxjKHZhcigtLXMyKSAqIHZhcigtLXJjMykgKiB2YXIoLS1zcHJlYWRSYXRpbykpO1xuICAgIC0tczQ6IGNhbGModmFyKC0tczMpICogdmFyKC0tcmM0KSAqIHZhcigtLXNwcmVhZFJhdGlvKSk7XG5cbiAgICAtLXNoYWRvdzE6IDAgdmFyKC0teTEpIHZhcigtLWIxKSB2YXIoLS1zMSkgaHNsKHZhcigtLWMpIC8gdmFyKC0tYTEpKTtcbiAgICAtLXNoYWRvdzI6IDAgdmFyKC0teTIpIHZhcigtLWIyKSB2YXIoLS1zMikgaHNsKHZhcigtLWMpIC8gdmFyKC0tYTIpKTtcbiAgICAtLXNoYWRvdzM6IDAgdmFyKC0teTMpIHZhcigtLWIzKSB2YXIoLS1zMykgaHNsKHZhcigtLWMpIC8gdmFyKC0tYTMpKTtcbiAgICAtLXNoYWRvdzQ6IDAgdmFyKC0teTQpIHZhcigtLWI0KSB2YXIoLS1zNCkgaHNsKHZhcigtLWMpIC8gdmFyKC0tYTQpKTtcblxuICAgIC0tZ3JuLXNoYWRvdy1zOiB2YXIoLS1zaGFkb3cxKSwgdmFyKC0tc2hhZG93Mik7XG5cbiAgICAtLWdybi1zaGFkb3ctbTogdmFyKC0tZ3JuLXNoYWRvdy1zKSwgdmFyKC0tc2hhZG93Myk7XG5cbiAgICAtLWdybi1zaGFkb3ctbDogdmFyKC0tZ3JuLXNoYWRvdy1tKSwgdmFyKC0tc2hhZG93NCk7XG4gIH1cbmA7XG4iXX0= */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var shadows = "\n :root,\n [data-theme='light'],\n [data-theme='dark'] [data-theme='invert'] {\n --alphaRatio: 0.6;\n }\n\n [data-theme='dark'],\n [data-theme='light'] [data-theme='invert'] {\n --alphaRatio: 20;\n }\n\n :root,\n [data-theme] {\n --c: 0 0% 0%;\n --blurRatio: 1.7;\n --yRatio: 1.1;\n --spreadRatio: 2;\n --ratioCurve: 0.9;\n\n --rc1: var(--ratioCurve) * 1;\n --rc2: var(--ratioCurve) * 2;\n --rc3: var(--ratioCurve) * 3;\n --rc4: var(--ratioCurve) * 4;\n\n --b1: 1px;\n --b2: calc(var(--b1) * var(--rc2) * var(--blurRatio));\n --b3: calc(var(--b2) * var(--rc3) * var(--blurRatio));\n --b4: calc(var(--b3) * var(--rc4) * var(--blurRatio));\n\n --y1: 1px;\n --y2: calc(var(--y1) * var(--rc2) * var(--yRatio));\n --y3: calc(var(--y2) * var(--rc3) * var(--yRatio));\n --y4: calc(var(--y3) * var(--rc4) * var(--yRatio));\n\n --a1: 5%;\n --a2: calc(var(--a1) * var(--rc2) * var(--alphaRatio));\n --a3: calc(var(--a2) * var(--rc3) * var(--alphaRatio));\n --a4: calc(var(--a3) * var(--rc4) * var(--alphaRatio));\n\n --s1: -0.1px;\n --s2: calc(var(--s1) * var(--rc2) * var(--spreadRatio));\n --s3: calc(var(--s2) * var(--rc3) * var(--spreadRatio));\n --s4: calc(var(--s3) * var(--rc4) * var(--spreadRatio));\n\n --shadow1: 0 var(--y1) var(--b1) var(--s1) hsl(var(--c) / var(--a1));\n --shadow2: 0 var(--y2) var(--b2) var(--s2) hsl(var(--c) / var(--a2));\n --shadow3: 0 var(--y3) var(--b3) var(--s3) hsl(var(--c) / var(--a3));\n --shadow4: 0 var(--y4) var(--b4) var(--s4) hsl(var(--c) / var(--a4));\n\n --grn-shadow-s: var(--shadow1), var(--shadow2);\n\n --grn-shadow-m: var(--grn-shadow-s), var(--shadow3);\n\n --grn-shadow-l: var(--grn-shadow-m), var(--shadow4);\n }\n";
|
|
2
|
+
export default shadows;
|
package/es/styles/variables.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export default process.env.NODE_ENV === "production" ? {
|
|
5
|
-
name: "15u6ad9",
|
|
6
|
-
styles: ":root{--grn-unit:8px;}:root{--grn-text-s:12px;--grn-text-m:15px;--grn-text-l:18px;--grn-text-xl:24px;--grn-text-xxl:30px;}:root{--grn-icon-s:14px;--grn-icon-m:18px;--grn-icon-l:22px;--grn-icon-xl:28px;--grn-icon-xxl:36px;}:root{--grn-weight-normal:400;--grn-weight-medium:500;}:root{--grn-space-xs:calc(var(--grn-unit) / 2);--grn-space-s:calc(var(--grn-unit) * 1);--grn-space-m:calc(var(--grn-unit) * 2);--grn-space-l:calc(var(--grn-unit) * 3);--grn-space-xl:calc(var(--grn-unit) * 5);--grn-space-xxl:calc(var(--grn-unit) * 7);}:root{--grn-radius-s:3px;--grn-radius-m:6px;--grn-radius-l:10px;}:root{--grn-transition-slow:400ms;--grn-transition-fast:200ms;--grn-transition-xFast:160ms;--grn-transition-xxFast:80ms;}:root,[data-theme]{--grn-space-betweenFormTitleAndContent:var(--grn-space-l);--grn-space-betweenFormContents:var(--grn-space-m);--grn-space-betweenFormContentAndActions:var(--grn-space-xl);--grn-space-betweenFormControlAndLabel:var(--grn-space-s);--grn-space-fieldPaddingX:12px;--grn-color-fieldBorder:var(--grn-color-fade3);--grn-color-fieldBorderHover:var(--grn-color-fade6);--grn-color-fieldBorderFocus:var(--grn-color-shade9);--grn-color-fieldBorderDisabled:var(--grn-color-shade5);--grn-color-fieldBackgroundDisabled:var(--grn-color-shade2);--grn-color-backdrop:var(--grn-color-darkFade8);--grn-transition-leave:var(--grn-transition-slow);--grn-transition-hover:var(--grn-transition-fast);--grn-transition-active:var(--grn-transition-xxFast);}"
|
|
7
|
-
} : {
|
|
8
|
-
name: "15u6ad9",
|
|
9
|
-
styles: ":root{--grn-unit:8px;}:root{--grn-text-s:12px;--grn-text-m:15px;--grn-text-l:18px;--grn-text-xl:24px;--grn-text-xxl:30px;}:root{--grn-icon-s:14px;--grn-icon-m:18px;--grn-icon-l:22px;--grn-icon-xl:28px;--grn-icon-xxl:36px;}:root{--grn-weight-normal:400;--grn-weight-medium:500;}:root{--grn-space-xs:calc(var(--grn-unit) / 2);--grn-space-s:calc(var(--grn-unit) * 1);--grn-space-m:calc(var(--grn-unit) * 2);--grn-space-l:calc(var(--grn-unit) * 3);--grn-space-xl:calc(var(--grn-unit) * 5);--grn-space-xxl:calc(var(--grn-unit) * 7);}:root{--grn-radius-s:3px;--grn-radius-m:6px;--grn-radius-l:10px;}:root{--grn-transition-slow:400ms;--grn-transition-fast:200ms;--grn-transition-xFast:160ms;--grn-transition-xxFast:80ms;}:root,[data-theme]{--grn-space-betweenFormTitleAndContent:var(--grn-space-l);--grn-space-betweenFormContents:var(--grn-space-m);--grn-space-betweenFormContentAndActions:var(--grn-space-xl);--grn-space-betweenFormControlAndLabel:var(--grn-space-s);--grn-space-fieldPaddingX:12px;--grn-color-fieldBorder:var(--grn-color-fade3);--grn-color-fieldBorderHover:var(--grn-color-fade6);--grn-color-fieldBorderFocus:var(--grn-color-shade9);--grn-color-fieldBorderDisabled:var(--grn-color-shade5);--grn-color-fieldBackgroundDisabled:var(--grn-color-shade2);--grn-color-backdrop:var(--grn-color-darkFade8);--grn-transition-leave:var(--grn-transition-slow);--grn-transition-hover:var(--grn-transition-fast);--grn-transition-active:var(--grn-transition-xxFast);}",
|
|
10
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zdHlsZXMvdmFyaWFibGVzLmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFa0IiLCJmaWxlIjoiLi4vLi4vc3JjL3N0eWxlcy92YXJpYWJsZXMuanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5leHBvcnQgZGVmYXVsdCBjc3NgXG4gIDpyb290IHtcbiAgICAtLWdybi11bml0OiA4cHg7XG4gIH1cblxuICA6cm9vdCB7XG4gICAgLS1ncm4tdGV4dC1zOiAxMnB4O1xuICAgIC0tZ3JuLXRleHQtbTogMTVweDtcbiAgICAtLWdybi10ZXh0LWw6IDE4cHg7XG4gICAgLS1ncm4tdGV4dC14bDogMjRweDtcbiAgICAtLWdybi10ZXh0LXh4bDogMzBweDtcbiAgfVxuXG4gIC8qIHRleHQgc2l6ZSDinJUgfjEuMiAqL1xuICA6cm9vdCB7XG4gICAgLS1ncm4taWNvbi1zOiAxNHB4O1xuICAgIC0tZ3JuLWljb24tbTogMThweDtcbiAgICAtLWdybi1pY29uLWw6IDIycHg7XG4gICAgLS1ncm4taWNvbi14bDogMjhweDtcbiAgICAtLWdybi1pY29uLXh4bDogMzZweDtcbiAgfVxuXG4gIDpyb290IHtcbiAgICAtLWdybi13ZWlnaHQtbm9ybWFsOiA0MDA7XG4gICAgLS1ncm4td2VpZ2h0LW1lZGl1bTogNTAwO1xuICB9XG5cbiAgOnJvb3Qge1xuICAgIC0tZ3JuLXNwYWNlLXhzOiBjYWxjKHZhcigtLWdybi11bml0KSAvIDIpO1xuICAgIC0tZ3JuLXNwYWNlLXM6IGNhbGModmFyKC0tZ3JuLXVuaXQpICogMSk7XG4gICAgLS1ncm4tc3BhY2UtbTogY2FsYyh2YXIoLS1ncm4tdW5pdCkgKiAyKTtcbiAgICAtLWdybi1zcGFjZS1sOiBjYWxjKHZhcigtLWdybi11bml0KSAqIDMpO1xuICAgIC0tZ3JuLXNwYWNlLXhsOiBjYWxjKHZhcigtLWdybi11bml0KSAqIDUpO1xuICAgIC0tZ3JuLXNwYWNlLXh4bDogY2FsYyh2YXIoLS1ncm4tdW5pdCkgKiA3KTtcbiAgfVxuXG4gIDpyb290IHtcbiAgICAtLWdybi1yYWRpdXMtczogM3B4O1xuICAgIC0tZ3JuLXJhZGl1cy1tOiA2cHg7XG4gICAgLS1ncm4tcmFkaXVzLWw6IDEwcHg7XG4gIH1cblxuICA6cm9vdCB7XG4gICAgLS1ncm4tdHJhbnNpdGlvbi1zbG93OiA0MDBtcztcbiAgICAtLWdybi10cmFuc2l0aW9uLWZhc3Q6IDIwMG1zO1xuICAgIC0tZ3JuLXRyYW5zaXRpb24teEZhc3Q6IDE2MG1zO1xuICAgIC0tZ3JuLXRyYW5zaXRpb24teHhGYXN0OiA4MG1zO1xuICB9XG5cbiAgOnJvb3QsXG4gIFtkYXRhLXRoZW1lXSB7XG4gICAgLS1ncm4tc3BhY2UtYmV0d2VlbkZvcm1UaXRsZUFuZENvbnRlbnQ6IHZhcigtLWdybi1zcGFjZS1sKTtcbiAgICAtLWdybi1zcGFjZS1iZXR3ZWVuRm9ybUNvbnRlbnRzOiB2YXIoLS1ncm4tc3BhY2UtbSk7XG4gICAgLS1ncm4tc3BhY2UtYmV0d2VlbkZvcm1Db250ZW50QW5kQWN0aW9uczogdmFyKC0tZ3JuLXNwYWNlLXhsKTtcbiAgICAtLWdybi1zcGFjZS1iZXR3ZWVuRm9ybUNvbnRyb2xBbmRMYWJlbDogdmFyKC0tZ3JuLXNwYWNlLXMpO1xuICAgIC0tZ3JuLXNwYWNlLWZpZWxkUGFkZGluZ1g6IDEycHg7XG5cbiAgICAtLWdybi1jb2xvci1maWVsZEJvcmRlcjogdmFyKC0tZ3JuLWNvbG9yLWZhZGUzKTtcbiAgICAtLWdybi1jb2xvci1maWVsZEJvcmRlckhvdmVyOiB2YXIoLS1ncm4tY29sb3ItZmFkZTYpO1xuICAgIC0tZ3JuLWNvbG9yLWZpZWxkQm9yZGVyRm9jdXM6IHZhcigtLWdybi1jb2xvci1zaGFkZTkpO1xuICAgIC0tZ3JuLWNvbG9yLWZpZWxkQm9yZGVyRGlzYWJsZWQ6IHZhcigtLWdybi1jb2xvci1zaGFkZTUpO1xuICAgIC0tZ3JuLWNvbG9yLWZpZWxkQmFja2dyb3VuZERpc2FibGVkOiB2YXIoLS1ncm4tY29sb3Itc2hhZGUyKTtcbiAgICAtLWdybi1jb2xvci1iYWNrZHJvcDogdmFyKC0tZ3JuLWNvbG9yLWRhcmtGYWRlOCk7XG5cbiAgICAtLWdybi10cmFuc2l0aW9uLWxlYXZlOiB2YXIoLS1ncm4tdHJhbnNpdGlvbi1zbG93KTtcbiAgICAtLWdybi10cmFuc2l0aW9uLWhvdmVyOiB2YXIoLS1ncm4tdHJhbnNpdGlvbi1mYXN0KTtcbiAgICAtLWdybi10cmFuc2l0aW9uLWFjdGl2ZTogdmFyKC0tZ3JuLXRyYW5zaXRpb24teHhGYXN0KTtcbiAgfVxuYDtcbiJdfQ== */",
|
|
11
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
12
|
-
};
|
|
1
|
+
var variables = "\n :root {\n --grn-unit: 8px;\n }\n\n :root {\n --grn-text-s: 12px;\n --grn-text-m: 15px;\n --grn-text-l: 18px;\n --grn-text-xl: 24px;\n --grn-text-xxl: 30px;\n }\n\n /* text size \u2715 ~1.2 */\n :root {\n --grn-icon-s: 14px;\n --grn-icon-m: 18px;\n --grn-icon-l: 22px;\n --grn-icon-xl: 28px;\n --grn-icon-xxl: 36px;\n }\n\n :root {\n --grn-weight-normal: 400;\n --grn-weight-medium: 500;\n }\n\n :root {\n --grn-space-xs: calc(var(--grn-unit) / 2);\n --grn-space-s: calc(var(--grn-unit) * 1);\n --grn-space-m: calc(var(--grn-unit) * 2);\n --grn-space-l: calc(var(--grn-unit) * 3);\n --grn-space-xl: calc(var(--grn-unit) * 5);\n --grn-space-xxl: calc(var(--grn-unit) * 7);\n }\n\n :root {\n --grn-radius-s: 3px;\n --grn-radius-m: 6px;\n --grn-radius-l: 10px;\n }\n\n :root {\n --grn-transition-slow: 400ms;\n --grn-transition-fast: 200ms;\n --grn-transition-xFast: 160ms;\n --grn-transition-xxFast: 80ms;\n }\n\n :root,\n [data-theme] {\n --grn-space-betweenFormTitleAndContent: var(--grn-space-l);\n --grn-space-betweenFormContents: var(--grn-space-m);\n --grn-space-betweenFormContentAndActions: var(--grn-space-xl);\n --grn-space-betweenFormControlAndLabel: var(--grn-space-s);\n --grn-space-fieldPaddingX: 12px;\n\n --grn-color-fieldBorder: var(--grn-color-fade3);\n --grn-color-fieldBorderHover: var(--grn-color-fade6);\n --grn-color-fieldBorderFocus: var(--grn-color-shade9);\n --grn-color-fieldBorderDisabled: var(--grn-color-shade5);\n --grn-color-fieldBackgroundDisabled: var(--grn-color-shade2);\n --grn-color-backdrop: var(--grn-color-darkFade8);\n\n --grn-transition-leave: var(--grn-transition-slow);\n --grn-transition-hover: var(--grn-transition-fast);\n --grn-transition-active: var(--grn-transition-xxFast);\n }\n";
|
|
2
|
+
export default variables;
|