@helpscout/hsds-react/components/SidePanel/SidePanel.layouts.css.js

React component library for Help Scout's Design System

"use strict";

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

exports.__esModule = true;
exports.FooterUI = exports.BodyUI = exports.HeaderUI = void 0;

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _color = require("../../styles/utilities/color");

var HeaderUI = (0, _styledComponents.default)('header').withConfig({
  displayName: "SidePanellayoutscss__HeaderUI",
  componentId: "sc-1rsnwpi-0"
})(["width:100%;height:125px;padding:30px;background-color:#fff;transition:box-shadow 0.2s;z-index:3;.SidePanel__Heading{margin:10px 0 4px 0;font-weight:500;font-size:18px;line-height:22px;color:", ";}.SidePanel__Subheading{margin:0;font-size:13px;line-height:19px;color:", ";}"], (0, _color.getColor)('charcoal.700'), (0, _color.getColor)('charcoal.300'));
exports.HeaderUI = HeaderUI;
var BodyUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "SidePanellayoutscss__BodyUI",
  componentId: "sc-1rsnwpi-1"
})(["width:100%;background-color:transparent;flex-grow:1;padding:20px;overflow:auto;"]);
exports.BodyUI = BodyUI;
var FooterUI = (0, _styledComponents.default)('footer').withConfig({
  displayName: "SidePanellayoutscss__FooterUI",
  componentId: "sc-1rsnwpi-2"
})(["width:100%;height:90px;padding:20px;background-color:#fff;transition:box-shadow 0.2s;z-index:3;.c-Button{width:100%;}"]);
exports.FooterUI = FooterUI;