@tailwind base;
|
@tailwind components;
|
@tailwind utilities;
|
|
body {
|
@apply !text-neutral-content !bg-neutral-background;
|
}
|
|
h1,
|
h2,
|
h3,
|
h4,
|
h5,
|
h6 {
|
font-weight: 500;
|
margin: 0;
|
color: inherit !important;
|
}
|
|
h1 {
|
font-size: 2em;
|
}
|
|
h2 {
|
font-size: 1.5em;
|
}
|
|
h3 {
|
font-size: 1.17em;
|
}
|
|
h4 {
|
font-size: 1em;
|
}
|
|
h5 {
|
font-size: 0.83em;
|
}
|
|
h6 {
|
font-size: 0.67em;
|
}
|
|
a {
|
@apply text-primary-content;
|
}
|
|
a:hover {
|
@apply text-primary-content-hover;
|
}
|
|
/* third-party libraries CSS */
|
@layer base {
|
:root {
|
--background: 0 0% 100%;
|
--foreground: 222.2 84% 4.9%;
|
--card: 0 0% 100%;
|
--card-foreground: 222.2 84% 4.9%;
|
--popover: 0 0% 100%;
|
--popover-foreground: 222.2 84% 4.9%;
|
--primary: 228 38% 48%;
|
--primary-foreground: 210 40% 98%;
|
--secondary: 210 40% 96.1%;
|
--secondary-foreground: 222.2 47.4% 11.2%;
|
--muted: 210 40% 96.1%;
|
--muted-foreground: 215.4 16.3% 46.9%;
|
--accent: 210 40% 96.1%;
|
--accent-foreground: 222.2 47.4% 11.2%;
|
--destructive: 0 84.2% 60.2%;
|
--destructive-foreground: 210 40% 98%;
|
--border: 228 38% 35%;
|
--input: 214.3 31.8% 91.4%;
|
--ring: 221.2 83.2% 53.3%;
|
--radius: 0.5rem;
|
--chart-1: 12 76% 61%;
|
--chart-2: 173 58% 39%;
|
--chart-3: 197 37% 24%;
|
--chart-4: 43 74% 66%;
|
--chart-5: 27 87% 67%;
|
}
|
|
.dark {
|
--background: 222.2 84% 4.9%;
|
--foreground: 210 40% 98%;
|
--card: 222.2 84% 4.9%;
|
--card-foreground: 210 40% 98%;
|
--popover: 222.2 84% 4.9%;
|
--popover-foreground: 210 40% 98%;
|
--primary: 217.2 91.2% 59.8%;
|
--primary-foreground: 222.2 47.4% 11.2%;
|
--secondary: 217.2 32.6% 17.5%;
|
--secondary-foreground: 210 40% 98%;
|
--muted: 217.2 32.6% 17.5%;
|
--muted-foreground: 215 20.2% 65.1%;
|
--accent: 217.2 32.6% 17.5%;
|
--accent-foreground: 210 40% 98%;
|
--destructive: 0 62.8% 30.6%;
|
--destructive-foreground: 210 40% 98%;
|
--border: 217.2 32.6% 17.5%;
|
--input: 217.2 32.6% 17.5%;
|
--ring: 224.3 76.3% 48%;
|
--chart-1: 220 70% 50%;
|
--chart-2: 160 60% 45%;
|
--chart-3: 30 80% 55%;
|
--chart-4: 280 65% 60%;
|
--chart-5: 340 75% 55%;
|
}
|
}
|
|
@layer utilities {
|
.text-shadow-button {
|
text-shadow: 0 1px 1px rgb(var(--color-neutral-shadow-raw) / 15%);
|
}
|
|
.pointer-events-all {
|
pointer-events: all;
|
}
|
}
|
|
* {
|
scrollbar-color: var(--color-neutral-border) var(--color-neutral-background);
|
scrollbar-width: thin;
|
}
|
|
*::-webkit-scrollbar {
|
width: 4px;
|
height: 4px;
|
background-color: var(--color-neutral-surface);
|
}
|
|
*::-webkit-scrollbar-thumb {
|
background: var(--color-neutral-border-boldest);
|
}
|
