Cleanup colors (#371)

* Cleanup colors

* Final cleanup

Author: jarrodmillman

assets/theme-css/code-highlight.css

@@ -112,7 +112,7 @@ html[data-theme="dark"] {
   }
   /* NameTag */
   .chroma .nt {
-    color: var(--colorCode);
+    color: #ffb8d1;
   }
   /* Literal */
   .chroma .l {

assets/theme-css/dark-mode.css

@@ -9,26 +9,3 @@
     --pst-color-background: #14181e;
   }
 }
-
-/* Once our colors have all been mapped to PST color names, this section can be removed. */
-@media (prefers-color-scheme: dark) {
-  :root {
-    /* Basically, we reassign the colors named in the non-dark theme. The
-       exception is the background: it seems to look better as #111
-       than as --colorPrimaryDark. */
-    --colorBackgroundAlt: var(--colorPrimaryDark);
-
-    --colorContentLink: var(--colorPrimaryLight);
-
-    --colorShadow: var(--colorSecondary);
-    --colorHeading: var(--colorSecondary);
-
-    /* For, e.g. .news-container */
-    --colorTextInverse: var(--colorSecondaryLight);
-    --colorBackgroundInverse: var(--colorPrimaryDark);
-    --colorLinkInverse: var(--colorPrimaryLight);
-
-    --colorBlockBackground: var(--colorPrimaryDark);
-    --colorCode: #ffb8d1;
-  }
-}

assets/theme-css/light-mode.css

@@ -4,18 +4,16 @@
   align-items: center;
   width: 100vw;
   min-height: 45px;
-  background-color: var(--colorBackgroundInverse);
-  color: var(--colorTextInverse);
+  background-color: var(--colorPrimaryDark);
+  color: var(--colorSecondaryLight);
   white-space: nowrap;
 }
 
 .news-container a {
-  /* FIXME: We need a named color for this, like --colorLinkInverse. */
-  color: var(--colorSecondary);
+  color: var(--colorSecondaryLight);
 }
 
 .news-container a:hover {
-  /* FIXME: We need a named color for this, too. */
   color: var(--colorPrimaryLight);
 }
 

assets/theme-css/news.css

@@ -111,8 +111,8 @@ a > code {
   text-transform: uppercase;
   letter-spacing: 1.5px;
   font-weight: 500;
-  color: var(--colorSecondary);
-  background-color: var(--colorBackgroundInverse);
+  color: var(--colorSecondaryLight);
+  background-color: var(--colorPrimaryDark);
   border: none;
   border-radius: 25px;
   outline: none;
@@ -123,7 +123,7 @@ a > code {
   height: 475px;
 }
 #backtotop.visible #backtotop-color:hover {
-  background: var(--colorHighlight);
+  background: var(--colorYellow);
 }
 
 .mt-30 {
@@ -212,10 +212,6 @@ a.footer-link {
   color: var(--colorSecondary);
 }
 
-.icon {
-  color: var(--colorIcon);
-}
-
 .copyright {
   font-size: 12px;
   color: var(--colorSecondary);
@@ -327,7 +323,7 @@ a.navbar-item:visited {
 }
 
 a.navbar-item:hover {
-  color: var(--colorPrimaryLight);
+  color: var(--pst-color-link-hover);
 }
 
 .navbar-logo {