Added transitions for client only buttons
This commit is contained in:
@@ -11,16 +11,18 @@ const breakpoints = useBreakpoints(
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ClientOnly>
|
<ClientOnly>
|
||||||
<UiButton
|
<Transition name="fade" appear>
|
||||||
:search-slash="breakpoints.lg.value"
|
<UiButton
|
||||||
:size="breakpoints.lg.value ? 'default' : 'icon'"
|
:search-slash="breakpoints.lg.value"
|
||||||
@click="revealAdvancedSearch()"
|
:size="breakpoints.lg.value ? 'default' : 'icon'"
|
||||||
>
|
@click="revealAdvancedSearch()"
|
||||||
<PhMagnifyingGlass size="20" weight="light" />
|
>
|
||||||
|
<PhMagnifyingGlass size="20" weight="light" />
|
||||||
|
|
||||||
<span class="max-lg:hidden">
|
<span class="max-lg:hidden">
|
||||||
{{ $t('entity.advancedSearch.title') }}
|
{{ $t('entity.advancedSearch.title') }}
|
||||||
</span>
|
</span>
|
||||||
</UiButton>
|
</UiButton>
|
||||||
|
</Transition>
|
||||||
</ClientOnly>
|
</ClientOnly>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -24,17 +24,19 @@ const breakpoints = useBreakpoints(
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<ClientOnly>
|
<ClientOnly>
|
||||||
<UiButton
|
<Transition name="fade" appear>
|
||||||
class="max-md:fixed max-md:bottom-8 max-md:right-8 max-md:z-50 max-md:size-14 max-md:rounded-xl"
|
<UiButton
|
||||||
:size="breakpoints.lg.value ? 'default' : 'icon'"
|
class="max-md:fixed max-md:bottom-8 max-md:right-8 max-md:z-50 max-md:size-14 max-md:rounded-xl"
|
||||||
@click="toggleDialog"
|
:size="breakpoints.lg.value ? 'default' : 'icon'"
|
||||||
>
|
@click="toggleDialog"
|
||||||
<PhPlus :size="breakpoints.md.value ? 18 : 24" weight="bold" />
|
>
|
||||||
|
<PhPlus :size="breakpoints.md.value ? 18 : 24" weight="bold" />
|
||||||
|
|
||||||
<strong class="font-semibold max-lg:hidden">
|
<strong class="font-semibold max-lg:hidden">
|
||||||
{{ $t("entity.calendar.event.newEvent") }}
|
{{ $t("entity.calendar.event.newEvent") }}
|
||||||
</strong>
|
</strong>
|
||||||
</UiButton>
|
</UiButton>
|
||||||
|
</Transition>
|
||||||
</ClientOnly>
|
</ClientOnly>
|
||||||
|
|
||||||
<UiDialog v-model:open="isDialogOpen">
|
<UiDialog v-model:open="isDialogOpen">
|
||||||
|
|||||||
Reference in New Issue
Block a user