diff --git a/components/MenuButton.qml b/components/MenuButton.qml
index 4321d248..afc2421a 100644
--- a/components/MenuButton.qml
+++ b/components/MenuButton.qml
@@ -61,19 +61,6 @@ Rectangle {
property bool present: !under || under.checked || checked || under.numSelectedChildren > 0
height: present ? ((appWindow.height >= 800) ? 44 * scaleRatio : 38 * scaleRatio ) : 0
- // Button gradient whilst checked
- // @TODO: replace by .png - gradient not available in 2d renderer
- LinearGradient {
- visible: button.checked ? true : false
- anchors.fill: parent
- start: Qt.point(0, 0)
- end: Qt.point(300, 0)
- gradient: Gradient {
- GradientStop { position: 1.0; color: "#333333" }
- GradientStop { position: 0.0; color: "black" }
- }
- }
-
// button decorations that are subject to leftMargin offsets
Rectangle {
anchors.left: parent.left
@@ -114,6 +101,17 @@ Rectangle {
}
}
+ // button gradient while checked
+ Image {
+ width: 160
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.right: parent.right
+ anchors.rightMargin: 0
+ anchors.leftMargin: parent.getOffset()
+ source: "../images/menuButtonGradient.png"
+ visible: button.checked
+ }
+
// menu button right arrow
Image {
anchors.verticalCenter: parent.verticalCenter
diff --git a/images/menuButtonGradient.png b/images/menuButtonGradient.png
new file mode 100644
index 00000000..616f72c1
Binary files /dev/null and b/images/menuButtonGradient.png differ
diff --git a/qml.qrc b/qml.qrc
index 7f5b673c..d7ea0e1d 100644
--- a/qml.qrc
+++ b/qml.qrc
@@ -178,6 +178,7 @@
images/titlebarGradient.jpg
images/titlebarLogo.png
images/menuArrow.png
+ images/menuButtonGradient.png
fonts/SFUIDisplay-Medium.otf
fonts/SFUIDisplay-Regular.otf
fonts/SFUIDisplay-Light.otf