learn and share notes on atproto (wip) 🦉
malfestio.stormlightlabs.org/
readability
solid
axum
atproto
srs
feat: add "Coming Soon" page
+195
+195
docs/static/index.html
+195
docs/static/index.html
···
1
+
<!DOCTYPE html>
2
+
<html lang="en">
3
+
4
+
<head>
5
+
<meta charset="UTF-8">
6
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7
+
<title>Malfestio - Coming Soon</title>
8
+
<meta name="description"
9
+
content="Coming soon: Master complex topics with spaced repetition, linked notes, and active recall. Share your decks, notes, and discoveries with the community.">
10
+
11
+
<!-- Open Graph -->
12
+
<meta property="og:type" content="website">
13
+
<meta property="og:url" content="https://malfestio.stormlightlabs.org/">
14
+
<meta property="og:title" content="Malfestio — Learning on the AT Protocol">
15
+
<meta property="og:description"
16
+
content="Coming soon: Master complex topics with spaced repetition, linked notes, and active recall. Share your decks, notes, and discoveries with the community.">
17
+
<meta property="og:image" content="https://malfestio.stormlightlabs.org/og-image.png">
18
+
19
+
<!-- Twitter Card -->
20
+
<meta name="twitter:card" content="summary_large_image">
21
+
<meta name="twitter:url" content="https://malfestio.stormlightlabs.org/">
22
+
<meta name="twitter:title" content="Malfestio — Learning on the AT Protocol">
23
+
<meta name="twitter:description"
24
+
content="Coming soon: Master complex topics with spaced repetition, linked notes, and active recall. Share your decks, notes, and discoveries with the community.">
25
+
<meta name="twitter:image" content="https://malfestio.stormlightlabs.org/og-image.png">
26
+
27
+
<link rel="icon" type="image/svg+xml"
28
+
href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='2em' height='2em' viewBox='0 0 24 24'><path fill='%232859c5' d='M12 14.327q2.394 0 4.197-1.445T18 9.173q0-.959-.348-1.795t-.975-1.474q-1.735.108-2.956 1.296Q12.5 8.389 12.5 10.116h-1q0-1.727-1.23-2.92Q9.038 6.004 7.294 5.93q-.599.638-.947 1.461T6 9.173q0 2.264 1.803 3.709T12 14.327M8.75 9.904q-.31 0-.52-.21t-.21-.52t.21-.521t.52-.21t.52.21t.21.52t-.21.52q-.209.21-.52.21m6.5 0q-.31 0-.52-.209q-.21-.21-.21-.52t.21-.521q.209-.21.52-.21t.52.21q.21.209.21.52q0 .31-.21.52q-.209.21-.52.21M12 21q-2.931 0-4.966-2.084Q5 16.83 5 13.885V9.173q0-2.69 2.092-4.431T12 3q2.68 0 4.84 1.696T19 9.173V20h-1q-1.558 0-2.664-1.106t-1.105-2.663v-1.212q-.25.074-.5.122l-.5.095v1q0 1.974 1.395 3.369T18 21z'/></svg>">
29
+
<link rel="preconnect" href="https://fonts.googleapis.com">
30
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
31
+
<link
32
+
href="https://fonts.googleapis.com/css2?family=Figtree:wght@300;400;500;600&family=Lora:wght@400;500;600&display=swap"
33
+
rel="stylesheet">
34
+
<style>
35
+
* {
36
+
margin: 0;
37
+
padding: 0;
38
+
box-sizing: border-box;
39
+
}
40
+
41
+
:root {
42
+
--layer-00: #161616;
43
+
--layer-01: #1e1e1e;
44
+
--layer-02: #262626;
45
+
--layer-03: #2c2c2c;
46
+
--duration-normal: 250ms;
47
+
--easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
48
+
}
49
+
50
+
body {
51
+
font-family: 'Figtree', sans-serif;
52
+
font-weight: 300;
53
+
background: #000000;
54
+
min-height: 100vh;
55
+
display: flex;
56
+
align-items: center;
57
+
justify-content: center;
58
+
color: #ffffff;
59
+
padding: 2rem;
60
+
position: relative;
61
+
overflow: hidden;
62
+
}
63
+
64
+
.grid-pattern {
65
+
position: absolute;
66
+
inset: 0;
67
+
background-size: 32px 32px;
68
+
background-image:
69
+
linear-gradient(to right, rgba(85, 85, 85, 0.3) 1px, transparent 1px),
70
+
linear-gradient(to bottom, rgba(85, 85, 85, 0.3) 1px, transparent 1px);
71
+
pointer-events: none;
72
+
}
73
+
74
+
.gradient-overlay {
75
+
position: absolute;
76
+
inset: 0;
77
+
background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.3), #000000);
78
+
pointer-events: none;
79
+
}
80
+
81
+
.container {
82
+
max-width: 700px;
83
+
text-align: center;
84
+
animation: fadeIn 0.8s var(--easing-standard);
85
+
position: relative;
86
+
z-index: 1;
87
+
}
88
+
89
+
@keyframes fadeIn {
90
+
from {
91
+
opacity: 0;
92
+
transform: translateY(20px);
93
+
}
94
+
95
+
to {
96
+
opacity: 1;
97
+
transform: translateY(0);
98
+
}
99
+
}
100
+
101
+
h1 {
102
+
font-family: 'Lora', serif;
103
+
font-size: 5rem;
104
+
font-weight: 500;
105
+
margin-bottom: 1rem;
106
+
letter-spacing: -0.02em;
107
+
line-height: 1.1;
108
+
}
109
+
110
+
.tagline {
111
+
font-family: 'Lora', serif;
112
+
font-size: 1.75rem;
113
+
font-weight: 400;
114
+
margin-bottom: 3rem;
115
+
color: #a3a3a3;
116
+
}
117
+
118
+
.description {
119
+
font-size: 1.125rem;
120
+
line-height: 1.8;
121
+
margin-bottom: 3rem;
122
+
color: #a3a3a3;
123
+
font-weight: 300;
124
+
}
125
+
126
+
.status {
127
+
font-family: 'Figtree', sans-serif;
128
+
font-size: 0.75rem;
129
+
font-weight: 500;
130
+
text-transform: uppercase;
131
+
letter-spacing: 0.1em;
132
+
padding: 0.75rem 1.5rem;
133
+
background: var(--layer-02);
134
+
border: 1px solid var(--layer-03);
135
+
border-radius: 0.125rem;
136
+
display: inline-block;
137
+
transition: all var(--duration-normal) var(--easing-standard);
138
+
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
139
+
}
140
+
141
+
.bsky-link {
142
+
color: #3b82f6;
143
+
text-decoration: none;
144
+
transition: color var(--duration-normal) var(--easing-standard);
145
+
}
146
+
147
+
.bsky-link:hover {
148
+
color: #60a5fa;
149
+
}
150
+
151
+
.bsky-link:visited {
152
+
color: #60a5fa;
153
+
}
154
+
155
+
.footer {
156
+
margin-top: 4rem;
157
+
font-size: 0.875rem;
158
+
color: #737373;
159
+
font-weight: 300;
160
+
}
161
+
162
+
@media (max-width: 768px) {
163
+
h1 {
164
+
font-size: 3rem;
165
+
}
166
+
167
+
.tagline {
168
+
font-size: 1.25rem;
169
+
}
170
+
171
+
.description {
172
+
font-size: 1rem;
173
+
}
174
+
}
175
+
</style>
176
+
</head>
177
+
178
+
<body>
179
+
<div class="grid-pattern"></div>
180
+
<div class="gradient-overlay"></div>
181
+
<div class="container">
182
+
<h1>Malfestio</h1>
183
+
<div class="tagline">
184
+
Learning on the AT Protocol
185
+
</div>
186
+
<p class="description">
187
+
Coming Soon
188
+
</p>
189
+
<div class="footer">
190
+
Check out <a class="bsky-link" href="https://bsky.app/profile/desertthunder.dev">Bluesky</a> for updates
191
+
</div>
192
+
</div>
193
+
</body>
194
+
195
+
</html>
docs/static/og-image.png
docs/static/og-image.png
This is a binary file and will not be displayed.