EasyFlow-Tech-Dev/EasyFlow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: tab栏UI优化

Browse Source
This commit is contained in:
陈子默
2026-03-07 21:23:16 +08:00
parent 0031c71594
commit c933971a75
1 changed files with 3 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
easyflow-ui-admin/packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
View File

@@ -122,19 +122,19 @@ function onMouseDown(e: MouseEvent, tab: TabConfig) {
<!-- close-icon --> <!-- close-icon -->
<X <X
v-show="!tab.affixTab && tabsView.length > 1 && tab.closable" v-show="!tab.affixTab && tabsView.length > 1 && tab.closable"
class="mt-[2px] size-3 cursor-pointer rounded-full stroke-[hsl(var(--nav-item-muted-foreground))] transition-all hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:stroke-[hsl(var(--foreground))] group-[.is-active]:stroke-[hsl(var(--nav-item-active-foreground))]" class="mt-[2px] size-3 cursor-pointer rounded-full stroke-[hsl(var(--nav-item-muted-foreground))] transition-all hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:stroke-[hsl(var(--foreground))] group-hover:stroke-[hsl(var(--nav-item-active-foreground))] group-[.is-active]:stroke-[hsl(var(--nav-item-active-foreground))]"
@click.stop="() => emit('close', tab.key)" @click.stop="() => emit('close', tab.key)"
/> />
<Pin <Pin
v-show="tab.affixTab && tabsView.length > 1 && tab.closable" v-show="tab.affixTab && tabsView.length > 1 && tab.closable"
class="mt-[1px] size-3.5 cursor-pointer rounded-full stroke-[hsl(var(--nav-item-muted-foreground))] transition-all hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:stroke-[hsl(var(--foreground))] group-[.is-active]:stroke-[hsl(var(--nav-item-active-foreground))]" class="mt-[1px] size-3.5 cursor-pointer rounded-full stroke-[hsl(var(--nav-item-muted-foreground))] transition-all hover:bg-[hsl(var(--surface-contrast-soft))/0.92] hover:stroke-[hsl(var(--foreground))] group-hover:stroke-[hsl(var(--nav-item-active-foreground))] group-[.is-active]:stroke-[hsl(var(--nav-item-active-foreground))]"
@click.stop="() => emit('unpin', tab)" @click.stop="() => emit('unpin', tab)"
/> />
</div> </div>
<!-- tab-item-main --> <!-- tab-item-main -->
<div <div
class="tabs-chrome__item-main z-[2] mx-3 my-0 flex h-full min-w-0 items-center overflow-hidden pl-2 pr-5 text-[hsl(var(--nav-item-muted-foreground))] duration-150 group-[.is-active]:font-medium group-[.is-active]:text-[hsl(var(--nav-item-active-foreground))]" class="tabs-chrome__item-main z-[2] mx-3 my-0 flex h-full min-w-0 items-center overflow-hidden pl-2 pr-5 text-[hsl(var(--nav-item-muted-foreground))] duration-150 group-hover:text-[hsl(var(--nav-item-active-foreground))] group-[.is-active]:font-medium group-[.is-active]:text-[hsl(var(--nav-item-active-foreground))]"
> >
<EasyFlowIcon <EasyFlowIcon
v-if="showIcon" v-if="showIcon"
@@ -190,12 +190,6 @@ function onMouseDown(e: MouseEvent, tab: TabConfig) {
.tabs-chrome__divider { .tabs-chrome__divider {
@apply opacity-0; @apply opacity-0;
} }
.tabs-chrome__background {
&-content {
@apply bg-[hsl(var(--nav-item-hover))];
}
}
} }
&.is-active { &.is-active {