From 870cb61adbf8ee1d18983b7bf57fb7c2004ccc99 Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mrmr.io>
Date: Fri, 17 Jan 2025 07:58:26 +0530
Subject: [PATCH] Theme

---
 web/apps/auth/src/pages/share.tsx           | 11 ++++++++---
 web/packages/base/components/utils/theme.ts |  7 ++++---
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/web/apps/auth/src/pages/share.tsx b/web/apps/auth/src/pages/share.tsx
index c60603e73b..910b28e365 100644
--- a/web/apps/auth/src/pages/share.tsx
+++ b/web/apps/auth/src/pages/share.tsx
@@ -1,6 +1,6 @@
 import { EnteLogo } from "@/base/components/EnteLogo";
 import { decryptMetadataJSON_New } from "@/base/crypto";
-import { Box, Button, Stack, Typography } from "@mui/material";
+import { Box, Button, Stack, Typography, useTheme } from "@mui/material";
 import React, { useEffect, useMemo, useState } from "react";
 
 interface SharedCode {
@@ -19,6 +19,8 @@ const Page: React.FC = () => {
         progress: 0,
     });
 
+    const theme = useTheme();
+
     const getTimeStatus = (
         currentTime: number,
         startTime: number,
@@ -101,8 +103,11 @@ const Page: React.FC = () => {
     }, [sharedCode]);
 
     const progressBarColor = useMemo(
-        () => (100 - codeDisplay.progress > 40 ? "#8E2DE2" : "#FFC107"),
-        [codeDisplay.progress],
+        () =>
+            100 - codeDisplay.progress > 40
+                ? theme.vars.palette.accent.light
+                : "#FFC107",
+        [theme, codeDisplay.progress],
     );
 
     return (
diff --git a/web/packages/base/components/utils/theme.ts b/web/packages/base/components/utils/theme.ts
index 0da06d187c..4f24a380a2 100644
--- a/web/packages/base/components/utils/theme.ts
+++ b/web/packages/base/components/utils/theme.ts
@@ -133,9 +133,10 @@ const _colors = {
         light: "#01DE4D",
     },
     accentAuth: {
-        dark: "rgb(164, 0, 182)",
-        main: "rgb(150, 13, 214)",
-        light: "rgb(152, 77, 244)",
+        dark: "#8e0fcb",
+        main: "#9610d6",
+        light: "#8e2de2",
+        lighter: "#984df4", /* TODO(LM) */
     },
     fixed: {
         white: "#fff",