ultra-design/lib/layout/layout-styles.js

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
var react = require('@emotion/react');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);

var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
var layoutStyles = function layoutStyles(_props) {
  return react.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n    width: 100%;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n  "])));
};
var headerStyles = function headerStyles(props) {
  var theme = props.theme,
      color = props.color;
  var _theme$theme$mode = theme[theme.mode],
      backgroundColor = _theme$theme$mode.backgroundColor,
      textColor = _theme$theme$mode.textColor;
  return react.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n    background-color: ", ";\n    color: ", ";\n    height: 60px;\n    padding: 0 20px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  "])), color === 'default' ? backgroundColor : color === 'primary' ? theme.style.primaryColor : color, color === 'primary' ? ' #fff' : textColor);
};
var siderStyles = function siderStyles(_props) {
  return react.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\n    width: 200px;\n    height: 100%;\n  "])));
};
var contentStyles = function contentStyles(_props) {
  return react.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default["default"](["\n    flex: 1;\n    padding: 12px;\n  "])));
};
var footerStyles = function footerStyles(_props) {
  return react.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default["default"](["\n    height: 60px;\n    padding: 0 20px;\n    display: flex;\n    align-items: center;\n  "])));
};

exports.contentStyles = contentStyles;
exports.footerStyles = footerStyles;
exports.headerStyles = headerStyles;
exports.layoutStyles = layoutStyles;
exports.siderStyles = siderStyles;