Fix: hover button fix
This commit is contained in:
@@ -645,6 +645,16 @@ Item {
|
||||
color: (netRow.net.connected || netRow.passwordOpen)
|
||||
? Qt.rgba(Colors.primary.r, Colors.primary.g, Colors.primary.b, 0.18)
|
||||
: (rowMouse.containsMouse ? Colors.primary : "transparent")
|
||||
readonly property bool active: netRow.net.connected || netRow.passwordOpen
|
||||
|
||||
// Colors.primaryText (used below whenever hovered) assumes a solid
|
||||
// Colors.primary fill behind it — true for a hovered *inactive* row,
|
||||
// but an active row's background stays the translucent tint above
|
||||
// even while hovered, so primaryText (dark, meant for a bright solid
|
||||
// fill) reads poorly against it. This hardcoded near-white (same one
|
||||
// TailscaleIndicator.qml uses for the same reason) is used instead
|
||||
// for that one case.
|
||||
readonly property color activeHoverColor: "#c9f0f0f0"
|
||||
|
||||
// Hover-only outline, offset outside the row rather than drawn on
|
||||
// its own edge — same treatment as ToggleSwitch's halo and the DNS
|
||||
@@ -680,7 +690,7 @@ Item {
|
||||
font.family: Appearance.iconFontFamilyRounded
|
||||
font.variableAxes: Appearance.iconFontAxes
|
||||
font.pixelSize: 16
|
||||
color: rowMouse.containsMouse ? Colors.primaryText : Colors.foreground
|
||||
color: rowMouse.containsMouse ? (netRow.active ? netRow.activeHoverColor : Colors.primaryText) : Colors.foreground
|
||||
// The wifi-fan glyph itself is flat/wide — stretch it
|
||||
// vertically to read taller while keeping its width (and
|
||||
// the layout around it) unchanged.
|
||||
@@ -701,14 +711,14 @@ Item {
|
||||
font.family: Appearance.fontFamily
|
||||
font.pixelSize: Appearance.fontSize
|
||||
font.bold: netRow.net.connected
|
||||
color: rowMouse.containsMouse ? Colors.primaryText : Colors.foreground
|
||||
color: rowMouse.containsMouse ? (netRow.active ? netRow.activeHoverColor : Colors.primaryText) : Colors.foreground
|
||||
}
|
||||
Text {
|
||||
visible: netRow.net.connected
|
||||
text: "Connected"
|
||||
font.family: Appearance.fontFamily
|
||||
font.pixelSize: Appearance.fontSizeSmall
|
||||
color: rowMouse.containsMouse ? Colors.primaryText : Colors.foreground
|
||||
color: rowMouse.containsMouse ? (netRow.active ? netRow.activeHoverColor : Colors.primaryText) : Colors.foreground
|
||||
}
|
||||
}
|
||||
Text {
|
||||
@@ -717,7 +727,7 @@ Item {
|
||||
font.family: Appearance.iconFontFamilyRounded
|
||||
font.variableAxes: Appearance.iconFontAxes
|
||||
font.pixelSize: 13
|
||||
color: rowMouse.containsMouse ? Colors.primaryText : Colors.muted
|
||||
color: rowMouse.containsMouse ? (netRow.active ? netRow.activeHoverColor : Colors.primaryText) : Colors.muted
|
||||
}
|
||||
Text {
|
||||
id: forgetIcon
|
||||
@@ -726,7 +736,7 @@ Item {
|
||||
font.family: Appearance.iconFontFamilyRounded
|
||||
font.variableAxes: Appearance.iconFontAxes
|
||||
font.pixelSize: 14
|
||||
color: rowMouse.containsMouse ? Colors.primaryText : Colors.muted
|
||||
color: rowMouse.containsMouse ? (netRow.active ? netRow.activeHoverColor : Colors.primaryText) : Colors.muted
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1204,12 +1214,19 @@ Item {
|
||||
|
||||
Column {
|
||||
id: networkListColumn
|
||||
// Inset 3px on each side (rather than flush with
|
||||
// Inset 3px on every side (rather than flush with
|
||||
// the Flickable) so NetworkRow's hover halo below
|
||||
// has room to sit outside the row without being
|
||||
// cropped by the Flickable's own clip.
|
||||
// cropped by the Flickable's own clip. Left/right
|
||||
// needs the manual x/width shift (children bind
|
||||
// width: parent.width, which ignores Column's own
|
||||
// padding); top/bottom just needs padding, since
|
||||
// that's along Column's own layout axis and the
|
||||
// Flickable's contentHeight tracks it.
|
||||
x: 3
|
||||
width: networkListFlick.width - 6
|
||||
topPadding: 3
|
||||
bottomPadding: 3
|
||||
spacing: 6
|
||||
|
||||
Column {
|
||||
|
||||
@@ -1097,11 +1097,18 @@ Item {
|
||||
|
||||
Column {
|
||||
id: listColumn
|
||||
// Inset 3px on each side so ExitNodeRow/PeerRow's
|
||||
// Inset 3px on every side so ExitNodeRow/PeerRow's
|
||||
// hover halo has room without being cropped by
|
||||
// listFlick's clip.
|
||||
// listFlick's clip. Left/right needs the manual
|
||||
// x/width shift (children bind width: parent.width,
|
||||
// which ignores Column's own padding); top/bottom
|
||||
// just needs padding, since that's along Column's
|
||||
// own layout axis and Flickable's contentHeight
|
||||
// tracks it.
|
||||
x: 3
|
||||
width: listFlick.width - 6
|
||||
topPadding: 3
|
||||
bottomPadding: 3
|
||||
spacing: 6
|
||||
|
||||
Column {
|
||||
|
||||
Reference in New Issue
Block a user