teal.fm
Your music, beautifully tracked. All yours. (coming soon)
teal.fm
teal-fm
atproto
set opsz so it looks the same across all platforms
authored by
Natalie
and committed by
Natalie B.
9d07731f
530cae59
+48
-47
apps/amethyst/global.css
+48
-47
apps/amethyst/global.css
···
3
3
@tailwind utilities;
4
4
5
5
@layer base {
6
-
:root {
7
-
--base-font-family: "EBGaramond";
8
-
--background: 313 35% 98%;
9
-
--foreground: 313 79% 4%;
10
-
--muted: 283 24% 92%;
11
-
--muted-foreground: 283 11% 39%;
12
-
--popover: 313 35% 97%;
13
-
--popover-foreground: 313 79% 3%;
14
-
--card: 313 35% 97%;
15
-
--card-foreground: 313 79% 3%;
16
-
--border: 313 8% 92%;
17
-
--input: 313 8% 92%;
18
-
--primary: 313 99% 74%;
19
-
--primary-foreground: 313 99% 14%;
20
-
--secondary: 283 99% 74%;
21
-
--secondary-foreground: 283 99% 14%;
22
-
--accent: 343 99% 74%;
23
-
--accent-foreground: 343 99% 14%;
24
-
--destructive: 5 91% 37%;
25
-
--destructive-foreground: 5 91% 97%;
26
-
--bsky: 211.08 99.11% 60.08%;
27
-
--ring: 313 99% 74%;
28
-
--radius: 1rem;
29
-
}
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
+
}
30
31
31
-
.dark:root {
32
-
--background: 313 60% 1%;
33
-
--foreground: 313 14% 97%;
34
-
--muted: 283 24% 8%;
35
-
--muted-foreground: 283 11% 61%;
36
-
--popover: 313 60% 2%;
37
-
--popover-foreground: 313 14% 98%;
38
-
--card: 313 60% 2%;
39
-
--card-foreground: 313 14% 98%;
40
-
--border: 313 8% 14%;
41
-
--input: 313 8% 14%;
42
-
--primary: 313 99% 74%;
43
-
--primary-foreground: 313 99% 14%;
44
-
--secondary: 283 99% 74%;
45
-
--secondary-foreground: 283 99% 14%;
46
-
--accent: 343 99% 74%;
47
-
--accent-foreground: 343 99% 14%;
48
-
--destructive: 5 91% 60%;
49
-
--destructive-foreground: 0 0% 100%;
50
-
--bsky: 211.08 99.11% 60.08%;
51
-
--ring: 313 99% 74%;
52
-
}
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
+
}
53
54
}
54
55
55
56
.var-font-soft {
56
-
font-variation-settings: "SOFT" 100;
57
+
font-variation-settings: "SOFT" 100;
57
58
}