summaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorDavid Hill <[email protected]>2026-02-17 18:39:21 +0000
committerDavid Hill <[email protected]>2026-02-17 18:39:21 +0000
commit7379903568552be7dcfe846856f6cdd547bd97f0 (patch)
tree5f569719481bf0413e5c8e7bf61f44fb3c37ae28
parenta685e7a805454110d92ed4da5a3799a15ea1bcb9 (diff)
downloadopencode-7379903568552be7dcfe846856f6cdd547bd97f0.tar.gz
opencode-7379903568552be7dcfe846856f6cdd547bd97f0.zip
tui: improve modified file visibility and button spacing
- Replace warning yellow with distinct orange color for modified files in git diff indicators - Increase button padding for better visual balance in session header and status popover
-rw-r--r--packages/app/src/components/file-tree.tsx4
-rw-r--r--packages/app/src/components/session/session-header.tsx2
-rw-r--r--packages/app/src/components/status-popover.tsx2
-rw-r--r--packages/ui/src/styles/theme.css4
-rw-r--r--packages/ui/src/theme/resolve.ts2
5 files changed, 7 insertions, 7 deletions
diff --git a/packages/app/src/components/file-tree.tsx b/packages/app/src/components/file-tree.tsx
index 1f09642ac..db0df6fe3 100644
--- a/packages/app/src/components/file-tree.tsx
+++ b/packages/app/src/components/file-tree.tsx
@@ -71,13 +71,13 @@ const kindLabel = (kind: Kind) => {
const kindTextColor = (kind: Kind) => {
if (kind === "add") return "color: var(--icon-diff-add-base)"
if (kind === "del") return "color: var(--icon-diff-delete-base)"
- return "color: var(--icon-warning-active)"
+ return "color: var(--icon-diff-modified-base)"
}
const kindDotColor = (kind: Kind) => {
if (kind === "add") return "background-color: var(--icon-diff-add-base)"
if (kind === "del") return "background-color: var(--icon-diff-delete-base)"
- return "background-color: var(--icon-warning-active)"
+ return "background-color: var(--icon-diff-modified-base)"
}
const visibleKind = (node: FileNode, kinds?: ReadonlyMap<string, Kind>, marks?: Set<string>) => {
diff --git a/packages/app/src/components/session/session-header.tsx b/packages/app/src/components/session/session-header.tsx
index 219ccc4ea..912e449cf 100644
--- a/packages/app/src/components/session/session-header.tsx
+++ b/packages/app/src/components/session/session-header.tsx
@@ -354,7 +354,7 @@ export function SessionHeader() {
<div class="flex h-[24px] box-border items-center rounded-md border border-border-weak-base bg-surface-panel overflow-hidden">
<Button
variant="ghost"
- class="rounded-none h-full py-0 pr-2 pl-0.5 gap-1.5 border-none shadow-none"
+ class="rounded-none h-full py-0 pr-3 pl-0.5 gap-1.5 border-none shadow-none"
onClick={copyPath}
aria-label={language.t("session.header.open.copyPath")}
>
diff --git a/packages/app/src/components/status-popover.tsx b/packages/app/src/components/status-popover.tsx
index 6c1e6e999..ccaa0ff77 100644
--- a/packages/app/src/components/status-popover.tsx
+++ b/packages/app/src/components/status-popover.tsx
@@ -196,7 +196,7 @@ export function StatusPopover() {
triggerProps={{
variant: "ghost",
class:
- "rounded-md h-[24px] pr-2 pl-0.5 gap-2 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-raised-base-hover",
+ "rounded-md h-[24px] pr-3 pl-0.5 gap-2 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-raised-base-hover",
style: { scale: 1 },
}}
trigger={
diff --git a/packages/ui/src/styles/theme.css b/packages/ui/src/styles/theme.css
index e2dd1598a..6bcc74852 100644
--- a/packages/ui/src/styles/theme.css
+++ b/packages/ui/src/styles/theme.css
@@ -287,7 +287,7 @@
--icon-diff-add-active: var(--mint-light-12);
--icon-diff-delete-base: var(--ember-light-10);
--icon-diff-delete-hover: var(--ember-light-11);
- --icon-diff-modified-base: var(--icon-warning-base);
+ --icon-diff-modified-base: #ff8c00;
--syntax-comment: var(--text-weak);
--syntax-regexp: var(--text-base);
--syntax-string: #006656;
@@ -545,7 +545,7 @@
--icon-diff-add-active: var(--mint-dark-11);
--icon-diff-delete-base: var(--ember-dark-9);
--icon-diff-delete-hover: var(--ember-dark-10);
- --icon-diff-modified-base: var(--icon-warning-base);
+ --icon-diff-modified-base: #ffba92;
--syntax-comment: var(--text-weak);
--syntax-regexp: var(--text-base);
--syntax-string: #00ceb9;
diff --git a/packages/ui/src/theme/resolve.ts b/packages/ui/src/theme/resolve.ts
index 2e9c3a521..f098e8028 100644
--- a/packages/ui/src/theme/resolve.ts
+++ b/packages/ui/src/theme/resolve.ts
@@ -240,7 +240,7 @@ export function resolveThemeVariant(variant: ThemeVariant, isDark: boolean): Res
tokens["icon-diff-add-active"] = diffAdd[isDark ? 10 : 11]
tokens["icon-diff-delete-base"] = diffDelete[isDark ? 8 : 9]
tokens["icon-diff-delete-hover"] = diffDelete[isDark ? 9 : 10]
- tokens["icon-diff-modified-base"] = tokens["icon-warning-base"]
+ tokens["icon-diff-modified-base"] = isDark ? "#ffba92" : "#FF8C00"
tokens["syntax-comment"] = "var(--text-weak)"
tokens["syntax-regexp"] = "var(--text-base)"