test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: enhance CalendarEventPanel layout with transition effects

Browse Source
This commit is contained in:
Shariq Ansari 2025-08-28 16:47:56 +05:30
parent 369d9fcd63
commit 0d1a4effdb
2 changed files with 24 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/Calendar/CalendarEventPanel.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div v-if="show" class="flex flex-col w-[352px] border-l text-base"> <div v-if="show" class="flex flex-col w-[352px] text-base">
<!-- Event Header --> <!-- Event Header -->
<div <div
class="flex items-center justify-between p-4.5 text-ink-gray-7 text-lg font-medium" class="flex items-center justify-between p-4.5 text-ink-gray-7 text-lg font-medium"

10
frontend/src/pages/Calendar.vue
View File

@ -90,6 +90,15 @@
</template> </template>
</Calendar> </Calendar>
<!-- Event Panel Container -->
<div
class="overflow-hidden flex-none transition-all duration-300 ease-in-out flex flex-col"
:class="
showEventPanel
? 'w-[352px] border-l bg-surface-white'
: 'w-0 border-l-0'
"
>
<CalendarEventPanel <CalendarEventPanel
v-if="showEventPanel" v-if="showEventPanel"
v-model="showEventPanel" v-model="showEventPanel"
@ -104,6 +113,7 @@
@sync="syncEvent" @sync="syncEvent"
/> />
</div> </div>
</div>
</template> </template>
<script setup> <script setup>
import CalendarEventPanel from '@/components/Calendar/CalendarEventPanel.vue' import CalendarEventPanel from '@/components/Calendar/CalendarEventPanel.vue'