mirrors/homebox
1
0
Fork 1
mirror of https://github.com/hay-kot/homebox.git synced 2025-08-03 16:20:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix spacing issue

Browse source
This commit is contained in:
Hayden 2022-10-24 18:12:54 -08:00
parent d30bfac38a
commit 12fc3541da
1 changed files with 52 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

103
frontend/pages/location/[id].vue
View file

@ -124,7 +124,7 @@
</script> </script>
<template> <template>
<BaseContainer> <div>
<BaseModal v-model="updateModal"> <BaseModal v-model="updateModal">
<template #title> Update Location </template> <template #title> Update Location </template>
<form v-if="location" @submit.prevent="update"> <form v-if="location" @submit.prevent="update">
@ -136,59 +136,60 @@
</div> </div>
</form> </form>
</BaseModal> </BaseModal>
<BaseContainer class="space-y-10 mb-16">
<BaseCard>
<template #title>
<BaseSectionHeader>
<Icon name="mdi-map-marker" class="mr-2 -mt-1 text-base-content" />
<span class="text-base-content">
{{ location ? location.name : "" }}
</span>
<div v-if="location && location.parent" class="text-sm breadcrumbs pb-0">
<ul class="text-base-content/70">
<li>
<NuxtLink :to="`/location/${location.parent.id}`"> {{ location.parent.name }}</NuxtLink>
</li>
<li>{{ location.name }}</li>
</ul>
</div>
</BaseSectionHeader>
</template>
<BaseCard class="mb-16"> <template #title-actions>
<template #title> <div class="flex mt-2 gap-2">
<BaseSectionHeader> <div class="form-control max-w-[160px]">
<Icon name="mdi-map-marker" class="mr-2 -mt-1 text-base-content" /> <label class="label cursor-pointer">
<span class="text-base-content"> <input v-model="preferences.showDetails" type="checkbox" class="toggle toggle-primary" />
{{ location ? location.name : "" }} <span class="label-text ml-2"> Detailed View </span>
</span> </label>
<div v-if="location && location.parent" class="text-sm breadcrumbs pb-0"> </div>
<ul class="text-base-content/70"> <BaseButton class="ml-auto" size="sm" @click="openUpdate">
<li> <Icon class="mr-1" name="mdi-pencil" />
<NuxtLink :to="`/location/${location.parent.id}`"> {{ location.parent.name }}</NuxtLink> Edit
</li> </BaseButton>
<li>{{ location.name }}</li> <BaseButton size="sm" @click="confirmDelete">
</ul> <Icon class="mr-1" name="mdi-delete" />
Delete
</BaseButton>
</div> </div>
</BaseSectionHeader> </template>
</template>
<template #title-actions> <DetailsSection :details="details" />
<div class="flex mt-2 gap-2"> </BaseCard>
<div class="form-control max-w-[160px]">
<label class="label cursor-pointer"> <section v-if="location && location.items.length > 0">
<input v-model="preferences.showDetails" type="checkbox" class="toggle toggle-primary" /> <BaseSectionHeader class="mb-5"> Items </BaseSectionHeader>
<span class="label-text ml-2"> Detailed View </span> <div class="grid gap-2 grid-cols-1 sm:grid-cols-2">
</label> <ItemCard v-for="item in location.items" :key="item.id" :item="item" />
</div>
<BaseButton class="ml-auto" size="sm" @click="openUpdate">
<Icon class="mr-1" name="mdi-pencil" />
Edit
</BaseButton>
<BaseButton size="sm" @click="confirmDelete">
<Icon class="mr-1" name="mdi-delete" />
Delete
</BaseButton>
</div> </div>
</template> </section>
<DetailsSection :details="details" /> <section v-if="location && location.children.length > 0">
</BaseCard> <BaseSectionHeader class="mb-5"> Child Locations </BaseSectionHeader>
<div class="grid gap-2 grid-cols-1 sm:grid-cols-3">
<section v-if="location && location.items.length > 0"> <LocationCard v-for="item in location.children" :key="item.id" :location="item" />
<BaseSectionHeader class="mb-5"> Items </BaseSectionHeader> </div>
<div class="grid gap-2 grid-cols-1 sm:grid-cols-2"> </section>
<ItemCard v-for="item in location.items" :key="item.id" :item="item" /> </BaseContainer>
</div> </div>
</section>
<section v-if="location && location.children.length > 0">
<BaseSectionHeader class="mb-5"> Child Locations </BaseSectionHeader>
<div class="grid gap-2 grid-cols-1 sm:grid-cols-3">
<LocationCard v-for="item in location.children" :key="item.id" :location="item" />
</div>
</section>
</BaseContainer>
</template> </template>