ken/muxplex
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use var(--border) for default left border on tiles and sidebar items

Browse Source
This commit is contained in:
Brian Krabach
2026-04-01 16:12:23 -07:00
parent d7d40f1f0d
commit d7bcf49283
2 changed files with 47 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
muxplex/frontend/style.css
+2 -2
View File
@@ -171,7 +171,7 @@ body {
height: var(--tile-height);
background: var(--bg-tile);
border: 1px solid var(--border);
border-left: 3px solid transparent; /* edge bar — always present, transparent by default */
border-left: 3px solid var(--border); /* edge bar — always present, matches other 3 borders */
border-radius: 4px;
display: flex;
flex-direction: column;
@@ -545,7 +545,7 @@ body {
flex-direction: column;
position: relative;
border: 1px solid var(--border);
border-left: 3px solid transparent; /* edge bar — always present, transparent by default */
border-left: 3px solid var(--border); /* edge bar — always present, matches other 3 borders */
border-radius: 4px;
transition: border-color var(--t-fast), border-left-color var(--t-fast), box-shadow var(--t-fast);
}
muxplex/tests/test_frontend_css.py
+45
View File
@@ -2092,3 +2092,48 @@ def test_custom_scrollbar_styles():
assert "border-radius: 3px" in css or "border-radius:3px" in css, (
"scrollbar thumb must be rounded"
)
# ============================================================
# Fix: default left border on tiles and sidebar items (task-4-fix-left-border)
# ============================================================
def test_css_session_tile_default_left_border() -> None:
""".session-tile default border-left must use var(--border), not transparent.
On the dark background, transparent makes the left border invisible —
it looks like only 3 sides have a border. Fix: change to 3px solid var(--border)
to match the other 3 borders. Bell and active states already override border-left-color.
"""
css = read_css()
block = _extract_rule_block(css, ".session-tile {")
assert "border-left: 3px solid var(--border)" in block, (
".session-tile default border-left must use var(--border) — "
"transparent is invisible on dark backgrounds"
)
# Verify transparent is not used as the default left border value
assert "transparent" not in block, (
".session-tile must not use transparent for default border-left — "
"it makes the left edge invisible on dark backgrounds"
)
def test_css_sidebar_item_default_left_border() -> None:
""".sidebar-item default border-left must use var(--border), not transparent.
On the dark background, transparent makes the left border invisible —
it looks like only 3 sides have a border. Fix: change to 3px solid var(--border)
to match the other 3 borders. Active state already overrides border-left-color.
"""
css = read_css()
block = _extract_rule_block(css, ".sidebar-item {")
assert "border-left: 3px solid var(--border)" in block, (
".sidebar-item default border-left must use var(--border) — "
"transparent is invisible on dark backgrounds"
)
# Verify transparent is not used as the default left border value
assert "transparent" not in block, (
".sidebar-item must not use transparent for default border-left — "
"it makes the left edge invisible on dark backgrounds"
)