From 3419315e658e67f8fb5e9f020b322e3387e2a239 Mon Sep 17 00:00:00 2001
From: Jas Singh <jaskiratpal.singh@outlook.com>
Date: Wed, 19 Feb 2025 17:23:57 -0800
Subject: [PATCH] Made shadows togglable with default set to false. (#786)

---
 src/components/settings/pages/config/bar/index.tsx           | 1 +
 src/components/settings/pages/config/general/index.tsx       | 1 +
 src/components/settings/pages/config/notifications/index.tsx | 1 +
 src/components/settings/pages/config/osd/index.tsx           | 1 +
 src/options.ts                                               | 4 ++++
 src/scss/style/bar/bar.scss                                  | 4 ++--
 src/scss/style/menus/menu.scss                               | 4 ++--
 src/scss/style/notifications/popups.scss                     | 4 ++--
 src/scss/style/osd/index.scss                                | 2 +-
 9 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/components/settings/pages/config/bar/index.tsx b/src/components/settings/pages/config/bar/index.tsx
index 10f7dc2..eee0ccd 100644
--- a/src/components/settings/pages/config/bar/index.tsx
+++ b/src/components/settings/pages/config/bar/index.tsx
@@ -53,6 +53,7 @@ export const BarSettings = (): JSX.Element => {
                     enums={['none', 'full', 'top', 'right', 'bottom', 'left', 'horizontal', 'vertical']}
                 />
                 <Option opt={options.theme.bar.border.width} title="Bar Border Width" type="string" />
+                <Option opt={options.theme.bar.enableShadow} title="Enable Shadow" type="boolean" />
                 <Option
                     opt={options.theme.bar.shadow}
                     title="Bar Shadow"
diff --git a/src/components/settings/pages/config/general/index.tsx b/src/components/settings/pages/config/general/index.tsx
index c5fe2ba..a02ea6c 100644
--- a/src/components/settings/pages/config/general/index.tsx
+++ b/src/components/settings/pages/config/general/index.tsx
@@ -65,6 +65,7 @@ export const BarGeneral = (): JSX.Element => {
                     max={10000}
                     increment={25}
                 />
+                <Option opt={options.theme.bar.menus.enableShadow} title="Enable Shadow" type="boolean" />
                 <Option
                     opt={options.theme.bar.menus.shadow}
                     title="Menu Shadow"
diff --git a/src/components/settings/pages/config/notifications/index.tsx b/src/components/settings/pages/config/notifications/index.tsx
index e98e8fe..e5f1887 100644
--- a/src/components/settings/pages/config/notifications/index.tsx
+++ b/src/components/settings/pages/config/notifications/index.tsx
@@ -22,6 +22,7 @@ export const NotificationSettings = (): JSX.Element => {
                     enums={['top left', 'top', 'top right', 'right', 'bottom right', 'bottom', 'bottom left', 'left']}
                 />
                 <Option opt={options.theme.notification.border_radius} title="Border Radius" type="string" />
+                <Option opt={options.theme.notification.enableShadow} title="Enable Shadow" type="boolean" />
                 <Option
                     opt={options.theme.notification.shadow}
                     title="Notification Shadow"
diff --git a/src/components/settings/pages/config/osd/index.tsx b/src/components/settings/pages/config/osd/index.tsx
index a835eb7..740ef70 100644
--- a/src/components/settings/pages/config/osd/index.tsx
+++ b/src/components/settings/pages/config/osd/index.tsx
@@ -49,6 +49,7 @@ export const OSDSettings = (): JSX.Element => {
                     type="string"
                 />
 
+                <Option opt={options.theme.osd.enableShadow} title="Enable Shadow" type="boolean" />
                 <Option
                     opt={options.theme.osd.shadow}
                     title="OSD Shadow"
diff --git a/src/options.ts b/src/options.ts
index 7f4076e..4dd386e 100644
--- a/src/options.ts
+++ b/src/options.ts
@@ -120,6 +120,7 @@ const options = mkOptions(CONFIG, {
             label: opt(colors.lavender),
             border: opt(secondary_colors.surface0),
             border_radius: opt('0.6em'),
+            enableShadow: opt(false),
             shadow: opt('0px 1px 2px 1px #16161e'),
             shadowMargins: opt('4px 4px'),
             time: opt(secondary_colors.overlay1),
@@ -151,6 +152,7 @@ const options = mkOptions(CONFIG, {
             active_monitor: opt(true),
             radius: opt('0.4em'),
             margins: opt('7px 7px 7px 7px'),
+            enableShadow: opt(false),
             shadow: opt('0px 0px 3px 2px #16161e'),
             location: opt<OSDAnchor>('right'),
             muted_zero: opt(false),
@@ -162,6 +164,7 @@ const options = mkOptions(CONFIG, {
             layer: opt<WindowLayer>('top'),
             margin_top: opt('0.5em'),
             opacity: opt(100),
+            enableShadow: opt(false),
             shadow: opt('0px 1px 2px 1px #16161e'),
             shadowMargins: opt('0px 0px 4px 0px'),
             margin_bottom: opt('0em'),
@@ -436,6 +439,7 @@ const options = mkOptions(CONFIG, {
                     radius: opt('0.7em'),
                     color: opt(colors.surface0),
                 },
+                enableShadow: opt(false),
                 shadow: opt('0px 0px 3px 1px #16161e'),
                 shadowMargins: opt('5px 5px'),
                 text: opt(colors.text),
diff --git a/src/scss/style/bar/bar.scss b/src/scss/style/bar/bar.scss
index c5637cf..60d667a 100644
--- a/src/scss/style/bar/bar.scss
+++ b/src/scss/style/bar/bar.scss
@@ -16,8 +16,8 @@
         background: if($bar-transparent, transparent, transparentize($bar-background, $transparency-value));
         border-radius: if($bar-floating, $bar-border_radius, 0em);
 
-        margin: $bar-shadowMargins;
-        box-shadow: $bar-shadow;
+        margin: if($bar-enableShadow, $bar-shadowMargins, 0px);
+        box-shadow: if($bar-enableShadow, $bar-shadow, 0 0 0 0);
 
         &.withBorder {
             border-top: if(
diff --git a/src/scss/style/menus/menu.scss b/src/scss/style/menus/menu.scss
index 09c858e..94eb492 100644
--- a/src/scss/style/menus/menu.scss
+++ b/src/scss/style/menus/menu.scss
@@ -228,8 +228,8 @@
 
 .dropdown-content {
     border-radius: $bar-menus-border-radius;
-    margin: $bar-menus-shadowMargins;
-    box-shadow: $bar-menus-shadow;
+    margin: if($bar-menus-enableShadow, $bar-menus-shadowMargins, 0px);
+    box-shadow: if($bar-menus-enableShadow, $bar-menus-shadow, 0 0 0 0);
 }
 
 .menu-label {
diff --git a/src/scss/style/notifications/popups.scss b/src/scss/style/notifications/popups.scss
index f2008bc..82e317c 100644
--- a/src/scss/style/notifications/popups.scss
+++ b/src/scss/style/notifications/popups.scss
@@ -7,8 +7,8 @@
     min-height: 4em;
     border-radius: $notification-border_radius;
     opacity: $notification-opacity * 0.01;
-    margin: $notification-shadowMargins;
-    box-shadow: $notification-shadow;
+    margin: if($notification-enableShadow, $notification-shadowMargins, 0px);
+    box-shadow: if($notification-enableShadow, $notification-shadow, 0 0 0 0);
 }
 
 .notification-card-container {
diff --git a/src/scss/style/osd/index.scss b/src/scss/style/osd/index.scss
index b8676a9..65cf662 100644
--- a/src/scss/style/osd/index.scss
+++ b/src/scss/style/osd/index.scss
@@ -6,7 +6,7 @@
     .osd-container {
         margin: $osd-margins;
         opacity: $osd-opacity * 0.01;
-        box-shadow: $osd-shadow;
+        box-shadow: if($osd-enableShadow, $osd-shadow, 0 0 0 0);
         border-radius: $osd-radius;
     }