@flodesk/grain 11.13.2 → 11.14.1
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.
|
@@ -12,7 +12,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
12
12
|
|
|
13
13
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
14
14
|
|
|
15
|
-
import { getColor, getSpace, getTransition } from '../utilities';
|
|
15
|
+
import { getColor, getRadius, getSpace, getTransition } from '../utilities';
|
|
16
16
|
import React from 'react';
|
|
17
17
|
import PropTypes from 'prop-types';
|
|
18
18
|
import { componentVars, FieldHint, FieldLabel } from '../foundational';
|
|
@@ -29,7 +29,7 @@ var CheckboxBoxInput = /*#__PURE__*/_styled("input", process.env.NODE_ENV === "p
|
|
|
29
29
|
} : {
|
|
30
30
|
target: "erxmy1h1",
|
|
31
31
|
label: "CheckboxBoxInput"
|
|
32
|
-
})("--checkColor:", getColor('shade2'), ";--backgroundColor:transparent;--backgroundColorActive:", getColor('shade12'), ";--borderColor:", getColor('shade6'), ";appearance:none;height:", size, "px;width:", size, "px;display:block;border-radius:
|
|
32
|
+
})("--checkColor:", getColor('shade2'), ";--backgroundColor:transparent;--backgroundColorActive:", getColor('shade12'), ";--borderColor:", getColor('shade6'), ";appearance:none;height:", size, "px;width:", size, "px;display:block;border-radius:", getRadius('xs'), ";cursor:pointer;margin:0;position:relative;background-color:var(--backgroundColor);border:", strokeSize, " solid var(--borderColor);transition:border-color ", getTransition('leave'), ";&:hover{--borderColor:", getColor('shade12'), ";transition:border-color ", getTransition('hover'), ";}&:checked{--borderColor:var(--backgroundColorActive);--backgroundColor:var(--backgroundColorActive);}&:after{content:'';position:absolute;left:0;right:0;top:0;margin:auto;height:", checkHeight, "px;width:", checkWidth, "px;box-shadow:inset -", checkStroke, "px -", checkStroke, "px 0 var(--checkColor);display:block;transform:rotate(45deg);pointer-events:none;opacity:0;}&:checked:after{opacity:1;}&:disabled{--checkColor:", getColor('disabledContent'), ";--backgroundColor:", getColor('disabledBackground'), ";--backgroundColorActive:", getColor('disabledBackground'), ";--borderColor:transparent;pointer-events:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2NoZWNrYm94LmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjcUMiLCJmaWxlIjoiLi4vLi4vc3JjL2NvbXBvbmVudHMvY2hlY2tib3guanN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgZ2V0Q29sb3IsIGdldFJhZGl1cywgZ2V0U3BhY2UsIGdldFRyYW5zaXRpb24gfSBmcm9tICcuLi91dGlsaXRpZXMnO1xuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgeyBjb21wb25lbnRWYXJzLCBGaWVsZEhpbnQsIEZpZWxkTGFiZWwgfSBmcm9tICcuLi9mb3VuZGF0aW9uYWwnO1xuaW1wb3J0IHsgdHlwZXMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IHNpemUgPSAxNjtcbmNvbnN0IGNoZWNrSGVpZ2h0ID0gc2l6ZSAvIDEuNjtcbmNvbnN0IGNoZWNrV2lkdGggPSBjaGVja0hlaWdodCAvIDEuODtcbmNvbnN0IGNoZWNrU3Ryb2tlID0gMS41O1xuXG5jb25zdCBzdHJva2VTaXplID0gY29tcG9uZW50VmFycy5zdHJva2VTaXplO1xuXG5jb25zdCBDaGVja2JveEJveElucHV0ID0gc3R5bGVkLmlucHV0YFxuICAtLWNoZWNrQ29sb3I6ICR7Z2V0Q29sb3IoJ3NoYWRlMicpfTtcbiAgLS1iYWNrZ3JvdW5kQ29sb3I6IHRyYW5zcGFyZW50O1xuICAtLWJhY2tncm91bmRDb2xvckFjdGl2ZTogJHtnZXRDb2xvcignc2hhZGUxMicpfTtcbiAgLS1ib3JkZXJDb2xvcjogJHtnZXRDb2xvcignc2hhZGU2Jyl9O1xuXG4gIGFwcGVhcmFuY2U6IG5vbmU7XG4gIGhlaWdodDogJHtzaXplfXB4O1xuICB3aWR0aDogJHtzaXplfXB4O1xuICBkaXNwbGF5OiBibG9jaztcbiAgYm9yZGVyLXJhZGl1czogJHtnZXRSYWRpdXMoJ3hzJyl9O1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIG1hcmdpbjogMDtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1iYWNrZ3JvdW5kQ29sb3IpO1xuICBib3JkZXI6ICR7c3Ryb2tlU2l6ZX0gc29saWQgdmFyKC0tYm9yZGVyQ29sb3IpO1xuICB0cmFuc2l0aW9uOiBib3JkZXItY29sb3IgJHtnZXRUcmFuc2l0aW9uKCdsZWF2ZScpfTtcblxuICAmOmhvdmVyIHtcbiAgICAtLWJvcmRlckNvbG9yOiAke2dldENvbG9yKCdzaGFkZTEyJyl9O1xuICAgIHRyYW5zaXRpb246IGJvcmRlci1jb2xvciAke2dldFRyYW5zaXRpb24oJ2hvdmVyJyl9O1xuICB9XG5cbiAgJjpjaGVja2VkIHtcbiAgICAtLWJvcmRlckNvbG9yOiB2YXIoLS1iYWNrZ3JvdW5kQ29sb3JBY3RpdmUpO1xuICAgIC0tYmFja2dyb3VuZENvbG9yOiB2YXIoLS1iYWNrZ3JvdW5kQ29sb3JBY3RpdmUpO1xuICB9XG5cbiAgJjphZnRlciB7XG4gICAgY29udGVudDogJyc7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIGxlZnQ6IDA7XG4gICAgcmlnaHQ6IDA7XG4gICAgdG9wOiAwO1xuICAgIG1hcmdpbjogYXV0bztcbiAgICBoZWlnaHQ6ICR7Y2hlY2tIZWlnaHR9cHg7XG4gICAgd2lkdGg6ICR7Y2hlY2tXaWR0aH1weDtcbiAgICBib3gtc2hhZG93OiBpbnNldCAtJHtjaGVja1N0cm9rZX1weCAtJHtjaGVja1N0cm9rZX1weCAwIHZhcigtLWNoZWNrQ29sb3IpO1xuICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgIHRyYW5zZm9ybTogcm90YXRlKDQ1ZGVnKTtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICBvcGFjaXR5OiAwO1xuICB9XG5cbiAgJjpjaGVja2VkOmFmdGVyIHtcbiAgICBvcGFjaXR5OiAxO1xuICB9XG5cbiAgJjpkaXNhYmxlZCB7XG4gICAgLS1jaGVja0NvbG9yOiAke2dldENvbG9yKCdkaXNhYmxlZENvbnRlbnQnKX07XG4gICAgLS1iYWNrZ3JvdW5kQ29sb3I6ICR7Z2V0Q29sb3IoJ2Rpc2FibGVkQmFja2dyb3VuZCcpfTtcbiAgICAtLWJhY2tncm91bmRDb2xvckFjdGl2ZTogJHtnZXRDb2xvcignZGlzYWJsZWRCYWNrZ3JvdW5kJyl9O1xuICAgIC0tYm9yZGVyQ29sb3I6IHRyYW5zcGFyZW50O1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICB9XG5gO1xuXG5jb25zdCBDaGVja2JveEJveCA9ICh7IG9uQ2hhbmdlID0gKCkgPT4ge30sIC4uLnByb3BzIH0pID0+IChcbiAgPENoZWNrYm94Qm94SW5wdXQgey4uLnByb3BzfSBvbkNoYW5nZT17b25DaGFuZ2V9IHR5cGU9XCJjaGVja2JveFwiIC8+XG4pO1xuXG5jb25zdCBSb290ID0gc3R5bGVkLmRpdmBcbiAgJHsoeyBoYXNUZXh0IH0pID0+XG4gICAgaGFzVGV4dCAmJlxuICAgIGBcbiAgICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgICBncmlkLWF1dG8tZmxvdzogY29sdW1uO1xuICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgIHdpZHRoOiBmaXQtY29udGVudDtcbiAgICAgIGNvbHVtbi1nYXA6ICR7Z2V0U3BhY2UoJ2JldHdlZW5Gb3JtQ29udHJvbEFuZExhYmVsJyl9O1xuICAgIGB9XG5cbiAgLmNoZWNrYm94SGludCwgLmNoZWNrYm94TGFiZWwge1xuICAgIGdyaWQtY29sdW1uOiAyIC8gMztcbiAgfVxuYDtcblxuZXhwb3J0IGNvbnN0IENoZWNrYm94ID0gKHsgaXNEaXNhYmxlZCwgaXNDaGVja2VkLCBsYWJlbCwgaGludCwgaWQsIG9uQ2hhbmdlLCAuLi5wcm9wcyB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPFJvb3QgaGFzVGV4dD17bGFiZWwgfHwgaGludH0gey4uLnByb3BzfT5cbiAgICAgIDxDaGVja2JveEJveFxuICAgICAgICB0eXBlPVwiY2hlY2tib3hcIlxuICAgICAgICBkaXNhYmxlZD17aXNEaXNhYmxlZH1cbiAgICAgICAgaWQ9e2lkfVxuICAgICAgICBjaGVja2VkPXtpc0NoZWNrZWR9XG4gICAgICAgIG9uQ2hhbmdlPXtvbkNoYW5nZX1cbiAgICAgIC8+XG4gICAgICB7bGFiZWwgJiYgKFxuICAgICAgICA8RmllbGRMYWJlbCBodG1sRm9yPXtpZH0gY2xhc3NOYW1lPVwiY2hlY2tib3hMYWJlbFwiPlxuICAgICAgICAgIHtsYWJlbH1cbiAgICAgICAgPC9GaWVsZExhYmVsPlxuICAgICAgKX1cbiAgICAgIHtoaW50ICYmIDxGaWVsZEhpbnQgY2xhc3NOYW1lPVwiY2hlY2tib3hIaW50XCI+e2hpbnR9PC9GaWVsZEhpbnQ+fVxuICAgIDwvUm9vdD5cbiAgKTtcbn07XG5cbkNoZWNrYm94LkxhYmVsID0gRmllbGRMYWJlbDtcbkNoZWNrYm94LkJveCA9IENoZWNrYm94Qm94O1xuXG5DaGVja2JveC5wcm9wVHlwZXMgPSB7XG4gIGlkOiBQcm9wVHlwZXMuc3RyaW5nLmlzUmVxdWlyZWQsXG4gIG9uQ2hhbmdlOiBQcm9wVHlwZXMuZnVuYyxcbiAgaXNEaXNhYmxlZDogUHJvcFR5cGVzLmJvb2wsXG4gIGlzQ2hlY2tlZDogUHJvcFR5cGVzLmJvb2wsXG4gIGxhYmVsOiBQcm9wVHlwZXMuc3RyaW5nLFxuICBoaW50OiB0eXBlcy5oaW50LFxufTtcbiJdfQ== */"));
|
|
33
33
|
|
|
34
34
|
var CheckboxBox = function CheckboxBox(_ref) {
|
|
35
35
|
var _ref$onChange = _ref.onChange,
|
|
@@ -50,7 +50,7 @@ var Root = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
|
|
|
50
50
|
})(function (_ref2) {
|
|
51
51
|
var hasText = _ref2.hasText;
|
|
52
52
|
return hasText && "\n display: grid;\n grid-auto-flow: column;\n align-items: center;\n width: fit-content;\n column-gap: ".concat(getSpace('betweenFormControlAndLabel'), ";\n ");
|
|
53
|
-
}, " .checkboxHint,.checkboxLabel{grid-column:2/3;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
53
|
+
}, " .checkboxHint,.checkboxLabel{grid-column:2/3;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL2NoZWNrYm94LmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyRXVCIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL2NoZWNrYm94LmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGdldENvbG9yLCBnZXRSYWRpdXMsIGdldFNwYWNlLCBnZXRUcmFuc2l0aW9uIH0gZnJvbSAnLi4vdXRpbGl0aWVzJztcbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUHJvcFR5cGVzIGZyb20gJ3Byb3AtdHlwZXMnO1xuaW1wb3J0IHsgY29tcG9uZW50VmFycywgRmllbGRIaW50LCBGaWVsZExhYmVsIH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcbmltcG9ydCB7IHR5cGVzIH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5jb25zdCBzaXplID0gMTY7XG5jb25zdCBjaGVja0hlaWdodCA9IHNpemUgLyAxLjY7XG5jb25zdCBjaGVja1dpZHRoID0gY2hlY2tIZWlnaHQgLyAxLjg7XG5jb25zdCBjaGVja1N0cm9rZSA9IDEuNTtcblxuY29uc3Qgc3Ryb2tlU2l6ZSA9IGNvbXBvbmVudFZhcnMuc3Ryb2tlU2l6ZTtcblxuY29uc3QgQ2hlY2tib3hCb3hJbnB1dCA9IHN0eWxlZC5pbnB1dGBcbiAgLS1jaGVja0NvbG9yOiAke2dldENvbG9yKCdzaGFkZTInKX07XG4gIC0tYmFja2dyb3VuZENvbG9yOiB0cmFuc3BhcmVudDtcbiAgLS1iYWNrZ3JvdW5kQ29sb3JBY3RpdmU6ICR7Z2V0Q29sb3IoJ3NoYWRlMTInKX07XG4gIC0tYm9yZGVyQ29sb3I6ICR7Z2V0Q29sb3IoJ3NoYWRlNicpfTtcblxuICBhcHBlYXJhbmNlOiBub25lO1xuICBoZWlnaHQ6ICR7c2l6ZX1weDtcbiAgd2lkdGg6ICR7c2l6ZX1weDtcbiAgZGlzcGxheTogYmxvY2s7XG4gIGJvcmRlci1yYWRpdXM6ICR7Z2V0UmFkaXVzKCd4cycpfTtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBtYXJnaW46IDA7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tYmFja2dyb3VuZENvbG9yKTtcbiAgYm9yZGVyOiAke3N0cm9rZVNpemV9IHNvbGlkIHZhcigtLWJvcmRlckNvbG9yKTtcbiAgdHJhbnNpdGlvbjogYm9yZGVyLWNvbG9yICR7Z2V0VHJhbnNpdGlvbignbGVhdmUnKX07XG5cbiAgJjpob3ZlciB7XG4gICAgLS1ib3JkZXJDb2xvcjogJHtnZXRDb2xvcignc2hhZGUxMicpfTtcbiAgICB0cmFuc2l0aW9uOiBib3JkZXItY29sb3IgJHtnZXRUcmFuc2l0aW9uKCdob3ZlcicpfTtcbiAgfVxuXG4gICY6Y2hlY2tlZCB7XG4gICAgLS1ib3JkZXJDb2xvcjogdmFyKC0tYmFja2dyb3VuZENvbG9yQWN0aXZlKTtcbiAgICAtLWJhY2tncm91bmRDb2xvcjogdmFyKC0tYmFja2dyb3VuZENvbG9yQWN0aXZlKTtcbiAgfVxuXG4gICY6YWZ0ZXIge1xuICAgIGNvbnRlbnQ6ICcnO1xuICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICBsZWZ0OiAwO1xuICAgIHJpZ2h0OiAwO1xuICAgIHRvcDogMDtcbiAgICBtYXJnaW46IGF1dG87XG4gICAgaGVpZ2h0OiAke2NoZWNrSGVpZ2h0fXB4O1xuICAgIHdpZHRoOiAke2NoZWNrV2lkdGh9cHg7XG4gICAgYm94LXNoYWRvdzogaW5zZXQgLSR7Y2hlY2tTdHJva2V9cHggLSR7Y2hlY2tTdHJva2V9cHggMCB2YXIoLS1jaGVja0NvbG9yKTtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICB0cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XG4gICAgcG9pbnRlci1ldmVudHM6IG5vbmU7XG4gICAgb3BhY2l0eTogMDtcbiAgfVxuXG4gICY6Y2hlY2tlZDphZnRlciB7XG4gICAgb3BhY2l0eTogMTtcbiAgfVxuXG4gICY6ZGlzYWJsZWQge1xuICAgIC0tY2hlY2tDb2xvcjogJHtnZXRDb2xvcignZGlzYWJsZWRDb250ZW50Jyl9O1xuICAgIC0tYmFja2dyb3VuZENvbG9yOiAke2dldENvbG9yKCdkaXNhYmxlZEJhY2tncm91bmQnKX07XG4gICAgLS1iYWNrZ3JvdW5kQ29sb3JBY3RpdmU6ICR7Z2V0Q29sb3IoJ2Rpc2FibGVkQmFja2dyb3VuZCcpfTtcbiAgICAtLWJvcmRlckNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgfVxuYDtcblxuY29uc3QgQ2hlY2tib3hCb3ggPSAoeyBvbkNoYW5nZSA9ICgpID0+IHt9LCAuLi5wcm9wcyB9KSA9PiAoXG4gIDxDaGVja2JveEJveElucHV0IHsuLi5wcm9wc30gb25DaGFuZ2U9e29uQ2hhbmdlfSB0eXBlPVwiY2hlY2tib3hcIiAvPlxuKTtcblxuY29uc3QgUm9vdCA9IHN0eWxlZC5kaXZgXG4gICR7KHsgaGFzVGV4dCB9KSA9PlxuICAgIGhhc1RleHQgJiZcbiAgICBgXG4gICAgICBkaXNwbGF5OiBncmlkO1xuICAgICAgZ3JpZC1hdXRvLWZsb3c6IGNvbHVtbjtcbiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICB3aWR0aDogZml0LWNvbnRlbnQ7XG4gICAgICBjb2x1bW4tZ2FwOiAke2dldFNwYWNlKCdiZXR3ZWVuRm9ybUNvbnRyb2xBbmRMYWJlbCcpfTtcbiAgICBgfVxuXG4gIC5jaGVja2JveEhpbnQsIC5jaGVja2JveExhYmVsIHtcbiAgICBncmlkLWNvbHVtbjogMiAvIDM7XG4gIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaGVja2JveCA9ICh7IGlzRGlzYWJsZWQsIGlzQ2hlY2tlZCwgbGFiZWwsIGhpbnQsIGlkLCBvbkNoYW5nZSwgLi4ucHJvcHMgfSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxSb290IGhhc1RleHQ9e2xhYmVsIHx8IGhpbnR9IHsuLi5wcm9wc30+XG4gICAgICA8Q2hlY2tib3hCb3hcbiAgICAgICAgdHlwZT1cImNoZWNrYm94XCJcbiAgICAgICAgZGlzYWJsZWQ9e2lzRGlzYWJsZWR9XG4gICAgICAgIGlkPXtpZH1cbiAgICAgICAgY2hlY2tlZD17aXNDaGVja2VkfVxuICAgICAgICBvbkNoYW5nZT17b25DaGFuZ2V9XG4gICAgICAvPlxuICAgICAge2xhYmVsICYmIChcbiAgICAgICAgPEZpZWxkTGFiZWwgaHRtbEZvcj17aWR9IGNsYXNzTmFtZT1cImNoZWNrYm94TGFiZWxcIj5cbiAgICAgICAgICB7bGFiZWx9XG4gICAgICAgIDwvRmllbGRMYWJlbD5cbiAgICAgICl9XG4gICAgICB7aGludCAmJiA8RmllbGRIaW50IGNsYXNzTmFtZT1cImNoZWNrYm94SGludFwiPntoaW50fTwvRmllbGRIaW50Pn1cbiAgICA8L1Jvb3Q+XG4gICk7XG59O1xuXG5DaGVja2JveC5MYWJlbCA9IEZpZWxkTGFiZWw7XG5DaGVja2JveC5Cb3ggPSBDaGVja2JveEJveDtcblxuQ2hlY2tib3gucHJvcFR5cGVzID0ge1xuICBpZDogUHJvcFR5cGVzLnN0cmluZy5pc1JlcXVpcmVkLFxuICBvbkNoYW5nZTogUHJvcFR5cGVzLmZ1bmMsXG4gIGlzRGlzYWJsZWQ6IFByb3BUeXBlcy5ib29sLFxuICBpc0NoZWNrZWQ6IFByb3BUeXBlcy5ib29sLFxuICBsYWJlbDogUHJvcFR5cGVzLnN0cmluZyxcbiAgaGludDogdHlwZXMuaGludCxcbn07XG4iXX0= */"));
|
|
54
54
|
|
|
55
55
|
export var Checkbox = function Checkbox(_ref3) {
|
|
56
56
|
var isDisabled = _ref3.isDisabled,
|
package/es/styles/variables.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var variables = "\n :root {\n --grn-unit: 8px;\n }\n\n :root {\n --grn-text-s: 12px;\n --grn-text-m: 14px;\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-s2: calc(var(--grn-unit) * 1.5);\n --grn-space-m: calc(var(--grn-unit) * 2);\n --grn-space-l: calc(var(--grn-unit) * 3);\n --grn-space-l2: calc(var(--grn-unit) * 4);\n --grn-space-xl: calc(var(--grn-unit) * 5);\n --grn-space-xl2: calc(var(--grn-unit) * 6);\n --grn-space-xxl: calc(var(--grn-unit) * 7);\n }\n\n :root {\n --grn-radius-s: 6px;\n --grn-radius-m: 8px;\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: hsl(var(--H) 15% 10% / 0.6);\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\n :root [data-experiment-lighter-fields='true'],\n [data-theme][data-experiment-lighter-fields='true'] {\n --grn-color-fieldBorder: var(--grn-color-fade2);\n }\n";
|
|
1
|
+
var variables = "\n :root {\n --grn-unit: 8px;\n }\n\n :root {\n --grn-text-s: 12px;\n --grn-text-m: 14px;\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-s2: calc(var(--grn-unit) * 1.5);\n --grn-space-m: calc(var(--grn-unit) * 2);\n --grn-space-l: calc(var(--grn-unit) * 3);\n --grn-space-l2: calc(var(--grn-unit) * 4);\n --grn-space-xl: calc(var(--grn-unit) * 5);\n --grn-space-xl2: calc(var(--grn-unit) * 6);\n --grn-space-xxl: calc(var(--grn-unit) * 7);\n }\n\n :root {\n --grn-radius-xs: 3px;\n --grn-radius-s: 6px;\n --grn-radius-m: 8px;\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: hsl(var(--H) 15% 10% / 0.6);\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\n :root [data-experiment-lighter-fields='true'],\n [data-theme][data-experiment-lighter-fields='true'] {\n --grn-color-fieldBorder: var(--grn-color-fade2);\n }\n";
|
|
2
2
|
export default variables;
|
package/es/variables/vars.js
CHANGED