titan/atlas-iac
3
0
Fork 0
Code Issues Pull Requests 9 Actions Packages Projects Releases Wiki Activity

fix(hermes): stabilize chat canvas gradients

Browse Source
This commit is contained in:
jenkins 2026-08-24 00:01:52 -03:00
parent af5ee4697b
commit e9a6eba30b
2 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
dockerfiles/hermes-webui-brand.css
View File

@ -78,13 +78,22 @@
background-color: transparent; background-color: transparent;
} }
:root.dark .messages { :root.dark .messages-shell {
background-image: background-image:
linear-gradient(var(--hermes-grid) 1px, transparent 1px), linear-gradient(var(--hermes-grid) 1px, transparent 1px),
linear-gradient(90deg, var(--hermes-grid) 1px, transparent 1px), linear-gradient(90deg, var(--hermes-grid) 1px, transparent 1px),
radial-gradient(circle at 76% 22%, rgba(76, 164, 205, 0.055), transparent 30rem), radial-gradient(circle at 76% 22%, rgba(76, 164, 205, 0.055), transparent 30rem),
radial-gradient(circle at 22% 78%, var(--hermes-violet-muted), transparent 35rem); radial-gradient(circle at 22% 78%, var(--hermes-violet-muted), transparent 35rem);
background-size: 32px 32px, 32px 32px, auto, auto; background-size: 32px 32px, 32px 32px, auto, auto;
background-repeat: repeat, repeat, no-repeat, no-repeat;
}
/* The transcript is an accelerated scroll surface. Painting gradients on it
produces stale compositor tiles on Chromium as the scroll offset changes,
which looks like a dark rectangle moving along the right edge. Keep the
scroll surface transparent and paint the texture on its stationary shell. */
:root.dark .messages {
background-image: none;
} }
:root.dark .rail { :root.dark .rail {

6
testing/tests/test_hermes_webui_brand.py
View File

@ -359,8 +359,12 @@ def test_brand_css_is_accessible_dark_and_reduced_motion_aware() -> None:
assert "--hermes-grid: rgba(72, 207, 204, 0.025)" in dark assert "--hermes-grid: rgba(72, 207, 204, 0.025)" in dark
assert ".empty-logo .hermes-agent-portrait" in css assert ".empty-logo .hermes-agent-portrait" in css
assert "width: 112px" in css assert "width: 112px" in css
assert ":root.dark .messages" in css assert ":root.dark .messages-shell" in css
assert "background-size: 32px 32px, 32px 32px, auto, auto" in css assert "background-size: 32px 32px, 32px 32px, auto, auto" in css
assert "background-repeat: repeat, repeat, no-repeat, no-repeat" in css
messages = css.rsplit(":root.dark .messages {", 1)[1].split("}", 1)[0]
assert "background-image: none" in messages
assert "radial-gradient" not in messages
assert ":root.dark .session-item.active" in css assert ":root.dark .session-item.active" in css
assert ":root.dark .suggestion:focus-visible" in css assert ":root.dark .suggestion:focus-visible" in css
assert "@media (prefers-reduced-motion: reduce)" in css assert "@media (prefers-reduced-motion: reduce)" in css