clean up

src/styles/index.scss

@@ -1,3 +1,4 @@
+// Reset styles for all elements
 * {
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold;
@@ -7,19 +8,23 @@
   box-sizing: border-box;
 }
 
+// Set up basic styles for the entire page
 body,
 html {
   min-height: 100vh;
   min-width: 100%;
   display: flex;
   overflow-x: hidden;
+  color: #fff;
 }
 
+// Ensure the root element takes up the full viewport
 #root {
   height: 100%;
   min-width: 100%;
 }
 
+// Headline styles
 h1 {
   font-size: 1.8rem;
 }
@@ -36,6 +41,7 @@ h4 {
   font-size: 1.1rem;
 }
 
+// Common styles for heading elements
 h1,
 h2,
 h3,
@@ -45,6 +51,19 @@ h6 {
   font-weight: bold;
 }
 
+// Text styles
+a {
+  color: #3abe78;
+  font-weight: bold;
+  text-decoration: none;
+  transition: all 100ms ease-in-out;
+
+  &:hover {
+    color: #31f399;
+  }
+}
+
+// Button styles
 button {
   background-color: #202024;
   color: #fff;
@@ -54,13 +73,14 @@ button {
   padding: 10px 20px;
   cursor: pointer;
   transition: all 300ms ease-in-out;
+
   &:hover {
     background-color: #42d486;
     color: #202024;
   }
 }
 
-// custom dark themed scrollbar
+// Custom dark-themed scrollbar
 ::-webkit-scrollbar {
   width: 5px;
   height: 5px;
@@ -74,8 +94,8 @@ button {
 ::-webkit-scrollbar-thumb {
   background: #31f39973;
   border-radius: 10px;
-}
 
-::-webkit-scrollbar-thumb:hover {
-  background: #48ee95;
+  &:hover {
+    background: #48ee95;
+  }
 }