Dark Mode Support

static/css/dark.css

@@ -0,0 +1,90 @@
+body {
+	color: white;
+	background-color: #202124;
+}
+
+::-moz-selection {
+	background: blue;
+	color: #fff;
+    text-shadow: none
+}
+
+::selection {
+	background: red;
+	color: #fff;
+    text-shadow: none
+}
+
+hr {
+    border-top: 3px dotted blue;
+}
+code {
+	background-color: lightblue;
+	color:black;
+	text-decoration: bold;
+	padding: .1em .2em;
+  }
+pre {
+	background-color: #272822;
+	line-height: 1.4;
+	overflow-x: auto;
+	padding: 1em;
+  }
+blockquote {
+	border-color: blue;
+}
+
+h1,h2,h3,h4,h5,h6 {
+	color: #ddd;
+}
+h1::before { color: var(--darkMaincolor); content: '# '; }
+h2::before { color: var(--darkMaincolor); content: '## '; }
+h3::before { color: var(--darkMaincolor); content: '### '; }
+h4::before { color: var(--darkMaincolor); content: '#### '; }
+h5::before { color: var(--darkMaincolor); content: '##### '; }
+h6::before { color: var(--darkMaincolor); content: '###### '; }
+
+a{
+    border-bottom: 3px solid var(--darkMaincolor);
+    color:inherit;
+}
+a:hover {
+	background-color: var(--darkMaincolor);
+	color:black;
+}
+
+.site-description a{
+	color: #ddd;
+}
+.site-description a:hover {
+	color: 	black;
+	
+}
+
+.tags a{
+	border-bottom: 3px solid var(--darkMaincolor); 
+  }
+  .tags a:hover{
+	color: black; 
+  }
+
+.site-title a {
+	color: white;
+	text-decoration: none !important;
+}
+
+.header nav,
+.footer {
+	border-color: #333;
+}
+
+.highlight {
+	background-color: #333;
+}
+.soc:hover{
+	color: black;
+  }
+  .draft-label{ 
+	color:var(--darkMaincolor);
+	background-color: blue;
+  }

static/css/main.css

@@ -6,6 +6,7 @@
 --bordercl:rebeccapurple;
 --callouctcolor:dodgerblue;
 --hovercolor:navy;
+--darkMaincolor: #50fa7b;
 }
 html {
   color: #232333;
@@ -51,7 +52,7 @@ a {
 }
 a:hover {
     background-color: var(--hovercolor);
-  color: #fff;
+    color: #fff;
 }
 
 ul {