mirror of
https://github.com/hansjone/netx.git
synced 2026-10-09 05:30:46 +08:00
Preserve NE icon white textures when applying vendor tint colors.
Layer the original PNG under a color blend tint so luminosity highlights stay visible while brand hues remain editable. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
parent
65afe8f29f
commit
a412ca7cbc
2 changed files with 28 additions and 3 deletions
|
|
@ -7132,13 +7132,30 @@ pre {
|
|||
}
|
||||
|
||||
.topo-node__icon {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
margin: 0;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
isolation: isolate;
|
||||
transition: transform 0.12s ease;
|
||||
}
|
||||
|
||||
.topo-node__icon-art {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
/* Recolor hue/sat from --topo-icon-color; keep luminosity so white textures remain. */
|
||||
.topo-node__icon-tint {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-color: var(--topo-icon-color, #3b82f6);
|
||||
mix-blend-mode: color;
|
||||
-webkit-mask-image: url(/topo/ne-router.png);
|
||||
mask-image: url(/topo/ne-router.png);
|
||||
-webkit-mask-size: contain;
|
||||
|
|
@ -7147,7 +7164,7 @@ pre {
|
|||
mask-repeat: no-repeat;
|
||||
-webkit-mask-position: center;
|
||||
mask-position: center;
|
||||
transition: transform 0.12s ease, background-color 0.12s ease;
|
||||
transition: background-color 0.12s ease;
|
||||
}
|
||||
|
||||
.topo-node__caption {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue