From 86f8b768353c5f0faa85799339ee55e97d5799c9 Mon Sep 17 00:00:00 2001
From: Snow <135516526+BabyBoySnow@users.noreply.github.com>
Date: Tue, 15 Oct 2024 22:06:53 -0500
Subject: [PATCH] Revert "var(--background-shading) -> $bg-shading"

This reverts commit a7a3752e7392ddcdcfb46767b53727e3c8b05763.
---
 src/channels/specialChannels.scss | 12 ++++++------
 src/chat/call.scss                |  8 ++++----
 src/chat/stageCall.scss           |  6 +++---
 src/fixespt2.scss                 |  2 +-
 src/general/scrollbar.scss        |  2 +-
 src/home/friends.scss             |  4 ++--
 src/home/nitro.scss               |  2 +-
 src/home/requests.scss            |  2 +-
 src/injectors/ven/plugins.scss    |  2 +-
 src/members/members.scss          |  4 ++--
 src/messages/poll.scss            |  2 +-
 src/modals/otherModals.scss       |  4 ++--
 src/pages/appDirectory.scss       | 10 +++++-----
 src/pages/discordShop.scss        |  4 ++--
 src/pages/forums.scss             |  4 ++--
 src/popouts/inboxPopout.scss      |  2 +-
 src/popouts/searchPopout.scss     |  2 +-
 src/settings/onboarding.scss      |  4 ++--
 src/settings/userSettings.scss    |  2 +-
 src/variables.scss                |  1 -
 20 files changed, 39 insertions(+), 40 deletions(-)

diff --git a/src/channels/specialChannels.scss b/src/channels/specialChannels.scss
index 98baa9fe2..d7fbe098d 100644
--- a/src/channels/specialChannels.scss
+++ b/src/channels/specialChannels.scss
@@ -1,10 +1,10 @@
 /*CUSTOMIZE CHANNELS*/
 
 %customizeChannelsHeader {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.6)) !important;
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6)) !important;
 }
 %customizeChannels {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.5)) !important;
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.5)) !important;
 }
 
 /*header*/
@@ -54,10 +54,10 @@
 }
 
 %browseChannelsRow {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   &:hover {
     &:not(%browseChannelsDisabled) {
-      background-color: rgba(0, 0, 0, calc($bg-shading * 0.6));
+      background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
     }
   }
 }
@@ -111,7 +111,7 @@
   %serverGuideAction,
   %serverGuideSidebarCard,
   %serverGuideRow {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   }
   %serverGuideAction:hover {
     background: $hover-color;
@@ -140,7 +140,7 @@
 }
 /*Cases where we get taken to channels*/
 %serverGuideChannelHintBanner {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 %serverGuideChannelHintIcon {
   background: $main-color;
diff --git a/src/chat/call.scss b/src/chat/call.scss
index 82a934971..8bfde681f 100644
--- a/src/chat/call.scss
+++ b/src/chat/call.scss
@@ -1,8 +1,8 @@
 /* PRIVATE CALL */
 %callWrapper {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.8));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.8));
   &%callMinimum {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.8));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.8));
   }
 }
 %callContainer {
@@ -11,7 +11,7 @@
 
 // VIDEO STREAM
 %callTile {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.7));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.7));
 }
 %callInviteButton {
   background-color: $main-color;
@@ -52,7 +52,7 @@
 }
 
 %streamStillRunning {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.7));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.7));
 }
 
 // ACTION BUTTON
diff --git a/src/chat/stageCall.scss b/src/chat/stageCall.scss
index 035e236d2..ecc2c4bf8 100644
--- a/src/chat/stageCall.scss
+++ b/src/chat/stageCall.scss
@@ -63,9 +63,9 @@
   }
 }
 %stageOptionContainer {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.3));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.3));
   &:hover {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.6));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
   }
 }
 %stageLeaveButton {
@@ -99,7 +99,7 @@
 
 // REQUESTS
 %stageRequestContainer {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.6));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
 }
 %stageIconBigBackground {
   background-color: $main-color;
diff --git a/src/fixespt2.scss b/src/fixespt2.scss
index c87e65fbb..fd9bc2e2c 100644
--- a/src/fixespt2.scss
+++ b/src/fixespt2.scss
@@ -5,7 +5,7 @@ div.popoutList_da8701.phoneFieldPopout_ff761b.elevationBorderLow_ff8688 {
 
 // Security keys list https://discord.com/channels/212324635356692500/858733936800956427/1270769660039663636
 div.credentialList_eaef52 {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   border-radius: 4px;
 }
 div.name_d808b0 {
diff --git a/src/general/scrollbar.scss b/src/general/scrollbar.scss
index 1ba8a28bd..c34508ba8 100644
--- a/src/general/scrollbar.scss
+++ b/src/general/scrollbar.scss
@@ -62,7 +62,7 @@
 %friendsTable {
   %scroller {
     &::-webkit-scrollbar-track-piece {
-      background-color: rgba(0, 0, 0, calc($bg-shading * 0.3)) !important;
+      background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.3)) !important;
     }
   }
 }
diff --git a/src/home/friends.scss b/src/home/friends.scss
index 28475e166..44922753e 100644
--- a/src/home/friends.scss
+++ b/src/home/friends.scss
@@ -7,7 +7,7 @@
 
 // FRIENDS COLUMN
 %friendsColumn {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 %friendsSearch {
   background-color: hsla(0, 0%, 100%, 0.07);
@@ -117,7 +117,7 @@
 
 // NOW PLAYING
 %nowPlayingColumn {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.6));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
 }
 %nowPlayingColumnContainer {
   background-color: transparent;
diff --git a/src/home/nitro.scss b/src/home/nitro.scss
index 0075bdf68..f27408ea7 100644
--- a/src/home/nitro.scss
+++ b/src/home/nitro.scss
@@ -32,7 +32,7 @@
 
 // PERKS PAGE
 %nitroPerksScroller {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.6));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
   transition: all 0.5s ease-in-out;
 }
 %nitroPerksBackButton {
diff --git a/src/home/requests.scss b/src/home/requests.scss
index 9e318b2c6..a3975cd26 100644
--- a/src/home/requests.scss
+++ b/src/home/requests.scss
@@ -7,5 +7,5 @@
 }
 /*was it spam*/
 %messageReqSpamCheck {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.3));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.3));
 }
diff --git a/src/injectors/ven/plugins.scss b/src/injectors/ven/plugins.scss
index db5710ec7..eec26f1b7 100644
--- a/src/injectors/ven/plugins.scss
+++ b/src/injectors/ven/plugins.scss
@@ -1,6 +1,6 @@
 /*Shiki code blocks*/
 .shiki-plain {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.2)) !important;
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.2)) !important;
 }
 
 .shiki-container {
diff --git a/src/members/members.scss b/src/members/members.scss
index f18adfd8b..2f8646425 100644
--- a/src/members/members.scss
+++ b/src/members/members.scss
@@ -235,10 +235,10 @@
 }
 // MEMBERS ACTIVITY SECTION (as opposed to just the text under members)
 %memberActivityContainer {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   border: 2px solid transparent;
   &:hover {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
     border: 2px solid $hover-color;
   }
 }
diff --git a/src/messages/poll.scss b/src/messages/poll.scss
index 74106310f..67e7b2f3c 100644
--- a/src/messages/poll.scss
+++ b/src/messages/poll.scss
@@ -1,5 +1,5 @@
 %poll {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 /* selection */
 %pollAnswerSelectionIcon %pollRadioForeground {
diff --git a/src/modals/otherModals.scss b/src/modals/otherModals.scss
index 24c485cac..1d401013d 100644
--- a/src/modals/otherModals.scss
+++ b/src/modals/otherModals.scss
@@ -147,7 +147,7 @@
   background: rgba(0, 0, 0, 0.4);
 }
 %activityTag {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.5));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.5));
 }
 %activityItem {
   background: rgba(0, 0, 0, 0.4);
@@ -197,7 +197,7 @@
     }
   }
   %soundboardHint {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.3));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.3));
   }
 }
 
diff --git a/src/pages/appDirectory.scss b/src/pages/appDirectory.scss
index 546c85cdf..3380ee2c3 100644
--- a/src/pages/appDirectory.scss
+++ b/src/pages/appDirectory.scss
@@ -13,19 +13,19 @@
 
 // HOME PAGE
 %directoryCategory {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   &:hover {
     background: $hover-color;
   }
 }
 %directoryCard,
 %directoryNewToApps {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 %directoryListCard {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
   &%directoryCardClickable:hover {
-    background-color: rgba(0, 0, 0, calc($bg-shading * 0.6));
+    background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
     color: #fff;
     %textMediumNormal {
       color: #fff;
@@ -33,7 +33,7 @@
   }
 }
 %directoryFooter {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 
 // SEARCH
diff --git a/src/pages/discordShop.scss b/src/pages/discordShop.scss
index 82c5ccd38..9ee4bd83f 100644
--- a/src/pages/discordShop.scss
+++ b/src/pages/discordShop.scss
@@ -12,7 +12,7 @@
   background-color: transparent;
 }
 %shopBackground {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 %shopPageWrapper {
   background-color: transparent;
@@ -104,5 +104,5 @@
 
 // Shop what's new
 %shopWhatsNew {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.8));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.8));
 }
diff --git a/src/pages/forums.scss b/src/pages/forums.scss
index a3d85a587..bc3466b49 100644
--- a/src/pages/forums.scss
+++ b/src/pages/forums.scss
@@ -56,10 +56,10 @@
 
 // GALLERY VIEW
 %forumCardContainer {
-  background: rgba(0, 0, 0, calc($bg-shading * 0.3));
+  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.3));
   border: 2px solid $main-color;
   &:hover {
-    background: rgba(0, 0, 0, calc($bg-shading * 0.3));
+    background: rgba(0, 0, 0, calc(var(--background-shading) * 0.3));
     border: 2px solid $hover-color;
   }
   &%forumOpen {
diff --git a/src/popouts/inboxPopout.scss b/src/popouts/inboxPopout.scss
index 06b7e1054..93d696fb8 100644
--- a/src/popouts/inboxPopout.scss
+++ b/src/popouts/inboxPopout.scss
@@ -145,5 +145,5 @@
 
 // CHATTING ABOUT: TOPIC
 %inboxChattingAbout {
-  background-color: hsla(0, 0%, 30%, calc($bg-shading * 0.5));
+  background-color: hsla(0, 0%, 30%, calc(var(--background-shading) * 0.5));
 }
diff --git a/src/popouts/searchPopout.scss b/src/popouts/searchPopout.scss
index dd0fe62e3..b956383ed 100644
--- a/src/popouts/searchPopout.scss
+++ b/src/popouts/searchPopout.scss
@@ -168,7 +168,7 @@
 %themeDark %calendarPicker {
   %datepicker,
   %datepickerHeader {
-    background-color: rgba(0, 0, 0, calc($bg-shading * 0.8));
+    background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.8));
   }
   > %datepicker {
     %datepickerNavigation {
diff --git a/src/settings/onboarding.scss b/src/settings/onboarding.scss
index b236f22d6..ea0593443 100644
--- a/src/settings/onboarding.scss
+++ b/src/settings/onboarding.scss
@@ -38,7 +38,7 @@
 
 // FOOTER
 %onboardingFooterContainer {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4)) !important;
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4)) !important;
   box-shadow: none;
 }
 
@@ -193,7 +193,7 @@
 }
 
 %onboardingRecommendedReadOnly {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 
 %onboardingPickAnEmoji {
diff --git a/src/settings/userSettings.scss b/src/settings/userSettings.scss
index 3ee468fa3..0629d3366 100644
--- a/src/settings/userSettings.scss
+++ b/src/settings/userSettings.scss
@@ -13,7 +13,7 @@
   border-color: transparent;
 }
 %accountSettingsBadges {
-  background-color: rgba(0, 0, 0, calc($bg-shading * 0.4));
+  background-color: rgba(0, 0, 0, calc(var(--background-shading) * 0.4));
 }
 // MY ACCOUNT - VERIFY PHONE
 %phoneInput {
diff --git a/src/variables.scss b/src/variables.scss
index 8739bf5a5..043eec0c7 100644
--- a/src/variables.scss
+++ b/src/variables.scss
@@ -163,4 +163,3 @@ $cv: (
 // SHORTHANDS
 $main-color: cv('colors.main');
 $hover-color: cv('colors.hover');
-$bg-shading: cv('bg.app.shading');