Fix border image drawing for corner cut buttons

Three corrections:
- Previously border was drawn along the border of the rectangle. This
caused half of the pen to remain outside of the rectangle and border
looked strange.
- The default border width should be 2
- Pressed button should show darker screen borders

Task-number: QTBUG-60083
Change-Id: I1677a252bd3fd14b69389bfa568787a1e8c15676
Reviewed-by: Kari Oikarinen <kari.oikarinen@qt.io>
Reviewed-by: Teemu Holappa <teemu.holappa@qt.io>

1 files changed, 3 insertions, 2 deletions

diff --git a/src/settingsui/qtbuttonimageproviderplugin/QtButton.qml b/src/settingsui/qtbuttonimageproviderplugin/QtButton.qml
index 9501aa1..6fb61f4 100644
--- a/src/settingsui/qtbuttonimageproviderplugin/QtButton.qml
+++ b/src/settingsui/qtbuttonimageproviderplugin/QtButton.qml
@@ -34,14 +34,15 @@ Image {
     sourceSize: Qt.size(width, height)
     property string state: "enabled"
     property int cutSize: 10
-    property color fillColor: "white"
-    property color borderColor: "black"
+    property color fillColor: viewSettings.buttonGreenColor
+    property color borderColor: mouseArea.pressed ? viewSettings.buttonActiveColor : viewSettings.buttonGreenColor
     property alias text: buttonText.text
     signal clicked()
 
     width: buttonText.contentWidth + cutSize * 4
 
     MouseArea {
+        id: mouseArea
         anchors.fill: parent
         onClicked: root.clicked()
     }