start: redesign
This commit is contained in:
@@ -3,103 +3,137 @@
|
||||
@tailwind utilities;
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Thin.ttf") format("truetype");
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-ExtraLight.ttf") format("truetype");
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Light.ttf") format("truetype");
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Regular.ttf") format("truetype");
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Medium.ttf") format("truetype");
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-SemiBold.ttf") format("truetype");
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Bold.ttf") format("truetype");
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-ExtraBold.ttf") format("truetype");
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Poppins";
|
||||
src: url("/fonts/Poppins-Black.ttf") format("truetype");
|
||||
font-weight: 900;
|
||||
font-family: "Fredoka";
|
||||
src: url("/fonts/fredoka-variable.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@layer base {
|
||||
:root {
|
||||
--background: 338 28% 98%;
|
||||
--foreground: 338 5% 10%;
|
||||
--card: 338 28% 98%;
|
||||
--card-foreground: 338 5% 15%;
|
||||
--popover: 338 28% 98%;
|
||||
--popover-foreground: 338 95% 10%;
|
||||
--primary: 338 63% 55.5%;
|
||||
--background: 24 33.3333% 97.0588%;
|
||||
--foreground: 0 0% 10.1961%;
|
||||
--card: 24 33.3333% 97.0588%;
|
||||
--card-foreground: 0 0% 10.1961%;
|
||||
--popover: 24 33.3333% 97.0588%;
|
||||
--popover-foreground: 0 0% 10.1961%;
|
||||
--primary: 0 55.7789% 39.0196%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 338 28% 90%;
|
||||
--secondary-foreground: 0 0% 0%;
|
||||
--muted: 300 28% 95%;
|
||||
--muted-foreground: 338 5% 40%;
|
||||
--accent: 300 28% 90%;
|
||||
--accent-foreground: 338 5% 15%;
|
||||
--destructive: 0 50% 50%;
|
||||
--destructive-foreground: 338 5% 98%;
|
||||
--border: 338 28% 82%;
|
||||
--input: 338 28% 50%;
|
||||
--ring: 338 63% 55.5%;
|
||||
--radius: 0.75rem;
|
||||
--secondary: 43.0769 90.6977% 91.5686%;
|
||||
--secondary-foreground: 39.8438 100% 25.098%;
|
||||
--muted: 22.5 21.0526% 92.549%;
|
||||
--muted-foreground: 33.3333 5.4545% 32.3529%;
|
||||
--accent: 48 96.4912% 88.8235%;
|
||||
--accent-foreground: 0 62.8205% 30.5882%;
|
||||
--destructive: 0 70% 35.2941%;
|
||||
--destructive-foreground: 0 0% 100%;
|
||||
--border: 37.7143 63.6364% 89.2157%;
|
||||
--input: 37.7143 63.6364% 89.2157%;
|
||||
--ring: 0 55.7789% 39.0196%;
|
||||
--chart-1: 0 73.7089% 41.7647%;
|
||||
--chart-2: 0 55.7789% 39.0196%;
|
||||
--chart-3: 0 62.8205% 30.5882%;
|
||||
--chart-4: 25.9649 90.4762% 37.0588%;
|
||||
--chart-5: 22.7273 82.5% 31.3725%;
|
||||
--sidebar: 22.5 21.0526% 92.549%;
|
||||
--sidebar-foreground: 0 0% 10.1961%;
|
||||
--sidebar-primary: 0 55.7789% 39.0196%;
|
||||
--sidebar-primary-foreground: 0 0% 100%;
|
||||
--sidebar-accent: 48 96.4912% 88.8235%;
|
||||
--sidebar-accent-foreground: 0 62.8205% 30.5882%;
|
||||
--sidebar-border: 37.7143 63.6364% 89.2157%;
|
||||
--sidebar-ring: 0 55.7789% 39.0196%;
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Libre Baskerville, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(0 63% 18%);
|
||||
--shadow-2xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-sm:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-md:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 2px 4px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-lg:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 4px 6px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-xl:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 8px 10px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-2xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.3);
|
||||
--tracking-normal: 0em;
|
||||
--spacing: 0.25rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: 338 28% 10%;
|
||||
--foreground: 338 5% 98%;
|
||||
--card: 338 28% 10%;
|
||||
--card-foreground: 338 5% 98%;
|
||||
--popover: 338 28% 5%;
|
||||
--popover-foreground: 338 5% 98%;
|
||||
--primary: 338 63% 55.5%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 338 28% 20%;
|
||||
--secondary-foreground: 0 0% 100%;
|
||||
--muted: 300 28% 25%;
|
||||
--muted-foreground: 338 5% 65%;
|
||||
--accent: 300 28% 25%;
|
||||
--accent-foreground: 338 5% 95%;
|
||||
--destructive: 0 50% 50%;
|
||||
--destructive-foreground: 338 5% 98%;
|
||||
--border: 338 28% 50%;
|
||||
--input: 338 28% 50%;
|
||||
--ring: 338 63% 55.5%;
|
||||
--radius: 0.75rem;
|
||||
--background: 24 9.8039% 10%;
|
||||
--foreground: 60 4.7619% 95.8824%;
|
||||
--card: 12 6.4935% 15.098%;
|
||||
--card-foreground: 60 4.7619% 95.8824%;
|
||||
--popover: 12 6.4935% 15.098%;
|
||||
--popover-foreground: 60 4.7619% 95.8824%;
|
||||
--primary: 0 73.7089% 41.7647%;
|
||||
--primary-foreground: 24 33.3333% 97.0588%;
|
||||
--secondary: 22.7273 82.5% 31.3725%;
|
||||
--secondary-foreground: 48 96.4912% 88.8235%;
|
||||
--muted: 24 8.7719% 11.1765%;
|
||||
--muted-foreground: 24 5.7471% 82.9412%;
|
||||
--accent: 25.9649 90.4762% 37.0588%;
|
||||
--accent-foreground: 48 96.4912% 88.8235%;
|
||||
--destructive: 0 84.2365% 60.1961%;
|
||||
--destructive-foreground: 0 0% 100%;
|
||||
--border: 30 6.25% 25.098%;
|
||||
--input: 30 6.25% 25.098%;
|
||||
--ring: 0 73.7089% 41.7647%;
|
||||
--chart-1: 0 90.604% 70.7843%;
|
||||
--chart-2: 0 84.2365% 60.1961%;
|
||||
--chart-3: 0 72.2222% 50.5882%;
|
||||
--chart-4: 43.2558 96.4126% 56.2745%;
|
||||
--chart-5: 37.6923 92.126% 50.1961%;
|
||||
--sidebar: 24 9.8039% 10%;
|
||||
--sidebar-foreground: 60 4.7619% 95.8824%;
|
||||
--sidebar-primary: 0 73.7089% 41.7647%;
|
||||
--sidebar-primary-foreground: 24 33.3333% 97.0588%;
|
||||
--sidebar-accent: 25.9649 90.4762% 37.0588%;
|
||||
--sidebar-accent-foreground: 48 96.4912% 88.8235%;
|
||||
--sidebar-border: 30 6.25% 25.098%;
|
||||
--sidebar-ring: 0 73.7089% 41.7647%;
|
||||
--font-sans: Poppins, sans-serif;
|
||||
--font-serif: Libre Baskerville, serif;
|
||||
--font-mono: IBM Plex Mono, monospace;
|
||||
--radius: 0.375rem;
|
||||
--shadow-x: 1px;
|
||||
--shadow-y: 1px;
|
||||
--shadow-blur: 16px;
|
||||
--shadow-spread: -2px;
|
||||
--shadow-opacity: 0.12;
|
||||
--shadow-color: hsl(0 63% 18%);
|
||||
--shadow-2xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-xs: 1px 1px 16px -2px hsl(0 63% 18% / 0.06);
|
||||
--shadow-sm:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 1px 2px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-md:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 2px 4px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-lg:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 4px 6px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-xl:
|
||||
1px 1px 16px -2px hsl(0 63% 18% / 0.12),
|
||||
1px 8px 10px -3px hsl(0 63% 18% / 0.12);
|
||||
--shadow-2xl: 1px 1px 16px -2px hsl(0 63% 18% / 0.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -112,7 +146,7 @@
|
||||
@apply bg-background text-foreground;
|
||||
scroll-behavior: smooth;
|
||||
font-family:
|
||||
"Poppins",
|
||||
"Fredoka",
|
||||
system-ui,
|
||||
-apple-system,
|
||||
BlinkMacSystemFont,
|
||||
|
||||
Reference in New Issue
Block a user