update

app/templates/index.css

@@ -1,95 +1,95 @@
 body {
-	font-family: Arial, Helvetica, sans-serif;
-	font-weight: 700;
-	font-size: min(10vw, 4em);
-	background-color: #e5e5e5;
-	color: #0a0a0a;
+        font-family: Helvetica, Arial, sans-serif;
+        font-weight: 700;
+        font-size: min(10vw, 4em);
+        background-color: #e5e5e5;
+        color: #0a0a0a;
 }
 
 .accent,
 a:hover {
-	color: #bf1f22;
+        color: #bf1f22;
 }
 
 h1,
 a {
-	letter-spacing: -0.08em;
+        letter-spacing: -0.08em;
 }
 
 h1 {
-	font-size: min(35vw, 16rem);
-	width: fit-content;
-	margin-left: auto;
-	margin-right: 4vw;
-	padding: 2rem;
+        font-size: min(35vw, 16rem);
+        width: fit-content;
+        margin-left: auto;
+        margin-right: 4vw;
+        padding: 2rem;
 }
 
 a {
-	text-decoration: none;
-	color: inherit;
-	position: relative;
-	padding-right: 1rem;
+        text-decoration: none;
+        color: inherit;
+        position: relative;
+        padding-right: 1rem;
 
-	&:hover {
-		text-decoration: underline;
-	}
+        &:hover {
+                text-decoration: underline;
+        }
 }
 
 footer {
-	font-size: 18px;
-	opacity: 33%;
-	position: absolute;
-	bottom: 0px;
+        font-size: 18px;
+        opacity: 33%;
+        position: absolute;
+        bottom: 0px;
 }
 
 #links,
 #content {
-	display: flex;
-	flex-direction: row;
-	gap: 1rem;
-	width: fit-content;
-	margin: auto;
+        display: flex;
+        flex-direction: row;
+        gap: 1rem;
+        width: fit-content;
+        margin: auto;
 }
 
 #links a:not(:last-child)::after {
-	content: "";
-	position: absolute;
-	right: 0;
-	top: 50%;
-	transform: translateY(-50%);
-	width: 1px;
-	height: 1em;
-	background: rgb(10, 10, 10);
+        content: "";
+        position: absolute;
+        right: 0;
+        top: 50%;
+        transform: translateY(-50%);
+        width: 1px;
+        height: 1em;
+        background: rgb(10, 10, 10);
 }
 
 @media (max-width: 1100px) {
-	#links {
-		flex-direction: column;
-		margin-left: 10vw;
-	}
+        #links {
+                flex-direction: column;
+                margin-left: 10vw;
+        }
 
-	#links a {
-		padding-right: 0;
-	}
+        #links a {
+                padding-right: 0;
+        }
 
-	#links a::after {
-		display: none;
-	}
+        #links a::after {
+                display: none;
+        }
 }
 
 @media (prefers-color-scheme: dark) {
 
-	.accent,
-	a:hover {
-		color: #a4133c;
-	}
+        .accent,
+        a:hover {
+                color: #a4133c;
+        }
 
-	body {
-		color: #c1c1c1;
-		background-color: #1a1a1a;
-	}
+        body {
+                color: #c1c1c1;
+                background-color: #1a1a1a;
+        }
 
-	#links a:not(:last-child)::after {
-		background-color: rgb(240, 240, 240);
-	}
+        #links a:not(:last-child)::after {
+                background-color: rgb(240, 240, 240);
+        }
 }