@square/maker/components/Section/styles.css.map

📚 Maker Design System by Square

{"version":3,"sources":["webpack://../components/Section/src/Section.vue"],"names":[],"mappings":"AAuEA,mBACA,kBAAA,CACA,gCAAA,CACA,iCAAA,CAEA,iBAAA,CACA,2BAAA,CACA,mBAAA,CACA,mCAAA,CACA,mCACA,CAEA,mBACA,kBAAA,CACA,eAAA,CACA,cAAA,CACA,gBACA,CAGA,sCACA,cAAA,CACA,gBAAA,CACA,mBAAA,CACA,wBACA,CAIA,sCACA,cAAA,CACA,gBACA,CAIA,sCACA,cAAA,CACA,gBACA,CAGA,mBAEA,eAAA,CAGA,qBAAA,CACA,mBACA,CAEA,sCARA,2BAAA,CAEA,cAAA,CACA,gBASA,CAEA,mBACA,YAAA,CACA,6BAAA,CACA,cACA","file":"styles.css","sourcesContent":["<template>\n\t<section\n\t\t:class=\"[\n\t\t\t$s.Section,\n\t\t\t$s[`size_${size}`],\n\t\t]\"\n\t\tv-bind=\"$attrs\"\n\t\tv-on=\"$listeners\"\n\t>\n\t\t<header :class=\"$s.Header\">\n\t\t\t<div\n\t\t\t\tv-if=\"label\"\n\t\t\t\t:class=\"$s.Label\"\n\t\t\t>\n\t\t\t\t{{ label }}\n\n\t\t\t\t<div\n\t\t\t\t\tv-if=\"sublabel\"\n\t\t\t\t\t:class=\"$s.Sublabel\"\n\t\t\t\t>\n\t\t\t\t\t{{ sublabel }}\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<div :class=\"$s.RequirementLabel\">\n\t\t\t\t<!-- @slot requirement label slot -->\n\t\t\t\t<slot name=\"requirement-label\" />\n\t\t\t</div>\n\t\t</header>\n\n\t\t<!-- @slot section content -->\n\t\t<slot />\n\t</section>\n</template>\n\n<script>\n/**\n * @inheritAttrs section\n * @inheritListeners section\n */\nexport default {\n\tinheritAttrs: false,\n\n\tprops: {\n\t\t/**\n\t\t * Section label\n\t\t */\n\t\tlabel: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Section sublabel\n\t\t */\n\t\tsublabel: {\n\t\t\ttype: String,\n\t\t\tdefault: undefined,\n\t\t},\n\t\t/**\n\t\t * Section size\n\t\t */\n\t\tsize: {\n\t\t\ttype: String,\n\t\t\tdefault: 'medium',\n\t\t\tvalidator: (size) => ['small', 'medium', 'large'].includes(size),\n\t\t},\n\t},\n};\n</script>\n\n<style module=\"$s\">\n.Section {\n\t--color-white: #fff;\n\t--color-black-90: rgba(0, 0, 0, 0.9);\n\t--color-black-55: rgba(0, 0, 0, 0.55);\n\n\tpadding: 16px 24px;\n\tcolor: var(--color-black-90);\n\tfont-family: inherit;\n\tbackground-color: var(--color-white);\n\tbox-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);\n}\n\n.Label {\n\tmargin-bottom: 16px;\n\tfont-weight: 500;\n\tfont-size: 14px;\n\tline-height: 20px;\n}\n\n.size_small {\n\t& .Label {\n\t\tfont-size: 12px;\n\t\tline-height: 20px;\n\t\tletter-spacing: 0.5px;\n\t\ttext-transform: uppercase;\n\t}\n}\n\n.size_medium {\n\t& .Label {\n\t\tfont-size: 14px;\n\t\tline-height: 20px;\n\t}\n}\n\n.size_large {\n\t& .Label {\n\t\tfont-size: 24px;\n\t\tline-height: 32px;\n\t}\n}\n\n.Sublabel {\n\tcolor: var(--color-black-55);\n\tfont-weight: 400;\n\tfont-size: 14px;\n\tline-height: 24px;\n\tletter-spacing: normal;\n\ttext-transform: none;\n}\n\n.RequirementLabel {\n\tcolor: var(--color-black-55);\n\tfont-size: 14px;\n\tline-height: 24px;\n}\n\n.Header {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\tfont-size: 14px;\n}\n</style>\n"]}