teal.fm
Your music, beautifully tracked. All yours. (coming soon)
teal.fm
teal-fm
atproto
1@tailwind base;
2@tailwind components;
3@tailwind utilities;
4
5@layer base {
6 :root {
7 font-variation-settings: "opsz" 10;
8 --base-font-family: "EBGaramond";
9 --background: 313 35% 98%;
10 --foreground: 313 79% 4%;
11 --muted: 283 24% 92%;
12 --muted-foreground: 283 11% 39%;
13 --popover: 313 35% 97%;
14 --popover-foreground: 313 79% 3%;
15 --card: 313 35% 97%;
16 --card-foreground: 313 79% 3%;
17 --border: 313 8% 92%;
18 --input: 313 8% 92%;
19 --primary: 313 99% 74%;
20 --primary-foreground: 313 99% 14%;
21 --secondary: 283 99% 74%;
22 --secondary-foreground: 283 99% 14%;
23 --accent: 343 99% 74%;
24 --accent-foreground: 343 99% 14%;
25 --destructive: 5 91% 37%;
26 --destructive-foreground: 5 91% 97%;
27 --bsky: 211.08 99.11% 60.08%;
28 --ring: 313 99% 74%;
29 --radius: 1rem;
30 }
31
32 .dark:root {
33 --background: 313 60% 1%;
34 --foreground: 313 14% 97%;
35 --muted: 283 24% 8%;
36 --muted-foreground: 283 11% 61%;
37 --popover: 313 60% 2%;
38 --popover-foreground: 313 14% 98%;
39 --card: 313 60% 2%;
40 --card-foreground: 313 14% 98%;
41 --border: 313 8% 14%;
42 --input: 313 8% 14%;
43 --primary: 313 99% 74%;
44 --primary-foreground: 313 99% 14%;
45 --secondary: 283 99% 74%;
46 --secondary-foreground: 283 99% 14%;
47 --accent: 343 99% 74%;
48 --accent-foreground: 343 99% 14%;
49 --destructive: 5 91% 60%;
50 --destructive-foreground: 0 0% 100%;
51 --bsky: 211.08 99.11% 60.08%;
52 --ring: 313 99% 74%;
53 }
54}
55
56* {
57 -webkit-font-smoothing: antialiased;
58 -moz-osx-font-smoothing: grayscale;
59 text-rendering: optimizeLegibility;
60}
61
62.var-font-soft {
63 font-variation-settings: "SOFT" 100;
64}
65
66@supports not selector(::-webkit-scrollbar) {
67 scrollbar-color: rgba(0, 0, 0, 0.8) transparent;
68 scrollbar-width: thin;
69}
70
71::-webkit-scrollbar {
72 width: 7px;
73}
74::-webkit-scrollbar-track {
75 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
76}
77::-webkit-scrollbar-thumb {
78 background-color: darkslategray;
79 outline: 1px solid slategrey;
80 border-radius: 99px;
81}
82::webkit-scrollbar-thumb:hover {
83 background-color: slategray;
84}