From 463157918107a3bb1d9b0bd98537c2e87b5a1f74 Mon Sep 17 00:00:00 2001
From: Stefan Zermatten <stefanzermatten@gmail.com>
Date: Sun, 31 May 2020 22:22:42 +0200
Subject: [PATCH] Character toolbar now correctly uses dark and light text
 where appropriate

---
 .../creature/character/CharacterSheetToolbar.vue | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/app/imports/ui/creature/character/CharacterSheetToolbar.vue b/app/imports/ui/creature/character/CharacterSheetToolbar.vue
index a59ece05..58f09555 100644
--- a/app/imports/ui/creature/character/CharacterSheetToolbar.vue
+++ b/app/imports/ui/creature/character/CharacterSheetToolbar.vue
@@ -2,8 +2,9 @@
   <v-toolbar
     app
     class="character-sheet-toolbar"
-    :color="creature && creature.color || 'secondary'"
-    dark
+    :color="toolbarColor"
+    :dark="isDark"
+    :light="!isDark"
     tabs
     dense
   >
@@ -122,6 +123,7 @@ import { theme } from '/imports/ui/theme.js';
 import { recomputeCreature } from '/imports/api/creature/computation/recomputeCreature.js';
 import { assertEditPermission } from '/imports/api/creature/creaturePermissions.js';
 import { updateUserSharePermissions } from '/imports/api/sharing/sharing.js';
+import isDarkColor from '/imports/ui/utility/isDarkColor.js';
 
 export default {
   props: {
@@ -137,6 +139,16 @@ export default {
     creatureId(){
       return this.$route.params.id;
     },
+    toolbarColor(){
+      if (this.creature && this.creature.color){
+        return this.creature.color;
+      } else {
+        return this.$vuetify.theme.secondary;
+      }
+    },
+    isDark(){
+      return isDarkColor(this.toolbarColor);
+    },
   },
   methods: {
     ...mapMutations([