Mouse-Over Tooltips fuer alle Layer und Visual Modes
Jedes interaktive Element hat einen erklaerenden Tooltip: - Layer-Checkboxen: Datenquelle, Refresh-Rate, Anzahl - Layer-Namen: Inhalt und Farbkodierung - Visual Modes: Erklaerung des Effekts - Custom CSS-Tooltips passend zum Dark-Theme
Dieser Commit ist enthalten in:
@@ -230,3 +230,28 @@ html, body { height: 100%; overflow: hidden; background: var(--bg-primary); colo
|
||||
pointer-events: none;
|
||||
z-index: 40;
|
||||
}
|
||||
|
||||
/* === Tooltip-Styling === */
|
||||
.layer-toggle[title]:hover::after,
|
||||
.layer-name[title]:hover::after,
|
||||
.vmode-btn[title]:hover::after {
|
||||
content: attr(title);
|
||||
position: absolute;
|
||||
left: 110%;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: rgba(11, 17, 33, 0.95);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 4px;
|
||||
padding: 6px 10px;
|
||||
font-size: 10px;
|
||||
color: var(--text);
|
||||
white-space: nowrap;
|
||||
z-index: 200;
|
||||
pointer-events: none;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.4);
|
||||
max-width: 280px;
|
||||
white-space: normal;
|
||||
line-height: 1.4;
|
||||
}
|
||||
.layer-toggle, .layer-name, .vmode-btn { position: relative; }
|
||||
|
||||
In neuem Issue referenzieren
Einen Benutzer sperren