update

assets/style.scss

@@ -3,6 +3,7 @@
 	--border: hsl(210, 21%, 20%);
 	--text: hsl(210, 21%, 95%);
 	--text-2: hsl(210, 21%, 80%);
+	--text-secondary: hsl(210, 21%, 40%);
 	--vriish-red: hsl(0, 100%, 75%);
 	--rose: hsl(0, 100%, 75%);
 	--orange: hsl(25, 100%, 75%);
@@ -10,6 +11,7 @@
 	--emerald: hsl(130, 100%, 75%);
 	--sky: hsl(215, 100%, 75%);
 	--purpur: hsl(275, 100%, 75%);
+	--white: hsl(360, 100%, 100%);
 }
 @media (prefers-color-scheme: light) {
 	:root {
@@ -93,13 +95,10 @@ hr {
 header, footer {
 	align-items: center;
 	display: flex;
-	margin: 0 auto;
-	max-width: 1140px;
 	overflow: auto;
 	white-space: nowrap;
 	width: 100%;
 	a {
-		color: var(--text-2);
 		padding: 17.6px 15px;
 		text-decoration-color: var(--background);
 		text-decoration-thickness: 2px !important;
@@ -109,7 +108,9 @@ header, footer {
 	}
 }
 header {
-	border-bottom: 1px solid var(--border);
+	a {
+		color: var(--text-2);
+	}
 	h1 {
 		display: flex;
 		font-size: 1em;
@@ -120,15 +121,17 @@ header {
 	}
 	nav {
 		display: flex;
+		margin-left: auto;
 	}
 	aside {
 		margin-left: auto;
 	}
 }
 footer {
-	border-top: 1px solid var(--border);
-	color: var(--text-2);
-	a { color: var(--text-2); }
+	bottom: 0;
+	color: var(--text-secondary);
+	position: absolute;
+	a { color: var(--text-secondary); }
 	span {
 		padding: 17.6px 30px;
 		margin-right: auto;
@@ -147,11 +150,8 @@ main {
 	span { font-size: .8em; }
 }
 
-#rainbow-heading {
-	animation: rainbow-swoosh;
-	animation-duration: 30000s;
-	animation-iteration-count: infinite;
-	background-image: linear-gradient(135deg, var(--purpur) 14.29%, var(--rose) 14.29%, var(--rose) 28.57%, var(--orange) 28.57%, var(--orange) 42.86%, var(--gold) 42.86%, var(--gold) 57.14%, var(--emerald) 57.14%, var(--emerald) 71.43%, var(--sky) 71.43%, var(--sky) 85.71%, var(--purpur) 85.71%);
+#intro-heading {
+	background-image: linear-gradient(180deg, var(--rose) 0%, var(--rose) 50%, var(--gold) 95%, var(--rose) 100%);
 	background-clip: text;
 	-webkit-background-clip: text;
 	color: transparent;
@@ -174,9 +174,3 @@ p.date-published {
 		margin: 0 auto;
 	}
 }
-
-@keyframes rainbow-swoosh {
-	0%   { background-position-x: 0px; }
-	50%  { background-position-x: 999999px; }
-	100% { background-position-x: 0px; }
-}