jensroemer.com
Test project for testing out tangled core
1:root {
2 font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
3 line-height: 1.5;
4 font-weight: 400;
5
6 color-scheme: light dark;
7 color: rgba(255, 255, 255, 0.87);
8 background-color: #242424;
9
10 font-synthesis: none;
11 text-rendering: optimizeLegibility;
12 -webkit-font-smoothing: antialiased;
13 -moz-osx-font-smoothing: grayscale;
14}
15
16a {
17 font-weight: 500;
18 color: #646cff;
19 text-decoration: inherit;
20}
21a:hover {
22 color: #535bf2;
23}
24
25body {
26 margin: 0;
27 display: flex;
28 place-items: center;
29 min-width: 320px;
30 min-height: 100vh;
31}
32
33h1 {
34 font-size: 3.2em;
35 line-height: 1.1;
36}
37
38button {
39 border-radius: 8px;
40 border: 1px solid transparent;
41 padding: 0.6em 1.2em;
42 font-size: 1em;
43 font-weight: 500;
44 font-family: inherit;
45 background-color: #1a1a1a;
46 cursor: pointer;
47 transition: border-color 0.25s;
48}
49button:hover {
50 border-color: #646cff;
51}
52button:focus,
53button:focus-visible {
54 outline: 4px auto -webkit-focus-ring-color;
55}
56
57@media (prefers-color-scheme: light) {
58 :root {
59 color: #213547;
60 background-color: #ffffff;
61 }
62 a:hover {
63 color: #747bff;
64 }
65 button {
66 background-color: #f9f9f9;
67 }
68}