M static/css/blog.css → static/css/blog.css

@@ -6,7 +6,7 @@ max-width: 664px;
     width: 100%;
     margin: 2rem auto;
     justify-content: center;
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 .blog-menu{
@@ -93,7 +93,7 @@ 
 .post-item > a {
     margin-right: 4rem;
     overflow: hidden;
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 .post-item > .post-date{
@@ -116,7 +116,7 @@ 
 .post-text{
     font-family: 'Inter', sans-serif;
     font-size: 16px;
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 
@@ -178,6 +178,7 @@ font-family: 'Exo 2';
     font-size:1.4rem;
     font-weight: 500;
     margin: 2rem 0;
+    color: var(--text-primary);
 }
 
 .post-text h3{
@@ -185,12 +186,14 @@ font-family: 'Exo 2';
     font-weight: 500;
     font-size:1.2rem;
     margin-top: 1.5rem;
+    color: var(--text-primary);
 }
 
 .post-text h4{
     font-weight: 600;
     font-size:1rem;
     margin-top: 1rem;
+    color: var(--text-primary);
 }
 
 .post-text ul{
@@ -245,6 +248,13 @@ border-radius: 6px;
     background-color: #40a6ff14;
     padding: 0.5rem 2.5rem;
     margin-top: 1rem;
+}
+
+.post-text ._aside h1,
+.post-text ._aside h2,
+.post-text ._aside h3,
+.post-text ._aside h4 {
+    color: var(--text)
 }
 
 .vid {

M static/css/main.css → static/css/main.css

@@ -12,7 +12,7 @@ a:active,
 a:focus{
     outline: none;
     text-decoration: none;
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 ::selection {
@@ -22,7 +22,7 @@ }
 
 :root{
     --dark-bg: #0a0a0a;
-    --dark-text: #c5c5c5;
+    --dark-text: #ffffffcc;
     --dark-text-primary: white;
     --dark-card-bg: #242424;
     --dark-card-head: white;
@@ -34,7 +34,7 @@ --dark-pre-border: #ffffff30;
     --dark-code-bg: #1a1a1a;
 
     --light-bg: #f3f3f3;
-    --light-text: #666666;
+    --light-text: #1a1a1a;
     --light-text-primary: black;
     --light-card-bg: white;
     --light-card-head: #333333;
@@ -67,8 +67,8 @@ @media (prefers-color-scheme: dark) {
     body.theme-auto{
         --bg: var(--dark-bg);
         --text: var(--dark-text);
+        --text-primary: var(--dark-text-primary);
         --text-secondary: #919191;
-        --text-primary: #ffffffcc;
         --quote-bar: #ffffff61;
         --card-bg: var(--dark-card-bg);
         --card-head: var(--dark-card-head);
@@ -85,8 +85,8 @@ 
 body.theme-dark{
     --bg: var(--dark-bg);
     --text: var(--dark-text);
+    --text-primary: var(--dark-text-primary);
     --text-secondary: #919191;
-    --text-primary: #ffffffcc;
     --quote-bar: #ffffff61;
     --card-bg: var(--dark-card-bg);
     --card-head: var(--dark-card-head);
@@ -96,7 +96,7 @@ --logo-bottom: var(--dark-logo-bottom);
     --pre-bg: var(--dark-pre-bg);
     --pre-border: var(--dark-pre-border);
     --code-bg: var(--dark-code-bg);
-    --scrollbar: #ffffff25;
+    --scrollbar: #ffffff11;
 }
 
 body{
@@ -137,7 +137,7 @@ align-self: flex-end;
     text-decoration: none;
     text-transform: uppercase;
     background: none;
-    color: var(--text-primary);
+    color: var(--text);
     font-family: monospace;
     font-size: inherit;
     font-weight: 700;
@@ -147,7 +147,7 @@ 
 #sun {
     width: 24px;
     margin-top: 6px;
-    fill: var(--text-primary);
+    fill: var(--text);
     cursor: pointer;
 }
 
@@ -170,13 +170,13 @@ }
 
 nav a{
     text-decoration: none;
-    color: var(--text-primary);
+    color: var(--text);
     font-weight: 500;
 }
 
 nav a:hover{
     text-decoration: underline;
-    color: var(--text-primary);
+    color: var(--text);
     font-weight: 500;
 }
 
@@ -185,12 +185,12 @@ margin-top: 3rem;
 }
 
 #latest-posts {
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 #latest-posts a:hover{
     text-decoration: underline;
-    color: var(--text-primary);
+    color: var(--text);
 }
 
 #latest-posts-viewall {