diff options
| -rw-r--r-- | packages/app/src/pages/session.tsx | 8 | ||||
| -rw-r--r-- | packages/ui/src/components/tabs.css | 21 |
2 files changed, 28 insertions, 1 deletions
diff --git a/packages/app/src/pages/session.tsx b/packages/app/src/pages/session.tsx index 7f21e4941..e11687cf5 100644 --- a/packages/app/src/pages/session.tsx +++ b/packages/app/src/pages/session.tsx @@ -2627,7 +2627,13 @@ export default function Page() { <Show when={layout.fileTree.opened()}> <div class="relative shrink-0 h-full" style={{ width: `${layout.fileTree.width()}px` }}> <div class="h-full border-l border-border-weak-base flex flex-col overflow-hidden"> - <Tabs variant="pill" value={fileTreeTab()} onChange={setFileTreeTabValue} class="h-full"> + <Tabs + variant="pill" + value={fileTreeTab()} + onChange={setFileTreeTabValue} + class="h-full" + data-scope="filetree" + > <Tabs.List> <Tabs.Trigger value="changes" class="flex-1" classes={{ button: "w-full" }}> {reviewCount()}{" "} diff --git a/packages/ui/src/components/tabs.css b/packages/ui/src/components/tabs.css index 1fb6e9b61..a283ab652 100644 --- a/packages/ui/src/components/tabs.css +++ b/packages/ui/src/components/tabs.css @@ -264,6 +264,27 @@ } } + &[data-variant="pill"][data-orientation="horizontal"][data-scope="filetree"] { + [data-slot="tabs-list"] { + padding: 12px; + gap: 8px; + } + + [data-slot="tabs-trigger-wrapper"] { + height: 26px; + border-radius: 6px; + color: var(--text-weak); + + &:not(:has([data-selected])):hover:not(:disabled) { + color: var(--text-base); + } + + &:has([data-selected]) { + color: var(--text-strong); + } + } + } + &[data-orientation="vertical"] { flex-direction: row; |