1
0
forked from noxious/client

Map list small UI improvement

This commit is contained in:
Dennis Postma 2025-02-17 19:23:30 +01:00
parent b5b6d0adcc
commit d51fbc8030
2 changed files with 9 additions and 10 deletions

View File

@ -124,7 +124,7 @@ button {
&.active,
&:hover {
@apply bg-red-400;
@apply bg-red-500;
}
}

View File

@ -1,17 +1,17 @@
<template>
<Modal ref="modalRef" :is-resizable="false" :modal-width="300" :modal-height="360" bg-style="none">
<template #modalHeader>
<h3 class="text-lg text-white">Maps</h3>
<div class="flex items-center">
<button class="btn-cyan w-7 h-7 font-normal flex items-center justify-center" @click="createMapModal?.open">+</button>
<h3 class="text-lg text-white ml-2">
Maps
</h3>
</div>
</template>
<template #modalBody>
<div class="my-4 mx-auto h-full">
<div class="text-center mb-4 px-2 flex gap-2.5">
<button class="btn-cyan py-1.5 min-w-[calc(50%_-_5px)]" @click="fetchMaps">Refresh</button>
<button class="btn-cyan py-1.5 min-w-[calc(50%_-_5px)]" @click="createMapModal?.open">New</button>
</div>
<div class="overflow-y-auto h-[calc(100%-20px)]">
<div class="mx-auto h-full">
<div class="overflow-y-auto h-[calc(100%)]">
<div class="relative p-2.5 cursor-pointer flex gap-y-2.5 gap-x-5 flex-wrap" v-for="(map, index) in mapList" :key="map.id">
<div class="absolute left-0 top-0 w-full h-px bg-gray-500" v-if="index === 0"></div>
<div class="flex gap-3 items-center w-full" @click="() => loadMap(map.id)">
<span>{{ map.name }}</span>
<span class="ml-auto gap-1 flex">
@ -24,7 +24,6 @@
</div>
</template>
</Modal>
<CreateMap ref="createMapModal" @create="fetchMaps" />
</template>