From bfcc21fb272ef33d2501c8bf45e308a8012f64eb Mon Sep 17 00:00:00 2001 From: Codinget Date: Fri, 22 May 2026 17:42:02 +0000 Subject: [PATCH] Fix invisible borders on Rem and Ram themes Both themes set borderColor == baseBackground in their IDE editor-scheme override (a seamless look for code editors). For the web UI secondary colour, fall back to secondaryBackground when borderColor would match the page background exactly. Co-Authored-By: Claude Sonnet 4.6 --- src/themeBuilder.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/themeBuilder.ts b/src/themeBuilder.ts index b2b6af0..9f2be2d 100644 --- a/src/themeBuilder.ts +++ b/src/themeBuilder.ts @@ -79,8 +79,14 @@ export function buildVariables(theme: ThemeConfig): Record { const isDark = theme.colorScheme === 'dark'; const primary = get(p, 'accentColor'); - const secondary = get(p, 'borderColor', get(p, 'secondaryBackground')); const body = get(p, 'baseBackground'); + // Some themes (e.g. Rem, Ram) set borderColor == baseBackground in their IDE + // editor-scheme override, creating an invisible-border effect suited for IDE + // editors but unusable in a web UI. Fall back to secondaryBackground instead. + const rawSecondary = get(p, 'borderColor', get(p, 'secondaryBackground')); + const secondary = rawSecondary === body + ? get(p, 'secondaryBackground', scaleLightness(body, isDark ? 0.08 : -0.08)) + : rawSecondary; const fg = get(p, 'foregroundColor'); const headerColor = get(p, 'headerColor'); const contrastColor = get(p, 'contrastColor');