monadical/opencode
14
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(app): update titlebar spacing and status popover styling

Browse Source
This commit is contained in:
David Hill
2026-01-24 19:20:19 +00:00
parent 02456376ce
commit b089358503
2 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/app/src/components/status-popover.tsx
View File

@@ -155,9 +155,12 @@ export function StatusPopover() {
</div> </div>
} }
class="[&_[data-slot=popover-body]]:p-0 w-[360px] max-w-[calc(100vw-40px)] mx-5 bg-transparent border-0 shadow-none rounded-xl" class="[&_[data-slot=popover-body]]:p-0 w-[360px] max-w-[calc(100vw-40px)] mx-5 bg-transparent border-0 shadow-none rounded-xl"
gutter={8} gutter={12}
> >
<div class="flex items-center gap-1 w-[360px] border border-border-weak-base rounded-xl"> <div
class="flex items-center gap-1 w-[360px] rounded-xl"
style={{ "box-shadow": "var(--shadow-lg-border-base)" }}
>
<Tabs <Tabs
aria-label="Server Configurations" aria-label="Server Configurations"
class="tabs" class="tabs"
@@ -197,7 +200,7 @@ export function StatusPopover() {
<Tabs.Content value="servers"> <Tabs.Content value="servers">
<div class="flex flex-col px-2 pb-2"> <div class="flex flex-col px-2 pb-2">
<div class="flex flex-col p-2 bg-background-base"> <div class="flex flex-col p-2 bg-background-base rounded min-h-14">
<For each={sortedServers()}> <For each={sortedServers()}>
{(url) => { {(url) => {
const isActive = () => url === server.url const isActive = () => url === server.url
@@ -259,7 +262,7 @@ export function StatusPopover() {
<Tabs.Content value="mcp"> <Tabs.Content value="mcp">
<div class="flex flex-col px-2 pb-2"> <div class="flex flex-col px-2 pb-2">
<div class="flex flex-col p-2 bg-background-base"> <div class="flex flex-col p-2 bg-background-base rounded min-h-14">
<Show <Show
when={mcpItems().length > 0} when={mcpItems().length > 0}
fallback={ fallback={
@@ -305,7 +308,7 @@ export function StatusPopover() {
<Tabs.Content value="lsp"> <Tabs.Content value="lsp">
<div class="flex flex-col px-2 pb-2"> <div class="flex flex-col px-2 pb-2">
<div class="flex flex-col p-2 bg-background-base"> <div class="flex flex-col p-2 bg-background-base rounded min-h-14">
<Show <Show
when={lspItems().length > 0} when={lspItems().length > 0}
fallback={ fallback={
@@ -335,7 +338,7 @@ export function StatusPopover() {
<Tabs.Content value="plugins"> <Tabs.Content value="plugins">
<div class="flex flex-col px-2 pb-2"> <div class="flex flex-col px-2 pb-2">
<div class="flex flex-col p-2 bg-background-base"> <div class="flex flex-col p-2 bg-background-base rounded min-h-14">
<Show <Show
when={plugins().length > 0} when={plugins().length > 0}
fallback={ fallback={

3
packages/app/src/components/titlebar.tsx
View File

@@ -81,7 +81,7 @@ export function Titlebar() {
classList={{ classList={{
"flex items-center w-full min-w-0": true, "flex items-center w-full min-w-0": true,
"pl-2": !mac(), "pl-2": !mac(),
"pr-2": !windows(), "pr-6": !windows(),
}} }}
onMouseDown={drag} onMouseDown={drag}
data-tauri-drag-region data-tauri-drag-region
@@ -145,6 +145,7 @@ export function Titlebar() {
data-tauri-drag-region data-tauri-drag-region
/> />
<Show when={windows()}> <Show when={windows()}>
<div class="w-6 shrink-0" />
<div data-tauri-decorum-tb class="flex flex-row" /> <div data-tauri-decorum-tb class="flex flex-row" />
</Show> </Show>
</div> </div>