@gsretail.com/gui-core/build/core/HelpText/GuiHelpText.styled.js

A skeleton to create your own React component library using Rollup, TypeScript, Sass and Storybook

import{__makeTemplateObject as n}from"../../node_modules/tslib/tslib.es6.js";import e from"@emotion/styled";var t,i=function(i){return e(i)(t||(t=n(["\n\n  &.gui-helpText {\n    display: inline-flex;\n    align-items: flex-start;\n    vertical-align: middle;\n    // position: relative;\n    // top: 1px;\n\n    word-break: break-all;\n    color: ",";\n\n    & svg {\n      flex-shrink: 0;\n      font-size: 16px;\n    }\n\n    & .helpIcon {\n      padding: 0 1px 0 2px;\n      font-size: 0.9375rem; //15px\n      font-weight: 700;\n      line-height: 1.2;\n      color: ",";\n    }\n\n    & .helpText {\n      padding-left: 4px;\n      font-size: 0.8125rem; //13px\n      font-weight: 500;\n      line-height: 1.34;\n      letter-spacing: 0.00938em;\n    }\n\n    &.size-small {\n      & svg {\n        font-size: 15px;\n      }\n      & .helpIcon {\n        font-size: 0.875rem;  //14px\n      }\n      & .helpText {\n        font-size: 0.75rem; //12px\n      }\n    }\n    &.size-large {\n      & svg {\n        font-size: 17px;\n      }\n      & .helpIcon {\n        padding: 0 2px;\n        font-size: 0.9375rem; //15px\n      }\n      & .helpText {\n        font-size: 0.875rem; //14px\n      }\n    }\n  }\n"],["\n\n  &.gui-helpText {\n    display: inline-flex;\n    align-items: flex-start;\n    vertical-align: middle;\n    // position: relative;\n    // top: 1px;\n\n    word-break: break-all;\n    color: ",";\n\n    & svg {\n      flex-shrink: 0;\n      font-size: 16px;\n    }\n\n    & .helpIcon {\n      padding: 0 1px 0 2px;\n      font-size: 0.9375rem; //15px\n      font-weight: 700;\n      line-height: 1.2;\n      color: ",";\n    }\n\n    & .helpText {\n      padding-left: 4px;\n      font-size: 0.8125rem; //13px\n      font-weight: 500;\n      line-height: 1.34;\n      letter-spacing: 0.00938em;\n    }\n\n    &.size-small {\n      & svg {\n        font-size: 15px;\n      }\n      & .helpIcon {\n        font-size: 0.875rem;  //14px\n      }\n      & .helpText {\n        font-size: 0.75rem; //12px\n      }\n    }\n    &.size-large {\n      & svg {\n        font-size: 17px;\n      }\n      & .helpIcon {\n        padding: 0 2px;\n        font-size: 0.9375rem; //15px\n      }\n      & .helpText {\n        font-size: 0.875rem; //14px\n      }\n    }\n  }\n"])),(function(n){var e=n.theme,t=n.variant;return"notice"===t?e.palette.grey[600]:"info"===t?e.palette.info.main:"warning"===t?e.palette.warning.main:"error"===t?e.palette.error.main:e.palette.grey[600]}),(function(n){return n.theme.palette.grey[600]}))};export{i as default};