silly personal website
dumb girl award once again
+8
-24
+8
-24
src/routes/mod.tsx
+8
-24
src/routes/mod.tsx
···
5
5
6
6
import { css, Import } from "~/mech/css.ts";
7
7
import { boundaries, fontSize, Layout, spacing, theme } from "~/layout.tsx";
8
-
import { NavigationBar } from "~/components/NavigationBar.tsx";
8
+
// import { NavigationBar } from "~/components/NavigationBar.tsx";
9
9
import Heading from "~/components/Heading.tsx";
10
10
import SectionTitle from "~/components/SectionTitle.tsx";
11
11
import Projects from "~/components/Projects.tsx";
···
21
21
position: relative;
22
22
}
23
23
24
-
/*
25
-
#heading h1 {
26
-
font-size: clamp(1.5rem, 5vw + 0.5rem, ${fontSize["2xl"]});
27
-
margin-bottom: ${spacing[1]};
28
-
line-height: 1.25;
29
-
display: block;
30
-
}
31
-
32
-
#heading h2 {
33
-
display: inline-block;
34
-
margin-top: 1ch;
35
-
width: fit-content;
36
-
color: ${theme.subtext};
37
-
font-size: ${fontSize.md};
24
+
#intro-text-container > p {
25
+
display: inline;
38
26
}
39
27
40
-
#intro-text-container > p {
41
-
display: inline;
28
+
#read-more-content {
29
+
margin-top: 2ch;
30
+
padding: 0 2ch;
31
+
border-left: 2px solid ${theme.lift};
42
32
}
43
-
*/
44
33
45
34
@media (min-width: ${boundaries.desktopMinWidth}) {
46
35
section, #heading {
···
124
113
& ~ .read-more-label-collapse { display: none; }
125
114
126
115
&:checked {
127
-
& ~ #read-more-content { display: inline !important; }
116
+
& ~ #read-more-content { display: block !important; }
128
117
& ~ .read-more-label-expand { display: none; }
129
118
& ~ .read-more-label-collapse { display: inline-block; }
130
119
}
···
138
127
font-size: ${fontSize.body};
139
128
color: ${theme.accent};
140
129
}
141
-
142
-
.break {
143
-
height: 1em;
144
-
}
145
130
146
131
.buttons {
147
132
display: flex;
···
198
183
<label for="intro-toggle" class="read-more-btn link read-more-label-expand">Read more</label>
199
184
<label for="intro-toggle" class="read-more-btn link read-more-label-collapse">Show less</label>
200
185
<div id="read-more-content">
201
-
<div class="break" />
202
186
<p>
203
187
<i>In a more personal tone~</i>
204
188
</p>