mirror of
https://github.com/sysadminsmedia/homebox.git
synced 2025-12-21 21:33:02 +01:00
3a4fae5eb8
* add missing translations and translate page titles * fix: actually use the declared localized variables * lint and prettier fixes * add missing translations for toasts and confirms * use components for shift/enter keys, add pluralization for photos, and fix primary photo conditional * remove prop defaults since we're computing these anyways
52 lines
1.4 KiB
Vue
52 lines
1.4 KiB
Vue
<template>
|
|
<Dialog v-if="isDesktop" :dialog-id="dialogId">
|
|
<DialogScrollContent>
|
|
<DialogHeader>
|
|
<DialogTitle>{{ title }}</DialogTitle>
|
|
</DialogHeader>
|
|
|
|
<slot />
|
|
|
|
<DialogFooter>
|
|
<i18n-t
|
|
keypath="components.app.create_modal.createAndAddAnother"
|
|
tag="span"
|
|
class="flex items-center gap-1 text-sm"
|
|
>
|
|
<template #shiftKey>
|
|
<Shortcut size="sm" :keys="[$t('components.app.create_modal.shift')]" />
|
|
</template>
|
|
<template #enterKey>
|
|
<Shortcut size="sm" :keys="[$t('components.app.create_modal.enter')]" />
|
|
</template>
|
|
</i18n-t>
|
|
</DialogFooter>
|
|
</DialogScrollContent>
|
|
</Dialog>
|
|
|
|
<Drawer v-else :dialog-id="dialogId">
|
|
<DrawerContent class="max-h-[90%]">
|
|
<DrawerHeader>
|
|
<DrawerTitle>{{ title }}</DrawerTitle>
|
|
</DrawerHeader>
|
|
|
|
<div class="m-2 overflow-y-auto p-2">
|
|
<slot />
|
|
</div>
|
|
</DrawerContent>
|
|
</Drawer>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useMediaQuery } from "@vueuse/core";
|
|
import { Drawer, DrawerContent, DrawerHeader, DrawerTitle } from "@/components/ui/drawer";
|
|
import { Dialog, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
|
|
|
|
const isDesktop = useMediaQuery("(min-width: 768px)");
|
|
|
|
defineProps<{
|
|
dialogId: string;
|
|
title: string;
|
|
}>();
|
|
</script>
|