admin/nexus-terminal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update App.vue

Browse Source
This commit is contained in:
Baobhan Sith
2025-04-23 21:29:28 +08:00
parent 1b943f7614
commit 985acbf18a
1 changed files with 3 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/frontend/src/App.vue
+3 -1
View File
@@ -44,8 +44,10 @@ const updateUnderline = async () => {
if (navRef.value && underlineRef.value) { if (navRef.value && underlineRef.value) {
const activeLink = navRef.value.querySelector('.router-link-exact-active') as HTMLElement; const activeLink = navRef.value.querySelector('.router-link-exact-active') as HTMLElement;
if (activeLink) { if (activeLink) {
const offsetBottom = 2; // 下划线距离文字底部的距离 (px)
underlineRef.value.style.left = `${activeLink.offsetLeft}px`; underlineRef.value.style.left = `${activeLink.offsetLeft}px`;
underlineRef.value.style.width = `${activeLink.offsetWidth}px`; underlineRef.value.style.width = `${activeLink.offsetWidth}px`;
// underlineRef.value.style.top = `${activeLink.offsetTop + activeLink.offsetHeight + offsetBottom}px`; // 移除 top 设置
underlineRef.value.style.opacity = '1'; // Make it visible underlineRef.value.style.opacity = '1'; // Make it visible
} else { } else {
underlineRef.value.style.opacity = '0'; // Hide if no active link (e.g., on login page if not a nav link) underlineRef.value.style.opacity = '0'; // Hide if no active link (e.g., on login page if not a nav link)
@@ -265,7 +267,7 @@ const isElementVisibleAndFocusable = (element: HTMLElement): boolean => {
<a href="#" v-if="isAuthenticated" @click.prevent="handleLogout" class="px-3 py-2 rounded-md text-sm font-medium text-secondary hover:text-link-hover hover:bg-nav-active-bg hover:no-underline transition duration-150 ease-in-out whitespace-nowrap">{{ t('nav.logout') }}</a> <a href="#" v-if="isAuthenticated" @click.prevent="handleLogout" class="px-3 py-2 rounded-md text-sm font-medium text-secondary hover:text-link-hover hover:bg-nav-active-bg hover:no-underline transition duration-150 ease-in-out whitespace-nowrap">{{ t('nav.logout') }}</a>
</div> </div>
<!-- Sliding underline element with Tailwind classes using theme variables (JS still controls positioning) --> <!-- Sliding underline element with Tailwind classes using theme variables (JS still controls positioning) -->
<div ref="underlineRef" class="absolute bottom-0 h-0.5 bg-link-active rounded transition-all duration-300 ease-in-out pointer-events-none opacity-0"></div> <!-- Added opacity-0 --> <div ref="underlineRef" class="absolute bottom-0 h-0.5 bg-link-active rounded transition-all duration-300 ease-in-out pointer-events-none opacity-0 transform translate-y-1.5"></div> <!-- Changed translate-y-1 to translate-y-1.5 -->
</nav> </nav>
</header> </header>