Map list small UI improvement
This commit is contained in:
parent
b5b6d0adcc
commit
d51fbc8030
@ -124,7 +124,7 @@ button {
|
||||
|
||||
&.active,
|
||||
&:hover {
|
||||
@apply bg-red-400;
|
||||
@apply bg-red-500;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -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>
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user