From 955d7ec5f521037939363cfd94538d0c25f9eb7c Mon Sep 17 00:00:00 2001
From: Laila Los <44241786+ElectronicBlueberry@users.noreply.github.com>
Date: Mon, 4 Mar 2024 14:15:38 +0100
Subject: [PATCH] apply default theme to theme selector

---
 client/src/components/User/ThemeSelector.vue      | 2 +-
 client/src/style/scss/custom_theme_variables.scss | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/client/src/components/User/ThemeSelector.vue b/client/src/components/User/ThemeSelector.vue
index 46f0948e9c98..d27dd058a118 100644
--- a/client/src/components/User/ThemeSelector.vue
+++ b/client/src/components/User/ThemeSelector.vue
@@ -35,7 +35,7 @@ watch(
 </script>
 
 <template>
-    <b-card :show="show" class="mr-3 overflow-auto">
+    <b-card :show="show" class="mr-3 overflow-auto reset-theme-variables">
         <b-form-radio-group v-model="currentValue">
             <b-form-radio
                 v-for="(themeDetails, theme, index) in config.themes"
diff --git a/client/src/style/scss/custom_theme_variables.scss b/client/src/style/scss/custom_theme_variables.scss
index bcf04723bd38..b8d909ffd374 100644
--- a/client/src/style/scss/custom_theme_variables.scss
+++ b/client/src/style/scss/custom_theme_variables.scss
@@ -1,6 +1,7 @@
 @import "theme/blue.scss";
 
-html {
+html,
+.reset-theme-variables {
     --masthead-color: #{$masthead-color};
     --masthead-text-color: #{$masthead-text-color};
     --masthead-text-hover: #{$masthead-text-hover};