From 8142d6fcbd7ca87433c7dd83a5f9c74724d6cbcd Mon Sep 17 00:00:00 2001
From: Benjamin Lu <benjaminlu1107@gmail.com>
Date: Mon, 30 Jun 2025 19:40:44 -0400
Subject: [PATCH] basic styling

---
 .../graph/vueWidgets/WidgetToggleSwitch.vue    | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/components/graph/vueWidgets/WidgetToggleSwitch.vue b/src/components/graph/vueWidgets/WidgetToggleSwitch.vue
index e74203b7c..c6ad85698 100644
--- a/src/components/graph/vueWidgets/WidgetToggleSwitch.vue
+++ b/src/components/graph/vueWidgets/WidgetToggleSwitch.vue
@@ -3,7 +3,23 @@
     <label v-if="widget.name" class="text-sm opacity-80">{{
       widget.name
     }}</label>
-    <ToggleSwitch v-model="value" v-bind="filteredProps" :disabled="readonly" />
+    <ToggleSwitch
+      v-model="value"
+      v-bind="filteredProps"
+      :disabled="readonly"
+      :pt="{
+        slider: ({ props }) => ({
+          style: {
+            backgroundColor: props.modelValue ? '#0b8ce9' : '#0e0e12'
+          }
+        }),
+        handle: ({ props }) => ({
+          style: {
+            backgroundColor: props.modelValue ? '#ffffff' : '#5b5e7d'
+          }
+        })
+      }"
+    />
   </div>
 </template>