From 2c96caee4f6ed48c9da0f1d63785402fa44e6237 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Sun, 17 Nov 2024 17:00:07 +0100
Subject: [PATCH] Text white when item is active in asset manager

---
 .../assetManager/partials/characterType/CharacterTypeList.vue   | 2 +-
 .../gameMaster/assetManager/partials/object/ObjectList.vue      | 2 +-
 .../gameMaster/assetManager/partials/sprite/SpriteList.vue      | 2 +-
 .../gameMaster/assetManager/partials/tile/TileList.vue          | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue b/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
index e040e0f..fb15206 100644
--- a/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
+++ b/src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue
@@ -14,7 +14,7 @@
     <div v-bind="wrapperProps" ref="elementToScroll">
       <a v-for="{ data: characterType } in list" :key="characterType.id" class="relative p-2.5 cursor-pointer block" :class="{ 'bg-cyan/80': assetManagerStore.selectedCharacterType?.id === characterType.id }" @click="assetManagerStore.setSelectedCharacterType(characterType as CharacterType)">
         <div class="flex items-center gap-2.5">
-          <span>{{ characterType.name }}</span>
+          <span :class="{ 'text-white': assetManagerStore.selectedCharacterType?.id === characterType.id }">{{ characterType.name }}</span>
         </div>
         <div class="absolute left-0 bottom-0 w-full h-px bg-gray-500"></div>
       </a>
diff --git a/src/components/gameMaster/assetManager/partials/object/ObjectList.vue b/src/components/gameMaster/assetManager/partials/object/ObjectList.vue
index 6f2e081..fe69668 100644
--- a/src/components/gameMaster/assetManager/partials/object/ObjectList.vue
+++ b/src/components/gameMaster/assetManager/partials/object/ObjectList.vue
@@ -16,7 +16,7 @@
           <div class="h-7 w-16 max-w-16 flex justify-center">
             <img class="h-7" :src="`${config.server_endpoint}/assets/objects/${object.id}.png`" alt="Object" />
           </div>
-          <span>{{ object.name }}</span>
+          <span :class="{ 'text-white': assetManagerStore.selectedObject?.id === object.id }">{{ object.name }}</span>
         </div>
         <div class="absolute left-0 bottom-0 w-full h-px bg-gray-500"></div>
       </a>
diff --git a/src/components/gameMaster/assetManager/partials/sprite/SpriteList.vue b/src/components/gameMaster/assetManager/partials/sprite/SpriteList.vue
index 73a46aa..c72e807 100644
--- a/src/components/gameMaster/assetManager/partials/sprite/SpriteList.vue
+++ b/src/components/gameMaster/assetManager/partials/sprite/SpriteList.vue
@@ -12,7 +12,7 @@
     <div v-bind="wrapperProps" ref="elementToScroll">
       <a v-for="{ data: sprite } in list" :key="sprite.id" class="relative p-2.5 cursor-pointer block" :class="{ 'bg-cyan/80': assetManagerStore.selectedSprite?.id === sprite.id }" @click="assetManagerStore.setSelectedSprite(sprite as Sprite)">
         <div class="flex items-center gap-2.5">
-          <span>{{ sprite.name }}</span>
+          <span :class="{ 'text-white': assetManagerStore.selectedSprite?.id === sprite.id }">{{ sprite.name }}</span>
         </div>
         <div class="absolute left-0 bottom-0 w-full h-px bg-gray-500"></div>
       </a>
diff --git a/src/components/gameMaster/assetManager/partials/tile/TileList.vue b/src/components/gameMaster/assetManager/partials/tile/TileList.vue
index 5db6dc8..102f180 100644
--- a/src/components/gameMaster/assetManager/partials/tile/TileList.vue
+++ b/src/components/gameMaster/assetManager/partials/tile/TileList.vue
@@ -16,7 +16,7 @@
           <div class="h-7 w-16 max-w-16 flex justify-center">
             <img class="h-7" :src="`${config.server_endpoint}/assets/tiles/${tile.id}.png`" alt="Tile" />
           </div>
-          <span>{{ tile.name }}</span>
+          <span :class="{ 'text-white': assetManagerStore.selectedTile?.id === tile.id }">{{ tile.name }}</span>
         </div>
         <div class="absolute left-0 bottom-0 w-full h-px bg-gray-500"></div>
       </a>