diff options
| author | Adam <[email protected]> | 2026-02-09 07:19:17 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2026-02-09 07:38:05 -0600 |
| commit | 03f3029dc697f520a0e154c31f8188743113deb4 (patch) | |
| tree | 3334ee9c77d58ad73a9f3177c4e04234094f3361 /packages/app/src | |
| parent | aed7bb8c09f1251926a1cd82ef3764d53d2e0a7c (diff) | |
| download | opencode-03f3029dc697f520a0e154c31f8188743113deb4.tar.gz opencode-03f3029dc697f520a0e154c31f8188743113deb4.zip | |
feat(app): polish Open in icon treatment
Bring in the Open in button-group and transparent icon updates from #12641 while keeping locale strings unchanged. Replace CSS inversion with dedicated light/dark Zed icon assets for cleaner theme handling.
Co-authored-by: Edin <[email protected]>
Diffstat (limited to 'packages/app/src')
| -rw-r--r-- | packages/app/src/components/session/session-header.tsx | 103 |
1 files changed, 53 insertions, 50 deletions
diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx index fcba47004..c7e2993ff 100644 --- a/packages/app/src/components/session/session-header.tsx +++ b/packages/app/src/components/session/session-header.tsx @@ -322,57 +322,60 @@ export function SessionHeader() { } > <div class="flex items-center"> - <Button - variant="ghost" - class="rounded-sm h-[24px] py-1.5 pr-3 pl-2 gap-2 border-none shadow-none rounded-r-none" - onClick={() => openDir(current().id)} - aria-label={language.t("session.header.open.ariaLabel", { app: current().label })} - > - <AppIcon id={current().icon} class="size-5" /> - <span class="text-12-regular text-text-strong"> - {language.t("session.header.open.action", { app: current().label })} - </span> - </Button> - <DropdownMenu> - <DropdownMenu.Trigger - as={IconButton} - icon="chevron-down" + <div class="flex items-center rounded-full border border-border-base bg-surface-panel"> + <Button variant="ghost" - class="rounded-sm h-[24px] w-auto px-1.5 border-none shadow-none rounded-l-none data-[expanded]:bg-surface-raised-base-active" - aria-label={language.t("session.header.open.menu")} - /> - <DropdownMenu.Portal> - <DropdownMenu.Content placement="bottom-end" gutter={6}> - <DropdownMenu.Group> - <DropdownMenu.GroupLabel>{language.t("session.header.openIn")}</DropdownMenu.GroupLabel> - <DropdownMenu.RadioGroup - value={prefs.app} - onChange={(value) => { - if (!OPEN_APPS.includes(value as OpenApp)) return - setPrefs("app", value as OpenApp) - }} - > - {options().map((o) => ( - <DropdownMenu.RadioItem value={o.id} onSelect={() => openDir(o.id)}> - <AppIcon id={o.icon} class="size-5" /> - <DropdownMenu.ItemLabel>{o.label}</DropdownMenu.ItemLabel> - <DropdownMenu.ItemIndicator> - <Icon name="check-small" size="small" class="text-icon-weak" /> - </DropdownMenu.ItemIndicator> - </DropdownMenu.RadioItem> - ))} - </DropdownMenu.RadioGroup> - </DropdownMenu.Group> - <DropdownMenu.Separator /> - <DropdownMenu.Item onSelect={copyPath}> - <Icon name="copy" size="small" class="text-icon-weak" /> - <DropdownMenu.ItemLabel> - {language.t("session.header.open.copyPath")} - </DropdownMenu.ItemLabel> - </DropdownMenu.Item> - </DropdownMenu.Content> - </DropdownMenu.Portal> - </DropdownMenu> + class="rounded-full h-[28px] py-1.5 pr-4 pl-3 gap-2 border-none shadow-none" + onClick={() => openDir(current().id)} + aria-label={language.t("session.header.open.ariaLabel", { app: current().label })} + > + <AppIcon id={current().icon} class="size-5" /> + <span class="text-12-regular text-text-strong"> + {language.t("session.header.open.action", { app: current().label })} + </span> + </Button> + <div class="h-6 w-px bg-border-base" /> + <DropdownMenu> + <DropdownMenu.Trigger + as={IconButton} + icon="chevron-down" + variant="ghost" + class="rounded-full h-[28px] w-auto px-2 border-none shadow-none data-[expanded]:bg-surface-raised-base-active" + aria-label={language.t("session.header.open.menu")} + /> + <DropdownMenu.Portal> + <DropdownMenu.Content placement="bottom-end" gutter={6}> + <DropdownMenu.Group> + <DropdownMenu.GroupLabel>{language.t("session.header.openIn")}</DropdownMenu.GroupLabel> + <DropdownMenu.RadioGroup + value={prefs.app} + onChange={(value) => { + if (!OPEN_APPS.includes(value as OpenApp)) return + setPrefs("app", value as OpenApp) + }} + > + {options().map((o) => ( + <DropdownMenu.RadioItem value={o.id} onSelect={() => openDir(o.id)}> + <AppIcon id={o.icon} class="size-5" /> + <DropdownMenu.ItemLabel>{o.label}</DropdownMenu.ItemLabel> + <DropdownMenu.ItemIndicator> + <Icon name="check-small" size="small" class="text-icon-weak" /> + </DropdownMenu.ItemIndicator> + </DropdownMenu.RadioItem> + ))} + </DropdownMenu.RadioGroup> + </DropdownMenu.Group> + <DropdownMenu.Separator /> + <DropdownMenu.Item onSelect={copyPath}> + <Icon name="copy" size="small" class="text-icon-weak" /> + <DropdownMenu.ItemLabel> + {language.t("session.header.open.copyPath")} + </DropdownMenu.ItemLabel> + </DropdownMenu.Item> + </DropdownMenu.Content> + </DropdownMenu.Portal> + </DropdownMenu> + </div> </div> </Show> </div> |