Cleanup and Maintenance part 1 (#1)

Co-authored-by: ari <ariadna@omg.lol>
Reviewed-on: #1

src/app.css

@@ -3,6 +3,18 @@
   src: url(https://witchcraft.systems/ProggyCleanNerdFont-Regular.ttf);
 }
 
+:root {
+  --link-color: #646cff;
+  --link-hover-color: #535bf2;
+  --background-color: #12082b;
+  --header-background-color: #1f1145;
+  --content-background-color: #0d0620;
+  --text-color: white;
+  --border-color: #8054f0;
+  --indicator-inactive-color: #4a4a4a;
+  --indicator-active-color: #8054f0;
+}
+
 ::-webkit-scrollbar {
   width: 0px;
   background: transparent;
@@ -35,11 +47,11 @@
 
 a {
   font-weight: 500;
-  color: #646cff;
+  color: var(--link-color);
   text-decoration: inherit;
 }
 a:hover {
-  color: #535bf2;
+  color: var(--link-hover-color);
   text-decoration: underline;
 }
 
@@ -49,11 +61,11 @@ body {
   place-items: center;
   min-width: 320px;
   min-height: 100vh;
-  background-color: #12082b;
+  background-color: var(--background-color);
   font-family: 'ProggyClean', monospace;
   font-size: 24px;
-  color: white;
-  border-color: #8054f0;
+  color: var(--text-color);
+  border-color: var(--border-color);
 }
 
 h1 {
@@ -68,6 +80,4 @@ h1 {
   margin-left: auto;
   margin-right: auto;
   text-align: center;
-}
-
-
+}