Enhance audio and UI interactions for improved user experience

- Added a prebuild script in package.json to copy audio assets for smoother audio playback.
- Updated App.vue to ensure the router is ready before displaying content, addressing issues with hard refreshes.
- Introduced a "Tap to start" feature in SplashScreen.vue to comply with browser autoplay policies for audio.
- Enhanced playLoopStart function in useLoginSounds.ts to utilize the Web Audio API for better audio control.
- Removed unnecessary redirect in router index.ts for cleaner routing logic.
- Improved Dashboard.vue and Login.vue styles for better visual hierarchy and user engagement during transitions.
This commit is contained in:
Dorian
2026-02-17 19:42:59 +00:00
parent 1b05b5b8f1
commit c72b97e940
8 changed files with 91 additions and 36 deletions
+5 -3
View File
@@ -69,7 +69,7 @@
<!-- Sidebar - Desktop Only, animates in at end with separate parts -->
<aside
data-controller-zone="sidebar"
class="hidden md:flex w-[256px] flex-shrink-0 relative flex-col"
class="hidden md:flex w-[256px] flex-shrink-0 relative flex-col z-10"
:class="{ 'sidebar-animate': showZoomIn }"
>
<div class="sidebar-shell">
@@ -127,7 +127,7 @@
<!-- Main Content (Xbox: Right goes here from sidebar) -->
<main
data-controller-zone="main"
class="flex-1 overflow-hidden relative pb-20 md:pb-0 glass-piece"
class="flex-1 overflow-hidden relative pb-20 md:pb-0 glass-piece z-10"
:class="{ 'glass-throw-main': showZoomIn }"
>
<!-- Connection Status Banner -->
@@ -1011,9 +1011,11 @@ function getTransitionName(currentRoute: any) {
}
}
/* When not animating, show everything */
/* When not animating, show everything (direct load / hard refresh) */
aside:not(.sidebar-animate) .sidebar-shell {
border-color: rgba(255, 255, 255, 0.18);
opacity: 1;
transform: none;
}
aside:not(.sidebar-animate) .sidebar-inner,
aside:not(.sidebar-animate) .sidebar-logo,