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

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
+1 -1
View File
@@ -28,5 +28,5 @@ portpicker = "0.1.1"
csv = "1" csv = "1"
calamine = "0.30.1" calamine = "0.30.1"
odbc-api = "25" odbc-api = "25"
rust-gaussdb = { git = "https://github.com/t8y2/rust-gaussdb", branch = "main" } rust-gaussdb = { path = "../../../gaussdb-rs" }
base64 = "0.22" base64 = "0.22"
+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"> <div v-if="queryStore.tabs.length > 0" class="relative h-9 flex items-stretch border-b bg-muted shrink-0">
<button <button
v-if="canScrollLeft" 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')" :aria-label="t('tabs.scrollLeft')"
@click="scrollTabs('left')" @click="scrollTabs('left')"
> >
@@ -139,7 +139,7 @@ watch(
</div> </div>
<button <button
v-if="canScrollRight" 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')" :aria-label="t('tabs.scrollRight')"
@click="scrollTabs('right')" @click="scrollTabs('right')"
> >