fix responsive ui

1 files changed, 24 insertions, 9 deletions

diff --git a/raveos-sddm-theme/sddm-rave-theme/Components/VirtualKeyboardButton.qml b/raveos-sddm-theme/sddm-rave-theme/Components/VirtualKeyboardButton.qml
index 90a52b8..f109dd1 100644
--- a/raveos-sddm-theme/sddm-rave-theme/Components/VirtualKeyboardButton.qml
+++ b/raveos-sddm-theme/sddm-rave-theme/Components/VirtualKeyboardButton.qml
@@ -6,10 +6,14 @@ import QtQuick 2.15
 import QtQuick.Controls 2.15
 
 Item {
+    width: parent.width
+    height: root.font.pointSize * 1.8
+
     Button {
         id: virtualKeyboardButton
 
         anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
         z: 1
         focusPolicy: Qt.TabFocus
 
@@ -32,20 +36,31 @@ Item {
             text: config.TranslateVirtualKeyboardButtonOff || "Virtual Keyboard (off)"
             font.pointSize: root.font.pointSize * 0.8
             font.family: root.font.family
+            style: Text.Raised
+            styleColor: Qt.rgba(0, 0, 0, 0.40)
             color: parent.visualFocus ? config.HoverVirtualKeyboardButtonTextColor : config.VirtualKeyboardButtonTextColor
         }
 
-        background: Rectangle {
-            id: virtualKeyboardButtonBackground
+        background: Item {
+            Rectangle {
+                anchors.fill: parent
+                anchors.topMargin: root.font.pointSize * 0.10
+                radius: config.RoundCorners !== "" ? parseInt(config.RoundCorners) : root.font.pointSize * 0.8
+                color: Qt.rgba(0, 0, 0, 0.20)
+            }
+
+            Rectangle {
+                id: virtualKeyboardButtonBackground
 
-            anchors.fill: parent
-            radius: config.RoundCorners !== "" ? parseInt(config.RoundCorners) : 10
-            color: virtualKeyboardButton.down ? Qt.rgba(1, 1, 1, 0.12) : (virtualKeyboardButton.hovered ? Qt.rgba(1, 1, 1, 0.08) : Qt.rgba(1, 1, 1, 0.04))
-            border.color: virtualKeyboardButton.visualFocus ? Qt.rgba(1, 1, 1, 0.60) : (virtualKeyboardButton.hovered ? Qt.rgba(1, 1, 1, 0.35) : Qt.rgba(1, 1, 1, 0.18))
-            border.width: virtualKeyboardButton.visualFocus ? 1.5 : 1
+                anchors.fill: parent
+                radius: config.RoundCorners !== "" ? parseInt(config.RoundCorners) : root.font.pointSize * 0.8
+                color: virtualKeyboardButton.down ? Qt.rgba(1, 1, 1, 0.20) : (virtualKeyboardButton.hovered ? Qt.rgba(1, 1, 1, 0.14) : Qt.rgba(1, 1, 1, 0.08))
+                border.color: virtualKeyboardButton.visualFocus ? Qt.rgba(1, 1, 1, 0.70) : (virtualKeyboardButton.hovered ? Qt.rgba(1, 1, 1, 0.40) : Qt.rgba(1, 1, 1, 0.22))
+                border.width: virtualKeyboardButton.visualFocus ? root.font.pointSize * 0.12 : root.font.pointSize * 0.08
 
-            Behavior on color { ColorAnimation { duration: 150 } }
-            Behavior on border.color { ColorAnimation { duration: 150 } }
+                Behavior on color { ColorAnimation { duration: 150 } }
+                Behavior on border.color { ColorAnimation { duration: 150 } }
+            }
         }
         states: [
             State {