Added transitions for client only buttons

components/calendar/SearchCTA.vue

@@ -11,6 +11,7 @@ const breakpoints = useBreakpoints(
 
 <template>
   <ClientOnly>
+    <Transition name="fade" appear>
       <UiButton
         :search-slash="breakpoints.lg.value"
         :size="breakpoints.lg.value ? 'default' : 'icon'"
@@ -22,5 +23,6 @@ const breakpoints = useBreakpoints(
           {{ $t('entity.advancedSearch.title') }}
         </span>
       </UiButton>
+    </Transition>
   </ClientOnly>
 </template>

components/calendar/dialog/QuickCreateEvent.vue

@@ -24,6 +24,7 @@ const breakpoints = useBreakpoints(
 
 <template>
   <ClientOnly>
+    <Transition name="fade" appear>
       <UiButton
         class="max-md:fixed max-md:bottom-8 max-md:right-8 max-md:z-50 max-md:size-14 max-md:rounded-xl"
         :size="breakpoints.lg.value ? 'default' : 'icon'"
@@ -35,6 +36,7 @@ const breakpoints = useBreakpoints(
           {{ $t("entity.calendar.event.newEvent") }}
         </strong>
       </UiButton>
+    </Transition>
   </ClientOnly>
 
   <UiDialog v-model:open="isDialogOpen">