nanakura/moeka-project
1
0
Fork 0
Code Issues Pull Requests 1 Actions 2 Packages Projects Releases Wiki Activity

perf(stage-ui): improve about dialog to be blurry

Browse Source
This commit is contained in:
Neko Ayaka
2026-03-26 23:32:06 +08:00
parent aa8834db69
commit 5b78f34847
2 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/stage-layouts/src/components/Layouts/InteractiveArea/Actions/About.vue
+1 -1
View File
@@ -25,7 +25,7 @@ const edition = isStageTamagotchi()
<template>
<button border="2 solid neutral-100/60 dark:neutral-800/30" bg="neutral-50/70 dark:neutral-800/70" w-fit flex items-center self-end justify-center rounded-xl p-2 backdrop-blur-md title="About" @click="show = !show">
<div i-solar:info-circle-outline size-5 text="neutral-500 dark:neutral-400" />
<div i-solar:info-circle-outline class="size-5" text="neutral-500 dark:neutral-400" />
</button>
<AboutDialog v-model="show">
<AboutContent :subtitle="edition" :build-info="buildInfo" :links="aboutLinks" />
packages/stage-ui/src/components/scenarios/dialogs/about/about-dialog.vue
+2 -2
View File
@@ -18,7 +18,7 @@ onMounted(() => screenSafeArea.update())
<slot name="trigger" />
<DialogPortal>
<DialogOverlay class="fixed inset-0 z-[9999] bg-black/50 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn" />
<DialogContent class="fixed left-1/2 top-1/2 z-[9999] max-h-full max-w-2xl w-[92dvw] transform overflow-y-scroll rounded-2xl bg-white p-6 shadow-xl outline-none backdrop-blur-md scrollbar-none -translate-x-1/2 -translate-y-1/2 data-[state=closed]:animate-contentHide data-[state=open]:animate-contentShow dark:bg-neutral-900">
<DialogContent class="fixed left-1/2 top-1/2 z-[9999] max-h-full max-w-2xl w-[92dvw] transform overflow-y-scroll rounded-2xl bg-white/95 p-6 shadow-xl outline-none backdrop-blur-md scrollbar-none -translate-x-1/2 -translate-y-1/2 data-[state=closed]:animate-contentHide data-[state=open]:animate-contentShow dark:bg-neutral-900/90">
<slot />
</DialogContent>
</DialogPortal>
@@ -26,7 +26,7 @@ onMounted(() => screenSafeArea.update())
<DrawerRoot v-else :open="showDialog" should-scale-background @update:open="value => showDialog = value">
<DrawerPortal>
<DrawerOverlay class="fixed inset-0" />
<DrawerContent class="fixed bottom-0 left-0 right-0 z-1000 mt-20 h-full max-h-[96%] flex flex-col rounded-t-2xl bg-neutral-50 px-4 pt-4 outline-none backdrop-blur-md dark:bg-neutral-900/95" :style="{ paddingBottom: `${Math.max(Number.parseFloat(screenSafeArea.bottom.value.replace('px', '')), 24)}px` }">
<DrawerContent class="fixed bottom-0 left-0 right-0 z-1000 mt-20 h-full max-h-[96%] flex flex-col rounded-t-2xl bg-neutral-50/95 px-4 pt-4 outline-none backdrop-blur-md dark:bg-neutral-900/90" :style="{ paddingBottom: `${Math.max(Number.parseFloat(screenSafeArea.bottom.value.replace('px', '')), 24)}px` }">
<DrawerHandle />
<slot />
</DrawerContent>