@littlespoon/accordion/lib/styled.js

Little Spoon accordion

"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;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Content = exports.ContentWrapper = exports.ButtonWrapper = exports.Item = exports.Divider = exports.List = void 0;
var colors_1 = __importDefault(require("@littlespoon/theme/lib/colors"));
var paragraph_1 = require("@littlespoon/theme/lib/fonts/paragraph");
var primary_1 = require("@littlespoon/theme/lib/fonts/primary");
var styled_components_1 = __importDefault(require("styled-components"));
exports.List = styled_components_1.default.dl(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n"], ["\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n"])));
exports.Divider = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 0.1rem;\n  background: ", ";\n  margin: 0.8rem 0;\n"], ["\n  width: 100%;\n  height: 0.1rem;\n  background: ", ";\n  margin: 0.8rem 0;\n"])), colors_1.default.borderMinimal);
exports.Item = styled_components_1.default.dt(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: ", ";\n\n  &:last-child ", " {\n    display: none;\n  }\n"], ["\n  color: ", ";\n\n  &:last-child ", " {\n    display: none;\n  }\n"])), colors_1.default.token.shadeBlack, exports.Divider);
exports.ButtonWrapper = styled_components_1.default.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  text-align: left;\n  align-items: center;\n  line-height: ", ";\n  font: ", " ", " ", ";\n  cursor: pointer;\n  background-color: transparent;\n  border: none;\n  padding: 0;\n  color: ", ";\n"], ["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  text-align: left;\n  align-items: center;\n  line-height: ", ";\n  font: ", " ", " ", ";\n  cursor: pointer;\n  background-color: transparent;\n  border: none;\n  padding: 0;\n  color: ", ";\n"])), paragraph_1.p3.lineHeight, primary_1.weight.bold, paragraph_1.p3.fontSize, primary_1.family, colors_1.default.token.shadeBlack);
exports.ContentWrapper = styled_components_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: relative;\n  height: ", ";\n  transition: all 0.4s ease-in-out;\n  overflow: hidden;\n  visibility: ", ";\n"], ["\n  position: relative;\n  height: ", ";\n  transition: all 0.4s ease-in-out;\n  overflow: hidden;\n  visibility: ", ";\n"])), function (props) { return (props.isExpanded ? "".concat(props.expandedHeight / 10, "rem") : '0'); }, function (props) { return (props.isExpanded ? 'visible' : 'hidden'); });
exports.Content = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  letter-spacing: 0.3px;\n  font: ", " ", " ", ";\n"], ["\n  letter-spacing: 0.3px;\n  font: ", " ", " ", ";\n"])), primary_1.weight.normal, paragraph_1.p3.fontSize, primary_1.family);
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
//# sourceMappingURL=styled.js.map