Elizhium/litlyx
1
0
Fork 0
mirror of https://github.com/Litlyx/litlyx synced 2025-12-10 07:48:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

better drawer

Browse Source
This commit is contained in:
Emily
2024-12-19 16:46:03 +01:00
parent 3f26f1ab68
commit 7009a0ad02
17 changed files with 108 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
dashboard/app.vue
View File

@@ -10,7 +10,7 @@ const { alerts, closeAlert } = useAlert();
const { showDialog, closeDialog, dialogComponent, dialogParams, dialogStyle, dialogClosable } = useCustomDialog();
const { visible } = usePricingDrawer();
const { drawerVisible, hideDrawer, drawerClasses } = useDrawer();
</script>
@@ -18,10 +18,10 @@ const { visible } = usePricingDrawer();
<div class="w-dvw h-dvh bg-lyx-background-light relative">
<Transition name="pdrawer">
<LazyPricingDrawer @onCloseClick="visible = false"
class="bg-black fixed right-0 top-0 w-full xl:w-[60vw] xl:min-w-[65rem] h-full z-[20]" v-if="visible">
</LazyPricingDrawer>
<Transition name="drawer">
<LazyDrawerGeneric @onCloseClick="hideDrawer()" :class="drawerClasses"
class="bg-black fixed right-0 top-0 w-full xl:w-[60vw] xl:min-w-[65rem] h-full z-[20]" v-if="drawerVisible">
</LazyDrawerGeneric>
</Transition>
@@ -78,18 +78,18 @@ const { visible } = usePricingDrawer();
</template>
<style scoped lang="scss">
.pdrawer-enter-active,
.pdrawer-leave-active {
.drawer-enter-active,
.drawer-leave-active {
transition: all .5s ease-in-out;
}
.pdrawer-enter-from,
.pdrawer-leave-to {
.drawer-enter-from,
.drawer-leave-to {
transform: translateX(100%)
}
.pdrawer-enter-to,
.pdrawer-leave-from {
.drawer-enter-to,
.drawer-leave-from {
transform: translateX(0)
}
</style>