Skip to content

Commit 7b0829f

Browse files
steipetesteipete
committed
improve(ui): remove the Roundness appearance setting
Corner radius is owned by themes; drop the browser-local multiplier that scaled all --radius-* variables (added in #49436). Stale borderRadius localStorage keys are ignored and dropped on next settings write.
1 parent 4be6fa7 commit 7b0829f

12 files changed

Lines changed: 2 additions & 249 deletions

File tree

‎ui/src/app/settings.node.test.ts‎

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,6 @@ function makeSettings(gatewayUrl: string, overrides: Partial<UiSettings> = {}):
6161
navWidth: 258,
6262
sidebarPinnedRoutes: ["overview"],
6363
sidebarMoreExpanded: false,
64-
borderRadius: 50,
6564
...overrides,
6665
};
6766
}
@@ -170,7 +169,6 @@ describe("loadSettings default gateway URL derivation", () => {
170169
navWidth: 258,
171170
sidebarPinnedRoutes: ["overview"],
172171
sidebarMoreExpanded: false,
173-
borderRadius: 50,
174172
textScale: 100,
175173
sessionsByGateway: {
176174
"wss://gateway.example:8443/openclaw": {
@@ -205,7 +203,6 @@ describe("loadSettings default gateway URL derivation", () => {
205203
navWidth: 258,
206204
sidebarPinnedRoutes: ["overview"],
207205
sidebarMoreExpanded: false,
208-
borderRadius: 50,
209206
textScale: 100,
210207
});
211208

@@ -238,7 +235,6 @@ describe("loadSettings default gateway URL derivation", () => {
238235
navWidth: 258,
239236
sidebarPinnedRoutes: ["overview"],
240237
sidebarMoreExpanded: false,
241-
borderRadius: 50,
242238
});
243239

244240
saveSettings({
@@ -256,7 +252,6 @@ describe("loadSettings default gateway URL derivation", () => {
256252
navWidth: 258,
257253
sidebarPinnedRoutes: ["overview"],
258254
sidebarMoreExpanded: false,
259-
borderRadius: 50,
260255
});
261256

262257
const settings = loadSettings();
@@ -286,7 +281,6 @@ describe("loadSettings default gateway URL derivation", () => {
286281
navWidth: 258,
287282
sidebarPinnedRoutes: ["overview"],
288283
sidebarMoreExpanded: false,
289-
borderRadius: 50,
290284
});
291285
const settings = loadSettings();
292286
expect(settings.gatewayUrl).toBe(gwUrl);
@@ -306,7 +300,6 @@ describe("loadSettings default gateway URL derivation", () => {
306300
navWidth: 258,
307301
sidebarPinnedRoutes: ["overview"],
308302
sidebarMoreExpanded: false,
309-
borderRadius: 50,
310303
textScale: 100,
311304
sessionsByGateway: {
312305
[gwUrl]: {
@@ -341,7 +334,6 @@ describe("loadSettings default gateway URL derivation", () => {
341334
navWidth: 258,
342335
sidebarPinnedRoutes: ["sessions", "cron"],
343336
sidebarMoreExpanded: true,
344-
borderRadius: 50,
345337
textScale: 100,
346338
});
347339

@@ -481,7 +473,6 @@ describe("loadSettings default gateway URL derivation", () => {
481473
navWidth: 258,
482474
sidebarPinnedRoutes: ["overview"],
483475
sidebarMoreExpanded: false,
484-
borderRadius: 50,
485476
});
486477
saveSettings({
487478
gatewayUrl: gwUrl,
@@ -497,7 +488,6 @@ describe("loadSettings default gateway URL derivation", () => {
497488
navWidth: 258,
498489
sidebarPinnedRoutes: ["overview"],
499490
sidebarMoreExpanded: false,
500-
borderRadius: 50,
501491
});
502492

503493
expect(loadSettings().token).toBe("");
@@ -526,7 +516,6 @@ describe("loadSettings default gateway URL derivation", () => {
526516
navWidth: 320,
527517
sidebarPinnedRoutes: ["overview"],
528518
sidebarMoreExpanded: false,
529-
borderRadius: 50,
530519
});
531520

532521
const scopedKey = `openclaw.control.settings.v1:${gwUrl}`;
@@ -598,7 +587,6 @@ describe("loadSettings default gateway URL derivation", () => {
598587
navWidth: 258,
599588
sidebarPinnedRoutes: ["overview"],
600589
sidebarMoreExpanded: false,
601-
borderRadius: 50,
602590
customTheme,
603591
});
604592

@@ -629,7 +617,6 @@ describe("loadSettings default gateway URL derivation", () => {
629617
navWidth: 258,
630618
sidebarPinnedRoutes: ["overview"],
631619
sidebarMoreExpanded: false,
632-
borderRadius: 50,
633620
customTheme: {
634621
sourceUrl: "https://tweakcn.com/themes/broken",
635622
themeId: "broken",
@@ -674,7 +661,6 @@ describe("loadSettings default gateway URL derivation", () => {
674661
navWidth: 258,
675662
sidebarPinnedRoutes: ["overview"],
676663
sidebarMoreExpanded: false,
677-
borderRadius: 50,
678664
});
679665

680666
const settings = loadSettings();
@@ -718,7 +704,6 @@ describe("loadSettings default gateway URL derivation", () => {
718704
navWidth: 258,
719705
sidebarPinnedRoutes: ["overview"],
720706
sidebarMoreExpanded: false,
721-
borderRadius: 50,
722707
});
723708

724709
const persisted = JSON.parse(localStorage.getItem(scopedKey) ?? "{}");

‎ui/src/app/settings.ts‎

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,6 @@ import { normalizeGatewayTokenScope } from "./gateway-scope.ts";
4545
import { parseThemeSelection, type ThemeMode, type ThemeName } from "./theme.ts";
4646
import { normalizeLocalUserIdentity, type LocalUserIdentity } from "./user-identity.ts";
4747

48-
export const BORDER_RADIUS_STOPS = [0, 25, 50, 75, 100] as const;
49-
export type BorderRadiusStop = (typeof BORDER_RADIUS_STOPS)[number];
50-
5148
export const TEXT_SCALE_STOPS = [90, 100, 110, 125, 140] as const;
5249
export type TextScaleStop = (typeof TEXT_SCALE_STOPS)[number];
5350

@@ -69,19 +66,6 @@ export function normalizeChatSendShortcut(value: unknown): ChatSendShortcut {
6966
: "enter";
7067
}
7168

72-
function snapBorderRadius(value: number): BorderRadiusStop {
73-
let best: BorderRadiusStop = BORDER_RADIUS_STOPS[0];
74-
let bestDist = Math.abs(value - best);
75-
for (const stop of BORDER_RADIUS_STOPS) {
76-
const dist = Math.abs(value - stop);
77-
if (dist < bestDist) {
78-
best = stop;
79-
bestDist = dist;
80-
}
81-
}
82-
return best;
83-
}
84-
8569
export function normalizeTextScale(value: unknown, fallback: TextScaleStop = 100): TextScaleStop {
8670
if (typeof value !== "number" || !Number.isFinite(value)) {
8771
return fallback;
@@ -117,7 +101,6 @@ export type UiSettings = {
117101
navWidth: number; // Sidebar width when expanded (240–400px)
118102
sidebarPinnedRoutes: SidebarNavRoute[]; // Nav routes shown above the "More" section
119103
sidebarMoreExpanded: boolean; // Whether the sidebar "More" section is expanded
120-
borderRadius: number; // Corner roundness (0–100, default 50)
121104
textScale?: TextScaleStop; // Browser-local text scale percentage
122105
customTheme?: ImportedCustomTheme;
123106
locale?: string;
@@ -538,7 +521,6 @@ export function loadSettings(): UiSettings {
538521
navWidth: NAV_WIDTH_DEFAULT,
539522
sidebarPinnedRoutes: [...DEFAULT_SIDEBAR_PINNED_ROUTES],
540523
sidebarMoreExpanded: false,
541-
borderRadius: 50,
542524
textScale: 100,
543525
};
544526

@@ -613,12 +595,6 @@ export function loadSettings(): UiSettings {
613595
typeof parsed.sidebarMoreExpanded === "boolean"
614596
? parsed.sidebarMoreExpanded
615597
: defaults.sidebarMoreExpanded,
616-
borderRadius:
617-
typeof parsed.borderRadius === "number" &&
618-
parsed.borderRadius >= 0 &&
619-
parsed.borderRadius <= 100
620-
? snapBorderRadius(parsed.borderRadius)
621-
: defaults.borderRadius,
622598
textScale: normalizeTextScale(parsed.textScale, defaults.textScale),
623599
customTheme: customTheme ?? undefined,
624600
locale: isSupportedLocale(parsed.locale) ? parsed.locale : undefined,
@@ -704,7 +680,6 @@ function persistSettings(next: UiSettings, options: { selectGateway?: boolean }
704680
navWidth: next.navWidth,
705681
sidebarPinnedRoutes: next.sidebarPinnedRoutes,
706682
sidebarMoreExpanded: next.sidebarMoreExpanded,
707-
borderRadius: next.borderRadius,
708683
textScale: normalizeTextScale(next.textScale),
709684
...(next.customTheme ? { customTheme: next.customTheme } : {}),
710685
sessionsByGateway,

‎ui/src/i18n/.i18n/raw-copy-baseline.json‎

Lines changed: 0 additions & 56 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎ui/src/pages/chat/chat-controls.test.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ function createSettings(): UiSettings {
2929
navWidth: 280,
3030
sidebarPinnedRoutes: ["overview", "workboard", "agents"],
3131
sidebarMoreExpanded: false,
32-
borderRadius: 50,
3332
};
3433
}
3534

‎ui/src/pages/chat/chat-view.test.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -408,7 +408,6 @@ function createChatHeaderState(
408408
navWidth: 280,
409409
sidebarPinnedRoutes: ["overview"],
410410
sidebarMoreExpanded: false,
411-
borderRadius: 50,
412411
chatShowThinking: false,
413412
chatShowToolCalls: true,
414413
},

‎ui/src/pages/config/config-page.ts‎

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -104,7 +104,6 @@ const KNOWN_CHANNELS = [
104104
{ id: "imessage", label: "iMessage" },
105105
] as const;
106106

107-
const BASE_RADII = { sm: 6, md: 10, lg: 14, xl: 20, full: 9999, default: 10 };
108107
const SYSTEM_INFO_POLL_INTERVAL_MS = 10_000;
109108

110109
function isUnknownSystemInfoMethodError(error: unknown): boolean {
@@ -263,20 +262,6 @@ function extractQuickSettingsSecurity(config: unknown): QuickSettingsSecurity {
263262
};
264263
}
265264

266-
function applyBorderRadius(value: number) {
267-
if (typeof document === "undefined") {
268-
return;
269-
}
270-
const root = document.documentElement;
271-
const scale = value / 50;
272-
root.style.setProperty("--radius-sm", `${Math.round(BASE_RADII.sm * scale)}px`);
273-
root.style.setProperty("--radius-md", `${Math.round(BASE_RADII.md * scale)}px`);
274-
root.style.setProperty("--radius-lg", `${Math.round(BASE_RADII.lg * scale)}px`);
275-
root.style.setProperty("--radius-xl", `${Math.round(BASE_RADII.xl * scale)}px`);
276-
root.style.setProperty("--radius-full", `${Math.round(BASE_RADII.full * scale)}px`);
277-
root.style.setProperty("--radius", `${Math.round(BASE_RADII.default * scale)}px`);
278-
}
279-
280265
function applyTextScale(value: unknown) {
281266
if (typeof document === "undefined") {
282267
return;
@@ -534,10 +519,8 @@ export class ConfigPage extends LitElement {
534519
theme: next.theme,
535520
themeMode: next.themeMode,
536521
customTheme: next.customTheme,
537-
borderRadius: next.borderRadius,
538522
textScale: next.textScale,
539523
});
540-
applyBorderRadius(this.settings.borderRadius);
541524
applyTextScale(this.settings.textScale);
542525
this.context.theme.refresh();
543526
}
@@ -570,10 +553,6 @@ export class ConfigPage extends LitElement {
570553
});
571554
}
572555

573-
private setBorderRadius(value: number) {
574-
this.applySettings({ ...this.settings, borderRadius: value });
575-
}
576-
577556
private setTextScale(value: number) {
578557
this.applySettings({ ...this.settings, textScale: normalizeTextScale(value) });
579558
}
@@ -729,8 +708,6 @@ export class ConfigPage extends LitElement {
729708
onImportCustomTheme: () => void this.importCustomTheme(),
730709
onClearCustomTheme: () => this.clearCustomTheme(),
731710
onOpenCustomThemeImport: () => this.openCustomThemeImport(),
732-
borderRadius: this.settings.borderRadius,
733-
setBorderRadius: (value) => this.setBorderRadius(value),
734711
textScale: this.settings.textScale ?? 100,
735712
setTextScale: (value) => this.setTextScale(value),
736713
gatewayUrl: this.context.gateway.connection.gatewayUrl,
@@ -795,7 +772,6 @@ export class ConfigPage extends LitElement {
795772
themeMode: this.settings.themeMode,
796773
hasCustomTheme: Boolean(this.settings.customTheme),
797774
customThemeLabel: this.settings.customTheme?.label,
798-
borderRadius: this.settings.borderRadius,
799775
textScale: this.settings.textScale ?? 100,
800776
setTheme: (theme, transitionContext) => this.setTheme(theme, transitionContext),
801777
setThemeMode: (mode, transitionContext) => this.setThemeMode(mode, transitionContext),
@@ -807,7 +783,6 @@ export class ConfigPage extends LitElement {
807783
};
808784
this.navigate("ai-agents");
809785
},
810-
setBorderRadius: (value) => this.setBorderRadius(value),
811786
setTextScale: (value) => this.setTextScale(value),
812787
onOpenCustomThemeImport: () => {
813788
this.pageId = "appearance";

‎ui/src/pages/config/quick.test.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,12 +65,10 @@ function createProps(overrides: Partial<QuickSettingsProps> = {}): QuickSettings
6565
themeMode: "system",
6666
hasCustomTheme: false,
6767
customThemeLabel: null,
68-
borderRadius: 50,
6968
textScale: 100,
7069
setTheme: vi.fn(),
7170
onOpenCustomThemeImport: vi.fn(),
7271
setThemeMode: vi.fn(),
73-
setBorderRadius: vi.fn(),
7472
setTextScale: vi.fn(),
7573
userAvatar: null,
7674
onUserAvatarChange: vi.fn(),

0 commit comments

Comments
 (0)