|
|
@@ -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 />
|