diff --git a/package.json b/package.json index 2a8eef6356..06cb8c15e7 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,8 @@ "random": "echo 'Random script'", "sso": "aws sso login --sso-session=opencode --no-browser", "translate:app": "bun run script/translate-app.ts", - "test": "echo 'do not run tests from root' && exit 1" + "test": "echo 'do not run tests from root' && exit 1", + "check:design": "node script/check-design-tokens.mjs" }, "workspaces": { "packages": [ diff --git a/packages/app/e2e/regression/session-timeline-lifecycle-state.spec.ts b/packages/app/e2e/regression/session-timeline-lifecycle-state.spec.ts index b303071c87..ccbd7a2b2f 100644 --- a/packages/app/e2e/regression/session-timeline-lifecycle-state.spec.ts +++ b/packages/app/e2e/regression/session-timeline-lifecycle-state.spec.ts @@ -41,9 +41,9 @@ test("shows and expands a running shell command without shimmering it", async ({ }) const tool = page.locator(`[data-timeline-part-id="${id}"]`) - await expect(tool.locator('[data-component="text-shimmer"]')).toHaveAttribute("data-active", "true") + await expect(tool.locator('[data-slot="basic-tool-tool-title"] [data-pending]')).toHaveAttribute("data-pending", "true") await expect(tool.locator('[data-component="shell-submessage"]')).toHaveText(command) - await expect(tool.locator('[data-component="shell-submessage"] [data-component="text-shimmer"]')).toHaveCount(0) + await expect(tool.locator('[data-component="shell-submessage"] [data-pending]')).toHaveCount(0) await tool.locator('[data-slot="collapsible-trigger"]').click() await expect(tool.locator('[data-slot="collapsible-trigger"]')).toHaveAttribute("aria-expanded", "true") await expect(tool.locator('[data-slot="bash-pre"]')).toContainText("still running") diff --git a/packages/app/index.html b/packages/app/index.html index bb0d1e3bc4..9e1f3253c5 100644 --- a/packages/app/index.html +++ b/packages/app/index.html @@ -1,5 +1,5 @@ - + - + diff --git a/packages/app/public/assets/DMSans-Variable.woff2 b/packages/app/public/assets/DMSans-Variable.woff2 new file mode 100644 index 0000000000..9313206b1f Binary files /dev/null and b/packages/app/public/assets/DMSans-Variable.woff2 differ diff --git a/packages/app/public/oc-theme-preload.js b/packages/app/public/oc-theme-preload.js index 0ab9742019..0fe9a1b608 100644 --- a/packages/app/public/oc-theme-preload.js +++ b/packages/app/public/oc-theme-preload.js @@ -1,6 +1,17 @@ ;(function () { var key = "opencode-theme-id" - var themeId = localStorage.getItem(key) || "oc-2" + // amicode: the app HARD-PINS the brand theme (lockThemeId in app.tsx), so the + // pin is authoritative here too. Reading localStorage instead would let a + // stale id from a previous build stamp the pre-paint frame with the old + // theme, which then persists visibly until hydration corrects it. + // MUST match lockThemeId in packages/app/src/app.tsx. + var PINNED_THEME_ID = "harmoniqs" + var themeId = PINNED_THEME_ID + if (localStorage.getItem(key) !== themeId) { + localStorage.setItem(key, themeId) + localStorage.removeItem("opencode-theme-css-light") + localStorage.removeItem("opencode-theme-css-dark") + } if (themeId === "oc-1") { themeId = "oc-2" @@ -26,13 +37,16 @@ document.documentElement.dataset.theme = themeId document.documentElement.dataset.colorScheme = mode - document.documentElement.style.backgroundColor = isDark ? "#080808" : "#fafafa" + // Brand ground, tracking harmoniqs.json palette.neutral (dark #000, light #fff). + // This paints before any stylesheet, so a stock literal here shows through as + // the old brand for the first frame. + document.documentElement.style.backgroundColor = isDark ? "#0F0F0D" : "#ffffff" // Update theme-color meta tag to match app color scheme var metas = document.querySelectorAll("meta[name='theme-color']") - if (metas.length > 0) metas[0].setAttribute("content", isDark ? "#080808" : "#fafafa") + if (metas.length > 0) metas[0].setAttribute("content", isDark ? "#0F0F0D" : "#ffffff") - if (themeId === "oc-2") return + if (themeId === "oc-2") return // stock theme needs no cached CSS var css = localStorage.getItem("opencode-theme-css-" + mode) if (css) { diff --git a/packages/app/src/app.tsx b/packages/app/src/app.tsx index fc84096afc..72568c4909 100644 --- a/packages/app/src/app.tsx +++ b/packages/app/src/app.tsx @@ -498,7 +498,7 @@ export function AppBaseProviders(props: ParentProps<{ locale?: Locale }>) { { void window.api?.setTitlebar?.({ mode, scheme }) }} diff --git a/packages/app/src/components/connection-banner.tsx b/packages/app/src/components/connection-banner.tsx index dcb7bba18c..be54a988d9 100644 --- a/packages/app/src/components/connection-banner.tsx +++ b/packages/app/src/components/connection-banner.tsx @@ -61,7 +61,7 @@ export function ConnectionBanner() { transform: "translateX(-50%)", "z-index": 40, padding: "6px 14px", - "border-radius": "999px", + "border-radius": "var(--radius-full)", "font-size": "12px", "font-weight": 600, border: "1px solid var(--v2-border-border-base, #3c3c3c)", diff --git a/packages/app/src/components/dialog-command-palette-v2.css b/packages/app/src/components/dialog-command-palette-v2.css index a4019928aa..c0758c5785 100644 --- a/packages/app/src/components/dialog-command-palette-v2.css +++ b/packages/app/src/components/dialog-command-palette-v2.css @@ -14,7 +14,7 @@ min-height: 280px; max-height: min(calc(100vh - 96px), 480px); margin-top: max(48px, calc((100vh - 480px) / 2)); - border-radius: 12px; + border-radius: var(--radius-lg); background: var(--v2-background-bg-base); box-shadow: var(--v2-elevation-floating); } @@ -36,7 +36,7 @@ .command-palette-v2-search [data-component="text-input-v2"] { width: 100%; height: 36px; - border-radius: 6px; + border-radius: var(--radius-sm); outline: 0; background: color-mix(in srgb, var(--v2-background-bg-layer-02) 60%, transparent); box-shadow: none; @@ -52,7 +52,7 @@ } .command-palette-v2-search [data-component="text-input-v2"] [data-slot="text-input-v2-value"] { - border-radius: 6px; + border-radius: var(--radius-sm); background: transparent; gap: 8px; } @@ -62,7 +62,7 @@ } .command-palette-v2-search [data-component="text-input-v2"] [data-slot="text-input-v2-input"] { - border-radius: 6px; + border-radius: var(--radius-sm); background: transparent; } @@ -105,7 +105,7 @@ gap: 8px; padding: 0 12px; border: 0; - border-radius: 6px; + border-radius: var(--radius-sm); background: transparent; color: var(--v2-text-text-base); text-align: left; diff --git a/packages/app/src/components/dialog-command-palette-v2.tsx b/packages/app/src/components/dialog-command-palette-v2.tsx index e996fd0be7..f2736183d2 100644 --- a/packages/app/src/components/dialog-command-palette-v2.tsx +++ b/packages/app/src/components/dialog-command-palette-v2.tsx @@ -304,7 +304,7 @@ function PaletteRow(props: { diff --git a/packages/app/src/components/dialog-connect-provider.tsx b/packages/app/src/components/dialog-connect-provider.tsx index 0267b4b4ef..a039749ef4 100644 --- a/packages/app/src/components/dialog-connect-provider.tsx +++ b/packages/app/src/components/dialog-connect-provider.tsx @@ -668,7 +668,7 @@ function ProviderConnection(props: { > {(option) => (
-
+
{option.label} @@ -743,7 +743,7 @@ function ProviderConnection(props: { class="group flex h-9 w-full items-center gap-2 rounded-md px-3 text-left text-[13px] leading-5 tracking-[-0.04px] hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none" onClick={() => void selectMethod(index())} > - + {details().label} @@ -778,7 +778,7 @@ function ProviderConnection(props: { > {(i) => (
-
+
{methodLabel(i)} diff --git a/packages/app/src/components/dialog-edit-project-v2.tsx b/packages/app/src/components/dialog-edit-project-v2.tsx index dc9714aa06..d0eab418ab 100644 --- a/packages/app/src/components/dialog-edit-project-v2.tsx +++ b/packages/app/src/components/dialog-edit-project-v2.tsx @@ -45,7 +45,7 @@ export function DialogEditProjectV2(props: { project: LocalProject; server: Serv )} diff --git a/packages/app/src/components/dialog-edit-project.tsx b/packages/app/src/components/dialog-edit-project.tsx index 86a9630359..e22878217c 100644 --- a/packages/app/src/components/dialog-edit-project.tsx +++ b/packages/app/src/components/dialog-edit-project.tsx @@ -75,7 +75,7 @@ export function DialogEditProject(props: { project: LocalProject; server: Server
setIndex(i)} >
boolean; onOpenFile?:
- {formatKeybind(item.keybind ?? "", palette.language.t)} + {formatKeybind(item.keybind ?? "", palette.language.t)}
diff --git a/packages/app/src/components/help-button.tsx b/packages/app/src/components/help-button.tsx index 18dd727084..0608405748 100644 --- a/packages/app/src/components/help-button.tsx +++ b/packages/app/src/components/help-button.tsx @@ -22,13 +22,13 @@ export function TabsInfoPopup() {