fix: remove gradient fades, fix sidebar active indicator full-height
Remove tile-body::before and sidebar-item-body::before gradient overlays that obscured ANSI colors at the bottom of previews. Replace box-shadow inset with border-left on sidebar-item--active so the cyan accent stripe spans the full item height (was only showing on the header).
This commit is contained in:
@@ -251,18 +251,7 @@ body {
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Fade gradient at bottom of tile body */
|
|
||||||
.tile-body::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
height: 40px;
|
|
||||||
background: linear-gradient(to bottom, transparent, #000000);
|
|
||||||
pointer-events: none;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ============================================================
|
/* ============================================================
|
||||||
Empty state
|
Empty state
|
||||||
@@ -491,7 +480,7 @@ body {
|
|||||||
.sidebar-item--active {
|
.sidebar-item--active {
|
||||||
background: var(--bg-surface);
|
background: var(--bg-surface);
|
||||||
border-color: var(--accent);
|
border-color: var(--accent);
|
||||||
box-shadow: inset 3px 0 0 var(--accent);
|
border-left: 3px solid var(--accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-item-header {
|
.sidebar-item-header {
|
||||||
@@ -523,21 +512,7 @@ body {
|
|||||||
background: #000000;
|
background: #000000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-item-body::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
height: 32px;
|
|
||||||
background: linear-gradient(to bottom, transparent, #000000);
|
|
||||||
pointer-events: none;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-item--active .sidebar-item-body::before {
|
|
||||||
background: linear-gradient(to bottom, transparent, #000000);
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-item-body pre {
|
.sidebar-item-body pre {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -355,13 +355,13 @@ def test_css_sidebar_item_hover():
|
|||||||
|
|
||||||
|
|
||||||
def test_css_sidebar_item_active():
|
def test_css_sidebar_item_active():
|
||||||
""".sidebar-item--active must use inset box-shadow stripe instead of border-left-width to avoid layout shift."""
|
""".sidebar-item--active must use border-left for full-height accent indicator."""
|
||||||
css = read_css()
|
css = read_css()
|
||||||
assert ".sidebar-item--active" in css
|
assert ".sidebar-item--active" in css
|
||||||
block = _extract_rule_block(css, ".sidebar-item--active {")
|
block = _extract_rule_block(css, ".sidebar-item--active {")
|
||||||
assert "background: var(--bg-surface)" in block
|
assert "background: var(--bg-surface)" in block
|
||||||
assert "border-color: var(--accent)" in block
|
assert "border-color: var(--accent)" in block
|
||||||
assert "box-shadow: inset 3px 0 0 var(--accent)" in block
|
assert "border-left: 3px solid var(--accent)" in block
|
||||||
|
|
||||||
|
|
||||||
def test_css_sidebar_item_header():
|
def test_css_sidebar_item_header():
|
||||||
@@ -714,19 +714,8 @@ def test_sidebar_item_body_pre_has_explicit_font_family():
|
|||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
def test_sidebar_item_body_gradient_fades_to_black():
|
def test_no_gradient_fade_on_previews():
|
||||||
""".sidebar-item-body::before gradient must fade to #000000 (not theme background)."""
|
"""Gradient fade overlays must be removed — they obscure ANSI colors at the bottom."""
|
||||||
css = read_css()
|
css = read_css()
|
||||||
block = _extract_rule_block(css, ".sidebar-item-body::before {")
|
assert ".tile-body::before" not in css, "tile-body::before gradient must be removed"
|
||||||
assert "#000000" in block or "transparent, #000" in block, (
|
assert ".sidebar-item-body::before" not in css, "sidebar-item-body::before gradient must be removed"
|
||||||
".sidebar-item-body::before gradient must fade to #000000 to match black terminal bg"
|
|
||||||
)
|
|
||||||
|
|
||||||
|
|
||||||
def test_tile_body_gradient_fades_to_black():
|
|
||||||
""".tile-body::before gradient must fade to #000000 (not theme background)."""
|
|
||||||
css = read_css()
|
|
||||||
block = _extract_rule_block(css, ".tile-body::before {")
|
|
||||||
assert "#000000" in block or "transparent, #000" in block, (
|
|
||||||
".tile-body::before gradient must fade to #000000 to match black terminal bg"
|
|
||||||
)
|
|
||||||
|
|||||||
Reference in New Issue
Block a user