From ea1789ebf68df35dd55f3011333767e92d479c54 Mon Sep 17 00:00:00 2001
From: IMB11 <calum@modrinth.com>
Date: Mon, 4 Aug 2025 18:33:38 +0100
Subject: [PATCH] fix: colors for dark mode only

---
 apps/frontend/src/assets/styles/global.scss           |  4 ++--
 .../ui/servers/marketing/MedalPlanPromotion.vue       | 11 ++++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/apps/frontend/src/assets/styles/global.scss b/apps/frontend/src/assets/styles/global.scss
index c4e6d113f..f8b5f5687 100644
--- a/apps/frontend/src/assets/styles/global.scss
+++ b/apps/frontend/src/assets/styles/global.scss
@@ -166,7 +166,7 @@ html {
   --landing-raw-bg: #fff;
 
   --medal-promotion-bg: #fff;
-  --medal-promotion-orange: #a86f35;
+  --medal-promotion-orange: #c08a3a;
 
   --banner-error-bg: #fee2e2;
   --banner-error-text: #991b1b;
@@ -305,7 +305,7 @@ html {
   --landing-raw-bg: #000;
 
   --medal-promotion-bg: #000;
-  --medal-promotion-orange: #b3600c54;
+  --medal-promotion-orange: #FFB84B54;
 
   --hover-filter: brightness(120%);
   --active-filter: brightness(140%);
diff --git a/apps/frontend/src/components/ui/servers/marketing/MedalPlanPromotion.vue b/apps/frontend/src/components/ui/servers/marketing/MedalPlanPromotion.vue
index c07e88426..cb134db4b 100644
--- a/apps/frontend/src/components/ui/servers/marketing/MedalPlanPromotion.vue
+++ b/apps/frontend/src/components/ui/servers/marketing/MedalPlanPromotion.vue
@@ -43,7 +43,12 @@ import MedalPromoBackground from "~/assets/images/illustrations/medal_promo_back
   left: 0;
   width: 100%;
   height: 100%;
-  background: linear-gradient(90deg, #45311470 50%, var(--medal-promotion-bg) 100%);
+  background: linear-gradient(
+    90deg,
+    color-mix(in srgb, var(--medal-promotion-orange) 25%, transparent),
+    transparent 50%,
+    var(--medal-promotion-bg) 100%
+  );
   z-index: 1;
   border-radius: inherit;
 }
@@ -64,4 +69,8 @@ import MedalPromoBackground from "~/assets/images/illustrations/medal_promo_back
   filter: drop-shadow(0 0 72px var(--color-orange)) drop-shadow(0 0 36px var(--color-orange))
     drop-shadow(0 0 18px var(--color-orange));
 }
+
+.text-orange {
+  color: #ffb84b;
+}
 </style>