github/dbx
4
0
Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-10-29 08:11:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): prevent tab scroll arrow overlapping with text

Browse Source 
Widen the scroll button gradient area and use a solid-to-transparent
gradient (40% opaque) instead of a semi-transparent via stop, so tab
text is fully hidden behind the arrow overlay.
This commit is contained in:
t8y2
2026-05-09 14:26:31 +08:00
parent 51b8b9344f
commit 5c911f39ff
2 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/layout/AppTabBar.vue
+2 -2
View File
@@ -47,7 +47,7 @@ watch(
<div v-if="queryStore.tabs.length > 0" class="relative h-9 flex items-stretch border-b bg-muted shrink-0">
<button
v-if="canScrollLeft"
class="absolute left-0 z-10 h-full px-1 bg-linear-to-r from-background via-background/80 to-transparent text-muted-foreground hover:text-foreground"
class="absolute left-0 z-10 h-full pl-1 pr-6 bg-linear-to-r from-background from-40% to-transparent text-muted-foreground hover:text-foreground"
:aria-label="t('tabs.scrollLeft')"
@click="scrollTabs('left')"
>
@@ -139,7 +139,7 @@ watch(
</div>
<button
v-if="canScrollRight"
class="absolute right-0 z-10 h-full px-1 bg-linear-to-l from-background via-background/80 to-transparent text-muted-foreground hover:text-foreground"
class="absolute right-0 z-10 h-full pr-1 pl-6 bg-linear-to-l from-background from-40% to-transparent text-muted-foreground hover:text-foreground"
:aria-label="t('tabs.scrollRight')"
@click="scrollTabs('right')"
>