Use variable for style file

Which allow us change style easily in the future

Author: wildskyf

_sass/variable.scss

@@ -1,4 +1,7 @@
 $font-size: 18px;
 $title-color: #70b950;
+$link-color: #80a0ff;
+$normal-color: #e8e8d3;
+$linenum-color: #605958;
 $pound: "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='40px' width='13px'><text x='0' y='17' fill='%2370b950' font-size='18' font-weight='600'>%23</text></svg>";
 $pound-offset: "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' version='1.1' height='40px' width='28px'><text x='0' y='17' fill='%2370b950' font-size='18' font-weight='600'>%23</text></svg>";

style.scss

@@ -8,7 +8,7 @@
   text-align: right;
   counter-increment: ln;
   content: counter(ln);
-  color: #605958;
+  color: $linenum-color;
   background-color: #151515;
   font-weight: 400;
 }
@@ -18,15 +18,15 @@ body {
   margin: 0;
   padding: 0;
   font-family: monospace;
-  color: #e8e8d3;
+  color: $normal-color;
   background-color: #151515;
   font-size: $font-size;
 }
 
 #main {
   padding: 1rem 0;
   font-family: monospace;
-  color: #e8e8d3;
+  color: $normal-color;
   background-color: #151515;
 
   h1::before {
@@ -106,7 +106,7 @@ body {
   }
 
   a {
-    color: #80a0ff;
+    color: $link-color;
     text-decoration: underline;
 
     &:hover {