Created
October 25, 2023 04:38
-
-
Save kristoferjoseph/d00fd03e825cc825046a24d22021089e to your computer and use it in GitHub Desktop.
enhance styles light, dark, accent, error
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * For more information please see the documentation at : https://github.com/enhance-dev/enhance-styles#readme | |
| */ | |
| /*** Theme Colors ***/ | |
| :root { | |
| --accent-h: 208; | |
| --accent-s: 100%; | |
| --accent-l: 43%; | |
| --accent: hsl(var(--accent-h), var(--accent-s), var(--accent-l)); | |
| --light: #fefefe; | |
| --dark: #222222; | |
| --fore: var(--dark, currentColor); | |
| --back: var(--light); | |
| --error-h: 360; | |
| --error-s: 95%; | |
| --error-l: 43%; | |
| --error: hsl(var(--error-h), var(--error-s), var(--error-l)); | |
| --focus-l: 30%; | |
| accent-color: var(--accent, royalblue); | |
| color-scheme: light dark; | |
| } | |
| :is(a, button, input, textarea, summary):focus:not(:focus-visible) { | |
| outline: none; | |
| } | |
| :is(a, button, input, textarea, summary):focus-visible { | |
| outline: max(var(--focus-size, 1px), 1px) solid var(--accent, royalblue); | |
| outline-offset: var(--focus-offset, 0); | |
| box-shadow: 0 0 0 max(var(--focus-size, 3px), 3px) hsl(var(--accent-h), var(--accent-s), calc(var(--accent-l) + var(--focus-l))) | |
| ; | |
| } | |
| :is(a, button, input, textarea, summary):not(:focus):not(:placeholder-shown):invalid { | |
| outline: max(var(--focus-size, 1px), 1px) solid var(--error, crimson); | |
| outline-offset: var(--focus-offset, 0); | |
| box-shadow: 0 0 0 3px hsl(var(--error-h), var(--error-s), calc(var(--error-l) + var(--focus-l))); | |
| } | |
| @media (prefers-color-scheme: dark) { | |
| :root { | |
| --accent-l: 62%; | |
| --focus-l: -30%; | |
| --fore: var(--light); | |
| --back: var(--dark); | |
| } | |
| } | |
| /*** Type Scale ***/ | |
| :root { | |
| --text--2: clamp(0.69rem, 0.71rem + -0.08vw, 0.63rem); | |
| --text--1: clamp(0.83rem, 0.83rem + 0.01vw, 0.84rem); | |
| --text-0: clamp(1rem, 0.97rem + 0.17vw, 1.13rem); | |
| --text-1: clamp(1.2rem, 1.12rem + 0.41vw, 1.5rem); | |
| --text-2: clamp(1.44rem, 1.29rem + 0.76vw, 2rem); | |
| --text-3: clamp(1.73rem, 1.47rem + 1.27vw, 2.66rem); | |
| --text-4: clamp(2.07rem, 1.67rem + 2vw, 3.55rem); | |
| --text-5: clamp(2.49rem, 1.88rem + 3.05vw, 4.74rem); | |
| } | |
| /*** Space Scale ***/ | |
| :root { | |
| --space--5: clamp(0.4rem, 0.44rem + -0.18vw, 0.27rem); | |
| --space--4: clamp(0.48rem, 0.52rem + -0.17vw, 0.36rem); | |
| --space--3: clamp(0.58rem, 0.61rem + -0.14vw, 0.48rem); | |
| --space--2: clamp(0.69rem, 0.71rem + -0.08vw, 0.63rem); | |
| --space--1: clamp(0.83rem, 0.83rem + 0.01vw, 0.84rem); | |
| --space-0: clamp(1rem, 0.97rem + 0.17vw, 1.13rem); | |
| --space-1: clamp(1.2rem, 1.12rem + 0.41vw, 1.5rem); | |
| --space-2: clamp(1.44rem, 1.29rem + 0.76vw, 2rem); | |
| --space-3: clamp(1.73rem, 1.47rem + 1.27vw, 2.66rem); | |
| --space-4: clamp(2.07rem, 1.67rem + 2vw, 3.55rem); | |
| --space-5: clamp(2.49rem, 1.88rem + 3.05vw, 4.74rem); | |
| } | |
| /*** Reset ***/ | |
| *, | |
| *::before, | |
| *::after { | |
| box-sizing: border-box; | |
| } | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| border: 0 solid transparent; | |
| } | |
| html:focus-within { | |
| scroll-behavior: smooth; | |
| } | |
| audio, | |
| canvas, | |
| embed, | |
| iframe, | |
| img, | |
| object, | |
| picture, | |
| svg, | |
| video { | |
| display: block; | |
| max-width: 100%; | |
| } | |
| button, | |
| input, | |
| select, | |
| textarea { | |
| font: inherit; | |
| line-height: inherit; | |
| color: inherit; | |
| } | |
| a { | |
| cursor: pointer; | |
| color: inherit; | |
| text-decoration: inherit; | |
| } | |
| a:not([class]) { | |
| text-decoration-skip-ink: auto; | |
| } | |
| button, | |
| [role="button"] { | |
| cursor: pointer; | |
| background-color: transparent; | |
| } | |
| code { | |
| font: inherit; | |
| font-size: inherit; | |
| } | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6 { | |
| font-size: inherit; | |
| font-weight: inherit; | |
| } | |
| ul[role='list'], | |
| ol[role='list'] { | |
| list-style: none; | |
| } | |
| table { | |
| border-collapse: collapse; | |
| border-spacing: 0; | |
| } | |
| textarea { | |
| vertical-align: top; | |
| overflow: auto; | |
| } | |
| @media (prefers-reduced-motion: reduce) { | |
| html:focus-within { | |
| scroll-behavior: auto; | |
| } | |
| *, | |
| *::before, | |
| *::after { | |
| animation-duration: 0.01ms !important; | |
| animation-iteration-count: 1 !important; | |
| transition-duration: 0.01ms !important; | |
| scroll-behavior: auto !important; | |
| } | |
| } | |
| /*** Typeface ***/ | |
| html {font-size: 100%;} | |
| /*** Family ***/ | |
| .font-sans{font-family: system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;} | |
| .font-serif{font-family: Georgia,Cambria,Times New Roman,Times,serif;} | |
| .font-mono{font-family: Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;} | |
| body { | |
| font-size: var(--text-0); | |
| font-weight: normal; | |
| line-height: 1; | |
| text-rendering: optimizeSpeed; | |
| } | |
| /*** Smoothing ***/ | |
| .font-smoothing { | |
| -webkit-font-smoothing: antialiased; | |
| -moz-osx-font-smoothing: grayscale; | |
| } | |
| /*** Background ***/ | |
| .bg-fixed{background-attachment:fixed;} | |
| .bg-local{background-attachment:local;} | |
| .bg-scroll{background-attachment:scroll;} | |
| .bg-bottom{background-position:bottom;} | |
| .bg-center{background-position:center;} | |
| .bg-left{background-position:left;} | |
| .bg-left-bottom{background-position:left bottom;} | |
| .bg-left-top{background-position:left top;} | |
| .bg-right{background-position:right;} | |
| .bg-right-bottom{background-position:right bottom;} | |
| .bg-right-top{background-position:right top;} | |
| .bg-top{background-position:top;} | |
| .bg-repeat{background-repeat:repeat;} | |
| .bg-no-repeat{background-repeat:no-repeat;} | |
| .bg-repeat-x{background-repeat:repeat-x;} | |
| .bg-repeat-y{background-repeat:repeat-y;} | |
| .bg-repeat-round{background-repeat:round;} | |
| .bg-repeat-space{background-repeat:space;} | |
| .bg-auto{background-size:auto;} | |
| .bg-cover{background-size:cover;} | |
| .bg-contain{background-size:contain;} | |
| .bg-unset{background-color:unset;} | |
| .bg-clip-border{background-clip:border-box;} | |
| .bg-clip-content{background-clip:content-box;} | |
| .bg-clip-padding{background-clip:padding-box;} | |
| .bg-clip-text{ | |
| background-clip:text; | |
| -webkit-background-clip:text; | |
| color:transparent; | |
| } | |
| /*** Border ***/ | |
| .border-solid{border-style:solid;} | |
| .border-dashed{border-style:dashed;} | |
| .border-dotted{border-style:dotted;} | |
| .border-double{border-style:double;} | |
| .border-none{border-style:none;} | |
| .border-bs-none{border-block-start:none;} | |
| .border-be-none{border-block-end:none;} | |
| .border-is-none{border-inline-start:none;} | |
| .border-ie-none{border-inline-end:none;} | |
| .border0{border-width:0px;} | |
| .border-bs0{border-block-start-width:0px;} | |
| .border-be0{border-block-end-width:0px;} | |
| .border-is0{border-inline-start-width:0px;} | |
| .border-ie0{border-inline-end-width:0px;} | |
| .border1{border-width:1px;} | |
| .border-bs1{border-block-start-width:1px;} | |
| .border-be1{border-block-end-width:1px;} | |
| .border-is1{border-inline-start-width:1px;} | |
| .border-ie1{border-inline-end-width:1px;} | |
| .border2{border-width:2px;} | |
| .border-bs2{border-block-start-width:2px;} | |
| .border-be2{border-block-end-width:2px;} | |
| .border-is2{border-inline-start-width:2px;} | |
| .border-ie2{border-inline-end-width:2px;} | |
| .border3{border-width:4px;} | |
| .border-bs3{border-block-start-width:4px;} | |
| .border-be3{border-block-end-width:4px;} | |
| .border-is3{border-inline-start-width:4px;} | |
| .border-ie3{border-inline-end-width:4px;} | |
| /*** Radius ***/ | |
| .radius-none{border-radius:0;} | |
| .radius-100{border-radius:100%;} | |
| .radius-pill{border-radius:9999px;} | |
| .radius-bs-none, | |
| .radius-is-none, | |
| .radius-ss-none{border-start-start-radius:0;} | |
| .radius-bs-none, | |
| .radius-ie-none, | |
| .radius-se-none{border-start-end-radius:0;} | |
| .radius-be-none, | |
| .radius-is-none, | |
| .radius-es-none{border-end-start-radius:0;} | |
| .radius-be-none, | |
| .radius-ie-none, | |
| .radius-ee-none{border-end-end-radius:0;} | |
| .radius0{border-radius:2px;} | |
| .radius1{border-radius:8px;} | |
| .radius2{border-radius:16px;} | |
| .radius3{border-radius:9999px;} | |
| /*** Color ***/ | |
| .text-current{color:currentColor}/* current color */ | |
| .text-transparent{color:transparent}/* transparent */ | |
| .border-current{border-color:currentColor}/* current color */ | |
| .border-transparent{border-color:transparent}/* transparent */ | |
| .background-current{background-color:currentColor}/* current color */ | |
| .background-transparent{background-color:transparent}/* transparent */ | |
| /*** Fill ***/ | |
| .fill-none{fill:none} | |
| .fill-current{fill:currentColor} | |
| /*** Stroke ***/ | |
| .stroke-none{stroke:none;} | |
| .stroke-current{stroke:currentColor;} | |
| /*** Font Sizes ***/ | |
| .text-2{font-size:var(--text--2);} | |
| .text-1{font-size:var(--text--1);} | |
| .text0{font-size:var(--text-0);} | |
| .text1{font-size:var(--text-1);} | |
| .text2{font-size:var(--text-2);} | |
| .text3{font-size:var(--text-3);} | |
| .text4{font-size:var(--text-4);} | |
| .text5{font-size:var(--text-5);} | |
| /*** Style ***/ | |
| .italic{font-style:italic;} | |
| .not-italic{font-style:normal;} | |
| /*** Line Height ***/ | |
| .leading5{line-height: 2;} | |
| .leading4{line-height: 1.625;} | |
| .leading3{line-height: 1.5;} | |
| .leading2{line-height: 1.375;} | |
| .leading1{line-height: 1.25;} | |
| .leading0, | |
| .leading-none{line-height:1;} | |
| /*** Tracking ***/ | |
| .tracking3{letter-spacing: 0.1em;} | |
| .tracking2{letter-spacing: 0.05em;} | |
| .tracking1{letter-spacing: 0.025em;} | |
| .tracking0{letter-spacing: 0;} | |
| .tracking-1{letter-spacing: -0.025em;} | |
| .tracking-2{letter-spacing: -0.05em;} | |
| /*** Font Weight ***/ | |
| .font-hairline{font-weight:100;} | |
| .font-thin{font-weight:200;} | |
| .font-light{font-weight:300;} | |
| .font-normal{font-weight:400;} | |
| .font-medium{font-weight:500;} | |
| .font-semibold{font-weight:600;} | |
| .font-bold{font-weight:700;} | |
| .font-extrabold{font-weight:800;} | |
| .font-black{font-weight:900;} | |
| /*** Text Transform ***/ | |
| .uppercase{text-transform:uppercase;} | |
| .lowercase{text-transform:lowercase;} | |
| .capitalize{text-transform:capitalize;} | |
| .normal-case{text-transform:none;} | |
| /*** Text alignment ***/ | |
| .text-inherit{text-align:inherit;} | |
| .text-center{text-align:center;} | |
| .text-start{text-align:start;} | |
| .text-end{text-align:end;} | |
| /*** Decoration ***/ | |
| .no-underline{text-decoration:none;} | |
| .underline{text-decoration:underline;} | |
| .line-through{text-decoration:line-through;} | |
| /*** List ***/ | |
| .list-none{list-style:none;} | |
| .list-disc{list-style:disc;} | |
| .list-decimal{list-style:decimal;} | |
| /*** Whitespace ***/ | |
| .whitespace-normal{white-space:normal;} | |
| .truncate, | |
| .whitespace-no-wrap{white-space:nowrap;} | |
| .whitespace-pre{white-space:pre;} | |
| .whitespace-pre-line{white-space:pre-line;} | |
| .whitespace-pre-wrap{white-space:pre-wrap;} | |
| /*** Wordbreak ***/ | |
| .break-normal{word-break:normal} | |
| .break-normal, | |
| .break-word{overflow-wrap:normal} | |
| .break-all{word-break:break-all} | |
| .break-keep{word-break:keep-all} | |
| .truncate, | |
| .ellipsis{text-overflow:ellipsis} | |
| /*** Layout ***/ | |
| /*** Position ***/ | |
| .sticky{position:sticky;} | |
| .static{position:static;} | |
| .absolute{position:absolute;} | |
| .relative{position:relative;} | |
| .fixed{position:fixed;} | |
| /*** Inset ***/ | |
| .inset-0{inset:0} | |
| .inset-b-0{inset-block:0;} | |
| .inset-bs-0{inset-block-start:0;} | |
| .inset-be-0{inset-block-end:0;} | |
| .inset-i-0{inset-inline:0;} | |
| .inset-is-0{inset-inline-start:0;} | |
| .inset-ie-0{inset-inline-end:0;} | |
| /*** Display ***/ | |
| .hidden{display:none;} | |
| .block{display:block;} | |
| .inline{display:inline;} | |
| .inline-block{display:inline-block;} | |
| .flex{display:flex;} | |
| .inline-flex{display:inline-flex;} | |
| .grid{display:grid;} | |
| .inline-grid{display:inline-grid;} | |
| /*** Size ***/ | |
| .sb-0{block-size:0} | |
| .sb-auto{block-size:auto} | |
| .sb-100{block-size:100%} | |
| .sb-min-0{min-block-size:0} | |
| .sb-min-100{min-block-size:100%} | |
| .sb-max-0{max-block-size:0} | |
| .sb-max-100{max-block-size:100%} | |
| .sb-100vw{block-size:100vw} | |
| .sb-100vh{block-size:100vh} | |
| .si-0{inline-size:0} | |
| .si-auto{inline-size:auto} | |
| .si-100{inline-size:100%} | |
| .si-min-0{min-inline-size:0} | |
| .si-min-100{min-inline-size:100%} | |
| .si-max0{max-inline-size:0} | |
| .si-max-100{max-inline-size:100%} | |
| .si-100vw{inline-size:100vw} | |
| .si-100vh{inline-size:100vh} | |
| /*** Flex ***/ | |
| .flex-1{flex: 1 1 0%;} | |
| .flex-auto{flex: 1 1 auto;} | |
| .flex-initial{flex: 0 1 auto;} | |
| .flex-none{flex:none;} | |
| .flex-row{flex-direction:row;} | |
| .flex-row-reverse{flex-direction:row-reverse;} | |
| .flex-col{flex-direction:column;} | |
| .flex-col-reverse{flex-direction:column-reverse;} | |
| .flex-grow{flex-grow:1;} | |
| .flex-grow-0{flex-grow:0;} | |
| .flex-shrink{flex-shrink:1;} | |
| .flex-shrink-0{flex-shrink:0;} | |
| .flex-wrap{flex-wrap:wrap;} | |
| .flex-wrap-reverse{flex-wrap:wrap-reverse;} | |
| .flex-no-wrap{flex-wrap:nowrap;} | |
| /*** Grid ***/ | |
| .flow-row{grid-auto-flow:row;} | |
| .flow-col{grid-auto-flow:column;} | |
| .flow-row-dense{grid-auto-flow:row dense;} | |
| .flow-column-dense{grid-auto-flow:column dense;} | |
| .row-auto{grid-row:auto;} | |
| .col-auto{grid-column:auto;} | |
| .col-end-auto{grid-column-end: auto;} | |
| .rows-end-auto{grid-row-end:auto;} | |
| .rows-none{grid-template-rows:none;} | |
| .col-1{grid-template-columns:repeat(1, minmax(0, 1fr));} | |
| .col-span-1{grid-column: span 1 / span 1;} | |
| .col-start-1{grid-column-start: 1;} | |
| .row-start-1{grid-row-start: 1;} | |
| .col-end-1{grid-column-end: 1;} | |
| .row-end-1{grid-row-end: 1;} | |
| .row-1{grid-template-rows: repeat(1, minmax(0, 1fr));} | |
| .col-2{grid-template-columns:repeat(2, minmax(0, 1fr));} | |
| .col-span-2{grid-column: span 2 / span 2;} | |
| .col-start-2{grid-column-start: 2;} | |
| .row-start-2{grid-row-start: 2;} | |
| .col-end-2{grid-column-end: 2;} | |
| .row-end-2{grid-row-end: 2;} | |
| .row-2{grid-template-rows: repeat(2, minmax(0, 1fr));} | |
| .col-3{grid-template-columns:repeat(3, minmax(0, 1fr));} | |
| .col-span-3{grid-column: span 3 / span 3;} | |
| .col-start-3{grid-column-start: 3;} | |
| .row-start-3{grid-row-start: 3;} | |
| .col-end-3{grid-column-end: 3;} | |
| .row-end-3{grid-row-end: 3;} | |
| .row-3{grid-template-rows: repeat(3, minmax(0, 1fr));} | |
| .col-4{grid-template-columns:repeat(4, minmax(0, 1fr));} | |
| .col-span-4{grid-column: span 4 / span 4;} | |
| .col-start-4{grid-column-start: 4;} | |
| .row-start-4{grid-row-start: 4;} | |
| .col-end-4{grid-column-end: 4;} | |
| .row-end-4{grid-row-end: 4;} | |
| .row-4{grid-template-rows: repeat(4, minmax(0, 1fr));} | |
| .col-5{grid-template-columns:repeat(5, minmax(0, 1fr));} | |
| .col-span-5{grid-column: span 5 / span 5;} | |
| .col-start-5{grid-column-start: 5;} | |
| .row-start-5{grid-row-start: 5;} | |
| .col-end-5{grid-column-end: 5;} | |
| .row-end-5{grid-row-end: 5;} | |
| .row-5{grid-template-rows: repeat(5, minmax(0, 1fr));} | |
| .col-6{grid-template-columns:repeat(6, minmax(0, 1fr));} | |
| .col-span-6{grid-column: span 6 / span 6;} | |
| .col-start-6{grid-column-start: 6;} | |
| .row-start-6{grid-row-start: 6;} | |
| .col-end-6{grid-column-end: 6;} | |
| .row-end-6{grid-row-end: 6;} | |
| .row-6{grid-template-rows: repeat(6, minmax(0, 1fr));} | |
| /*** Box alignment ***/ | |
| .align-items-stretch{align-items:stretch;} | |
| .align-items-center{align-items:center;} | |
| .align-items-start{align-items:start;} | |
| .align-items-end{align-items:end;} | |
| .align-items-self-start{align-items:self-start;} | |
| .align-items-self-end{align-items:self-end;} | |
| .align-items-flex-start{align-items:flex-start;} | |
| .align-items-flex-end{align-items:flex-end;} | |
| .align-items-baseline{align-items:baseline;} | |
| .align-content-stretch{align-content:stretch;} | |
| .align-content-center{align-content:center;} | |
| .align-content-start{align-content:start;} | |
| .align-content-end{align-content:end;} | |
| .align-content-flex-start{align-content:flex-start;} | |
| .align-content-flex-end{align-content:flex-end;} | |
| .align-content-baseline{align-content:baseline;} | |
| .align-content-between{align-content:space-between;} | |
| .align-content-around{align-content:space-around;} | |
| .align-content-evenly{align-content:space-evenly;} | |
| .align-self-stretch{align-self:stretch;} | |
| .align-self-auto{align-self:auto;} | |
| .align-self-center{align-self:center;} | |
| .align-self-start{align-self:start;} | |
| .align-self-end{align-self:end;} | |
| .align-self-self-start{align-self:self-start;} | |
| .align-self-self-end{align-self:self-end;} | |
| .align-self-flex-start{align-self:flex-start;} | |
| .align-self-flex-end{align-self:flex-end;} | |
| .align-self-baseline{align-self:baseline;} | |
| .justify-content-stretch{justify-content:stretch;} | |
| .justify-content-center{justify-content:center;} | |
| .justify-content-start{justify-content:start;} | |
| .justify-content-end{justify-content:end;} | |
| .justify-content-flex-start{justify-content:flex-start;} | |
| .justify-content-flex-end{justify-content:flex-end;} | |
| .justify-content-between{justify-content:space-between;} | |
| .justify-content-around{justify-content:space-around;} | |
| .justify-content-evenly{justify-content:space-evenly;} | |
| .justify-items-stretch{justify-items:stretch;} | |
| .justify-items-center{justify-items:center;} | |
| .justify-items-start{justify-items:start;} | |
| .justify-items-end{justify-items:end;} | |
| .justify-items-flex-start{justify-items:flex-start;} | |
| .justify-items-flex-end{justify-items:flex-end;} | |
| .justify-items-self-start{justify-items:self-start;} | |
| .justify-items-self-end{justify-items:self-end;} | |
| .justify-items-baseline{justify-items:baseline;} | |
| .justify-self-stretch{justify-self:stretch;} | |
| .justify-self-center{justify-self:center;} | |
| .justify-self-start{justify-self:start;} | |
| .justify-self-end{justify-self:end;} | |
| .justify-self-flex-start{justify-self:flex-start;} | |
| .justify-self-flex-end{justify-self:flex-end;} | |
| .justify-self-self-start{justify-self:self-start;} | |
| .justify-self-self-end{justify-self:self-end;} | |
| .justify-self-baseline{justify-self:baseline;} | |
| .place-content-stretch{place-content:stretch;} | |
| .place-content-center{place-content:center;} | |
| .place-content-start{place-content:start;} | |
| .place-content-end{place-content:end;} | |
| .place-content-flex-start{place-content:flex-start;} | |
| .place-content-flex-end{place-content:flex-end;} | |
| .place-content-between{place-content:space-between;} | |
| .place-content-around{place-content:space-around;} | |
| .place-content-evenly{place-content:space-evenly;} | |
| .place-items-stretch{place-items:stretch;} | |
| .place-items-center{place-items:center;} | |
| .place-items-start{place-items:start;} | |
| .place-items-end{place-items:end;} | |
| .place-items-self-start{place-items:self-start;} | |
| .place-items-self-end{place-items:self-end;} | |
| .place-items-flex-start{place-items:flex-start;} | |
| .place-items-flex-end{place-items:flex-end;} | |
| .place-items-baseline{place-items:baseline;} | |
| .place-self-stretch{place-self:stretch;} | |
| .place-self-center{place-self:center;} | |
| .place-self-start{place-self:start;} | |
| .place-self-end{place-self:end;} | |
| .place-self-flex-start{place-self:flex-start;} | |
| .place-self-flex-end{place-self:flex-end;} | |
| .place-self-self-start{place-self:self-start;} | |
| .place-self-self-end{place-self:self-end;} | |
| .place-self-baseline{place-self:baseline;} | |
| /*** Gap ***/ | |
| .gap-5{gap:var(--space--5);} | |
| .gap-4{gap:var(--space--4);} | |
| .gap-3{gap:var(--space--3);} | |
| .gap-2{gap:var(--space--2);} | |
| .gap-1{gap:var(--space--1);} | |
| .gap0{gap:var(--space-0);} | |
| .gap1{gap:var(--space-1);} | |
| .gap2{gap:var(--space-2);} | |
| .gap3{gap:var(--space-3);} | |
| .gap4{gap:var(--space-4);} | |
| .gap5{gap:var(--space-5);} | |
| /*** Order ***/ | |
| .order-first{order:-9999;} | |
| .order-last{order:9999;} | |
| .order-none{order:0;} | |
| .order-1{order:1;} | |
| .order-2{order:2;} | |
| .order-3{order:3;} | |
| .order-4{order:4;} | |
| .order-5{order:5;} | |
| .order-6{order:6;} | |
| /*** Z-Index ***/ | |
| .z-auto{z-index:auto;} | |
| .z1{z-index:1;} | |
| .z0{z-index:0;} | |
| .z-1{z-index:-1;} | |
| /*** Margin ***/ | |
| .m-none{margin:0} | |
| .mb-none{margin-block:0} | |
| .mbs-none{margin-block-start:0} | |
| .mbe-none{margin-block-end:0} | |
| .mi-none{margin-inline:0} | |
| .mis-none{margin-inline-start:0} | |
| .mie-none{margin-inline-end:0} | |
| .m-auto{margin:auto} | |
| .mb-auto{margin-block:auto} | |
| .mbs-auto{margin-block-start:auto} | |
| .mbe-auto{margin-block-end:auto} | |
| .mi-auto{margin-inline:auto} | |
| .mis-auto{margin-inline-start:auto} | |
| .mie-auto{margin-inline-end:auto} | |
| .m-5{margin:var(--space--5);} | |
| .mb-5{margin-block:var(--space--5);} | |
| .mbs-5{margin-block-start:var(--space--5);} | |
| .mbe-5{margin-block-end:var(--space--5);} | |
| .mi-5{margin-inline:var(--space--5);} | |
| .mis-5{margin-inline-start:var(--space--5);} | |
| .mie-5{margin-inline-end:var(--space--5);} | |
| .m-4{margin:var(--space--4);} | |
| .mb-4{margin-block:var(--space--4);} | |
| .mbs-4{margin-block-start:var(--space--4);} | |
| .mbe-4{margin-block-end:var(--space--4);} | |
| .mi-4{margin-inline:var(--space--4);} | |
| .mis-4{margin-inline-start:var(--space--4);} | |
| .mie-4{margin-inline-end:var(--space--4);} | |
| .m-3{margin:var(--space--3);} | |
| .mb-3{margin-block:var(--space--3);} | |
| .mbs-3{margin-block-start:var(--space--3);} | |
| .mbe-3{margin-block-end:var(--space--3);} | |
| .mi-3{margin-inline:var(--space--3);} | |
| .mis-3{margin-inline-start:var(--space--3);} | |
| .mie-3{margin-inline-end:var(--space--3);} | |
| .m-2{margin:var(--space--2);} | |
| .mb-2{margin-block:var(--space--2);} | |
| .mbs-2{margin-block-start:var(--space--2);} | |
| .mbe-2{margin-block-end:var(--space--2);} | |
| .mi-2{margin-inline:var(--space--2);} | |
| .mis-2{margin-inline-start:var(--space--2);} | |
| .mie-2{margin-inline-end:var(--space--2);} | |
| .m-1{margin:var(--space--1);} | |
| .mb-1{margin-block:var(--space--1);} | |
| .mbs-1{margin-block-start:var(--space--1);} | |
| .mbe-1{margin-block-end:var(--space--1);} | |
| .mi-1{margin-inline:var(--space--1);} | |
| .mis-1{margin-inline-start:var(--space--1);} | |
| .mie-1{margin-inline-end:var(--space--1);} | |
| .m0{margin:var(--space-0);} | |
| .mb0{margin-block:var(--space-0);} | |
| .mbs0{margin-block-start:var(--space-0);} | |
| .mbe0{margin-block-end:var(--space-0);} | |
| .mi0{margin-inline:var(--space-0);} | |
| .mis0{margin-inline-start:var(--space-0);} | |
| .mie0{margin-inline-end:var(--space-0);} | |
| .m1{margin:var(--space-1);} | |
| .mb1{margin-block:var(--space-1);} | |
| .mbs1{margin-block-start:var(--space-1);} | |
| .mbe1{margin-block-end:var(--space-1);} | |
| .mi1{margin-inline:var(--space-1);} | |
| .mis1{margin-inline-start:var(--space-1);} | |
| .mie1{margin-inline-end:var(--space-1);} | |
| .m2{margin:var(--space-2);} | |
| .mb2{margin-block:var(--space-2);} | |
| .mbs2{margin-block-start:var(--space-2);} | |
| .mbe2{margin-block-end:var(--space-2);} | |
| .mi2{margin-inline:var(--space-2);} | |
| .mis2{margin-inline-start:var(--space-2);} | |
| .mie2{margin-inline-end:var(--space-2);} | |
| .m3{margin:var(--space-3);} | |
| .mb3{margin-block:var(--space-3);} | |
| .mbs3{margin-block-start:var(--space-3);} | |
| .mbe3{margin-block-end:var(--space-3);} | |
| .mi3{margin-inline:var(--space-3);} | |
| .mis3{margin-inline-start:var(--space-3);} | |
| .mie3{margin-inline-end:var(--space-3);} | |
| .m4{margin:var(--space-4);} | |
| .mb4{margin-block:var(--space-4);} | |
| .mbs4{margin-block-start:var(--space-4);} | |
| .mbe4{margin-block-end:var(--space-4);} | |
| .mi4{margin-inline:var(--space-4);} | |
| .mis4{margin-inline-start:var(--space-4);} | |
| .mie4{margin-inline-end:var(--space-4);} | |
| .m5{margin:var(--space-5);} | |
| .mb5{margin-block:var(--space-5);} | |
| .mbs5{margin-block-start:var(--space-5);} | |
| .mbe5{margin-block-end:var(--space-5);} | |
| .mi5{margin-inline:var(--space-5);} | |
| .mis5{margin-inline-start:var(--space-5);} | |
| .mie5{margin-inline-end:var(--space-5);} | |
| /*** Padding ***/ | |
| .p-none{padding:0} | |
| .pb-none{padding-block:0} | |
| .pbs-none{padding-block-start:0} | |
| .pbe-none{padding-block-end:0} | |
| .pi-none{padding-inline:0} | |
| .pis-none{padding-inline-start:0} | |
| .pie-none{padding-inline-end:0} | |
| .p-5{padding:var(--space--5);} | |
| .pb-5{padding-block:var(--space--5);} | |
| .pbs-5{padding-block-start:var(--space--5);} | |
| .pbe-5{padding-block-end:var(--space--5);} | |
| .pi-5{padding-inline:var(--space--5);} | |
| .pis-5{padding-inline-start:var(--space--5);} | |
| .pie-5{padding-inline-end:var(--space--5);} | |
| .p-4{padding:var(--space--4);} | |
| .pb-4{padding-block:var(--space--4);} | |
| .pbs-4{padding-block-start:var(--space--4);} | |
| .pbe-4{padding-block-end:var(--space--4);} | |
| .pi-4{padding-inline:var(--space--4);} | |
| .pis-4{padding-inline-start:var(--space--4);} | |
| .pie-4{padding-inline-end:var(--space--4);} | |
| .p-3{padding:var(--space--3);} | |
| .pb-3{padding-block:var(--space--3);} | |
| .pbs-3{padding-block-start:var(--space--3);} | |
| .pbe-3{padding-block-end:var(--space--3);} | |
| .pi-3{padding-inline:var(--space--3);} | |
| .pis-3{padding-inline-start:var(--space--3);} | |
| .pie-3{padding-inline-end:var(--space--3);} | |
| .p-2{padding:var(--space--2);} | |
| .pb-2{padding-block:var(--space--2);} | |
| .pbs-2{padding-block-start:var(--space--2);} | |
| .pbe-2{padding-block-end:var(--space--2);} | |
| .pi-2{padding-inline:var(--space--2);} | |
| .pis-2{padding-inline-start:var(--space--2);} | |
| .pie-2{padding-inline-end:var(--space--2);} | |
| .p-1{padding:var(--space--1);} | |
| .pb-1{padding-block:var(--space--1);} | |
| .pbs-1{padding-block-start:var(--space--1);} | |
| .pbe-1{padding-block-end:var(--space--1);} | |
| .pi-1{padding-inline:var(--space--1);} | |
| .pis-1{padding-inline-start:var(--space--1);} | |
| .pie-1{padding-inline-end:var(--space--1);} | |
| .p0{padding:var(--space-0);} | |
| .pb0{padding-block:var(--space-0);} | |
| .pbs0{padding-block-start:var(--space-0);} | |
| .pbe0{padding-block-end:var(--space-0);} | |
| .pi0{padding-inline:var(--space-0);} | |
| .pis0{padding-inline-start:var(--space-0);} | |
| .pie0{padding-inline-end:var(--space-0);} | |
| .p1{padding:var(--space-1);} | |
| .pb1{padding-block:var(--space-1);} | |
| .pbs1{padding-block-start:var(--space-1);} | |
| .pbe1{padding-block-end:var(--space-1);} | |
| .pi1{padding-inline:var(--space-1);} | |
| .pis1{padding-inline-start:var(--space-1);} | |
| .pie1{padding-inline-end:var(--space-1);} | |
| .p2{padding:var(--space-2);} | |
| .pb2{padding-block:var(--space-2);} | |
| .pbs2{padding-block-start:var(--space-2);} | |
| .pbe2{padding-block-end:var(--space-2);} | |
| .pi2{padding-inline:var(--space-2);} | |
| .pis2{padding-inline-start:var(--space-2);} | |
| .pie2{padding-inline-end:var(--space-2);} | |
| .p3{padding:var(--space-3);} | |
| .pb3{padding-block:var(--space-3);} | |
| .pbs3{padding-block-start:var(--space-3);} | |
| .pbe3{padding-block-end:var(--space-3);} | |
| .pi3{padding-inline:var(--space-3);} | |
| .pis3{padding-inline-start:var(--space-3);} | |
| .pie3{padding-inline-end:var(--space-3);} | |
| .p4{padding:var(--space-4);} | |
| .pb4{padding-block:var(--space-4);} | |
| .pbs4{padding-block-start:var(--space-4);} | |
| .pbe4{padding-block-end:var(--space-4);} | |
| .pi4{padding-inline:var(--space-4);} | |
| .pis4{padding-inline-start:var(--space-4);} | |
| .pie4{padding-inline-end:var(--space-4);} | |
| .p5{padding:var(--space-5);} | |
| .pb5{padding-block:var(--space-5);} | |
| .pbs5{padding-block-start:var(--space-5);} | |
| .pbe5{padding-block-end:var(--space-5);} | |
| .pi5{padding-inline:var(--space-5);} | |
| .pis5{padding-inline-start:var(--space-5);} | |
| .pie5{padding-inline-end:var(--space-5);} | |
| /*** Overflow ***/ | |
| .overflow-auto{overflow:auto;} | |
| .truncate, | |
| .overflow-hidden{overflow:hidden;} | |
| .overflow-visible{overflow:visible;} | |
| .overflow-scroll{overflow:scroll;} | |
| .overflow-x-auto{overflow-x:auto;} | |
| .overflow-y-auto{overflow-y:auto;} | |
| .overflow-x-scroll{overflow-x:scroll;} | |
| .overflow-x-hidden{overflow-x:hidden;} | |
| .overflow-y-scroll{overflow-y:scroll;} | |
| .overflow-y-hidden{overflow-y:hidden;} | |
| .scrolling-touch{-webkit-overflow-scrolling:touch;} | |
| .scrolling-auto{-webkit-overflow-scrolling:auto;} | |
| /*** Visibility ***/ | |
| .invisible{visibility:hidden;} | |
| .visible{visibility:visible;} | |
| /*** Object Fit ***/ | |
| .object-contain{object-fit:contain;} | |
| .object-cover{object-fit:cover;} | |
| .object-fill{object-fit:fill;} | |
| .object-none{object-fit:none;} | |
| .object-scale-down{object-fit:scale-down;} | |
| /*** Object Position ***/ | |
| .object-b{object-position:bottom;} | |
| .object-c{object-position:center;} | |
| .object-t{object-position:top;} | |
| .object-r{object-position:right;} | |
| .object-rt{object-position:right top;} | |
| .object-rb{object-position:right bottom;} | |
| .object-l{object-position:left;} | |
| .object-lt{object-position:left top;} | |
| .object-lb{object-position:left bottom;} | |
| /*** Outline ***/ | |
| .outline-none{outline:0;} | |
| /*** Opacity ***/ | |
| .opacity-0{opacity:0;} | |
| .opacity-25{opacity:0.25;} | |
| .opacity-50{opacity:0.5;} | |
| .opacity-75{opacity:0.75;} | |
| .opacity-100{opacity:1.0;} | |
| /*** Cursor ***/ | |
| .cursor-auto{cursor:auto;} | |
| .cursor-default{cursor:default;} | |
| .cursor-pointer{cursor:pointer;} | |
| .cursor-wait{cursor:wait;} | |
| .cursor-text{cursor:text;} | |
| .cursor-move{cursor:move;} | |
| .cursor-not-allowed{cursor:not-allowed;} | |
| .cursor-grab{cursor:grab;} | |
| .cursor-grabbing{cursor:grabbing;} | |
| /*** User Select ***/ | |
| .select-none{user-select:none;} | |
| .select-text{user-select:text;} | |
| .select-all{user-select:all;} | |
| .select-auto{user-select:auto;} | |
| /*** Debug ***/ | |
| .debug * { outline: 2px dotted var(--debug-color, rebeccapurple) } | |
| .debug *:hover { border:2px solid var(--debug-color, rebeccapurple) } | |
| @media only screen and (min-width:48em) { | |
| /*** Font Sizes ***/ | |
| .text-2-lg{font-size:var(--text--2);} | |
| .text-1-lg{font-size:var(--text--1);} | |
| .text0-lg{font-size:var(--text-0);} | |
| .text1-lg{font-size:var(--text-1);} | |
| .text2-lg{font-size:var(--text-2);} | |
| .text3-lg{font-size:var(--text-3);} | |
| .text4-lg{font-size:var(--text-4);} | |
| .text5-lg{font-size:var(--text-5);} | |
| /*** Style ***/ | |
| .italic-lg{font-style:italic;} | |
| .not-italic-lg{font-style:normal;} | |
| /*** Line Height ***/ | |
| .leading5-lg{line-height: 2;} | |
| .leading4-lg{line-height: 1.625;} | |
| .leading3-lg{line-height: 1.5;} | |
| .leading2-lg{line-height: 1.375;} | |
| .leading1-lg{line-height: 1.25;} | |
| .leading0-lg, | |
| .leading-none-lg{line-height:1;} | |
| /*** Tracking ***/ | |
| .tracking3-lg{letter-spacing: 0.1em;} | |
| .tracking2-lg{letter-spacing: 0.05em;} | |
| .tracking1-lg{letter-spacing: 0.025em;} | |
| .tracking0-lg{letter-spacing: 0;} | |
| .tracking-1-lg{letter-spacing: -0.025em;} | |
| .tracking-2-lg{letter-spacing: -0.05em;} | |
| /*** Font Weight ***/ | |
| .font-hairline-lg{font-weight:100;} | |
| .font-thin-lg{font-weight:200;} | |
| .font-light-lg{font-weight:300;} | |
| .font-normal-lg{font-weight:400;} | |
| .font-medium-lg{font-weight:500;} | |
| .font-semibold-lg{font-weight:600;} | |
| .font-bold-lg{font-weight:700;} | |
| .font-extrabold-lg{font-weight:800;} | |
| .font-black-lg{font-weight:900;} | |
| /*** Text Transform ***/ | |
| .uppercase-lg{text-transform:uppercase;} | |
| .lowercase-lg{text-transform:lowercase;} | |
| .capitalize-lg{text-transform:capitalize;} | |
| .normal-case-lg{text-transform:none;} | |
| /*** Text alignment ***/ | |
| .text-inherit-lg{text-align:inherit;} | |
| .text-center-lg{text-align:center;} | |
| .text-start-lg{text-align:start;} | |
| .text-end-lg{text-align:end;} | |
| /*** Decoration ***/ | |
| .no-underline-lg{text-decoration:none;} | |
| .underline-lg{text-decoration:underline;} | |
| .line-through-lg{text-decoration:line-through;} | |
| /*** List ***/ | |
| .list-none-lg{list-style:none;} | |
| .list-disc-lg{list-style:disc;} | |
| .list-decimal-lg{list-style:decimal;} | |
| /*** Whitespace ***/ | |
| .whitespace-normal-lg{white-space:normal;} | |
| .truncate-lg, | |
| .whitespace-no-wrap-lg{white-space:nowrap;} | |
| .whitespace-pre-lg{white-space:pre;} | |
| .whitespace-pre-line-lg{white-space:pre-line;} | |
| .whitespace-pre-wrap-lg{white-space:pre-wrap;} | |
| /*** Wordbreak ***/ | |
| .break-normal-lg{word-break:normal} | |
| .break-normal-lg, | |
| .break-word-lg{overflow-wrap:normal} | |
| .break-all-lg{word-break:break-all} | |
| .break-keep-lg{word-break:keep-all} | |
| .truncate-lg, | |
| .ellipsis-lg{text-overflow:ellipsis} | |
| /*** Layout ***/ | |
| /*** Position ***/ | |
| .sticky-lg{position:sticky;} | |
| .static-lg{position:static;} | |
| .absolute-lg{position:absolute;} | |
| .relative-lg{position:relative;} | |
| .fixed-lg{position:fixed;} | |
| /*** Inset ***/ | |
| .inset-0-lg{inset:0} | |
| .inset-b-0-lg{inset-block:0;} | |
| .inset-bs-0-lg{inset-block-start:0;} | |
| .inset-be-0-lg{inset-block-end:0;} | |
| .inset-i-0-lg{inset-inline:0;} | |
| .inset-is-0-lg{inset-inline-start:0;} | |
| .inset-ie-0-lg{inset-inline-end:0;} | |
| /*** Display ***/ | |
| .hidden-lg{display:none;} | |
| .block-lg{display:block;} | |
| .inline-lg{display:inline;} | |
| .inline-block-lg{display:inline-block;} | |
| .flex-lg{display:flex;} | |
| .inline-flex-lg{display:inline-flex;} | |
| .grid-lg{display:grid;} | |
| .inline-grid-lg{display:inline-grid;} | |
| /*** Size ***/ | |
| .sb-0-lg{block-size:0} | |
| .sb-auto-lg{block-size:auto} | |
| .sb-100-lg{block-size:100%} | |
| .sb-min-0-lg{min-block-size:0} | |
| .sb-min-100-lg{min-block-size:100%} | |
| .sb-max-0-lg{max-block-size:0} | |
| .sb-max-100-lg{max-block-size:100%} | |
| .sb-100vw-lg{block-size:100vw} | |
| .sb-100vh-lg{block-size:100vh} | |
| .si-0-lg{inline-size:0} | |
| .si-auto-lg{inline-size:auto} | |
| .si-100-lg{inline-size:100%} | |
| .si-min-0-lg{min-inline-size:0} | |
| .si-min-100-lg{min-inline-size:100%} | |
| .si-max0-lg{max-inline-size:0} | |
| .si-max-100-lg{max-inline-size:100%} | |
| .si-100vw-lg{inline-size:100vw} | |
| .si-100vh-lg{inline-size:100vh} | |
| /*** Flex ***/ | |
| .flex-1-lg{flex: 1 1 0%;} | |
| .flex-auto-lg{flex: 1 1 auto;} | |
| .flex-initial-lg{flex: 0 1 auto;} | |
| .flex-none-lg{flex:none;} | |
| .flex-row-lg{flex-direction:row;} | |
| .flex-row-reverse-lg{flex-direction:row-reverse;} | |
| .flex-col-lg{flex-direction:column;} | |
| .flex-col-reverse-lg{flex-direction:column-reverse;} | |
| .flex-grow-lg{flex-grow:1;} | |
| .flex-grow-0-lg{flex-grow:0;} | |
| .flex-shrink-lg{flex-shrink:1;} | |
| .flex-shrink-0-lg{flex-shrink:0;} | |
| .flex-wrap-lg{flex-wrap:wrap;} | |
| .flex-wrap-reverse-lg{flex-wrap:wrap-reverse;} | |
| .flex-no-wrap-lg{flex-wrap:nowrap;} | |
| /*** Grid ***/ | |
| .flow-row-lg{grid-auto-flow:row;} | |
| .flow-col-lg{grid-auto-flow:column;} | |
| .flow-row-dense-lg{grid-auto-flow:row dense;} | |
| .flow-column-dense-lg{grid-auto-flow:column dense;} | |
| .row-auto-lg{grid-row:auto;} | |
| .col-auto-lg{grid-column:auto;} | |
| .col-end-auto-lg{grid-column-end: auto;} | |
| .rows-end-auto-lg{grid-row-end:auto;} | |
| .rows-none-lg{grid-template-rows:none;} | |
| .col-1-lg{grid-template-columns:repeat(1, minmax(0, 1fr));} | |
| .col-span-1-lg{grid-column: span 1 / span 1;} | |
| .col-start-1-lg{grid-column-start: 1;} | |
| .row-start-1-lg{grid-row-start: 1;} | |
| .col-end-1-lg{grid-column-end: 1;} | |
| .row-end-1-lg{grid-row-end: 1;} | |
| .row-1-lg{grid-template-rows: repeat(1, minmax(0, 1fr));} | |
| .col-2-lg{grid-template-columns:repeat(2, minmax(0, 1fr));} | |
| .col-span-2-lg{grid-column: span 2 / span 2;} | |
| .col-start-2-lg{grid-column-start: 2;} | |
| .row-start-2-lg{grid-row-start: 2;} | |
| .col-end-2-lg{grid-column-end: 2;} | |
| .row-end-2-lg{grid-row-end: 2;} | |
| .row-2-lg{grid-template-rows: repeat(2, minmax(0, 1fr));} | |
| .col-3-lg{grid-template-columns:repeat(3, minmax(0, 1fr));} | |
| .col-span-3-lg{grid-column: span 3 / span 3;} | |
| .col-start-3-lg{grid-column-start: 3;} | |
| .row-start-3-lg{grid-row-start: 3;} | |
| .col-end-3-lg{grid-column-end: 3;} | |
| .row-end-3-lg{grid-row-end: 3;} | |
| .row-3-lg{grid-template-rows: repeat(3, minmax(0, 1fr));} | |
| .col-4-lg{grid-template-columns:repeat(4, minmax(0, 1fr));} | |
| .col-span-4-lg{grid-column: span 4 / span 4;} | |
| .col-start-4-lg{grid-column-start: 4;} | |
| .row-start-4-lg{grid-row-start: 4;} | |
| .col-end-4-lg{grid-column-end: 4;} | |
| .row-end-4-lg{grid-row-end: 4;} | |
| .row-4-lg{grid-template-rows: repeat(4, minmax(0, 1fr));} | |
| .col-5-lg{grid-template-columns:repeat(5, minmax(0, 1fr));} | |
| .col-span-5-lg{grid-column: span 5 / span 5;} | |
| .col-start-5-lg{grid-column-start: 5;} | |
| .row-start-5-lg{grid-row-start: 5;} | |
| .col-end-5-lg{grid-column-end: 5;} | |
| .row-end-5-lg{grid-row-end: 5;} | |
| .row-5-lg{grid-template-rows: repeat(5, minmax(0, 1fr));} | |
| .col-6-lg{grid-template-columns:repeat(6, minmax(0, 1fr));} | |
| .col-span-6-lg{grid-column: span 6 / span 6;} | |
| .col-start-6-lg{grid-column-start: 6;} | |
| .row-start-6-lg{grid-row-start: 6;} | |
| .col-end-6-lg{grid-column-end: 6;} | |
| .row-end-6-lg{grid-row-end: 6;} | |
| .row-6-lg{grid-template-rows: repeat(6, minmax(0, 1fr));} | |
| /*** Box alignment ***/ | |
| .align-items-stretch-lg{align-items:stretch;} | |
| .align-items-center-lg{align-items:center;} | |
| .align-items-start-lg{align-items:start;} | |
| .align-items-end-lg{align-items:end;} | |
| .align-items-self-start-lg{align-items:self-start;} | |
| .align-items-self-end-lg{align-items:self-end;} | |
| .align-items-flex-start-lg{align-items:flex-start;} | |
| .align-items-flex-end-lg{align-items:flex-end;} | |
| .align-items-baseline-lg{align-items:baseline;} | |
| .align-content-stretch-lg{align-content:stretch;} | |
| .align-content-center-lg{align-content:center;} | |
| .align-content-start-lg{align-content:start;} | |
| .align-content-end-lg{align-content:end;} | |
| .align-content-flex-start-lg{align-content:flex-start;} | |
| .align-content-flex-end-lg{align-content:flex-end;} | |
| .align-content-baseline-lg{align-content:baseline;} | |
| .align-content-between-lg{align-content:space-between;} | |
| .align-content-around-lg{align-content:space-around;} | |
| .align-content-evenly-lg{align-content:space-evenly;} | |
| .align-self-stretch-lg{align-self:stretch;} | |
| .align-self-auto-lg{align-self:auto;} | |
| .align-self-center-lg{align-self:center;} | |
| .align-self-start-lg{align-self:start;} | |
| .align-self-end-lg{align-self:end;} | |
| .align-self-self-start-lg{align-self:self-start;} | |
| .align-self-self-end-lg{align-self:self-end;} | |
| .align-self-flex-start-lg{align-self:flex-start;} | |
| .align-self-flex-end-lg{align-self:flex-end;} | |
| .align-self-baseline-lg{align-self:baseline;} | |
| .justify-content-stretch-lg{justify-content:stretch;} | |
| .justify-content-center-lg{justify-content:center;} | |
| .justify-content-start-lg{justify-content:start;} | |
| .justify-content-end-lg{justify-content:end;} | |
| .justify-content-flex-start-lg{justify-content:flex-start;} | |
| .justify-content-flex-end-lg{justify-content:flex-end;} | |
| .justify-content-between-lg{justify-content:space-between;} | |
| .justify-content-around-lg{justify-content:space-around;} | |
| .justify-content-evenly-lg{justify-content:space-evenly;} | |
| .justify-items-stretch-lg{justify-items:stretch;} | |
| .justify-items-center-lg{justify-items:center;} | |
| .justify-items-start-lg{justify-items:start;} | |
| .justify-items-end-lg{justify-items:end;} | |
| .justify-items-flex-start-lg{justify-items:flex-start;} | |
| .justify-items-flex-end-lg{justify-items:flex-end;} | |
| .justify-items-self-start-lg{justify-items:self-start;} | |
| .justify-items-self-end-lg{justify-items:self-end;} | |
| .justify-items-baseline-lg{justify-items:baseline;} | |
| .justify-self-stretch-lg{justify-self:stretch;} | |
| .justify-self-center-lg{justify-self:center;} | |
| .justify-self-start-lg{justify-self:start;} | |
| .justify-self-end-lg{justify-self:end;} | |
| .justify-self-flex-start-lg{justify-self:flex-start;} | |
| .justify-self-flex-end-lg{justify-self:flex-end;} | |
| .justify-self-self-start-lg{justify-self:self-start;} | |
| .justify-self-self-end-lg{justify-self:self-end;} | |
| .justify-self-baseline-lg{justify-self:baseline;} | |
| .place-content-stretch-lg{place-content:stretch;} | |
| .place-content-center-lg{place-content:center;} | |
| .place-content-start-lg{place-content:start;} | |
| .place-content-end-lg{place-content:end;} | |
| .place-content-flex-start-lg{place-content:flex-start;} | |
| .place-content-flex-end-lg{place-content:flex-end;} | |
| .place-content-between-lg{place-content:space-between;} | |
| .place-content-around-lg{place-content:space-around;} | |
| .place-content-evenly-lg{place-content:space-evenly;} | |
| .place-items-stretch-lg{place-items:stretch;} | |
| .place-items-center-lg{place-items:center;} | |
| .place-items-start-lg{place-items:start;} | |
| .place-items-end-lg{place-items:end;} | |
| .place-items-self-start-lg{place-items:self-start;} | |
| .place-items-self-end-lg{place-items:self-end;} | |
| .place-items-flex-start-lg{place-items:flex-start;} | |
| .place-items-flex-end-lg{place-items:flex-end;} | |
| .place-items-baseline-lg{place-items:baseline;} | |
| .place-self-stretch-lg{place-self:stretch;} | |
| .place-self-center-lg{place-self:center;} | |
| .place-self-start-lg{place-self:start;} | |
| .place-self-end-lg{place-self:end;} | |
| .place-self-flex-start-lg{place-self:flex-start;} | |
| .place-self-flex-end-lg{place-self:flex-end;} | |
| .place-self-self-start-lg{place-self:self-start;} | |
| .place-self-self-end-lg{place-self:self-end;} | |
| .place-self-baseline-lg{place-self:baseline;} | |
| /*** Gap ***/ | |
| .gap-5-lg{gap:var(--space--5);} | |
| .gap-4-lg{gap:var(--space--4);} | |
| .gap-3-lg{gap:var(--space--3);} | |
| .gap-2-lg{gap:var(--space--2);} | |
| .gap-1-lg{gap:var(--space--1);} | |
| .gap0-lg{gap:var(--space-0);} | |
| .gap1-lg{gap:var(--space-1);} | |
| .gap2-lg{gap:var(--space-2);} | |
| .gap3-lg{gap:var(--space-3);} | |
| .gap4-lg{gap:var(--space-4);} | |
| .gap5-lg{gap:var(--space-5);} | |
| /*** Order ***/ | |
| .order-first-lg{order:-9999;} | |
| .order-last-lg{order:9999;} | |
| .order-none-lg{order:0;} | |
| .order-1-lg{order:1;} | |
| .order-2-lg{order:2;} | |
| .order-3-lg{order:3;} | |
| .order-4-lg{order:4;} | |
| .order-5-lg{order:5;} | |
| .order-6-lg{order:6;} | |
| /*** Z-Index ***/ | |
| .z-auto-lg{z-index:auto;} | |
| .z1-lg{z-index:1;} | |
| .z0-lg{z-index:0;} | |
| .z-1-lg{z-index:-1;} | |
| /*** Margin ***/ | |
| .m-none-lg{margin:0} | |
| .mb-none-lg{margin-block:0} | |
| .mbs-none-lg{margin-block-start:0} | |
| .mbe-none-lg{margin-block-end:0} | |
| .mi-none-lg{margin-inline:0} | |
| .mis-none-lg{margin-inline-start:0} | |
| .mie-none-lg{margin-inline-end:0} | |
| .m-auto-lg{margin:auto} | |
| .mb-auto-lg{margin-block:auto} | |
| .mbs-auto-lg{margin-block-start:auto} | |
| .mbe-auto-lg{margin-block-end:auto} | |
| .mi-auto-lg{margin-inline:auto} | |
| .mis-auto-lg{margin-inline-start:auto} | |
| .mie-auto-lg{margin-inline-end:auto} | |
| .m-5-lg{margin:var(--space--5);} | |
| .mb-5-lg{margin-block:var(--space--5);} | |
| .mbs-5-lg{margin-block-start:var(--space--5);} | |
| .mbe-5-lg{margin-block-end:var(--space--5);} | |
| .mi-5-lg{margin-inline:var(--space--5);} | |
| .mis-5-lg{margin-inline-start:var(--space--5);} | |
| .mie-5-lg{margin-inline-end:var(--space--5);} | |
| .m-4-lg{margin:var(--space--4);} | |
| .mb-4-lg{margin-block:var(--space--4);} | |
| .mbs-4-lg{margin-block-start:var(--space--4);} | |
| .mbe-4-lg{margin-block-end:var(--space--4);} | |
| .mi-4-lg{margin-inline:var(--space--4);} | |
| .mis-4-lg{margin-inline-start:var(--space--4);} | |
| .mie-4-lg{margin-inline-end:var(--space--4);} | |
| .m-3-lg{margin:var(--space--3);} | |
| .mb-3-lg{margin-block:var(--space--3);} | |
| .mbs-3-lg{margin-block-start:var(--space--3);} | |
| .mbe-3-lg{margin-block-end:var(--space--3);} | |
| .mi-3-lg{margin-inline:var(--space--3);} | |
| .mis-3-lg{margin-inline-start:var(--space--3);} | |
| .mie-3-lg{margin-inline-end:var(--space--3);} | |
| .m-2-lg{margin:var(--space--2);} | |
| .mb-2-lg{margin-block:var(--space--2);} | |
| .mbs-2-lg{margin-block-start:var(--space--2);} | |
| .mbe-2-lg{margin-block-end:var(--space--2);} | |
| .mi-2-lg{margin-inline:var(--space--2);} | |
| .mis-2-lg{margin-inline-start:var(--space--2);} | |
| .mie-2-lg{margin-inline-end:var(--space--2);} | |
| .m-1-lg{margin:var(--space--1);} | |
| .mb-1-lg{margin-block:var(--space--1);} | |
| .mbs-1-lg{margin-block-start:var(--space--1);} | |
| .mbe-1-lg{margin-block-end:var(--space--1);} | |
| .mi-1-lg{margin-inline:var(--space--1);} | |
| .mis-1-lg{margin-inline-start:var(--space--1);} | |
| .mie-1-lg{margin-inline-end:var(--space--1);} | |
| .m0-lg{margin:var(--space-0);} | |
| .mb0-lg{margin-block:var(--space-0);} | |
| .mbs0-lg{margin-block-start:var(--space-0);} | |
| .mbe0-lg{margin-block-end:var(--space-0);} | |
| .mi0-lg{margin-inline:var(--space-0);} | |
| .mis0-lg{margin-inline-start:var(--space-0);} | |
| .mie0-lg{margin-inline-end:var(--space-0);} | |
| .m1-lg{margin:var(--space-1);} | |
| .mb1-lg{margin-block:var(--space-1);} | |
| .mbs1-lg{margin-block-start:var(--space-1);} | |
| .mbe1-lg{margin-block-end:var(--space-1);} | |
| .mi1-lg{margin-inline:var(--space-1);} | |
| .mis1-lg{margin-inline-start:var(--space-1);} | |
| .mie1-lg{margin-inline-end:var(--space-1);} | |
| .m2-lg{margin:var(--space-2);} | |
| .mb2-lg{margin-block:var(--space-2);} | |
| .mbs2-lg{margin-block-start:var(--space-2);} | |
| .mbe2-lg{margin-block-end:var(--space-2);} | |
| .mi2-lg{margin-inline:var(--space-2);} | |
| .mis2-lg{margin-inline-start:var(--space-2);} | |
| .mie2-lg{margin-inline-end:var(--space-2);} | |
| .m3-lg{margin:var(--space-3);} | |
| .mb3-lg{margin-block:var(--space-3);} | |
| .mbs3-lg{margin-block-start:var(--space-3);} | |
| .mbe3-lg{margin-block-end:var(--space-3);} | |
| .mi3-lg{margin-inline:var(--space-3);} | |
| .mis3-lg{margin-inline-start:var(--space-3);} | |
| .mie3-lg{margin-inline-end:var(--space-3);} | |
| .m4-lg{margin:var(--space-4);} | |
| .mb4-lg{margin-block:var(--space-4);} | |
| .mbs4-lg{margin-block-start:var(--space-4);} | |
| .mbe4-lg{margin-block-end:var(--space-4);} | |
| .mi4-lg{margin-inline:var(--space-4);} | |
| .mis4-lg{margin-inline-start:var(--space-4);} | |
| .mie4-lg{margin-inline-end:var(--space-4);} | |
| .m5-lg{margin:var(--space-5);} | |
| .mb5-lg{margin-block:var(--space-5);} | |
| .mbs5-lg{margin-block-start:var(--space-5);} | |
| .mbe5-lg{margin-block-end:var(--space-5);} | |
| .mi5-lg{margin-inline:var(--space-5);} | |
| .mis5-lg{margin-inline-start:var(--space-5);} | |
| .mie5-lg{margin-inline-end:var(--space-5);} | |
| /*** Padding ***/ | |
| .p-none-lg{padding:0} | |
| .pb-none-lg{padding-block:0} | |
| .pbs-none-lg{padding-block-start:0} | |
| .pbe-none-lg{padding-block-end:0} | |
| .pi-none-lg{padding-inline:0} | |
| .pis-none-lg{padding-inline-start:0} | |
| .pie-none-lg{padding-inline-end:0} | |
| .p-5-lg{padding:var(--space--5);} | |
| .pb-5-lg{padding-block:var(--space--5);} | |
| .pbs-5-lg{padding-block-start:var(--space--5);} | |
| .pbe-5-lg{padding-block-end:var(--space--5);} | |
| .pi-5-lg{padding-inline:var(--space--5);} | |
| .pis-5-lg{padding-inline-start:var(--space--5);} | |
| .pie-5-lg{padding-inline-end:var(--space--5);} | |
| .p-4-lg{padding:var(--space--4);} | |
| .pb-4-lg{padding-block:var(--space--4);} | |
| .pbs-4-lg{padding-block-start:var(--space--4);} | |
| .pbe-4-lg{padding-block-end:var(--space--4);} | |
| .pi-4-lg{padding-inline:var(--space--4);} | |
| .pis-4-lg{padding-inline-start:var(--space--4);} | |
| .pie-4-lg{padding-inline-end:var(--space--4);} | |
| .p-3-lg{padding:var(--space--3);} | |
| .pb-3-lg{padding-block:var(--space--3);} | |
| .pbs-3-lg{padding-block-start:var(--space--3);} | |
| .pbe-3-lg{padding-block-end:var(--space--3);} | |
| .pi-3-lg{padding-inline:var(--space--3);} | |
| .pis-3-lg{padding-inline-start:var(--space--3);} | |
| .pie-3-lg{padding-inline-end:var(--space--3);} | |
| .p-2-lg{padding:var(--space--2);} | |
| .pb-2-lg{padding-block:var(--space--2);} | |
| .pbs-2-lg{padding-block-start:var(--space--2);} | |
| .pbe-2-lg{padding-block-end:var(--space--2);} | |
| .pi-2-lg{padding-inline:var(--space--2);} | |
| .pis-2-lg{padding-inline-start:var(--space--2);} | |
| .pie-2-lg{padding-inline-end:var(--space--2);} | |
| .p-1-lg{padding:var(--space--1);} | |
| .pb-1-lg{padding-block:var(--space--1);} | |
| .pbs-1-lg{padding-block-start:var(--space--1);} | |
| .pbe-1-lg{padding-block-end:var(--space--1);} | |
| .pi-1-lg{padding-inline:var(--space--1);} | |
| .pis-1-lg{padding-inline-start:var(--space--1);} | |
| .pie-1-lg{padding-inline-end:var(--space--1);} | |
| .p0-lg{padding:var(--space-0);} | |
| .pb0-lg{padding-block:var(--space-0);} | |
| .pbs0-lg{padding-block-start:var(--space-0);} | |
| .pbe0-lg{padding-block-end:var(--space-0);} | |
| .pi0-lg{padding-inline:var(--space-0);} | |
| .pis0-lg{padding-inline-start:var(--space-0);} | |
| .pie0-lg{padding-inline-end:var(--space-0);} | |
| .p1-lg{padding:var(--space-1);} | |
| .pb1-lg{padding-block:var(--space-1);} | |
| .pbs1-lg{padding-block-start:var(--space-1);} | |
| .pbe1-lg{padding-block-end:var(--space-1);} | |
| .pi1-lg{padding-inline:var(--space-1);} | |
| .pis1-lg{padding-inline-start:var(--space-1);} | |
| .pie1-lg{padding-inline-end:var(--space-1);} | |
| .p2-lg{padding:var(--space-2);} | |
| .pb2-lg{padding-block:var(--space-2);} | |
| .pbs2-lg{padding-block-start:var(--space-2);} | |
| .pbe2-lg{padding-block-end:var(--space-2);} | |
| .pi2-lg{padding-inline:var(--space-2);} | |
| .pis2-lg{padding-inline-start:var(--space-2);} | |
| .pie2-lg{padding-inline-end:var(--space-2);} | |
| .p3-lg{padding:var(--space-3);} | |
| .pb3-lg{padding-block:var(--space-3);} | |
| .pbs3-lg{padding-block-start:var(--space-3);} | |
| .pbe3-lg{padding-block-end:var(--space-3);} | |
| .pi3-lg{padding-inline:var(--space-3);} | |
| .pis3-lg{padding-inline-start:var(--space-3);} | |
| .pie3-lg{padding-inline-end:var(--space-3);} | |
| .p4-lg{padding:var(--space-4);} | |
| .pb4-lg{padding-block:var(--space-4);} | |
| .pbs4-lg{padding-block-start:var(--space-4);} | |
| .pbe4-lg{padding-block-end:var(--space-4);} | |
| .pi4-lg{padding-inline:var(--space-4);} | |
| .pis4-lg{padding-inline-start:var(--space-4);} | |
| .pie4-lg{padding-inline-end:var(--space-4);} | |
| .p5-lg{padding:var(--space-5);} | |
| .pb5-lg{padding-block:var(--space-5);} | |
| .pbs5-lg{padding-block-start:var(--space-5);} | |
| .pbe5-lg{padding-block-end:var(--space-5);} | |
| .pi5-lg{padding-inline:var(--space-5);} | |
| .pis5-lg{padding-inline-start:var(--space-5);} | |
| .pie5-lg{padding-inline-end:var(--space-5);} | |
| /*** Overflow ***/ | |
| .overflow-auto-lg{overflow:auto;} | |
| .truncate-lg, | |
| .overflow-hidden-lg{overflow:hidden;} | |
| .overflow-visible-lg{overflow:visible;} | |
| .overflow-scroll-lg{overflow:scroll;} | |
| .overflow-x-auto-lg{overflow-x:auto;} | |
| .overflow-y-auto-lg{overflow-y:auto;} | |
| .overflow-x-scroll-lg{overflow-x:scroll;} | |
| .overflow-x-hidden-lg{overflow-x:hidden;} | |
| .overflow-y-scroll-lg{overflow-y:scroll;} | |
| .overflow-y-hidden-lg{overflow-y:hidden;} | |
| .scrolling-touch-lg{-webkit-overflow-scrolling:touch;} | |
| .scrolling-auto-lg{-webkit-overflow-scrolling:auto;} | |
| /*** Visibility ***/ | |
| .invisible-lg{visibility:hidden;} | |
| .visible-lg{visibility:visible;} | |
| /*** Object Fit ***/ | |
| .object-contain-lg{object-fit:contain;} | |
| .object-cover-lg{object-fit:cover;} | |
| .object-fill-lg{object-fit:fill;} | |
| .object-none-lg{object-fit:none;} | |
| .object-scale-down-lg{object-fit:scale-down;} | |
| /*** Object Position ***/ | |
| .object-b-lg{object-position:bottom;} | |
| .object-c-lg{object-position:center;} | |
| .object-t-lg{object-position:top;} | |
| .object-r-lg{object-position:right;} | |
| .object-rt-lg{object-position:right top;} | |
| .object-rb-lg{object-position:right bottom;} | |
| .object-l-lg{object-position:left;} | |
| .object-lt-lg{object-position:left top;} | |
| .object-lb-lg{object-position:left bottom;} | |
| /*** Outline ***/ | |
| .outline-none-lg{outline:0;} | |
| /*** Opacity ***/ | |
| .opacity-0-lg{opacity:0;} | |
| .opacity-25-lg{opacity:0.25;} | |
| .opacity-50-lg{opacity:0.5;} | |
| .opacity-75-lg{opacity:0.75;} | |
| .opacity-100-lg{opacity:1.0;} | |
| /*** Cursor ***/ | |
| .cursor-auto-lg{cursor:auto;} | |
| .cursor-default-lg{cursor:default;} | |
| .cursor-pointer-lg{cursor:pointer;} | |
| .cursor-wait-lg{cursor:wait;} | |
| .cursor-text-lg{cursor:text;} | |
| .cursor-move-lg{cursor:move;} | |
| .cursor-not-allowed-lg{cursor:not-allowed;} | |
| .cursor-grab-lg{cursor:grab;} | |
| .cursor-grabbing-lg{cursor:grabbing;} | |
| /*** User Select ***/ | |
| .select-none-lg{user-select:none;} | |
| .select-text-lg{user-select:text;} | |
| .select-all-lg{user-select:all;} | |
| .select-auto-lg{user-select:auto;} | |
| /*** Debug ***/ | |
| .debug * { outline: 2px dotted var(--debug-color, rebeccapurple) } | |
| .debug *:hover { border:2px solid var(--debug-color, rebeccapurple) } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment