Add Hover Effect to Buttons

TeroStyle/QuickFilter.qml

@@ -19,6 +19,7 @@ RowLayout {
 
             required property int index
             required property var modelData
+            property bool hovered: false
             property real padding: Dimensions.m
 
             height: text.height + padding * 2
@@ -28,7 +29,7 @@ RowLayout {
                 anchors.fill: parent
                 border.color: modelData.selected ? Colors.transparent : Colors.foreground
                 border.width: 2
-                color: modelData.selected ? Colors.primary : Colors.transparent
+                color: modelData.selected || mouseArea.containsMouse ? Colors.primary : Colors.transparent
                 radius: parent.height
             }
             Text {
@@ -41,6 +42,9 @@ RowLayout {
                 y: parent.padding
             }
             MouseArea {
+                id: mouseArea
+
+                hoverEnabled: true
                 anchors.fill: parent
                 cursorShape: Qt.PointingHandCursor