Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed log in animation

Browse Source
This commit is contained in:
Alexis
2025-07-29 22:30:14 +02:00
parent 300507bbed
commit 0e7b60235a
2 changed files with 30 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
app/assets/main.css
View File

@@ -33,18 +33,30 @@ body {
} }
.fade-enter-active, .fade-enter-active,
.fade-leave-active { .fade-leave-active,
.fade-group-enter-active,
.fade-group-leave-active {
transition: all .5s ease; transition: all .5s ease;
} }
.fade-delay-enter-active, .fade-delay-enter-active,
.fade-delay-leave-active { .fade-delay-leave-active,
.fade-group-delay-enter-active,
.fade-group-delay-leave-active {
transition: all .5s ease 1s; transition: all .5s ease 1s;
} }
.fade-enter-from, .fade-enter-from,
.fade-leave-to, .fade-leave-to,
.fade-delay-enter-from, .fade-delay-enter-from,
.fade-delay-leave-to { .fade-delay-leave-to,
.fade-group-enter-from,
.fade-group-leave-to,
.fade-group-delay-enter-from,
.fade-group-delay-leave-to {
opacity: 0; opacity: 0;
visibility: hidden; visibility: hidden;
} }
.fade-group-leave-active {
position: absolute;
}

6
app/components/global/user/CTA.vue
View File

@@ -58,7 +58,8 @@ function pushRoute(to: AvailableRoutes) {
<ClientOnly> <ClientOnly>
<UiDropdownMenu v-model:open="menuOpened"> <UiDropdownMenu v-model:open="menuOpened">
<UiDropdownMenuTrigger> <UiDropdownMenuTrigger>
<UiAvatar v-if="user" id="user-avatar" class="ring-[.2rem] ring-indigo-700 dark:ring-neutral-900 cursor-pointer"> <TransitionGroup name="fade-group" class="transition-group" appear>
<UiAvatar v-if="user" id="user-avatar" class="aspect-square ring-[.2rem] ring-indigo-700 dark:ring-neutral-900 cursor-pointer">
<UiAvatarImage <UiAvatarImage
:src="userMeta?.avatar_url" :src="userMeta?.avatar_url"
:alt="userMeta?.full_name" :alt="userMeta?.full_name"
@@ -68,9 +69,10 @@ function pushRoute(to: AvailableRoutes) {
{{ $t('ui.sidebarMenu.avatarFallback') }} {{ $t('ui.sidebarMenu.avatarFallback') }}
</UiAvatarFallback> </UiAvatarFallback>
</UiAvatar> </UiAvatar>
<UiButton v-else variant="outline" size="icon" class="rounded-full border-indigo-200 bg-indigo-700 dark:border-slate-300 dark:bg-neutral-950 dark:hover:bg-slate-50 dark:hover:text-slate-950 cursor-pointer"> <UiButton v-else variant="outline" size="icon" class="aspect-square ring-[.2rem] ring-indigo-700 dark:ring-neutral-900 rounded-full border-indigo-200 bg-indigo-700 dark:border-slate-300 dark:bg-neutral-950 dark:hover:bg-slate-50 dark:hover:text-slate-950 cursor-pointer">
<PhUserCircle size="24" /> <PhUserCircle size="24" />
</UiButton> </UiButton>
</TransitionGroup>
</UiDropdownMenuTrigger> </UiDropdownMenuTrigger>
<UiDropdownMenuContent class="w-72 p-0 pb-1" :align="'start'" :side="'top'" :side-offset="10" :align-offset="25" :collision-padding="40"> <UiDropdownMenuContent class="w-72 p-0 pb-1" :align="'start'" :side="'top'" :side-offset="10" :align-offset="25" :collision-padding="40">