Created
June 9, 2023 17:53
-
-
Save Twikito/e9817c6a650db021ec1a335708cbc32a to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
This file contains 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
@function dash-join($args...) { | |
$result: null; | |
$first-add: true; | |
$glue: '-'; | |
@for $i from 1 through length($args) { | |
$e: nth($args, $i); | |
@if $e != null and $e != '' { | |
$result: if($i == 1 or $first-add == true, #{$e}, #{$result}#{$glue}#{$e}); | |
$first-add: false; | |
} | |
} | |
@return $result; | |
} | |
@function pixel-to-rem($value) { | |
@return if(type-of($value) == 'number' and unitless($value), rem($value), $value); | |
} | |
$sizings: ('0': 0, '0\\\.5': 2, '1': 4, '2': 8, '3': 12, '4': 16, '5': 20, '6': 24, '7': 28, '8': 32, '10': 40, '11': 44, '12': 48, '14': 56, 'full': 100%, 'auto': 'auto'); | |
$directions: (w: inline, h: block); | |
$boudaries: (min, '' , max); | |
$queries: ( | |
default: 'all', | |
sm: '>xsmall', | |
md: '>small', | |
lg: '>medium', | |
xl: '>large', | |
); | |
@each $breakpointname, $query in $queries { | |
@media($query) { | |
@each $direction, $property in $directions { | |
@each $boundary in $boudaries { | |
$propname: dash-join($boundary, $property, 'size'); | |
@each $sizingname, $size in $sizings { | |
$classname: #{if($breakpointname == 'default', '', $breakpointname + '\\\:')}#{dash-join($boundary, $direction, $sizingname)}; | |
.#{$classname} { | |
#{$propname}: #{pixel-to-rem($size)}; | |
} | |
} | |
$classname: #{if($breakpointname == 'default', '', $breakpointname + '\\\:')}#{dash-join($boundary, $direction, 'custom')}; | |
$value: #{if($breakpointname == 'default', '', $breakpointname + '-')}#{dash-join($boundary, $direction, 'custom')}; | |
.#{$classname} { | |
&#{&} { // Specificity fail 😒 | |
#{$propname}: var(--#{$value}); | |
} | |
} | |
} | |
} | |
} | |
} |
This file contains 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
@media (all) { | |
.min-w-0 { | |
min-inline-size: rem(0); | |
} | |
.min-w-0\.5 { | |
min-inline-size: rem(2); | |
} | |
.min-w-1 { | |
min-inline-size: rem(4); | |
} | |
.min-w-2 { | |
min-inline-size: rem(8); | |
} | |
.min-w-3 { | |
min-inline-size: rem(12); | |
} | |
.min-w-4 { | |
min-inline-size: rem(16); | |
} | |
.min-w-5 { | |
min-inline-size: rem(20); | |
} | |
.min-w-6 { | |
min-inline-size: rem(24); | |
} | |
.min-w-7 { | |
min-inline-size: rem(28); | |
} | |
.min-w-8 { | |
min-inline-size: rem(32); | |
} | |
.min-w-10 { | |
min-inline-size: rem(40); | |
} | |
.min-w-11 { | |
min-inline-size: rem(44); | |
} | |
.min-w-12 { | |
min-inline-size: rem(48); | |
} | |
.min-w-14 { | |
min-inline-size: rem(56); | |
} | |
.min-w-full { | |
min-inline-size: 100%; | |
} | |
.min-w-auto { | |
min-inline-size: auto; | |
} | |
.min-w-custom.min-w-custom { | |
min-inline-size: var(--min-w-custom); | |
} | |
.w-0 { | |
inline-size: rem(0); | |
} | |
.w-0\.5 { | |
inline-size: rem(2); | |
} | |
.w-1 { | |
inline-size: rem(4); | |
} | |
.w-2 { | |
inline-size: rem(8); | |
} | |
.w-3 { | |
inline-size: rem(12); | |
} | |
.w-4 { | |
inline-size: rem(16); | |
} | |
.w-5 { | |
inline-size: rem(20); | |
} | |
.w-6 { | |
inline-size: rem(24); | |
} | |
.w-7 { | |
inline-size: rem(28); | |
} | |
.w-8 { | |
inline-size: rem(32); | |
} | |
.w-10 { | |
inline-size: rem(40); | |
} | |
.w-11 { | |
inline-size: rem(44); | |
} | |
.w-12 { | |
inline-size: rem(48); | |
} | |
.w-14 { | |
inline-size: rem(56); | |
} | |
.w-full { | |
inline-size: 100%; | |
} | |
.w-auto { | |
inline-size: auto; | |
} | |
.w-custom.w-custom { | |
inline-size: var(--w-custom); | |
} | |
.max-w-0 { | |
max-inline-size: rem(0); | |
} | |
.max-w-0\.5 { | |
max-inline-size: rem(2); | |
} | |
.max-w-1 { | |
max-inline-size: rem(4); | |
} | |
.max-w-2 { | |
max-inline-size: rem(8); | |
} | |
.max-w-3 { | |
max-inline-size: rem(12); | |
} | |
.max-w-4 { | |
max-inline-size: rem(16); | |
} | |
.max-w-5 { | |
max-inline-size: rem(20); | |
} | |
.max-w-6 { | |
max-inline-size: rem(24); | |
} | |
.max-w-7 { | |
max-inline-size: rem(28); | |
} | |
.max-w-8 { | |
max-inline-size: rem(32); | |
} | |
.max-w-10 { | |
max-inline-size: rem(40); | |
} | |
.max-w-11 { | |
max-inline-size: rem(44); | |
} | |
.max-w-12 { | |
max-inline-size: rem(48); | |
} | |
.max-w-14 { | |
max-inline-size: rem(56); | |
} | |
.max-w-full { | |
max-inline-size: 100%; | |
} | |
.max-w-auto { | |
max-inline-size: auto; | |
} | |
.max-w-custom.max-w-custom { | |
max-inline-size: var(--max-w-custom); | |
} | |
.min-h-0 { | |
min-block-size: rem(0); | |
} | |
.min-h-0\.5 { | |
min-block-size: rem(2); | |
} | |
.min-h-1 { | |
min-block-size: rem(4); | |
} | |
.min-h-2 { | |
min-block-size: rem(8); | |
} | |
.min-h-3 { | |
min-block-size: rem(12); | |
} | |
.min-h-4 { | |
min-block-size: rem(16); | |
} | |
.min-h-5 { | |
min-block-size: rem(20); | |
} | |
.min-h-6 { | |
min-block-size: rem(24); | |
} | |
.min-h-7 { | |
min-block-size: rem(28); | |
} | |
.min-h-8 { | |
min-block-size: rem(32); | |
} | |
.min-h-10 { | |
min-block-size: rem(40); | |
} | |
.min-h-11 { | |
min-block-size: rem(44); | |
} | |
.min-h-12 { | |
min-block-size: rem(48); | |
} | |
.min-h-14 { | |
min-block-size: rem(56); | |
} | |
.min-h-full { | |
min-block-size: 100%; | |
} | |
.min-h-auto { | |
min-block-size: auto; | |
} | |
.min-h-custom.min-h-custom { | |
min-block-size: var(--min-h-custom); | |
} | |
.h-0 { | |
block-size: rem(0); | |
} | |
.h-0\.5 { | |
block-size: rem(2); | |
} | |
.h-1 { | |
block-size: rem(4); | |
} | |
.h-2 { | |
block-size: rem(8); | |
} | |
.h-3 { | |
block-size: rem(12); | |
} | |
.h-4 { | |
block-size: rem(16); | |
} | |
.h-5 { | |
block-size: rem(20); | |
} | |
.h-6 { | |
block-size: rem(24); | |
} | |
.h-7 { | |
block-size: rem(28); | |
} | |
.h-8 { | |
block-size: rem(32); | |
} | |
.h-10 { | |
block-size: rem(40); | |
} | |
.h-11 { | |
block-size: rem(44); | |
} | |
.h-12 { | |
block-size: rem(48); | |
} | |
.h-14 { | |
block-size: rem(56); | |
} | |
.h-full { | |
block-size: 100%; | |
} | |
.h-auto { | |
block-size: auto; | |
} | |
.h-custom.h-custom { | |
block-size: var(--h-custom); | |
} | |
.max-h-0 { | |
max-block-size: rem(0); | |
} | |
.max-h-0\.5 { | |
max-block-size: rem(2); | |
} | |
.max-h-1 { | |
max-block-size: rem(4); | |
} | |
.max-h-2 { | |
max-block-size: rem(8); | |
} | |
.max-h-3 { | |
max-block-size: rem(12); | |
} | |
.max-h-4 { | |
max-block-size: rem(16); | |
} | |
.max-h-5 { | |
max-block-size: rem(20); | |
} | |
.max-h-6 { | |
max-block-size: rem(24); | |
} | |
.max-h-7 { | |
max-block-size: rem(28); | |
} | |
.max-h-8 { | |
max-block-size: rem(32); | |
} | |
.max-h-10 { | |
max-block-size: rem(40); | |
} | |
.max-h-11 { | |
max-block-size: rem(44); | |
} | |
.max-h-12 { | |
max-block-size: rem(48); | |
} | |
.max-h-14 { | |
max-block-size: rem(56); | |
} | |
.max-h-full { | |
max-block-size: 100%; | |
} | |
.max-h-auto { | |
max-block-size: auto; | |
} | |
.max-h-custom.max-h-custom { | |
max-block-size: var(--max-h-custom); | |
} | |
} | |
@media (>xsmall) { | |
.sm\:min-w-0 { | |
min-inline-size: rem(0); | |
} | |
.sm\:min-w-0\.5 { | |
min-inline-size: rem(2); | |
} | |
.sm\:min-w-1 { | |
min-inline-size: rem(4); | |
} | |
.sm\:min-w-2 { | |
min-inline-size: rem(8); | |
} | |
.sm\:min-w-3 { | |
min-inline-size: rem(12); | |
} | |
.sm\:min-w-4 { | |
min-inline-size: rem(16); | |
} | |
.sm\:min-w-5 { | |
min-inline-size: rem(20); | |
} | |
.sm\:min-w-6 { | |
min-inline-size: rem(24); | |
} | |
.sm\:min-w-7 { | |
min-inline-size: rem(28); | |
} | |
.sm\:min-w-8 { | |
min-inline-size: rem(32); | |
} | |
.sm\:min-w-10 { | |
min-inline-size: rem(40); | |
} | |
.sm\:min-w-11 { | |
min-inline-size: rem(44); | |
} | |
.sm\:min-w-12 { | |
min-inline-size: rem(48); | |
} | |
.sm\:min-w-14 { | |
min-inline-size: rem(56); | |
} | |
.sm\:min-w-full { | |
min-inline-size: 100%; | |
} | |
.sm\:min-w-auto { | |
min-inline-size: auto; | |
} | |
.sm\:min-w-custom.sm\:min-w-custom { | |
min-inline-size: var(--sm-min-w-custom); | |
} | |
.sm\:w-0 { | |
inline-size: rem(0); | |
} | |
.sm\:w-0\.5 { | |
inline-size: rem(2); | |
} | |
.sm\:w-1 { | |
inline-size: rem(4); | |
} | |
.sm\:w-2 { | |
inline-size: rem(8); | |
} | |
.sm\:w-3 { | |
inline-size: rem(12); | |
} | |
.sm\:w-4 { | |
inline-size: rem(16); | |
} | |
.sm\:w-5 { | |
inline-size: rem(20); | |
} | |
.sm\:w-6 { | |
inline-size: rem(24); | |
} | |
.sm\:w-7 { | |
inline-size: rem(28); | |
} | |
.sm\:w-8 { | |
inline-size: rem(32); | |
} | |
.sm\:w-10 { | |
inline-size: rem(40); | |
} | |
.sm\:w-11 { | |
inline-size: rem(44); | |
} | |
.sm\:w-12 { | |
inline-size: rem(48); | |
} | |
.sm\:w-14 { | |
inline-size: rem(56); | |
} | |
.sm\:w-full { | |
inline-size: 100%; | |
} | |
.sm\:w-auto { | |
inline-size: auto; | |
} | |
.sm\:w-custom.sm\:w-custom { | |
inline-size: var(--sm-w-custom); | |
} | |
.sm\:max-w-0 { | |
max-inline-size: rem(0); | |
} | |
.sm\:max-w-0\.5 { | |
max-inline-size: rem(2); | |
} | |
.sm\:max-w-1 { | |
max-inline-size: rem(4); | |
} | |
.sm\:max-w-2 { | |
max-inline-size: rem(8); | |
} | |
.sm\:max-w-3 { | |
max-inline-size: rem(12); | |
} | |
.sm\:max-w-4 { | |
max-inline-size: rem(16); | |
} | |
.sm\:max-w-5 { | |
max-inline-size: rem(20); | |
} | |
.sm\:max-w-6 { | |
max-inline-size: rem(24); | |
} | |
.sm\:max-w-7 { | |
max-inline-size: rem(28); | |
} | |
.sm\:max-w-8 { | |
max-inline-size: rem(32); | |
} | |
.sm\:max-w-10 { | |
max-inline-size: rem(40); | |
} | |
.sm\:max-w-11 { | |
max-inline-size: rem(44); | |
} | |
.sm\:max-w-12 { | |
max-inline-size: rem(48); | |
} | |
.sm\:max-w-14 { | |
max-inline-size: rem(56); | |
} | |
.sm\:max-w-full { | |
max-inline-size: 100%; | |
} | |
.sm\:max-w-auto { | |
max-inline-size: auto; | |
} | |
.sm\:max-w-custom.sm\:max-w-custom { | |
max-inline-size: var(--sm-max-w-custom); | |
} | |
.sm\:min-h-0 { | |
min-block-size: rem(0); | |
} | |
.sm\:min-h-0\.5 { | |
min-block-size: rem(2); | |
} | |
.sm\:min-h-1 { | |
min-block-size: rem(4); | |
} | |
.sm\:min-h-2 { | |
min-block-size: rem(8); | |
} | |
.sm\:min-h-3 { | |
min-block-size: rem(12); | |
} | |
.sm\:min-h-4 { | |
min-block-size: rem(16); | |
} | |
.sm\:min-h-5 { | |
min-block-size: rem(20); | |
} | |
.sm\:min-h-6 { | |
min-block-size: rem(24); | |
} | |
.sm\:min-h-7 { | |
min-block-size: rem(28); | |
} | |
.sm\:min-h-8 { | |
min-block-size: rem(32); | |
} | |
.sm\:min-h-10 { | |
min-block-size: rem(40); | |
} | |
.sm\:min-h-11 { | |
min-block-size: rem(44); | |
} | |
.sm\:min-h-12 { | |
min-block-size: rem(48); | |
} | |
.sm\:min-h-14 { | |
min-block-size: rem(56); | |
} | |
.sm\:min-h-full { | |
min-block-size: 100%; | |
} | |
.sm\:min-h-auto { | |
min-block-size: auto; | |
} | |
.sm\:min-h-custom.sm\:min-h-custom { | |
min-block-size: var(--sm-min-h-custom); | |
} | |
.sm\:h-0 { | |
block-size: rem(0); | |
} | |
.sm\:h-0\.5 { | |
block-size: rem(2); | |
} | |
.sm\:h-1 { | |
block-size: rem(4); | |
} | |
.sm\:h-2 { | |
block-size: rem(8); | |
} | |
.sm\:h-3 { | |
block-size: rem(12); | |
} | |
.sm\:h-4 { | |
block-size: rem(16); | |
} | |
.sm\:h-5 { | |
block-size: rem(20); | |
} | |
.sm\:h-6 { | |
block-size: rem(24); | |
} | |
.sm\:h-7 { | |
block-size: rem(28); | |
} | |
.sm\:h-8 { | |
block-size: rem(32); | |
} | |
.sm\:h-10 { | |
block-size: rem(40); | |
} | |
.sm\:h-11 { | |
block-size: rem(44); | |
} | |
.sm\:h-12 { | |
block-size: rem(48); | |
} | |
.sm\:h-14 { | |
block-size: rem(56); | |
} | |
.sm\:h-full { | |
block-size: 100%; | |
} | |
.sm\:h-auto { | |
block-size: auto; | |
} | |
.sm\:h-custom.sm\:h-custom { | |
block-size: var(--sm-h-custom); | |
} | |
.sm\:max-h-0 { | |
max-block-size: rem(0); | |
} | |
.sm\:max-h-0\.5 { | |
max-block-size: rem(2); | |
} | |
.sm\:max-h-1 { | |
max-block-size: rem(4); | |
} | |
.sm\:max-h-2 { | |
max-block-size: rem(8); | |
} | |
.sm\:max-h-3 { | |
max-block-size: rem(12); | |
} | |
.sm\:max-h-4 { | |
max-block-size: rem(16); | |
} | |
.sm\:max-h-5 { | |
max-block-size: rem(20); | |
} | |
.sm\:max-h-6 { | |
max-block-size: rem(24); | |
} | |
.sm\:max-h-7 { | |
max-block-size: rem(28); | |
} | |
.sm\:max-h-8 { | |
max-block-size: rem(32); | |
} | |
.sm\:max-h-10 { | |
max-block-size: rem(40); | |
} | |
.sm\:max-h-11 { | |
max-block-size: rem(44); | |
} | |
.sm\:max-h-12 { | |
max-block-size: rem(48); | |
} | |
.sm\:max-h-14 { | |
max-block-size: rem(56); | |
} | |
.sm\:max-h-full { | |
max-block-size: 100%; | |
} | |
.sm\:max-h-auto { | |
max-block-size: auto; | |
} | |
.sm\:max-h-custom.sm\:max-h-custom { | |
max-block-size: var(--sm-max-h-custom); | |
} | |
} | |
@media (>small) { | |
.md\:min-w-0 { | |
min-inline-size: rem(0); | |
} | |
.md\:min-w-0\.5 { | |
min-inline-size: rem(2); | |
} | |
.md\:min-w-1 { | |
min-inline-size: rem(4); | |
} | |
.md\:min-w-2 { | |
min-inline-size: rem(8); | |
} | |
.md\:min-w-3 { | |
min-inline-size: rem(12); | |
} | |
.md\:min-w-4 { | |
min-inline-size: rem(16); | |
} | |
.md\:min-w-5 { | |
min-inline-size: rem(20); | |
} | |
.md\:min-w-6 { | |
min-inline-size: rem(24); | |
} | |
.md\:min-w-7 { | |
min-inline-size: rem(28); | |
} | |
.md\:min-w-8 { | |
min-inline-size: rem(32); | |
} | |
.md\:min-w-10 { | |
min-inline-size: rem(40); | |
} | |
.md\:min-w-11 { | |
min-inline-size: rem(44); | |
} | |
.md\:min-w-12 { | |
min-inline-size: rem(48); | |
} | |
.md\:min-w-14 { | |
min-inline-size: rem(56); | |
} | |
.md\:min-w-full { | |
min-inline-size: 100%; | |
} | |
.md\:min-w-auto { | |
min-inline-size: auto; | |
} | |
.md\:min-w-custom.md\:min-w-custom { | |
min-inline-size: var(--md-min-w-custom); | |
} | |
.md\:w-0 { | |
inline-size: rem(0); | |
} | |
.md\:w-0\.5 { | |
inline-size: rem(2); | |
} | |
.md\:w-1 { | |
inline-size: rem(4); | |
} | |
.md\:w-2 { | |
inline-size: rem(8); | |
} | |
.md\:w-3 { | |
inline-size: rem(12); | |
} | |
.md\:w-4 { | |
inline-size: rem(16); | |
} | |
.md\:w-5 { | |
inline-size: rem(20); | |
} | |
.md\:w-6 { | |
inline-size: rem(24); | |
} | |
.md\:w-7 { | |
inline-size: rem(28); | |
} | |
.md\:w-8 { | |
inline-size: rem(32); | |
} | |
.md\:w-10 { | |
inline-size: rem(40); | |
} | |
.md\:w-11 { | |
inline-size: rem(44); | |
} | |
.md\:w-12 { | |
inline-size: rem(48); | |
} | |
.md\:w-14 { | |
inline-size: rem(56); | |
} | |
.md\:w-full { | |
inline-size: 100%; | |
} | |
.md\:w-auto { | |
inline-size: auto; | |
} | |
.md\:w-custom.md\:w-custom { | |
inline-size: var(--md-w-custom); | |
} | |
.md\:max-w-0 { | |
max-inline-size: rem(0); | |
} | |
.md\:max-w-0\.5 { | |
max-inline-size: rem(2); | |
} | |
.md\:max-w-1 { | |
max-inline-size: rem(4); | |
} | |
.md\:max-w-2 { | |
max-inline-size: rem(8); | |
} | |
.md\:max-w-3 { | |
max-inline-size: rem(12); | |
} | |
.md\:max-w-4 { | |
max-inline-size: rem(16); | |
} | |
.md\:max-w-5 { | |
max-inline-size: rem(20); | |
} | |
.md\:max-w-6 { | |
max-inline-size: rem(24); | |
} | |
.md\:max-w-7 { | |
max-inline-size: rem(28); | |
} | |
.md\:max-w-8 { | |
max-inline-size: rem(32); | |
} | |
.md\:max-w-10 { | |
max-inline-size: rem(40); | |
} | |
.md\:max-w-11 { | |
max-inline-size: rem(44); | |
} | |
.md\:max-w-12 { | |
max-inline-size: rem(48); | |
} | |
.md\:max-w-14 { | |
max-inline-size: rem(56); | |
} | |
.md\:max-w-full { | |
max-inline-size: 100%; | |
} | |
.md\:max-w-auto { | |
max-inline-size: auto; | |
} | |
.md\:max-w-custom.md\:max-w-custom { | |
max-inline-size: var(--md-max-w-custom); | |
} | |
.md\:min-h-0 { | |
min-block-size: rem(0); | |
} | |
.md\:min-h-0\.5 { | |
min-block-size: rem(2); | |
} | |
.md\:min-h-1 { | |
min-block-size: rem(4); | |
} | |
.md\:min-h-2 { | |
min-block-size: rem(8); | |
} | |
.md\:min-h-3 { | |
min-block-size: rem(12); | |
} | |
.md\:min-h-4 { | |
min-block-size: rem(16); | |
} | |
.md\:min-h-5 { | |
min-block-size: rem(20); | |
} | |
.md\:min-h-6 { | |
min-block-size: rem(24); | |
} | |
.md\:min-h-7 { | |
min-block-size: rem(28); | |
} | |
.md\:min-h-8 { | |
min-block-size: rem(32); | |
} | |
.md\:min-h-10 { | |
min-block-size: rem(40); | |
} | |
.md\:min-h-11 { | |
min-block-size: rem(44); | |
} | |
.md\:min-h-12 { | |
min-block-size: rem(48); | |
} | |
.md\:min-h-14 { | |
min-block-size: rem(56); | |
} | |
.md\:min-h-full { | |
min-block-size: 100%; | |
} | |
.md\:min-h-auto { | |
min-block-size: auto; | |
} | |
.md\:min-h-custom.md\:min-h-custom { | |
min-block-size: var(--md-min-h-custom); | |
} | |
.md\:h-0 { | |
block-size: rem(0); | |
} | |
.md\:h-0\.5 { | |
block-size: rem(2); | |
} | |
.md\:h-1 { | |
block-size: rem(4); | |
} | |
.md\:h-2 { | |
block-size: rem(8); | |
} | |
.md\:h-3 { | |
block-size: rem(12); | |
} | |
.md\:h-4 { | |
block-size: rem(16); | |
} | |
.md\:h-5 { | |
block-size: rem(20); | |
} | |
.md\:h-6 { | |
block-size: rem(24); | |
} | |
.md\:h-7 { | |
block-size: rem(28); | |
} | |
.md\:h-8 { | |
block-size: rem(32); | |
} | |
.md\:h-10 { | |
block-size: rem(40); | |
} | |
.md\:h-11 { | |
block-size: rem(44); | |
} | |
.md\:h-12 { | |
block-size: rem(48); | |
} | |
.md\:h-14 { | |
block-size: rem(56); | |
} | |
.md\:h-full { | |
block-size: 100%; | |
} | |
.md\:h-auto { | |
block-size: auto; | |
} | |
.md\:h-custom.md\:h-custom { | |
block-size: var(--md-h-custom); | |
} | |
.md\:max-h-0 { | |
max-block-size: rem(0); | |
} | |
.md\:max-h-0\.5 { | |
max-block-size: rem(2); | |
} | |
.md\:max-h-1 { | |
max-block-size: rem(4); | |
} | |
.md\:max-h-2 { | |
max-block-size: rem(8); | |
} | |
.md\:max-h-3 { | |
max-block-size: rem(12); | |
} | |
.md\:max-h-4 { | |
max-block-size: rem(16); | |
} | |
.md\:max-h-5 { | |
max-block-size: rem(20); | |
} | |
.md\:max-h-6 { | |
max-block-size: rem(24); | |
} | |
.md\:max-h-7 { | |
max-block-size: rem(28); | |
} | |
.md\:max-h-8 { | |
max-block-size: rem(32); | |
} | |
.md\:max-h-10 { | |
max-block-size: rem(40); | |
} | |
.md\:max-h-11 { | |
max-block-size: rem(44); | |
} | |
.md\:max-h-12 { | |
max-block-size: rem(48); | |
} | |
.md\:max-h-14 { | |
max-block-size: rem(56); | |
} | |
.md\:max-h-full { | |
max-block-size: 100%; | |
} | |
.md\:max-h-auto { | |
max-block-size: auto; | |
} | |
.md\:max-h-custom.md\:max-h-custom { | |
max-block-size: var(--md-max-h-custom); | |
} | |
} | |
@media (>medium) { | |
.lg\:min-w-0 { | |
min-inline-size: rem(0); | |
} | |
.lg\:min-w-0\.5 { | |
min-inline-size: rem(2); | |
} | |
.lg\:min-w-1 { | |
min-inline-size: rem(4); | |
} | |
.lg\:min-w-2 { | |
min-inline-size: rem(8); | |
} | |
.lg\:min-w-3 { | |
min-inline-size: rem(12); | |
} | |
.lg\:min-w-4 { | |
min-inline-size: rem(16); | |
} | |
.lg\:min-w-5 { | |
min-inline-size: rem(20); | |
} | |
.lg\:min-w-6 { | |
min-inline-size: rem(24); | |
} | |
.lg\:min-w-7 { | |
min-inline-size: rem(28); | |
} | |
.lg\:min-w-8 { | |
min-inline-size: rem(32); | |
} | |
.lg\:min-w-10 { | |
min-inline-size: rem(40); | |
} | |
.lg\:min-w-11 { | |
min-inline-size: rem(44); | |
} | |
.lg\:min-w-12 { | |
min-inline-size: rem(48); | |
} | |
.lg\:min-w-14 { | |
min-inline-size: rem(56); | |
} | |
.lg\:min-w-full { | |
min-inline-size: 100%; | |
} | |
.lg\:min-w-auto { | |
min-inline-size: auto; | |
} | |
.lg\:min-w-custom.lg\:min-w-custom { | |
min-inline-size: var(--lg-min-w-custom); | |
} | |
.lg\:w-0 { | |
inline-size: rem(0); | |
} | |
.lg\:w-0\.5 { | |
inline-size: rem(2); | |
} | |
.lg\:w-1 { | |
inline-size: rem(4); | |
} | |
.lg\:w-2 { | |
inline-size: rem(8); | |
} | |
.lg\:w-3 { | |
inline-size: rem(12); | |
} | |
.lg\:w-4 { | |
inline-size: rem(16); | |
} | |
.lg\:w-5 { | |
inline-size: rem(20); | |
} | |
.lg\:w-6 { | |
inline-size: rem(24); | |
} | |
.lg\:w-7 { | |
inline-size: rem(28); | |
} | |
.lg\:w-8 { | |
inline-size: rem(32); | |
} | |
.lg\:w-10 { | |
inline-size: rem(40); | |
} | |
.lg\:w-11 { | |
inline-size: rem(44); | |
} | |
.lg\:w-12 { | |
inline-size: rem(48); | |
} | |
.lg\:w-14 { | |
inline-size: rem(56); | |
} | |
.lg\:w-full { | |
inline-size: 100%; | |
} | |
.lg\:w-auto { | |
inline-size: auto; | |
} | |
.lg\:w-custom.lg\:w-custom { | |
inline-size: var(--lg-w-custom); | |
} | |
.lg\:max-w-0 { | |
max-inline-size: rem(0); | |
} | |
.lg\:max-w-0\.5 { | |
max-inline-size: rem(2); | |
} | |
.lg\:max-w-1 { | |
max-inline-size: rem(4); | |
} | |
.lg\:max-w-2 { | |
max-inline-size: rem(8); | |
} | |
.lg\:max-w-3 { | |
max-inline-size: rem(12); | |
} | |
.lg\:max-w-4 { | |
max-inline-size: rem(16); | |
} | |
.lg\:max-w-5 { | |
max-inline-size: rem(20); | |
} | |
.lg\:max-w-6 { | |
max-inline-size: rem(24); | |
} | |
.lg\:max-w-7 { | |
max-inline-size: rem(28); | |
} | |
.lg\:max-w-8 { | |
max-inline-size: rem(32); | |
} | |
.lg\:max-w-10 { | |
max-inline-size: rem(40); | |
} | |
.lg\:max-w-11 { | |
max-inline-size: rem(44); | |
} | |
.lg\:max-w-12 { | |
max-inline-size: rem(48); | |
} | |
.lg\:max-w-14 { | |
max-inline-size: rem(56); | |
} | |
.lg\:max-w-full { | |
max-inline-size: 100%; | |
} | |
.lg\:max-w-auto { | |
max-inline-size: auto; | |
} | |
.lg\:max-w-custom.lg\:max-w-custom { | |
max-inline-size: var(--lg-max-w-custom); | |
} | |
.lg\:min-h-0 { | |
min-block-size: rem(0); | |
} | |
.lg\:min-h-0\.5 { | |
min-block-size: rem(2); | |
} | |
.lg\:min-h-1 { | |
min-block-size: rem(4); | |
} | |
.lg\:min-h-2 { | |
min-block-size: rem(8); | |
} | |
.lg\:min-h-3 { | |
min-block-size: rem(12); | |
} | |
.lg\:min-h-4 { | |
min-block-size: rem(16); | |
} | |
.lg\:min-h-5 { | |
min-block-size: rem(20); | |
} | |
.lg\:min-h-6 { | |
min-block-size: rem(24); | |
} | |
.lg\:min-h-7 { | |
min-block-size: rem(28); | |
} | |
.lg\:min-h-8 { | |
min-block-size: rem(32); | |
} | |
.lg\:min-h-10 { | |
min-block-size: rem(40); | |
} | |
.lg\:min-h-11 { | |
min-block-size: rem(44); | |
} | |
.lg\:min-h-12 { | |
min-block-size: rem(48); | |
} | |
.lg\:min-h-14 { | |
min-block-size: rem(56); | |
} | |
.lg\:min-h-full { | |
min-block-size: 100%; | |
} | |
.lg\:min-h-auto { | |
min-block-size: auto; | |
} | |
.lg\:min-h-custom.lg\:min-h-custom { | |
min-block-size: var(--lg-min-h-custom); | |
} | |
.lg\:h-0 { | |
block-size: rem(0); | |
} | |
.lg\:h-0\.5 { | |
block-size: rem(2); | |
} | |
.lg\:h-1 { | |
block-size: rem(4); | |
} | |
.lg\:h-2 { | |
block-size: rem(8); | |
} | |
.lg\:h-3 { | |
block-size: rem(12); | |
} | |
.lg\:h-4 { | |
block-size: rem(16); | |
} | |
.lg\:h-5 { | |
block-size: rem(20); | |
} | |
.lg\:h-6 { | |
block-size: rem(24); | |
} | |
.lg\:h-7 { | |
block-size: rem(28); | |
} | |
.lg\:h-8 { | |
block-size: rem(32); | |
} | |
.lg\:h-10 { | |
block-size: rem(40); | |
} | |
.lg\:h-11 { | |
block-size: rem(44); | |
} | |
.lg\:h-12 { | |
block-size: rem(48); | |
} | |
.lg\:h-14 { | |
block-size: rem(56); | |
} | |
.lg\:h-full { | |
block-size: 100%; | |
} | |
.lg\:h-auto { | |
block-size: auto; | |
} | |
.lg\:h-custom.lg\:h-custom { | |
block-size: var(--lg-h-custom); | |
} | |
.lg\:max-h-0 { | |
max-block-size: rem(0); | |
} | |
.lg\:max-h-0\.5 { | |
max-block-size: rem(2); | |
} | |
.lg\:max-h-1 { | |
max-block-size: rem(4); | |
} | |
.lg\:max-h-2 { | |
max-block-size: rem(8); | |
} | |
.lg\:max-h-3 { | |
max-block-size: rem(12); | |
} | |
.lg\:max-h-4 { | |
max-block-size: rem(16); | |
} | |
.lg\:max-h-5 { | |
max-block-size: rem(20); | |
} | |
.lg\:max-h-6 { | |
max-block-size: rem(24); | |
} | |
.lg\:max-h-7 { | |
max-block-size: rem(28); | |
} | |
.lg\:max-h-8 { | |
max-block-size: rem(32); | |
} | |
.lg\:max-h-10 { | |
max-block-size: rem(40); | |
} | |
.lg\:max-h-11 { | |
max-block-size: rem(44); | |
} | |
.lg\:max-h-12 { | |
max-block-size: rem(48); | |
} | |
.lg\:max-h-14 { | |
max-block-size: rem(56); | |
} | |
.lg\:max-h-full { | |
max-block-size: 100%; | |
} | |
.lg\:max-h-auto { | |
max-block-size: auto; | |
} | |
.lg\:max-h-custom.lg\:max-h-custom { | |
max-block-size: var(--lg-max-h-custom); | |
} | |
} | |
@media (>large) { | |
.xl\:min-w-0 { | |
min-inline-size: rem(0); | |
} | |
.xl\:min-w-0\.5 { | |
min-inline-size: rem(2); | |
} | |
.xl\:min-w-1 { | |
min-inline-size: rem(4); | |
} | |
.xl\:min-w-2 { | |
min-inline-size: rem(8); | |
} | |
.xl\:min-w-3 { | |
min-inline-size: rem(12); | |
} | |
.xl\:min-w-4 { | |
min-inline-size: rem(16); | |
} | |
.xl\:min-w-5 { | |
min-inline-size: rem(20); | |
} | |
.xl\:min-w-6 { | |
min-inline-size: rem(24); | |
} | |
.xl\:min-w-7 { | |
min-inline-size: rem(28); | |
} | |
.xl\:min-w-8 { | |
min-inline-size: rem(32); | |
} | |
.xl\:min-w-10 { | |
min-inline-size: rem(40); | |
} | |
.xl\:min-w-11 { | |
min-inline-size: rem(44); | |
} | |
.xl\:min-w-12 { | |
min-inline-size: rem(48); | |
} | |
.xl\:min-w-14 { | |
min-inline-size: rem(56); | |
} | |
.xl\:min-w-full { | |
min-inline-size: 100%; | |
} | |
.xl\:min-w-auto { | |
min-inline-size: auto; | |
} | |
.xl\:min-w-custom.xl\:min-w-custom { | |
min-inline-size: var(--xl-min-w-custom); | |
} | |
.xl\:w-0 { | |
inline-size: rem(0); | |
} | |
.xl\:w-0\.5 { | |
inline-size: rem(2); | |
} | |
.xl\:w-1 { | |
inline-size: rem(4); | |
} | |
.xl\:w-2 { | |
inline-size: rem(8); | |
} | |
.xl\:w-3 { | |
inline-size: rem(12); | |
} | |
.xl\:w-4 { | |
inline-size: rem(16); | |
} | |
.xl\:w-5 { | |
inline-size: rem(20); | |
} | |
.xl\:w-6 { | |
inline-size: rem(24); | |
} | |
.xl\:w-7 { | |
inline-size: rem(28); | |
} | |
.xl\:w-8 { | |
inline-size: rem(32); | |
} | |
.xl\:w-10 { | |
inline-size: rem(40); | |
} | |
.xl\:w-11 { | |
inline-size: rem(44); | |
} | |
.xl\:w-12 { | |
inline-size: rem(48); | |
} | |
.xl\:w-14 { | |
inline-size: rem(56); | |
} | |
.xl\:w-full { | |
inline-size: 100%; | |
} | |
.xl\:w-auto { | |
inline-size: auto; | |
} | |
.xl\:w-custom.xl\:w-custom { | |
inline-size: var(--xl-w-custom); | |
} | |
.xl\:max-w-0 { | |
max-inline-size: rem(0); | |
} | |
.xl\:max-w-0\.5 { | |
max-inline-size: rem(2); | |
} | |
.xl\:max-w-1 { | |
max-inline-size: rem(4); | |
} | |
.xl\:max-w-2 { | |
max-inline-size: rem(8); | |
} | |
.xl\:max-w-3 { | |
max-inline-size: rem(12); | |
} | |
.xl\:max-w-4 { | |
max-inline-size: rem(16); | |
} | |
.xl\:max-w-5 { | |
max-inline-size: rem(20); | |
} | |
.xl\:max-w-6 { | |
max-inline-size: rem(24); | |
} | |
.xl\:max-w-7 { | |
max-inline-size: rem(28); | |
} | |
.xl\:max-w-8 { | |
max-inline-size: rem(32); | |
} | |
.xl\:max-w-10 { | |
max-inline-size: rem(40); | |
} | |
.xl\:max-w-11 { | |
max-inline-size: rem(44); | |
} | |
.xl\:max-w-12 { | |
max-inline-size: rem(48); | |
} | |
.xl\:max-w-14 { | |
max-inline-size: rem(56); | |
} | |
.xl\:max-w-full { | |
max-inline-size: 100%; | |
} | |
.xl\:max-w-auto { | |
max-inline-size: auto; | |
} | |
.xl\:max-w-custom.xl\:max-w-custom { | |
max-inline-size: var(--xl-max-w-custom); | |
} | |
.xl\:min-h-0 { | |
min-block-size: rem(0); | |
} | |
.xl\:min-h-0\.5 { | |
min-block-size: rem(2); | |
} | |
.xl\:min-h-1 { | |
min-block-size: rem(4); | |
} | |
.xl\:min-h-2 { | |
min-block-size: rem(8); | |
} | |
.xl\:min-h-3 { | |
min-block-size: rem(12); | |
} | |
.xl\:min-h-4 { | |
min-block-size: rem(16); | |
} | |
.xl\:min-h-5 { | |
min-block-size: rem(20); | |
} | |
.xl\:min-h-6 { | |
min-block-size: rem(24); | |
} | |
.xl\:min-h-7 { | |
min-block-size: rem(28); | |
} | |
.xl\:min-h-8 { | |
min-block-size: rem(32); | |
} | |
.xl\:min-h-10 { | |
min-block-size: rem(40); | |
} | |
.xl\:min-h-11 { | |
min-block-size: rem(44); | |
} | |
.xl\:min-h-12 { | |
min-block-size: rem(48); | |
} | |
.xl\:min-h-14 { | |
min-block-size: rem(56); | |
} | |
.xl\:min-h-full { | |
min-block-size: 100%; | |
} | |
.xl\:min-h-auto { | |
min-block-size: auto; | |
} | |
.xl\:min-h-custom.xl\:min-h-custom { | |
min-block-size: var(--xl-min-h-custom); | |
} | |
.xl\:h-0 { | |
block-size: rem(0); | |
} | |
.xl\:h-0\.5 { | |
block-size: rem(2); | |
} | |
.xl\:h-1 { | |
block-size: rem(4); | |
} | |
.xl\:h-2 { | |
block-size: rem(8); | |
} | |
.xl\:h-3 { | |
block-size: rem(12); | |
} | |
.xl\:h-4 { | |
block-size: rem(16); | |
} | |
.xl\:h-5 { | |
block-size: rem(20); | |
} | |
.xl\:h-6 { | |
block-size: rem(24); | |
} | |
.xl\:h-7 { | |
block-size: rem(28); | |
} | |
.xl\:h-8 { | |
block-size: rem(32); | |
} | |
.xl\:h-10 { | |
block-size: rem(40); | |
} | |
.xl\:h-11 { | |
block-size: rem(44); | |
} | |
.xl\:h-12 { | |
block-size: rem(48); | |
} | |
.xl\:h-14 { | |
block-size: rem(56); | |
} | |
.xl\:h-full { | |
block-size: 100%; | |
} | |
.xl\:h-auto { | |
block-size: auto; | |
} | |
.xl\:h-custom.xl\:h-custom { | |
block-size: var(--xl-h-custom); | |
} | |
.xl\:max-h-0 { | |
max-block-size: rem(0); | |
} | |
.xl\:max-h-0\.5 { | |
max-block-size: rem(2); | |
} | |
.xl\:max-h-1 { | |
max-block-size: rem(4); | |
} | |
.xl\:max-h-2 { | |
max-block-size: rem(8); | |
} | |
.xl\:max-h-3 { | |
max-block-size: rem(12); | |
} | |
.xl\:max-h-4 { | |
max-block-size: rem(16); | |
} | |
.xl\:max-h-5 { | |
max-block-size: rem(20); | |
} | |
.xl\:max-h-6 { | |
max-block-size: rem(24); | |
} | |
.xl\:max-h-7 { | |
max-block-size: rem(28); | |
} | |
.xl\:max-h-8 { | |
max-block-size: rem(32); | |
} | |
.xl\:max-h-10 { | |
max-block-size: rem(40); | |
} | |
.xl\:max-h-11 { | |
max-block-size: rem(44); | |
} | |
.xl\:max-h-12 { | |
max-block-size: rem(48); | |
} | |
.xl\:max-h-14 { | |
max-block-size: rem(56); | |
} | |
.xl\:max-h-full { | |
max-block-size: 100%; | |
} | |
.xl\:max-h-auto { | |
max-block-size: auto; | |
} | |
.xl\:max-h-custom.xl\:max-h-custom { | |
max-block-size: var(--xl-max-h-custom); | |
} | |
} |
This file contains 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
{ | |
"sass": { | |
"compiler": "dart-sass/1.32.12", | |
"extensions": {}, | |
"syntax": "SCSS", | |
"outputStyle": "expanded" | |
}, | |
"autoprefixer": false | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment