diff --git a/src/components/utilities/zoneEditor/Objects.vue b/src/components/utilities/zoneEditor/Objects.vue index a2d0ff6..73e3934 100644 --- a/src/components/utilities/zoneEditor/Objects.vue +++ b/src/components/utilities/zoneEditor/Objects.vue @@ -21,12 +21,13 @@ <div class="columns-2 sm:columns-3 md:columns-4 lg:columns-5 gap-4"> <div v-for="(object, index) in zoneEditorStore.objectList" :key="index" class="mb-4"> <img + class="border-2 border-solid" :src="`${config.server_endpoint}/assets/objects/${object.id}.png`" alt="Object" @click="zoneEditorStore.setSelectedObject(object)" :class="{ - 'w-full h-auto cursor-pointer border-2 transition-all duration-300': true, - 'border-2 border-solid border-cyan shadow-lg scale-105': zoneEditorStore.selectedObject?.id === object.id, + 'w-full h-auto cursor-pointer transition-all duration-300': true, + 'border-cyan shadow-lg scale-105': zoneEditorStore.selectedObject?.id === object.id, 'border-transparent hover:border-gray-300': zoneEditorStore.selectedObject?.id !== object.id }" /> diff --git a/src/components/utilities/zoneEditor/Tiles.vue b/src/components/utilities/zoneEditor/Tiles.vue index 4ac6698..f8cdd02 100644 --- a/src/components/utilities/zoneEditor/Tiles.vue +++ b/src/components/utilities/zoneEditor/Tiles.vue @@ -16,20 +16,26 @@ <div class="m-[15px]"> <div class="flex flex-wrap gap-2.5"> <img - class="w-[64px] h-[32px] cursor-pointer border-2 border-solid border-transparent transition ease duration-300" + class="w-[64px] h-[32px] cursor-pointer border-2 border-solid border-transparent transition-all ease duration-300" src="/assets/zone/blank_tile.png" alt="Blank tile" @click="zoneEditorStore.setSelectedTile('blank_tile')" - :class="{ 'border-2 border-solid border-red': zoneEditorStore.selectedTile && zoneEditorStore.selectedTile === 'blank_tile' }" + :class="{ + 'border-cyan shadow-lg scale-105': zoneEditorStore.selectedTile === 'blank_tile', + 'border-transparent hover:border-gray-300': zoneEditorStore.selectedTile !== 'blank_tile' + }" /> <img - class="w-[64px] h-[32px] cursor-pointer border-2 border-solid border-transparent transition ease duration-300" + class="w-[64px] h-[32px] cursor-pointer border-2 border-solid transition-all ease duration-300" v-for="(tile, index) in zoneEditorStore.tileList" :key="index" :src="`${config.server_endpoint}/assets/tiles/${tile}.png`" alt="Tile" @click="zoneEditorStore.setSelectedTile(tile)" - :class="{ 'border-2 border-solid border-red': zoneEditorStore.selectedTile && zoneEditorStore.selectedTile === tile }" + :class="{ + 'border-cyan shadow-lg scale-105': zoneEditorStore.selectedTile === tile, + 'border-transparent hover:border-gray-300': zoneEditorStore.selectedTile !== tile + }" /> </div> </div>