chore: install prettier

This commit is contained in:
Viet An
2026-05-04 15:22:27 +07:00
parent 93d29ca7d8
commit bd58e2b847
267 changed files with 22950 additions and 13581 deletions

View File

@@ -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;
}