My personal website
emmeline.tngl.io/
gitignore and rm output
+1
-325
+1
.gitignore
+1
.gitignore
···
1
+
/output
-30
output/about/index.html
-30
output/about/index.html
···
1
-
<!DOCTYPE html>
2
-
<html lang="en">
3
-
<head>
4
-
<meta charset="UTF-8">
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
-
<title>Emmeline's Site - About Me</title>
7
-
<link rel="stylesheet" href="/static/style.css" />
8
-
9
-
</head>
10
-
<body>
11
-
<header>
12
-
<h1>Emmeline's Site</h1>
13
-
</header>
14
-
<div class="content">
15
-
<nav>
16
-
<ul>
17
-
<p><a href="/">Home</a></p>
18
-
<p><a href="/about/">About Me</a></p>
19
-
</ul>
20
-
</nav>
21
-
<main>
22
-
<h2>About Me</h2>
23
-
24
-
<footer>
25
-
<p>Site compiled at <code>1772217474.583238</code>.</p>
26
-
</footer>
27
-
</main>
28
-
</div>
29
-
</body>
30
-
</html>
-100
output/index.html
-100
output/index.html
···
1
-
<!DOCTYPE html>
2
-
<html lang="en">
3
-
<head>
4
-
<meta charset="UTF-8">
5
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6
-
<title>Emmeline's Site - Home</title>
7
-
<link rel="stylesheet" href="/static/style.css" />
8
-
9
-
</head>
10
-
<body>
11
-
<header>
12
-
<h1>Emmeline's Site</h1>
13
-
</header>
14
-
<div class="content">
15
-
<nav>
16
-
<ul>
17
-
<p><a href="/">Home</a></p>
18
-
<p><a href="/about/">About Me</a></p>
19
-
</ul>
20
-
</nav>
21
-
<main>
22
-
<h2>Hiya, I'm Emmeline!</h2>
23
-
24
-
<p>I'm a programmer interested in language and game development.</p>
25
-
<p>I'm quite friendly and thoroughly enjoy making friends. Please feel free to contact me!</p>
26
-
<p>Nicknames: May, Emma</p>
27
-
28
-
<br/>
29
-
<h3>Software I Use</h3>
30
-
<p>Desktop:</p>
31
-
<ul>
32
-
<li><a href="https://alpinelinux.org">Alpine Linux</a> (Operating System)</li>
33
-
<li><a href="https://github.com/niri-wm/niri">Niri</a> (Window Manager)</li>
34
-
<li><a href="https://alacritty.org/">Alacritty</a> (Terminal Emulator)</li>
35
-
<li><a href="https://apps.gnome.org/Nautilus/">Nautilus</a> (Graphical File Explorer, dependency of Niri on Alpine)</li>
36
-
<li><a href="https://github.com/emersion/mako">Mako</a> (Notification Daemon)</li>
37
-
<li><a href="https://github.com/Alexays/Waybar">Waybar</a> (Bar)</li>
38
-
<li><a href="https://pipewire.org/">Pipewire</a> (Audio Server, +pipewire-pulse)</li>
39
-
<li><a href="https://gitlab.freedesktop.org/pipewire/wireplumber/">Wireplumber</a> (Pipewire Session Manager)</li>
40
-
<li><a href="https://networkmanager.dev/">NetworkManager</a> (Wi-Fi/Ethernet Manager)</li>
41
-
<li><a href="https://www.startpage.com/en/">Startpage</a> (Search Engine)</li>
42
-
</ul>
43
-
<p>Extra Applications:</p>
44
-
<ul>
45
-
<li><a href="https://vscodium.com/">VSCodium</a> (Graphical Text Editor, looking for an alternative)</li>
46
-
<li><a href="https://vesktop.dev/">Vesktop</a> (Discord Client)</li>
47
-
<li><a href="https://www.waterfox.com/">Waterfox</a> (Web Browser)</li>
48
-
<li><a href="https://obsidian.md/">Obsidian</a> (Markdown Editor)</li>
49
-
<li><a href="https://prismlauncher.org/">Prism Launcher</a> (Minecraft Launcher)</li>
50
-
<li><a href="https://store.steampowered.com/about/">Steam</a> (Games)</li>
51
-
<li><a href="https://www.aseprite.org/">Aseprite</a> (Pixel Art)</li>
52
-
<li><a href="https://krita.org/en/">Krita</a> (Digital Art)</li>
53
-
<li><a href="https://inkscape.en.softonic.com/">Inkscape</a> (Vector Art)</li>
54
-
<li><a href="https://lmms.io/">LMMS</a> (DAW)</li>
55
-
<li><a href="https://github.com/htkhiem/euphonica/">Euphonica</a> (Desktop Music Player)</li>
56
-
<li><a href="https://apps.ankiweb.net/">Anki</a> (Flashcards)</li>
57
-
<li><a href="https://keepassxc.org/">KeePassXC</a> (Password Manager)</li>
58
-
</ul>
59
-
<p>Programming Languages:</p>
60
-
<ul>
61
-
<li><a href="https://gcc.gnu.org/">C (GCC)</a></li>
62
-
<li><a href="https://bellard.org/tcc/">C (TCC)</a></li>
63
-
<li><a href="https://lua.org/">Lua</a></li>
64
-
</ul>
65
-
66
-
<br/>
67
-
<h3>Cool Albums & Playlists</h3>
68
-
<p>Peak music that you should listen to.</p>
69
-
<p>All links to YouTube. Tracking has been removed from the URLs (<code>&si=...</code>).</p>
70
-
<ul>
71
-
<li><a href="https://youtube.com/playlist?list=PLdkSCrAWCqGYWVj8uT81J3dWxE3sXJqpv">D-CELL - <em>UNBEATABLE: DEMO TAPES</em></a></li>
72
-
<li><a href="https://youtu.be/RKybAhTw8iE">Ninajirachi - <em>I Love My Computer</em></a></li>
73
-
<li><a href="https://youtu.be/RDRycy6_WKE">ESTR0GEM - <em>Worm Party On Sunday</em></a> - HOW ARE THERE ONLY 516 VIEWS AND 378 SUBSCRIBERS??? Please go listen and support ESTR0GEM!</li>
74
-
</ul>
75
-
76
-
<br/>
77
-
<h3>Cool Sites</h3>
78
-
<p>A collection of cool sites I've found.</p>
79
-
<ul>
80
-
<li><a href="https://neomojimixer.com/">Neomojimixer</a> - Neomoji Creator</li>
81
-
<li><a href="https://quaternions.online/">Quaternions</a> - Quaternion visualizer that helped me actually wrap my head around them</li>
82
-
<li><a href="https://wareya.github.io/webtyler/">Webtyler</a> - Tileset generation tool</li>
83
-
<li><a href="https://ygopro.org/yugioh-card-maker/">Yu-Gi-Oh! Card Maker</a> - Easily the best YGO card maker I've found. Props to my friend, Sock, for making it!</li>
84
-
<li><a href="https://flexbox.malven.co/">Flexbox Cheatsheet</a> - Visual cheatsheet for Flexbox, I use this every time I use flexboxes.</li>
85
-
</ul>
86
-
87
-
<br/>
88
-
<h3>Buttons</h3>
89
-
<p>My Circle:</p>
90
-
<span><a href="https://gingershaped.computer"><img src="https://gingershaped.computer/8831/button.png" alt="ginger's 88x31 button" width="88" height="31" decoding="async" /></a></span><span><a href="https://violunae.dev"><img src="https://violunae.dev/assets/badges/violunae.png" alt="violunae.dev" width="88" height="31" decoding="async" style="image-rendering:pixelated;"/></a></span><span><a href="https://conorobrien-foxx.github.io"><img src="https://conorobrien-foxx.github.io/img/button.png" alt="conor's 88x31 button" width="88" height="31" decoding="async" style="image-rendering:pixelated;"/></a></span><span><a href="https://nogginzmart.neocities.org"><img src="https://files.catbox.moe/4u56vg.gif" alt="nogginzmart's button" width="88" height="31" decoding="async" /></a></span>
91
-
<p>Misc:</p>
92
-
<span><img src="https://www.emmelinecoats.com/static/others/e2vial-88x31.gif" alt="powered by estrogen" width="88" height="31" decoding="async" style="image-rendering:pixelated;"/></span>
93
-
94
-
<footer>
95
-
<p>Site compiled at <code>1772217474.583238</code>.</p>
96
-
</footer>
97
-
</main>
98
-
</div>
99
-
</body>
100
-
</html>
-195
output/static/style.css
-195
output/static/style.css
···
1
-
:root {
2
-
/* Palette */
3
-
--white: #EFEFEF;
4
-
--white-1: #EBE3E4;
5
-
--black: #17181F;
6
-
7
-
--green: #B7E57F;
8
-
--sage: #9FAC6B;
9
-
10
-
--yellow: #FDD307;
11
-
--deep-yellow: #FCBC00;
12
-
--orange: #DB8007;
13
-
14
-
--blue: #06C0DC;
15
-
--deep-blue: #059BB3;
16
-
--blue-grey: #607A90;
17
-
--dark-blue-grey: #066374;
18
-
19
-
--pink: #F5C9E3;
20
-
--deep-pink: #D6A0C0;
21
-
22
-
font-family: sans-serif;
23
-
}
24
-
25
-
@media (prefers-color-scheme: light) {
26
-
:root {
27
-
--bg: var(--white);
28
-
--fg: var(--black);
29
-
--accent: var(--sage);
30
-
--link: #0F529A;
31
-
--link-hover: #09427f;
32
-
}
33
-
}
34
-
35
-
@media (prefers-color-scheme: dark) {
36
-
:root {
37
-
--bg: var(--black);
38
-
--fg: var(--white-1);
39
-
--accent: var(--sage);
40
-
--link: var(--blue);
41
-
--link-hover: var(--deep-blue);
42
-
}
43
-
}
44
-
45
-
html {
46
-
background-color: var(--bg);
47
-
color: var(--fg);
48
-
49
-
display: flex;
50
-
align-items: center;
51
-
justify-content: center;
52
-
}
53
-
54
-
body {
55
-
display: flex;
56
-
align-items: center;
57
-
justify-content: center;
58
-
59
-
flex-direction: column;
60
-
align-items: start;
61
-
justify-content: start;
62
-
63
-
gap: 8px;
64
-
65
-
width: 70vw;
66
-
}
67
-
68
-
div.content {
69
-
display: flex;
70
-
align-items: center;
71
-
justify-content: center;
72
-
73
-
flex-direction: row;
74
-
align-items: start;
75
-
justify-content: start;
76
-
77
-
gap: 18px;
78
-
79
-
width: 70vw;
80
-
}
81
-
82
-
main {
83
-
width: 60vw;
84
-
}
85
-
86
-
nav {
87
-
width: 10vw;
88
-
padding: 8px;
89
-
border-right: 1px solid var(--accent);
90
-
}
91
-
92
-
footer {
93
-
text-align: right;
94
-
}
95
-
96
-
code {
97
-
font-family: monospace;
98
-
99
-
padding-left: 4px;
100
-
padding-right: 4px;
101
-
}
102
-
103
-
a, a:visited {
104
-
color: var(--link);
105
-
106
-
text-decoration: underline;
107
-
}
108
-
109
-
a:hover {
110
-
color: var(--link-hover);
111
-
}
112
-
113
-
hr {
114
-
border-top: none;
115
-
border-left: none;
116
-
border-right: none;
117
-
border-bottom: 1px solid var(--accent);
118
-
}
119
-
120
-
ul.favourited-list {
121
-
list-style-type: none;
122
-
}
123
-
124
-
ul.favourited-list>li,
125
-
ul.favourited-list>li>span {
126
-
vertical-align: middle;
127
-
}
128
-
129
-
table {
130
-
border-collapse: collapse;
131
-
}
132
-
133
-
th, td {
134
-
padding: 8px;
135
-
border: 1px solid var(--accent);
136
-
}
137
-
138
-
details {
139
-
border: 1px solid var(--accent);
140
-
padding: 8px;
141
-
}
142
-
143
-
summary {
144
-
cursor: pointer;
145
-
}
146
-
147
-
div.buttons {
148
-
display: flex;
149
-
align-items: center;
150
-
justify-content: center;
151
-
flex-wrap: wrap;
152
-
gap: 8px;
153
-
}
154
-
155
-
.swash {
156
-
display: inline-block;
157
-
width: 30px;
158
-
height: 30px;
159
-
border: 2px solid var(--fg);
160
-
border-radius: 50%;
161
-
}
162
-
163
-
.mini-swash {
164
-
display: inline-block;
165
-
width: 8px;
166
-
height: 8px;
167
-
border: 1px solid var(--fg);
168
-
border-radius: 50%;
169
-
}
170
-
171
-
.secret {
172
-
color: var(--accent);
173
-
}
174
-
175
-
/* "Mobile Mode" */
176
-
@media only screen and (max-device-width: 600px) {
177
-
body {
178
-
width: 98vw;
179
-
}
180
-
181
-
div.content {
182
-
flex-direction: column;
183
-
width: 98vw;
184
-
}
185
-
186
-
main {
187
-
width: 98vw;
188
-
}
189
-
190
-
nav {
191
-
width: 98vw;
192
-
padding: 8px 0 8px 0;
193
-
border-right: none;
194
-
}
195
-
}