From 710a22c0a66a59385bf4d86a5126c68a18b36708 Mon Sep 17 00:00:00 2001
From: Kyle Conroy <kyleconroy@gmail.com>
Date: Mon, 7 Mar 2022 13:59:21 -0500
Subject: [PATCH] fix dark theme support

---
 jdaviz/components/toolbar_nested.vue | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/jdaviz/components/toolbar_nested.vue b/jdaviz/components/toolbar_nested.vue
index 682e462a0f..20db880481 100644
--- a/jdaviz/components/toolbar_nested.vue
+++ b/jdaviz/components/toolbar_nested.vue
@@ -28,7 +28,7 @@
         >
           <template v-slot:activator="{ on, attrs }">
             <v-list-item v-bind="attrs" v-on="on" :input-value="primary" @click="() => select_primary([menu_ind, id])">
-              <v-list-item-title><img :src="img" width="20"/></v-list-item-title>
+              <v-list-item-title><img class='invert-if-dark' :src="img" width="20"/></v-list-item-title>
             </v-list-item>
           </template>
           <span>{{ tooltip }}</span>
@@ -71,5 +71,12 @@
   bottom: 0px;
   right: 6px !important;
   margin-right: -22px;
+  /* the parent button will invert everything anyways, so we need to override this to be black first,
+     regardless of light or dark theme */
+  color: black !important;
+}
+
+.theme--dark .invert-if-dark {
+  filter: invert(1) !important;
 }
 </style>