Revisione/app/assets/css/main.css

75 lines
1.8 KiB
CSS

@import url("https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=DM+Sans:wght@300;400;500;600&display=swap");
@import "tailwindcss";
:root {
--bg: oklch(97.5% 0.008 78);
--surface: oklch(95.5% 0.012 76);
--surface-2: oklch(93% 0.016 74);
--surface-3: oklch(90% 0.020 72);
--border: oklch(88% 0.022 73);
--border-2: oklch(82% 0.026 70);
--text: oklch(20% 0.020 55);
--text-2: oklch(42% 0.020 60);
--text-3: oklch(60% 0.016 68);
--accent: oklch(54% 0.140 44);
--accent-light: oklch(93% 0.040 76);
--accent-dim: oklch(88% 0.060 72);
--green: oklch(54% 0.130 158);
--green-light: oklch(93% 0.040 155);
--blue: oklch(54% 0.130 255);
--blue-light: oklch(93% 0.035 255);
--sidebar-w: 228px;
--r-card: 16px;
--r-surface: 14px;
--r-item: 12px;
--r-btn: 10px;
--r-sm: 8px;
}
@theme {
--font-serif: "Lora", Georgia, serif;
--font-sans: "DM Sans", system-ui, sans-serif;
--font-mono: ui-monospace, "SFMono-Regular", Menlo, monospace;
}
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
html {
font-size: 16px;
}
body {
font-family: "DM Sans", sans-serif;
background: var(--bg);
color: var(--text);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
button {
font-family: inherit;
cursor: pointer;
border: none;
background: none;
}
input, textarea, select {
font-family: inherit;
}
::selection {
background: var(--accent);
color: white;
}
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-2); border-radius: 3px; }