chore: install prettier
This commit is contained in:
@@ -2,61 +2,66 @@
|
||||
|
||||
// Font size loops
|
||||
@for $i from 10 through 50 {
|
||||
.fs-#{$i} { font-size: $i + px; }
|
||||
.fsb-#{$i} { font-size: $i + px; font-weight: bold; }
|
||||
.fs-#{$i} {
|
||||
font-size: $i + px;
|
||||
}
|
||||
.fsb-#{$i} {
|
||||
font-size: $i + px;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.font-thin {
|
||||
.font-thin {
|
||||
font-weight: 100;
|
||||
}
|
||||
.font-extralight {
|
||||
.font-extralight {
|
||||
font-weight: 200;
|
||||
}
|
||||
.font-light {
|
||||
.font-light {
|
||||
font-weight: 300;
|
||||
}
|
||||
.font-normal {
|
||||
.font-normal {
|
||||
font-weight: 400;
|
||||
}
|
||||
.font-medium {
|
||||
.font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
.font-semibold {
|
||||
.font-semibold {
|
||||
font-weight: 600;
|
||||
}
|
||||
.font-bold {
|
||||
.font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
.font-extrabold {
|
||||
.font-extrabold {
|
||||
font-weight: 800;
|
||||
}
|
||||
.font-black {
|
||||
.font-black {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.rounded-xs {
|
||||
border-radius: 0.125rem;
|
||||
border-radius: 0.125rem;
|
||||
}
|
||||
.rounded-sm {
|
||||
border-radius: 0.25rem;
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
.rounded-md {
|
||||
border-radius: 0.375rem;
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
.rounded-lg {
|
||||
border-radius: 0.5rem;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
.rounded-xl {
|
||||
border-radius: 0.75rem;
|
||||
border-radius: 0.75rem;
|
||||
}
|
||||
.rounded-2xl {
|
||||
border-radius: 1rem;
|
||||
border-radius: 1rem;
|
||||
}
|
||||
.rounded-3xl {
|
||||
border-radius: 1.5rem;
|
||||
border-radius: 1.5rem;
|
||||
}
|
||||
.rounded-4xl {
|
||||
border-radius: 2rem;
|
||||
border-radius: 2rem;
|
||||
}
|
||||
.rounded-none {
|
||||
border-radius: 0;
|
||||
@@ -83,20 +88,20 @@
|
||||
|
||||
// ─── CSS custom properties ─────────────────────────────────────────────────
|
||||
:root {
|
||||
--spacing: 0.25rem;
|
||||
--container-3xs: 16rem;
|
||||
--container-2xs: 18rem;
|
||||
--container-xs: 20rem;
|
||||
--container-sm: 24rem;
|
||||
--container-md: 28rem;
|
||||
--container-lg: 32rem;
|
||||
--container-xl: 36rem;
|
||||
--container-2xl: 42rem;
|
||||
--container-3xl: 48rem;
|
||||
--container-4xl: 56rem;
|
||||
--container-5xl: 64rem;
|
||||
--container-6xl: 72rem;
|
||||
--container-7xl: 80rem;
|
||||
--spacing: 0.25rem;
|
||||
--container-3xs: 16rem;
|
||||
--container-2xs: 18rem;
|
||||
--container-xs: 20rem;
|
||||
--container-sm: 24rem;
|
||||
--container-md: 28rem;
|
||||
--container-lg: 32rem;
|
||||
--container-xl: 36rem;
|
||||
--container-2xl: 42rem;
|
||||
--container-3xl: 48rem;
|
||||
--container-4xl: 56rem;
|
||||
--container-5xl: 64rem;
|
||||
--container-6xl: 72rem;
|
||||
--container-7xl: 80rem;
|
||||
}
|
||||
|
||||
// ─── Shared mixin ──────────────────────────────────────────────────────────
|
||||
@@ -108,9 +113,16 @@
|
||||
|
||||
// ─── Class types ───────────────────────────────────────────────────────────
|
||||
$class-types: (
|
||||
"w": (width),
|
||||
"h": (height),
|
||||
"size": (width, height),
|
||||
"w": (
|
||||
width,
|
||||
),
|
||||
"h": (
|
||||
height,
|
||||
),
|
||||
"size": (
|
||||
width,
|
||||
height,
|
||||
),
|
||||
);
|
||||
|
||||
// ─── Numeric: w-0 → w-48, h-0 → h-48, size-0 → size-48 ───────────────────
|
||||
@@ -124,32 +136,110 @@ $class-types: (
|
||||
|
||||
// ─── Fractions ─────────────────────────────────────────────────────────────
|
||||
$fractions: (
|
||||
"1\\/2": (1, 2),
|
||||
"1\\/3": (1, 3),
|
||||
"2\\/3": (2, 3),
|
||||
"1\\/4": (1, 4),
|
||||
"2\\/4": (2, 4),
|
||||
"3\\/4": (3, 4),
|
||||
"1\\/5": (1, 5),
|
||||
"2\\/5": (2, 5),
|
||||
"3\\/5": (3, 5),
|
||||
"4\\/5": (4, 5),
|
||||
"1\\/6": (1, 6),
|
||||
"2\\/6": (2, 6),
|
||||
"3\\/6": (3, 6),
|
||||
"4\\/6": (4, 6),
|
||||
"5\\/6": (5, 6),
|
||||
"1\\/12": (1, 12),
|
||||
"2\\/12": (2, 12),
|
||||
"3\\/12": (3, 12),
|
||||
"4\\/12": (4, 12),
|
||||
"5\\/12": (5, 12),
|
||||
"6\\/12": (6, 12),
|
||||
"7\\/12": (7, 12),
|
||||
"8\\/12": (8, 12),
|
||||
"9\\/12": (9, 12),
|
||||
"10\\/12": (10, 12),
|
||||
"11\\/12": (11, 12),
|
||||
"1\\/2": (
|
||||
1,
|
||||
2,
|
||||
),
|
||||
"1\\/3": (
|
||||
1,
|
||||
3,
|
||||
),
|
||||
"2\\/3": (
|
||||
2,
|
||||
3,
|
||||
),
|
||||
"1\\/4": (
|
||||
1,
|
||||
4,
|
||||
),
|
||||
"2\\/4": (
|
||||
2,
|
||||
4,
|
||||
),
|
||||
"3\\/4": (
|
||||
3,
|
||||
4,
|
||||
),
|
||||
"1\\/5": (
|
||||
1,
|
||||
5,
|
||||
),
|
||||
"2\\/5": (
|
||||
2,
|
||||
5,
|
||||
),
|
||||
"3\\/5": (
|
||||
3,
|
||||
5,
|
||||
),
|
||||
"4\\/5": (
|
||||
4,
|
||||
5,
|
||||
),
|
||||
"1\\/6": (
|
||||
1,
|
||||
6,
|
||||
),
|
||||
"2\\/6": (
|
||||
2,
|
||||
6,
|
||||
),
|
||||
"3\\/6": (
|
||||
3,
|
||||
6,
|
||||
),
|
||||
"4\\/6": (
|
||||
4,
|
||||
6,
|
||||
),
|
||||
"5\\/6": (
|
||||
5,
|
||||
6,
|
||||
),
|
||||
"1\\/12": (
|
||||
1,
|
||||
12,
|
||||
),
|
||||
"2\\/12": (
|
||||
2,
|
||||
12,
|
||||
),
|
||||
"3\\/12": (
|
||||
3,
|
||||
12,
|
||||
),
|
||||
"4\\/12": (
|
||||
4,
|
||||
12,
|
||||
),
|
||||
"5\\/12": (
|
||||
5,
|
||||
12,
|
||||
),
|
||||
"6\\/12": (
|
||||
6,
|
||||
12,
|
||||
),
|
||||
"7\\/12": (
|
||||
7,
|
||||
12,
|
||||
),
|
||||
"8\\/12": (
|
||||
8,
|
||||
12,
|
||||
),
|
||||
"9\\/12": (
|
||||
9,
|
||||
12,
|
||||
),
|
||||
"10\\/12": (
|
||||
10,
|
||||
12,
|
||||
),
|
||||
"11\\/12": (
|
||||
11,
|
||||
12,
|
||||
),
|
||||
);
|
||||
|
||||
@each $prefix, $props in $class-types {
|
||||
@@ -163,13 +253,12 @@ $fractions: (
|
||||
}
|
||||
|
||||
// ─── Container sizes (w- only) ─────────────────────────────────────────────
|
||||
$containers: (
|
||||
"3xs", "2xs", "xs", "sm", "md", "lg", "xl",
|
||||
"2xl", "3xl", "4xl", "5xl", "6xl", "7xl"
|
||||
);
|
||||
$containers: ("3xs", "2xs", "xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "7xl");
|
||||
|
||||
@each $name in $containers {
|
||||
.w-#{$name} { width: var(--container-#{$name}); }
|
||||
.w-#{$name} {
|
||||
width: var(--container-#{$name});
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Shared keywords (auto, px, full, min, max, fit) ───────────────────────
|
||||
@@ -178,9 +267,9 @@ $shared-keywords: (
|
||||
"auto": auto,
|
||||
"px": 1px,
|
||||
"full": 100%,
|
||||
"min": min-content,
|
||||
"max": max-content,
|
||||
"fit": fit-content,
|
||||
"min": min-content,
|
||||
"max": max-content,
|
||||
"fit": fit-content,
|
||||
);
|
||||
|
||||
@each $prefix, $props in $class-types {
|
||||
@@ -210,5 +299,9 @@ $viewport-keywords: (
|
||||
}
|
||||
}
|
||||
|
||||
.w-screen { width: 100vw; }
|
||||
.h-screen { height: 100vh; }
|
||||
.w-screen {
|
||||
width: 100vw;
|
||||
}
|
||||
.h-screen {
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user