react-life-design/lib/DatePicker/DatePicker.styled.js

Life Design UI components

"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
Object.defineProperty(exports, "__esModule", { value: true });
var styled_components_1 = require("styled-components");
var Colors_1 = require("../Colors");
var TextHelper_1 = require("../TextHelper");
var Sizes_1 = require("../Sizes");
exports.WrapperTable = styled_components_1.default.table(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  text-align: center;\n  border-collapse: collapse;\n\n  @media screen and (min-width: 768px) {\n    width: 376px;\n    margin: 25px auto 0;\n  }\n"], ["\n  width: 100%;\n  text-align: center;\n  border-collapse: collapse;\n\n  @media screen and (min-width: 768px) {\n    width: 376px;\n    margin: 25px auto 0;\n  }\n"])));
exports.DaysRow = styled_components_1.default.tr(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  color: ", ";\n  font-size: ", "em;\n"], ["\n  color: ", ";\n  font-size: ", "em;\n"])), Colors_1.default.support, TextHelper_1.default.pxToEm(Sizes_1.default.s3));
exports.DaysColumn = styled_components_1.default.td(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n\n  button {\n    background-color: transparent;\n    border: 0;\n    border-radius: 50%;\n    width: 41px;\n    height: 41px;\n    margin: 5px auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    transition: .5s all ease;\n    font-size: ", "em;\n    font-family: ", ";\n  }\n\n  ", ";\n"], ["\n\n  button {\n    background-color: transparent;\n    border: 0;\n    border-radius: 50%;\n    width: 41px;\n    height: 41px;\n    margin: 5px auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    transition: .5s all ease;\n    font-size: ", "em;\n    font-family: ", ";\n  }\n\n  ",
    ";\n"])), TextHelper_1.default.pxToEm(Sizes_1.default.s3), TextHelper_1.default.fontVariant('regular'), function (_a) {
    var active = _a.active;
    return active && "\n    button {\n      background-color: " + Colors_1.default.mongeral + ";\n      color: white;\n    }\n  ";
});
exports.SelectYear = styled_components_1.default.select(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  appearance: none;\n  border: 0 none;\n  background-color: transparent;\n  font-size: 16px;\n  font-family: ", ";\n  text-transform: uppercase;\n  width: 100%;\n  max-width: 90%;\n"], ["\n  appearance: none;\n  border: 0 none;\n  background-color: transparent;\n  font-size: 16px;\n  font-family: ", ";\n  text-transform: uppercase;\n  width: 100%;\n  max-width: 90%;\n"])), TextHelper_1.default.fontVariant('medium'));
exports.SelectYearWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  text-align: center;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin: 25px 0 25px 15px;\n\n  @media screen and (min-width: 768px) {\n    margin: 41px 0 10px 67px;\n  }\n  \n  &:last-of-type {\n    margin-left: 20px\n  }\n\n  label {\n    display: inherit;\n  }\n\n  svg {\n    margin-left: 5px;\n  }\n"], ["\n  text-align: center;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin: 25px 0 25px 15px;\n\n  @media screen and (min-width: 768px) {\n    margin: 41px 0 10px 67px;\n  }\n  \n  &:last-of-type {\n    margin-left: 20px\n  }\n\n  label {\n    display: inherit;\n  }\n\n  svg {\n    margin-left: 5px;\n  }\n"])));
exports.InputWrapper = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  position: relative;\n\n  button {\n    appearance: none;\n    background-color: transparent;\n    border: 0 none;\n    padding: 0;\n    position: absolute;\n    top: -3px;\n    right: 0;\n  }\n"], ["\n  position: relative;\n\n  button {\n    appearance: none;\n    background-color: transparent;\n    border: 0 none;\n    padding: 0;\n    position: absolute;\n    top: -3px;\n    right: 0;\n  }\n"])));
exports.ModalStyles = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n\n  div[type=\"default\"] { padding: 0 0 20px }\n\n  .close { right: 20px; background-color: transparent; top: 16px; position: absolute }\n\n  @media screen and (min-width: 768px) {\n    div[type=\"default\"] {\n      padding: 0;\n      max-height: 494px;\n      margin-top: 109px;\n    };\n    \n\n    & .footer-modal {\n      position: absolute;\n      bottom: 20px;\n      right: 20px;\n    }\n  }\n"], ["\n\n  div[type=\"default\"] { padding: 0 0 20px }\n\n  .close { right: 20px; background-color: transparent; top: 16px; position: absolute }\n\n  @media screen and (min-width: 768px) {\n    div[type=\"default\"] {\n      padding: 0;\n      max-height: 494px;\n      margin-top: 109px;\n    };\n    \n\n    & .footer-modal {\n      position: absolute;\n      bottom: 20px;\n      right: 20px;\n    }\n  }\n"])));
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
//# sourceMappingURL=DatePicker.styled.js.map