raiguard/raiguard.me

git clone https://git.raiguard.me/raiguard/raiguard.me

Caleb HeuerWIPe9def4e

blog
2.1 KiB124 linesraw
1@font-face {
2  font-family: "/fonts/Inter";
3  src: url("/fonts/Inter/Inter-Regular.woff2") format("woff2");
4  font-weight: 400;
5  font-style: normal;
6  font-display: swap;
7}
8
9@font-face {
10  font-family: "/fonts/JetBrainsMono";
11  src: url("/fonts/JetBrainsMono/JetBrainsMono-Regular.woff2") format("woff2");
12  font-weight: 400;
13  font-style: normal;
14  font-display: swap;
15}
16
17$font: "/fonts/Inter", sans-serif;
18$font-mono: "/fonts/JetBrainsMono", monospace;
19
20$color-fg: #d5d5d5;
21$color-bg: #121212;
22$color-inset: #323232;
23$color-accent: #e5a72a;
24
25body {
26    background-color: $color-bg;
27    color: $color-fg;
28    font-family: $font;
29    font-size: 1rem;
30    margin: auto;
31    max-width: 60rem;
32    min-width: 20rem;
33    padding: 1em;
34}
35
36hr {
37    border: none;
38    height: 1px;
39    background: $color-inset;
40    margin-bottom: 1em;
41}
42
43nav {
44    display: flex;
45    justify-content: center;
46    gap: 1.25em;
47    font-family: $font-mono;
48    margin-bottom: 1em;
49}
50
51h1 {
52    font-family: $font-mono;
53    font-size: 1.5rem;
54    small {
55        display: block;
56        font-size: 0.7rem;
57    }
58}
59
60h2 {
61    font-family: $font-mono;
62    font-size: 1.2rem;
63    margin: 0;
64}
65
66a {
67    color: $color-accent;
68    text-decoration: none;
69}
70
71a:hover {
72    text-decoration: underline;
73}
74
75section#index {
76    aside {
77        float: right;
78        display: flex;
79        flex-direction: column;
80        align-items: center;
81        max-width: 40%;
82        margin: 0 0 0 2rem;
83
84        img {
85            margin: 0 0 1rem;
86            border-radius: 5px;
87        }
88
89        @media(max-width: 600px) {
90            float: none;
91            margin: 0 auto;
92        }
93    }
94}
95
96section#blog-index {
97    span#article-date {
98        font-family: $font-mono;
99        font-size: 12px;
100        margin-right: 1em;
101    }
102
103    ul {
104        list-style: none;
105        padding: 0;
106    }
107
108    a#rss-link {
109        float: right;
110    }
111}
112
113article {
114    pre {
115        background-color: $color-inset;
116        padding: 0.5rem;
117        overflow: scroll;
118        border-radius: 5px;
119        code {
120            font-family: $font-mono;
121            font-size: 0.8rem;
122        }
123    }
124}