WesternTechnologies/kmtnflower

0 Fork 0

fix(ssr): remove color defaults from :root in _themes.scss #12

Merged

robot merged 2 commits from fix/remove-root-color-defaults into main

2026-08-09 00:17:03 -07:00

Author	SHA1	Message	Date
robot	bb45e8d6ae	fix(ssr): inject derived gradients and migrate component SCSS to CSS vars CI Pipeline / backend-test (push) Successful in 9m52s Details CI Pipeline / frontend-test (push) Successful in 24s Details CI Pipeline / frontend-build (push) Successful in 30s Details CI Pipeline / backend-lint (push) Successful in 9s Details CI Pipeline / backend-test (pull_request) Successful in 9m59s Details CI Pipeline / frontend-test (pull_request) Successful in 23s Details CI Pipeline / frontend-build (pull_request) Successful in 31s Details CI Pipeline / backend-lint (pull_request) Successful in 8s Details CI Pipeline / quality-gate (push) Successful in 2s Details CI Pipeline / quality-gate (pull_request) Successful in 2s Details The server-injected inline <style> was missing the three derived gradient variables (--sky-gradient, --sunset-gradient, --mixed-gradient) that components reference via var(). Without them, components fell back to SCSS build-time defaults on the first paint, causing a visible flash before ThemeService.apply() corrected the values. Additionally, migrate three component SCSS files from hardcoded SCSS color variables to CSS custom properties so the first paint uses the server-injected runtime colors: - login.component.scss: backgrounds, text colors, borders, focus rings - events.component.scss: event date card background gradient - about.component.scss: donation CTA background gradient	2026-08-09 06:49:24 +00:00
robot	e78a725839	fix(ssr): remove color defaults from :root in _themes.scss CI Pipeline / backend-test (push) Successful in 9m55s Details CI Pipeline / frontend-test (push) Successful in 23s Details CI Pipeline / frontend-build (push) Successful in 29s Details CI Pipeline / backend-lint (push) Successful in 9s Details CI Pipeline / backend-test (pull_request) Successful in 9m56s Details CI Pipeline / frontend-test (pull_request) Successful in 23s Details CI Pipeline / frontend-build (pull_request) Successful in 30s Details CI Pipeline / backend-lint (pull_request) Successful in 8s Details CI Pipeline / quality-gate (push) Successful in 2s Details CI Pipeline / quality-gate (pull_request) Successful in 1s Details The SSR server injects fresh color CSS custom properties as an inline <style> block before </head>, but _themes.scss also set hardcoded color defaults on :root at build time. The two :root blocks compete in the cascade — the compiled stylesheet (loaded after the inline <style>) overwrites the server-injected colors, causing a visible flash where wrong colors render briefly before ThemeService.apply() corrects them. Removing the color properties from :root in _themes.scss makes the server-injected <style> the sole source of truth for colors. Non-color properties (fonts, radii, shadows) remain as build-time defaults since they don't change between deploys.	2026-08-09 05:55:28 +00:00