mirror of
https://github.com/Matysh/houseplan-card
synced 2026-08-01 00:48:29 +00:00
Trail casing: dark halo + light core
The accent line vanished on same-hue fills. Blend modes (difference/ exclusion) all keep a blind luminance where the stroke disappears and composite expensively on old kiosk WebViews, so the trail now uses the cartographers' trick instead: a neutral dark halo under a light core — one of the two always contrasts with whatever is underneath. Verified over glow fill (dark rooms + light pools) in one screenshot.
This commit is contained in:
+10
-3
@@ -1291,13 +1291,20 @@ export const cardStyles = css`
|
||||
}
|
||||
.vactrail polyline {
|
||||
fill: none;
|
||||
stroke: var(--hp-accent);
|
||||
stroke-opacity: 0.35;
|
||||
stroke-width: 3;
|
||||
stroke-linejoin: round;
|
||||
stroke-linecap: round;
|
||||
vector-effect: non-scaling-stroke;
|
||||
}
|
||||
/* dark halo + light core: neutral, and one of the two always contrasts
|
||||
with whatever fill is underneath */
|
||||
.vactrail .case {
|
||||
stroke: rgba(0, 0, 0, 0.4);
|
||||
stroke-width: 4.5;
|
||||
}
|
||||
.vactrail .core {
|
||||
stroke: rgba(255, 255, 255, 0.82);
|
||||
stroke-width: 1.8;
|
||||
}
|
||||
.vacbox .vacbtns { display: flex; gap: 8px; margin: 6px 0; flex-wrap: wrap; }
|
||||
.vaccalbar {
|
||||
position: fixed;
|
||||
|
||||
Reference in New Issue
Block a user