[fix] make it a bit more mobile responsive and add a 404 page

1 files changed, 50 insertions, 0 deletions

diff --git a/static/style.css b/static/style.css
index 3c3e6ce..d9bd157 100644
--- a/static/style.css
+++ b/static/style.css
@@ -324,3 +324,53 @@ a {
 .projects-entry ol {
 	margin: 0.3rem 0;
 }
+
+@media screen and (max-width: 768px) {
+	body {
+		font-size: 16px;
+		line-height: 1.2;
+	}
+
+	.header-inner {
+		flex-direction: column;
+		align-items: flex-start;
+		gap: 10px;
+	}
+
+	.hey {
+		padding-top: 30px;
+	}
+
+	nav {
+		flex-wrap: wrap;
+		gap: 8px;
+	}
+
+	nav a {
+		font-size: 1.1em;
+		padding: 4px 8px;
+	}
+
+	.site-title {
+		font-size: 1.2em;
+	}
+
+	.blog-content {
+		font-size: 1.05em;
+	}
+
+	pre, code {
+		font-size: 0.9em;
+		word-wrap: break-word;
+		white-space: pre-wrap;
+	}
+
+	.blog-image-wrap img {
+		max-width: 100%;
+		height: auto;
+	}
+
+	.container {
+		padding: 0 15px;
+	}
+}