From 3f41f9de3c3a6ad4895c8d1be38d27f312960535 Mon Sep 17 00:00:00 2001
From: Jacob Sommer <jacobgsommer@gmail.com>
Date: Wed, 24 Jan 2024 14:16:30 -0800
Subject: [PATCH] Boost contrast of primary color and more info button slightly
 for dark mode

---
 site/src/index.css                      |  4 ++++
 site/src/pages/RoadmapPage/Course.scss  |  4 ++--
 site/src/pages/RoadmapPage/Header.scss  |  7 -------
 site/src/pages/RoadmapPage/Quarter.scss |  2 +-
 site/src/pages/RoadmapPage/Year.scss    |  9 +--------
 site/src/style/theme.scss               | 20 ++++++++++++++++++++
 6 files changed, 28 insertions(+), 18 deletions(-)

diff --git a/site/src/index.css b/site/src/index.css
index 0c6f8ebc..2ec2e250 100644
--- a/site/src/index.css
+++ b/site/src/index.css
@@ -29,6 +29,10 @@ code {
   --peterportal-mid-gray: #8d8d8d;
   --peterportal-uci-gold: #ffd200;
   --peterportal-gray-blue: #f5f6fc;
+  --zot-blue: var(--peterportal-primary-color-1);
+  --aldrich-blue: var(--peterportal-primary-color-2);
+  --ring-road-white: #ffffff;
+  --petr-gray: #808080;
   --border-radius: 8px;
 }
 
diff --git a/site/src/pages/RoadmapPage/Course.scss b/site/src/pages/RoadmapPage/Course.scss
index 8e7fabbf..80dc77b8 100644
--- a/site/src/pages/RoadmapPage/Course.scss
+++ b/site/src/pages/RoadmapPage/Course.scss
@@ -1,5 +1,5 @@
 .course {
-  box-shadow: 0px 0px 4px #2484c6;
+  box-shadow: 0px 0px 4px var(--zot-blue);
   background: var(--overlay1);
   border-radius: 15px;
   height: auto;
@@ -9,7 +9,7 @@
 
   .name {
     font-weight: bold;
-    color: #2484c6;
+    color: var(--zot-blue);
     font-size: 18px;
   }
 
diff --git a/site/src/pages/RoadmapPage/Header.scss b/site/src/pages/RoadmapPage/Header.scss
index 4846cc2e..2701077c 100644
--- a/site/src/pages/RoadmapPage/Header.scss
+++ b/site/src/pages/RoadmapPage/Header.scss
@@ -1,10 +1,3 @@
-* {
-  --zot-blue: #2484c6;
-  --aldrich-blue: #74d1f6;
-  --ring-road-white: #ffffff;
-  --petr-gray: #808080;
-}
-
 .header {
   background: linear-gradient(to right, var(--zot-blue), var(--aldrich-blue));
   border-radius: var(--border-radius);
diff --git a/site/src/pages/RoadmapPage/Quarter.scss b/site/src/pages/RoadmapPage/Quarter.scss
index f6096e61..a1ddb015 100644
--- a/site/src/pages/RoadmapPage/Quarter.scss
+++ b/site/src/pages/RoadmapPage/Quarter.scss
@@ -13,7 +13,7 @@
 .quarter {
   background-color: var(--overlay1);
   border-radius: 10px;
-  box-shadow: 0px 0px 4px #2484c6;
+  box-shadow: 0px 0px 4px var(--zot-blue);
   flex: 1 1 30%;
   height: fit-content;
   margin: 0.75rem;
diff --git a/site/src/pages/RoadmapPage/Year.scss b/site/src/pages/RoadmapPage/Year.scss
index effb8e88..a13288e4 100644
--- a/site/src/pages/RoadmapPage/Year.scss
+++ b/site/src/pages/RoadmapPage/Year.scss
@@ -1,10 +1,3 @@
-* {
-  --zot-blue: #2484c6;
-  --aldrich-blue: #74d1f6;
-  --ring-road-white: #ffffff;
-  --petr-gray: #808080;
-}
-
 [data-theme='dark'] {
   .year-settings-btn:hover,
   .year-settings-btn:focus,
@@ -50,7 +43,7 @@
 
 .empty-quarter {
   border-radius: 10px;
-  box-shadow: 0px 0px 4px #2484c6;
+  box-shadow: 0px 0px 4px var(--zot-blue);
   flex: 1 1 30%;
   margin: 0.75rem;
 }
diff --git a/site/src/style/theme.scss b/site/src/style/theme.scss
index 79597f08..40f27d77 100644
--- a/site/src/style/theme.scss
+++ b/site/src/style/theme.scss
@@ -25,6 +25,8 @@
   --text-dark: #fff;
   --text-light: #fff;
   --hover: #cacbcd;
+  --peterportal-primary-color-1: #268cd3;
+  --zot-blue: var(--peterportal-primary-color-1);
 
   color-scheme: dark;
 }
@@ -61,6 +63,24 @@
     background-color: var(--overlay3);
   }
 
+  .btn-outline-primary {
+    color: #0f83ff;
+    border-color: #0f83ff;
+
+    &:hover,
+    &:focus {
+      color: white;
+    }
+
+    &:hover {
+      border-color: #007bff;
+    }
+
+    &:focus {
+      border-color: #2767d4;
+    }
+  }
+
   .close {
     color: var(--text);
     text-shadow: none;