@krowdy-ui/core/CssGlobal/CssGlobal.js

React components that implement Google's Material Design.

"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

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

var _withStyles = _interopRequireDefault(require("../styles/withStyles"));

var styles = function styles(_ref) {
  var palette = _ref.palette,
      typography = _ref.typography;
  return {
    '@global': {
      '*, *::before, *::after': {
        boxSizing: 'inherit'
      },
      '::-webkit-scrollbar': {
        height: 6,
        width: 7
      },
      '::-webkit-scrollbar-thumb': {
        backgroundColor: 'rgba(0, 0, 0, 0.3)',
        borderRadius: '10px'
      },
      '::-webkit-scrollbar-track': {
        borderRadius: '10px'
      },
      body: (0, _extends2["default"])({
        '&::backdrop': {
          backgroundColor: palette.background["default"]
        },
        // Remove the margin in all browsers.
        '@media print': {
          // Save printer ink.
          backgroundColor: palette.common.white
        }
      }, typography.body2, {
        backgroundColor: palette.background["default"],
        color: palette.text.primary,
        // Add support for document.body.requestFullScreen().
        // Other elements, if background transparent, are not supported.
        margin: 0
      }),
      html: {
        MozOsxFontSmoothing: 'grayscale',
        // Antialiasing.
        WebkitFontSmoothing: 'antialiased',
        // Antialiasing.
        // Change from `box-sizing: content-box` so that `width`
        // is not affected by `padding` or `border`.
        boxSizing: 'border-box'
      },
      'strong, b': {
        fontWeight: 'bolder'
      }
    }
  };
};

var _default = (0, _withStyles["default"])(styles, {
  name: 'CssGlobal'
})(function () {
  return null;
});

exports["default"] = _default;