add hover glow to all bar modules
This commit is contained in:
parent
8d074af824
commit
43c2541ccd
3 changed files with 40 additions and 4 deletions
|
|
@ -1,4 +1,5 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
|
import QtQuick.Effects
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import "." as M
|
import "." as M
|
||||||
|
|
||||||
|
|
@ -6,6 +7,7 @@ Text {
|
||||||
id: root
|
id: root
|
||||||
property string icon: ""
|
property string icon: ""
|
||||||
property string tooltip: ""
|
property string tooltip: ""
|
||||||
|
property bool _hovered: false
|
||||||
|
|
||||||
text: icon
|
text: icon
|
||||||
color: M.Theme.base05
|
color: M.Theme.base05
|
||||||
|
|
@ -13,8 +15,18 @@ Text {
|
||||||
font.family: M.Theme.iconFontFamily
|
font.family: M.Theme.iconFontFamily
|
||||||
verticalAlignment: Text.AlignVCenter
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
|
||||||
|
layer.enabled: _hovered
|
||||||
|
layer.effect: MultiEffect {
|
||||||
|
shadowEnabled: true
|
||||||
|
shadowColor: M.Theme.base05
|
||||||
|
shadowBlur: 0.5
|
||||||
|
shadowVerticalOffset: 0
|
||||||
|
shadowHorizontalOffset: 0
|
||||||
|
}
|
||||||
|
|
||||||
HoverHandler {
|
HoverHandler {
|
||||||
onHoveredChanged: {
|
onHoveredChanged: {
|
||||||
|
root._hovered = hovered;
|
||||||
if (hovered && root.tooltip !== "") {
|
if (hovered && root.tooltip !== "") {
|
||||||
M.FlyoutState.text = root.tooltip;
|
M.FlyoutState.text = root.tooltip;
|
||||||
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,5 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
|
import QtQuick.Effects
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import "." as M
|
import "." as M
|
||||||
|
|
||||||
|
|
@ -7,9 +8,14 @@ Text {
|
||||||
property string label: ""
|
property string label: ""
|
||||||
property string tooltip: ""
|
property string tooltip: ""
|
||||||
property string minText: ""
|
property string minText: ""
|
||||||
|
property bool _hovered: false
|
||||||
|
|
||||||
text: label
|
text: label
|
||||||
width: minText ? Math.max(implicitWidth, _minMetrics.width) : implicitWidth
|
width: minText ? Math.max(implicitWidth, _minMetrics.width) : implicitWidth
|
||||||
|
color: M.Theme.base05
|
||||||
|
font.pixelSize: M.Theme.fontSize
|
||||||
|
font.family: M.Theme.fontFamily
|
||||||
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
|
||||||
TextMetrics {
|
TextMetrics {
|
||||||
id: _minMetrics
|
id: _minMetrics
|
||||||
|
|
@ -17,13 +23,19 @@ Text {
|
||||||
font.pixelSize: root.font.pixelSize
|
font.pixelSize: root.font.pixelSize
|
||||||
font.family: root.font.family
|
font.family: root.font.family
|
||||||
}
|
}
|
||||||
color: M.Theme.base05
|
|
||||||
font.pixelSize: M.Theme.fontSize
|
layer.enabled: _hovered
|
||||||
font.family: M.Theme.fontFamily
|
layer.effect: MultiEffect {
|
||||||
verticalAlignment: Text.AlignVCenter
|
shadowEnabled: true
|
||||||
|
shadowColor: M.Theme.base05
|
||||||
|
shadowBlur: 0.5
|
||||||
|
shadowVerticalOffset: 0
|
||||||
|
shadowHorizontalOffset: 0
|
||||||
|
}
|
||||||
|
|
||||||
HoverHandler {
|
HoverHandler {
|
||||||
onHoveredChanged: {
|
onHoveredChanged: {
|
||||||
|
root._hovered = hovered;
|
||||||
if (hovered && root.tooltip !== "") {
|
if (hovered && root.tooltip !== "") {
|
||||||
M.FlyoutState.text = root.tooltip;
|
M.FlyoutState.text = root.tooltip;
|
||||||
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,25 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
|
import QtQuick.Effects
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import "." as M
|
import "." as M
|
||||||
|
|
||||||
Row {
|
Row {
|
||||||
id: root
|
id: root
|
||||||
property string tooltip: ""
|
property string tooltip: ""
|
||||||
|
property bool _hovered: false
|
||||||
|
|
||||||
|
layer.enabled: _hovered
|
||||||
|
layer.effect: MultiEffect {
|
||||||
|
shadowEnabled: true
|
||||||
|
shadowColor: M.Theme.base05
|
||||||
|
shadowBlur: 0.5
|
||||||
|
shadowVerticalOffset: 0
|
||||||
|
shadowHorizontalOffset: 0
|
||||||
|
}
|
||||||
|
|
||||||
HoverHandler {
|
HoverHandler {
|
||||||
onHoveredChanged: {
|
onHoveredChanged: {
|
||||||
|
root._hovered = hovered;
|
||||||
if (hovered && root.tooltip !== "") {
|
if (hovered && root.tooltip !== "") {
|
||||||
M.FlyoutState.text = root.tooltip;
|
M.FlyoutState.text = root.tooltip;
|
||||||
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
M.FlyoutState.itemX = root.mapToGlobal(root.width / 2, 0).x - (QsWindow.window?.screen?.x ?? 0);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue