diff options
| author | Jacob Bahn <[email protected]> | 2026-01-20 18:34:33 -0800 |
|---|---|---|
| committer | GitHub <[email protected]> | 2026-01-20 20:34:33 -0600 |
| commit | 65d9e829e7daff9e35309649c464ec520024d323 (patch) | |
| tree | 0e005efa200c883f92383da3b17a32edec420e0f | |
| parent | 6793b4a6fd8888b8eb3bf040a691b791329b786c (diff) | |
| download | opencode-65d9e829e7daff9e35309649c464ec520024d323.tar.gz opencode-65d9e829e7daff9e35309649c464ec520024d323.zip | |
feat(desktop): standardize desktop layout icons (#9685)
| -rw-r--r-- | packages/app/src/components/session/session-header.tsx | 6 | ||||
| -rw-r--r-- | packages/app/src/components/titlebar.tsx | 23 |
2 files changed, 20 insertions, 9 deletions
diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx index 6d6287bd2..0fc8828fd 100644 --- a/packages/app/src/components/session/session-header.tsx +++ b/packages/app/src/components/session/session-header.tsx @@ -194,18 +194,18 @@ export function SessionHeader() { > <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0"> <Icon - name={view().reviewPanel.opened() ? "layout-right" : "layout-left"} size="small" + name={view().reviewPanel.opened() ? "layout-right-full" : "layout-right"} class="group-hover/review-toggle:hidden" /> <Icon - name={view().reviewPanel.opened() ? "layout-right-partial" : "layout-left-partial"} size="small" + name="layout-right-partial" class="hidden group-hover/review-toggle:inline-block" /> <Icon - name={view().reviewPanel.opened() ? "layout-right-full" : "layout-left-full"} size="small" + name={view().reviewPanel.opened() ? "layout-right" : "layout-right-full"} class="hidden group-active/review-toggle:inline-block" /> </div> diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx index 2f348e2cf..d0d27e99f 100644 --- a/packages/app/src/components/titlebar.tsx +++ b/packages/app/src/components/titlebar.tsx @@ -1,5 +1,7 @@ import { createEffect, createMemo, Show } from "solid-js" import { IconButton } from "@opencode-ai/ui/icon-button" +import { Icon } from "@opencode-ai/ui/icon" +import { Button } from "@opencode-ai/ui/button" import { TooltipKeybind } from "@opencode-ai/ui/tooltip" import { useTheme } from "@opencode-ai/ui/theme" @@ -98,12 +100,21 @@ export function Titlebar() { title={language.t("command.sidebar.toggle")} keybind={command.keybind("sidebar.toggle")} > - <IconButton - icon={layout.sidebar.opened() ? "layout-left" : "layout-right"} - variant="ghost" - class="size-8 rounded-md" - onClick={layout.sidebar.toggle} - /> + <Button variant="ghost" class="group/sidebar-toggle size-6 p-0" onClick={layout.sidebar.toggle}> + <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0"> + <Icon + size="small" + name={layout.sidebar.opened() ? "layout-left-full" : "layout-left"} + class="group-hover/sidebar-toggle:hidden" + /> + <Icon size="small" name="layout-left-partial" class="hidden group-hover/sidebar-toggle:inline-block" /> + <Icon + size="small" + name={layout.sidebar.opened() ? "layout-left" : "layout-left-full"} + class="hidden group-active/sidebar-toggle:inline-block" + /> + </div> + </Button> </TooltipKeybind> <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" /> <div class="flex-1 h-full" data-tauri-drag-region /> |