noxious/client
3
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix object image sizing

Browse Source
This commit is contained in:
Colin Kallemein 2024-07-07 23:03:44 +02:00
parent 1b46be98b8
commit 38307ec2d9
1 changed files with 5 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/utilities/zoneEditor/Objects.vue
View File

@ -17,16 +17,16 @@
</div> </div>
</template> </template>
<template #modalBody> <template #modalBody>
<div class="my-[15px] mx-auto"> <div class="m-[15px]">
<div class="columns-2 sm:columns-3 md:columns-4 lg:columns-5 gap-4"> <div class="flex justify-between flex-wrap gap-2.5 items-center">
<div v-for="(object, index) in zoneEditorStore.objectList" :key="index" class="mb-4"> <div v-for="(object, index) in zoneEditorStore.objectList" :key="index" class="max-w-[25%] inline-block">
<img <img
class="border-2 border-solid" class="border-2 border-solid max-w-full"
:src="`${config.server_endpoint}/assets/objects/${object.id}.png`" :src="`${config.server_endpoint}/assets/objects/${object.id}.png`"
alt="Object" alt="Object"
@click="zoneEditorStore.setSelectedObject(object)" @click="zoneEditorStore.setSelectedObject(object)"
:class="{ :class="{
'w-full h-auto cursor-pointer transition-all duration-300': true, 'cursor-pointer transition-all duration-300': true,
'border-cyan shadow-lg scale-105': zoneEditorStore.selectedObject?.id === object.id, 'border-cyan shadow-lg scale-105': zoneEditorStore.selectedObject?.id === object.id,
'border-transparent hover:border-gray-300': zoneEditorStore.selectedObject?.id !== object.id 'border-transparent hover:border-gray-300': zoneEditorStore.selectedObject?.id !== object.id
}" }"