@storybook/design-system/dist/components/shared/global.js

Storybook design system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.GlobalStyle = exports.fontUrl = exports.bodyStyles = void 0;

var _react = _interopRequireDefault(require("react"));

var _theming = require("@storybook/theming");

var _styles = require("./styles");

var bodyStyles = /*#__PURE__*/(0, _theming.css)("font-family:", _styles.typography.type.primary, ";font-size:", _styles.typography.size.s3, "px;color:", _styles.color.darkest, ";margin:0;overflow-y:auto;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);-webkit-tap-highlight-color:transparent;-webkit-overflow-scrolling:touch;*{box-sizing:border-box;}h1,h2,h3,h4,h5,h6{font-weight:", _styles.typography.weight.regular, ";margin:0;padding:0;}button,input,textarea,select{font-family:", _styles.typography.type.primary, ";}sub,sup{font-size:0.8em;}sub{bottom:-0.2em;}sup{top:-0.2em;}b,em{font-weight:", _styles.typography.weight.bold, ";}em{font-style:normal;}hr{border:none;border-top:1px solid ", _styles.color.border, ";clear:both;margin-bottom:1.25rem;}code,pre{font-family:", _styles.typography.type.code, ";font-size:", _styles.typography.size.s2 - 1, "px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}code{display:inline-block;padding-left:2px;padding-right:2px;vertical-align:baseline;color:", _styles.color.secondary, ";}pre{line-height:18px;padding:11px 1rem;white-space:pre-wrap;background:rgba(0, 0, 0, 0.05);color:", _styles.color.darkest, ";border-radius:3px;margin:1rem 0;}&.ReactModal__Body--open{overflow:hidden;&.hide-intercom #intercom-container{display:none;}}.ReactModalPortal>div{opacity:0;}.ReactModalPortal .ReactModal__Overlay{transition:all 200ms ease-in;&--after-open{opacity:1;}&--before-close{opacity:0;}}" + (process.env.NODE_ENV === "production" ? "" : ";label:bodyStyles;")); // Allow design system consumers to access font settings but control how and
// where they load the font.

exports.bodyStyles = bodyStyles;
var fontUrl = 'https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,800&display=swap';
exports.fontUrl = fontUrl;
var globalStyles = /*#__PURE__*/(0, _theming.css)("body{", bodyStyles, ";}:focus:not(:focus-visible){outline:none;}" + (process.env.NODE_ENV === "production" ? "" : ";label:globalStyles;"));

var GlobalStyle = function GlobalStyle() {
  return /*#__PURE__*/_react["default"].createElement(_theming.Global, {
    styles: globalStyles
  });
};

exports.GlobalStyle = GlobalStyle;