Mae's website :3
maemoon.me
maemoon.me
personal
website
svelte
sveltekit
1.theme-light {
2 --color-bg: #eceff4;
3 --color-bg-2: #e5e9f0;
4 --color-fg-1: #2e3440;
5 --color-fg-2: #3b4252;
6 --color-fg-3: #434c5e;
7 --color-fg-4: #4c566a;
8 --color-accent: #81a1c1;
9}
10
11.theme-dark {
12 --color-bg: #3b4252;
13 --color-bg-2: #434c5e;
14 --color-fg-1: #eceff4;
15 --color-fg-2: #e5e9f0;
16 --color-fg-3: #d8dee9;
17 --color-accent: #81a1c1;
18}
19
20* {
21 margin: 0;
22 padding: 0;
23}
24
25body {
26 background-color: var(--color-bg);
27 color: var(--color-fg-1);
28 word-wrap: break-word;
29 font-family: 'Inter';
30}
31
32h2 {
33 color: var(--color-fg-1);
34 padding: 0.5rem 0;
35}
36
37p, span {
38 font-size: 1.2rem;
39}
40
41a {
42 color: var(--color-fg-2);
43 font-style: normal;
44 font-size: 1.2rem;
45}
46
47article a {
48 font-size: 1em;
49}
50
51article > p {
52 padding-bottom: 1.2em;
53}
54
55a:focus {
56 outline: var(--color-fg-4) solid 2px;
57 border-radius: 3px;
58 background-color: var(--color-bg);
59}
60
61a:hover {
62 color: var(--color-fg-4);
63}
64
65li {
66 list-style: none;
67 padding-bottom: 0.2rem;
68}
69
70.icon {
71 width: 1rem;
72 height: 1rem;
73 vertical-align: -0.125rem;
74}