authorgravatar for 97427849+flamboh@users.noreply.github.comoliver <97427849+flamboh@users.noreply.github.com> 2026-09-01 18:43:57-07:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-09-01 21:43:57-04:00
logcdbf324aa043b1bc5705159127d2b55f186d1b9b
treee76a34feaecc339e84aa1c05361df275a04e924b
parentd0b19b32e01d7abc8829c01353d759fed3d304ed
signature Signed by PGP key B5690EEEBB952194

fix(web): keep generated muted foreground dimmer than entered text (#9113)


2 files changed, 4 insertions(+), 1 deletions(-)

apps/web/src/themePalette.test.ts+3
...@@ -156,6 +156,9 @@ describe("theme files", () => {...@@ -156,6 +156,9 @@ describe("theme files", () => {
156 expect(contrastRatio(colors.textMuted, colors.canvas)).toBeGreaterThanOrEqual(4.5);156 expect(contrastRatio(colors.textMuted, colors.canvas)).toBeGreaterThanOrEqual(4.5);
157 expect(contrastRatio(colors.textMuted, colors.canvas)).toBeLessThan(5.5);157 expect(contrastRatio(colors.textMuted, colors.canvas)).toBeLessThan(5.5);
158 expect(contrastRatio(colors.mutedForeground, colors.muted)).toBeGreaterThanOrEqual(4.5);158 expect(contrastRatio(colors.mutedForeground, colors.muted)).toBeGreaterThanOrEqual(4.5);
159 expect(contrastRatio(colors.mutedForeground, colors.muted)).toBeLessThan(
160 contrastRatio(colors.text, colors.muted),
161 );
159 expect(contrastRatio(colors.placeholder, colors.surfaceRaised)).toBeGreaterThanOrEqual(4.5);162 expect(contrastRatio(colors.placeholder, colors.surfaceRaised)).toBeGreaterThanOrEqual(4.5);
160 expect(contrastRatio(colors.placeholder, colors.surfaceRaised)).toBeLessThan(163 expect(contrastRatio(colors.placeholder, colors.surfaceRaised)).toBeLessThan(
161 contrastRatio(colors.text, colors.surfaceRaised),164 contrastRatio(colors.text, colors.surfaceRaised),
apps/web/src/themePalette.ts+1-1
...@@ -916,7 +916,7 @@ export function createVividThemeColors(...@@ -916,7 +916,7 @@ export function createVividThemeColors(
916 themeOklchToThemeColor(916 themeOklchToThemeColor(
917 solveOklchLightness(textBase, surfaceRgb, 4.6, dark ? "lighter" : "darker"),917 solveOklchLightness(textBase, surfaceRgb, 4.6, dark ? "lighter" : "darker"),
918 );918 );
919 const mutedForeground = foregroundOn(mutedRgb);919 const mutedForeground = themeRgbToThemeColor(readableThemeText(mutedRgb, textRgb, 1, 4.6));
920 const placeholder = themeRgbToThemeColor(readableThemeText(surfaceRaisedRgb, textRgb, 1, 4.6));920 const placeholder = themeRgbToThemeColor(readableThemeText(surfaceRaisedRgb, textRgb, 1, 4.6));
921921
922 const actionHover: ThemeOklch = { ...action, L: action.L + (dark ? 0.06 : -0.06) };922 const actionHover: ThemeOklch = { ...action, L: action.L + (dark ? 0.06 : -0.06) };