arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-29 11:20:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore(Slideover): migrate by using DialogPanel

Browse Source
This commit is contained in:
Benjamin Canac
2022-04-28 14:36:45 +02:00
parent 936d6a5fee
commit 6532b4bfdd
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/runtime/components/overlays/Slideover.vue
View File

@@ -10,7 +10,7 @@
leave-from="opacity-100" leave-from="opacity-100"
leave-to="opacity-0" leave-to="opacity-0"
> >
<DialogOverlay class="fixed inset-0 bg-gray-500/75 dark:bg-gray-600/75 transition-opacity" /> <div class="fixed inset-0 bg-gray-500/75 dark:bg-gray-600/75 transition-opacity" />
</TransitionChild> </TransitionChild>
<TransitionChild <TransitionChild
@@ -22,7 +22,7 @@
leave-from="translate-x-0" leave-from="translate-x-0"
leave-to="-translate-x-full" leave-to="-translate-x-full"
> >
<div class="relative flex-1 flex flex-col w-full max-w-md u-bg-white focus:outline-none"> <DialogPanel class="relative flex-1 flex flex-col w-full max-w-md u-bg-white focus:outline-none">
<div v-if="$slots.header" class="border-b u-border-gray-200"> <div v-if="$slots.header" class="border-b u-border-gray-200">
<div class="flex items-center justify-between px-4 sm:px-6 h-16"> <div class="flex items-center justify-between px-4 sm:px-6 h-16">
<slot name="header" /> <slot name="header" />
@@ -30,7 +30,7 @@
</div> </div>
<slot /> <slot />
</div> </DialogPanel>
</TransitionChild> </TransitionChild>
</Dialog> </Dialog>
</TransitionRoot> </TransitionRoot>
@@ -39,7 +39,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed } from 'vue' import { computed } from 'vue'
import type { WritableComputedRef, PropType } from 'vue' import type { WritableComputedRef, PropType } from 'vue'
import { Dialog, DialogOverlay, TransitionChild, TransitionRoot } from '@headlessui/vue' import { Dialog, DialogPanel, TransitionRoot, TransitionChild } from '@headlessui/vue'
const props = defineProps({ const props = defineProps({
modelValue: { modelValue: {