From 01953cf057ee40511d09d64019350393800b7abc Mon Sep 17 00:00:00 2001 From: psychedelicious <4822129+psychedelicious@users.noreply.github.com> Date: Fri, 20 Jun 2025 16:12:10 +1000 Subject: [PATCH] feat(ui): tweak dockview tabs --- .../web/src/features/ui/layouts/TabWithoutCloseButton.tsx | 2 +- .../web/src/features/ui/styles/dockview-theme-invoke.css | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/invokeai/frontend/web/src/features/ui/layouts/TabWithoutCloseButton.tsx b/invokeai/frontend/web/src/features/ui/layouts/TabWithoutCloseButton.tsx index 179bb4bfb3..84dbb1e7ad 100644 --- a/invokeai/frontend/web/src/features/ui/layouts/TabWithoutCloseButton.tsx +++ b/invokeai/frontend/web/src/features/ui/layouts/TabWithoutCloseButton.tsx @@ -14,7 +14,7 @@ export const TabWithoutCloseButton = (props: IDockviewPanelHeaderProps) => { useCallbackOnDragEnter(setActive, ref, 300); return ( - + {props.api.title ?? props.api.id} ); diff --git a/invokeai/frontend/web/src/features/ui/styles/dockview-theme-invoke.css b/invokeai/frontend/web/src/features/ui/styles/dockview-theme-invoke.css index 06a1e99c58..49aab65e53 100644 --- a/invokeai/frontend/web/src/features/ui/styles/dockview-theme-invoke.css +++ b/invokeai/frontend/web/src/features/ui/styles/dockview-theme-invoke.css @@ -1,7 +1,7 @@ .dockview-theme-invoke { --dv-paneview-active-outline-color: var(--invoke-colors-invokeBlue-300); --dv-tabs-and-actions-container-font-size: var(--invoke-fontSizes-sm); - --dv-tabs-and-actions-container-height: var(--invoke-sizes-8); + --dv-tabs-and-actions-container-height: var(--invoke-sizes-10); --dv-drag-over-background-color: var(--invoke-colors-baseAlpha-400); --dv-drag-over-border-color: var(--invoke-colors-base-300); --dv-tabs-container-scrollbar-color: #888; @@ -57,6 +57,8 @@ .dv-tab { /* margin-right: 2px; */ + padding-inline-start: var(--invoke-sizes-4); + padding-inline-end: var(--invoke-sizes-4); } .dv-inactive-group .dv-tabs-container.dv-horizontal .dv-tab:not(:first-child)::before {