@helpscout/hsds-react/components/OptionTile/OptionTile.css.js

React component library for Help Scout's Design System

"use strict";

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

exports.__esModule = true;
exports.default = exports.TitleUI = exports.ContentUI = exports.CenteredContentUI = exports.HeaderUI = exports.OptionTileUI = exports.config = void 0;

var _FluffyCard = _interopRequireDefault(require("../FluffyCard"));

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

var config = {
  headerOffset: 10,
  headerTransition: 'transform 220ms ease-out',
  headerHoverTransform: 'translateY(-3px)',
  iconSize: 44,
  titleOffset: 3
};
exports.config = config;
var OptionTileUI = (0, _styledComponents.default)(_FluffyCard.default).withConfig({
  displayName: "OptionTilecss__OptionTileUI",
  componentId: "sc-1ba8txg-0"
})(["margin-top:calc(", "px / 2);position:relative;& > *:first-child{border-top-left-radius:initial;border-top-right-radius:initial;}& > *:last-child{border-bottom-left-radius:initial;border-bottom-right-radius:initial;}&:hover{.c-OptionTile__header{transform:", ";}}"], config.iconSize, config.headerHoverTransform);
exports.OptionTileUI = OptionTileUI;
var HeaderUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "OptionTilecss__HeaderUI",
  componentId: "sc-1ba8txg-1"
})(["left:0;position:absolute;right:0;top:calc((", "px / 2) * -1);transform:translateY(0);transition:", ";"], config.iconSize, config.headerTransition);
exports.HeaderUI = HeaderUI;
var CenteredContentUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "OptionTilecss__CenteredContentUI",
  componentId: "sc-1ba8txg-2"
})(["height:100%;display:flex;align-items:center;justify-content:center;"]);
exports.CenteredContentUI = CenteredContentUI;
var ContentUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "OptionTilecss__ContentUI",
  componentId: "sc-1ba8txg-3"
})(["padding-top:", "px;"], config.headerOffset);
exports.ContentUI = ContentUI;
var TitleUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "OptionTilecss__TitleUI",
  componentId: "sc-1ba8txg-4"
})(["margin-bottom:", "px;"], config.titleOffset);
exports.TitleUI = TitleUI;
var _default = OptionTileUI;
exports.default = _default;