csd
Version:
css codes with design system in css in js libraries
1 lines • 11.9 kB
JavaScript
!function(n,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.csd=e():n.csd=e()}(this,(function(){return(()=>{"use strict";var n={d:(e,c)=>{for(var t in c)n.o(c,t)&&!n.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:c[t]})},o:(n,e)=>Object.prototype.hasOwnProperty.call(n,e),r:n=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})}},e={};n.d(e,{default:()=>tn});var c={};n.r(c),n.d(c,{col:()=>b,colCenter:()=>l,colEnd:()=>p,colSpaceBetween:()=>x,default:()=>s,flex:()=>a,relative:()=>m,row:()=>o,rowCenter:()=>d,rowEnd:()=>r,rowSpaceBetween:()=>i});var t={};n.r(t),n.d(t,{absolute:()=>G,default:()=>K,fluid:()=>g,grid:()=>h,grid1:()=>w,grid10:()=>P,grid11:()=>B,grid12:()=>C,grid2:()=>y,grid3:()=>v,grid4:()=>z,grid5:()=>j,grid6:()=>O,grid7:()=>S,grid8:()=>k,grid9:()=>E,mb1:()=>I,mb2:()=>T,mb3:()=>N,mb4:()=>D,mb5:()=>H,mb6:()=>M,mb7:()=>R,mb8:()=>_,noGrow:()=>A});var f={};n.r(f),n.d(f,{BREAKPOINT:()=>F,H:()=>U,LINEHEIGHT:()=>X,PAD:()=>Z,ROUND:()=>q,SPACING:()=>L,ZINDEX:()=>J});var a="\n display:flex;\n flex-wrap:wrap;\n",o="\n ".concat(a,"\n align-items:center;\n"),d="\n ".concat(o,"\n justify-content:center;\n"),i="\n ".concat(o,"\n justify-content:space-between;\n"),r="\n ".concat(o,"\n justify-content: flex-end;\n"),b="\n ".concat(a,"\n flex-direction:column;\n flex-wrap:nowrap;\n"),l="\n ".concat(b,"\n justify-content:center;\n align-items:center;\n"),x="\n ".concat(b,"\n justify-content:center;\n align-items:space-between;\n"),p="\n ".concat(b,"\n justify-content: flex-end;\n"),m="\n position:relative;\n";const s={flex:a,row:o,rowCenter:d,rowSpaceBetween:i,rowEnd:r,col:b,colCenter:l,colSpaceBetween:x,colEnd:p,relative:m},u={4:"4px",8:"8px",10:"10px",12:"12px",16:"16px",20:"20px",24:"24px",28:"28px",30:"30px",32:"32px",40:"40px",50:"50px",60:"60px",70:"70px",80:"80px"};var g="width: 100%;",h="flex: 1 0 auto;",A="flex: 0 0 auto;",w="\n ".concat(A,"\n width: 8.3333333333%;\n"),y="\n ".concat(A,"\n width: 16.6666666667%;\n"),v="\n ".concat(A,"\n width: 25%;\n"),z="\n ".concat(A,"\n width: 33.3333333333%;\n"),j="\n ".concat(A,"\n width: 41.6666666667%;\n"),O="\n ".concat(A,"\n width: 50%;\n"),S="\n ".concat(A,"\n width: 58.3333333333%;\n"),k="\n ".concat(A,"\n width: 66.6666666667%;\n"),E="\n ".concat(A,"\n width: 75%;\n"),P="\n ".concat(A,"\n width: 83.3333333333%;\n"),B="\n ".concat(A,"\n width: 91.6666666667%;\n"),C="\n ".concat(A,"\n width: 100%;\n"),G="\n position:absolute;\n top: 0;\n left: 0;\n",I="margin-bottom: ".concat(u[10],";"),T="margin-bottom: ".concat(u[20],";"),N="margin-bottom: ".concat(u[30],";"),D="margin-bottom: ".concat(u[40],";"),H="margin-bottom: ".concat(u[50],";"),M="margin-bottom: ".concat(u[60],";"),R="margin-bottom: ".concat(u[70],";"),_="margin-bottom: ".concat(u[80],";");const K={fluid:g,noGrow:A,grid:h,grid1:w,grid2:y,grid3:v,grid4:z,grid5:j,grid6:O,grid7:S,grid8:k,grid9:E,grid10:P,grid11:B,grid12:C,absolute:G,mb1:I,mb2:T,mb3:N,mb4:D,mb5:H,mb6:M,mb7:R,mb8:_};var L={4:4,8:8,10:10,12:12,16:16,20:20,24:24,28:28,30:30,32:32,40:40,50:50,60:60,70:70,80:80},U={10:10,12:12,14:14,16:16,18:18,22:22,32:32,42:42},X={10:1.2,12:1.3,14:1.4,16:1.3,18:1.3,22:1.2,32:1.1,42:1.1},Z={xs:24,sm:40,md:60,lg:80,xl:80},q={xs:4,sm:8,md:12,lg:20,xl:32},F={xs:576,sm:768,md:1024,lg:1200,xl:1440},J={dropdown:1e3,sticky:1020,fixed:1030,backdrop:1040,modal:1050,popover:1060,tooltip:1070},Q=Object.values(F),V={xs:function(n){return"@media only screen and (min-width:".concat(Q[0],"px){").concat(n,"}")},sm:function(n){return"@media only screen and (min-width:".concat(Q[1],"px){").concat(n,"}")},md:function(n){return"@media only screen and (min-width:".concat(Q[2],"px){").concat(n,"}")},lg:function(n){return"@media only screen and (min-width:".concat(Q[3],"px){").concat(n,"}")},xl:function(n){return"@media only screen and (min-width:".concat(Q[4],"px){").concat(n,"}")}};const W={only:{xs:function(n){return"@media only screen and (max-width: ".concat(Q[0]-1,"px){").concat(n,"}")},sm:function(n){return"@media only screen and (min-width:".concat(Q[0],"px) and (max-width:").concat(Q[1],"px){").concat(n,"}")},md:function(n){return"@media only screen and (min-width:".concat(Q[1],"px) and (max-width:").concat(Q[2],"px){").concat(n,"}")},lg:function(n){return"@media only screen and (min-width:".concat(Q[2],"px) and (max-width:").concat(Q[3],"px){").concat(n,"}")},xl:function(n){return"@media only screen and (min-width:".concat(Q[3],"px) and (max-width:").concat(Q[4],"px){").concat(n,"}")}},over:V,under:{xs:function(n){return"@media only screen and (max-width:".concat(Q[0]-1,"px){").concat(n,"}")},sm:function(n){return"@media only screen and (max-width:".concat(Q[1]-1,"px){").concat(n,"}")},md:function(n){return"@media only screen and (max-width:".concat(Q[2]-1,"px){").concat(n,"}")},lg:function(n){return"@media only screen and (max-width:".concat(Q[3]-1,"px){").concat(n,"}")},xl:function(n){return"@media only screen and (max-width:".concat(Q[4]-1,"px){").concat(n,"}")}},smTo:{md:function(n){return"@media only screen and (min-width:".concat(Q[0],"px) and (max-width:").concat(Q[2],"px){").concat(n,"}")},lg:function(n){return"@media only screen and (min-width:".concat(Q[0],"px) and (max-width:").concat(Q[3],"px){").concat(n,"}")},xl:function(n){return"@media only screen and (min-width:".concat(Q[0],"px) and (max-width:").concat(Q[4],"px){").concat(n,"}")}},mdTo:{lg:function(n){return"@media only screen and (min-width:".concat(Q[1],"px) and (max-width:").concat(Q[3],"px){").concat(n,"}")},xl:function(n){return"@media only screen and (min-width:".concat(Q[1],"px) and (max-width:").concat(Q[4],"px){").concat(n,"}")}}};var Y=function(n){void 0===n&&(n={});var e=n.align,t=n.xs,f=void 0===t||t,a=n.sm,o=void 0===a||a,d=n.md,i=void 0===d||d,r=n.lg,b=void 0===r||r,l="";return e&&(l+=c[e]),Object.entries({xs:f,sm:o,md:i,lg:b}).forEach((function(n){var e=n[0];n[1]&&(l+="xs"===e?"\n padding-right: ".concat(Z.xs,"px;\n padding-left: ").concat(Z.xs,"px;\n "):V[e]("\n padding-right: ".concat(Z[e],"px;\n padding-left: ").concat(Z[e],"px;\n ")))})),"\n width: 100%;\n margin-right: auto;\n margin-left: auto;\n ".concat(l,"\n ")};const $={baseButton:"\n display: inline-block;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n outline: none;\n cursor: pointer;\n background: none;\n font-size: inherit;\n",baseContainer:Y,baseSection:function(n){return void 0===n&&(n="mb3"),"\n ".concat(Y(),"\n ").concat(t[n],"\n")}},nn={bold:"font-weight: bold;",textCenter:"text-align:center;",h10:"font-size: 10px; line-height: 1.2;",h12:"font-size: 12px; line-height: 1.3;",h14:"font-size: 14px; line-height: 1.4;",h16:"font-size: 16px; line-height: 1.3;",h18:"font-size: 18px; line-height: 1.3;",h22:"font-size: 22px; line-height: 1.2;",h32:"font-size: 32px; line-height: 1.1;",h42:"font-size: 42px; line-height: 1.1;"},en={black:"#000",white:"#fff",red:{50:"#ffebee",100:"#ffcdd2",200:"#ef9a9a",300:"#e57373",400:"#ef5350",500:"#f44336",600:"#e53935",700:"#d32f2f",800:"#c62828",900:"#b71c1c",A100:"#ff8a80",A200:"#ff5252",A400:"#ff1744",A700:"#d50000"},pink:{50:"#fce4ec",100:"#f8bbd0",200:"#f48fb1",300:"#f06292",400:"#ec407a",500:"#e91e63",600:"#d81b60",700:"#c2185b",800:"#ad1457",900:"#880e4f",A100:"#ff80ab",A200:"#ff4081",A400:"#f50057",A700:"#c51162"},purple:{50:"#f3e5f5",100:"#e1bee7",200:"#ce93d8",300:"#ba68c8",400:"#ab47bc",500:"#9c27b0",600:"#8e24aa",700:"#7b1fa2",800:"#6a1b9a",900:"#4a148c",A100:"#ea80fc",A200:"#e040fb",A400:"#d500f9",A700:"#aa00ff"},deepPurple:{50:"#ede7f6",100:"#d1c4e9",200:"#b39ddb",300:"#9575cd",400:"#7e57c2",500:"#673ab7",600:"#5e35b1",700:"#512da8",800:"#4527a0",900:"#311b92",A100:"#b388ff",A200:"#7c4dff",A400:"#651fff",A700:"#6200ea"},indigo:{50:"#e8eaf6",100:"#c5cae9",200:"#9fa8da",300:"#7986cb",400:"#5c6bc0",500:"#3f51b5",600:"#3949ab",700:"#303f9f",800:"#283593",900:"#1a237e",A100:"#8c9eff",A200:"#536dfe",A400:"#3d5afe",A700:"#304ffe"},blue:{50:"#e3f2fd",100:"#bbdefb",200:"#90caf9",300:"#64b5f6",400:"#42a5f5",500:"#2196f3",600:"#1e88e5",700:"#1976d2",800:"#1565c0",900:"#0d47a1",A100:"#82b1ff",A200:"#448aff",A400:"#2979ff",A700:"#2962ff"},lightBlue:{50:"#e1f5fe",100:"#b3e5fc",200:"#81d4fa",300:"#4fc3f7",400:"#29b6f6",500:"#03a9f4",600:"#039be5",700:"#0288d1",800:"#0277bd",900:"#01579b",A100:"#80d8ff",A200:"#40c4ff",A400:"#00b0ff",A700:"#0091ea"},cyan:{50:"#e0f7fa",100:"#b2ebf2",200:"#80deea",300:"#4dd0e1",400:"#26c6da",500:"#00bcd4",600:"#00acc1",700:"#0097a7",800:"#00838f",900:"#006064",A100:"#84ffff",A200:"#18ffff",A400:"#00e5ff",A700:"#00b8d4"},teal:{50:"#e0f2f1",100:"#b2dfdb",200:"#80cbc4",300:"#4db6ac",400:"#26a69a",500:"#009688",600:"#00897b",700:"#00796b",800:"#00695c",900:"#004d40",A100:"#a7ffeb",A200:"#64ffda",A400:"#1de9b6",A700:"#00bfa5"},green:{50:"#e8f5e9",100:"#c8e6c9",200:"#a5d6a7",300:"#81c784",400:"#66bb6a",500:"#4caf50",600:"#43a047",700:"#388e3c",800:"#2e7d32",900:"#1b5e20",A100:"#b9f6ca",A200:"#69f0ae",A400:"#00e676",A700:"#00c853"},lightGreen:{50:"#f1f8e9",100:"#dcedc8",200:"#c5e1a5",300:"#aed581",400:"#9ccc65",500:"#8bc34a",600:"#7cb342",700:"#689f38",800:"#558b2f",900:"#33691e",A100:"#ccff90",A200:"#b2ff59",A400:"#76ff03",A700:"#64dd17"},lime:{50:"#f9fbe7",100:"#f0f4c3",200:"#e6ee9c",300:"#dce775",400:"#d4e157",500:"#cddc39",600:"#c0ca33",700:"#afb42b",800:"#9e9d24",900:"#827717",A100:"#f4ff81",A200:"#eeff41",A400:"#c6ff00",A700:"#aeea00"},yellow:{50:"#fffde7",100:"#fff9c4",200:"#fff59d",300:"#fff176",400:"#ffee58",500:"#ffeb3b",600:"#fdd835",700:"#fbc02d",800:"#f9a825",900:"#f57f17",A100:"#ffff8d",A200:"#ffff00",A400:"#ffea00",A700:"#ffd600"},amber:{50:"#fff8e1",100:"#ffecb3",200:"#ffe082",300:"#ffd54f",400:"#ffca28",500:"#ffc107",600:"#ffb300",700:"#ffa000",800:"#ff8f00",900:"#ff6f00",A100:"#ffe57f",A200:"#ffd740",A400:"#ffc400",A700:"#ffab00"},orange:{50:"#fff3e0",100:"#ffe0b2",200:"#ffcc80",300:"#ffb74d",400:"#ffa726",500:"#ff9800",600:"#fb8c00",700:"#f57c00",800:"#ef6c00",900:"#e65100",A100:"#ffd180",A200:"#ffab40",A400:"#ff9100",A700:"#ff6d00"},deepOrange:{50:"#fbe9e7",100:"#ffccbc",200:"#ffab91",300:"#ff8a65",400:"#ff7043",500:"#ff5722",600:"#f4511e",700:"#e64a19",800:"#d84315",900:"#bf360c",A100:"#ff9e80",A200:"#ff6e40",A400:"#ff3d00",A700:"#dd2c00"},brown:{50:"#efebe9",100:"#d7ccc8",200:"#bcaaa4",300:"#a1887f",400:"#8d6e63",500:"#795548",600:"#6d4c41",700:"#5d4037",800:"#4e342e",900:"#3e2723",A100:"#d7ccc8",A200:"#bcaaa4",A400:"#8d6e63",A700:"#5d4037"},grey:{50:"#fafafa",100:"#f5f5f5",200:"#eeeeee",300:"#e0e0e0",400:"#bdbdbd",500:"#9e9e9e",600:"#757575",700:"#616161",800:"#424242",900:"#212121",A100:"#d5d5d5",A200:"#aaaaaa",A400:"#303030",A700:"#616161"},blueGrey:{50:"#eceff1",100:"#cfd8dc",200:"#b0bec5",300:"#90a4ae",400:"#78909c",500:"#607d8b",600:"#546e7a",700:"#455a64",800:"#37474f",900:"#263238",A100:"#cfd8dc",A200:"#b0bec5",A400:"#78909c",A700:"#455a64"}};var cn=function(){return cn=Object.assign||function(n){for(var e,c=1,t=arguments.length;c<t;c++)for(var f in e=arguments[c])Object.prototype.hasOwnProperty.call(e,f)&&(n[f]=e[f]);return n},cn.apply(this,arguments)};const tn=cn(cn(cn(cn(cn(cn(cn({},s),K),$),W),nn),en),{pad:{xs:"24px",sm:"40px",md:"60px",lg:"80px",xl:"80px"},round:{xs:"4px",sm:"8px",md:"12px",lg:"20px",xl:"32px"},spacing:u,typo:nn,zIndex:{dropdown:"z-index: 1000;",sticky:"z-index: 1020;",fixed:"z-index: 1030;",backdrop:"z-index: 1040;",modal:"z-index: 1050;",popover:"z-index: 1060;",tooltip:"z-index: 1070;"},values:f,colors:en});return e.default})()}));