From d4232055f94bdc438575db04fb9b590af33ca118 Mon Sep 17 00:00:00 2001
From: Diego Temkin <65834932+dtemkin1@users.noreply.github.com>
Date: Tue, 1 Oct 2024 20:17:19 -0400
Subject: [PATCH] Improve color contrast

---
 src/mixins/colorMixin.js | 25 +++++++++++++++++++------
 1 file changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/mixins/colorMixin.js b/src/mixins/colorMixin.js
index 2dbb54ec..f648614b 100644
--- a/src/mixins/colorMixin.js
+++ b/src/mixins/colorMixin.js
@@ -167,13 +167,26 @@ export default {
       return this.colors[courseColor];
     },
     getRawTextColor: function (courseColor) {
-      const r = parseInt(this.colors[courseColor].substring(1, 3), 16);
-      const g = parseInt(this.colors[courseColor].substring(3, 5), 16);
-      const b = parseInt(this.colors[courseColor].substring(5, 7), 16);
+      // See https://github.com/Myndex/max-contrast
+      // https://stackoverflow.com/questions/1855884/determine-font-color-based-on-background-color
 
-      return r * 0.299 + g * 0.587 + b * 0.114 > 186
-        ? "#000000bb"
-        : "#ffffffee";
+      const Rs = parseInt(this.colors[courseColor].substring(1, 3), 16);
+      const Gs = parseInt(this.colors[courseColor].substring(3, 5), 16);
+      const Bs = parseInt(this.colors[courseColor].substring(5, 7), 16);
+
+      const flipYs = 0.342; // based on APCA™ 0.98G middle contrast BG
+
+      const trc = 2.4,
+        Rco = 0.2126729,
+        Gco = 0.7151522,
+        Bco = 0.072175;
+
+      let Ys =
+        (Rs / 255.0) ** trc * Rco +
+        (Gs / 255.0) ** trc * Gco +
+        (Bs / 255.0) ** trc * Bco;
+
+      return Ys < flipYs ? "#ffffffdd" : "#000000dd";
     },
     // courseColor takes in subject
     courseColor: function (subject) {