QmlDesigner: Some styling adjustments

Change-Id: I24884a8d4d45c4fac83e7a1892b172bf41f6ba88
Reviewed-by: Tim Jenssen <tim.jenssen@theqtcompany.com>

share/qtcreator/qmldesigner/propertyEditorQmlSources/HelperWidgets/CustomComboBoxStyle.qml

@@ -68,7 +68,6 @@ ComboBoxStyle {
             anchors.fill: parent
             anchors.margins: -1
             color: "transparent"
-            radius: 4
             opacity: 0.3
             visible: control.activeFocus
         }

share/qtcreator/qmldesigner/propertyEditorQmlSources/HelperWidgets/CustomSpinBoxStyle.qml

@@ -70,7 +70,6 @@ SpinBoxStyle {
         implicitWidth: Math.max(64, styleData.contentWidth)
         implicitHeight: 23
         border.color: borderColor
-        radius: 3
         gradient: Gradient {
             GradientStop {color: "#2c2c2c" ; position: 0}
             GradientStop {color: "#343434" ; position: 0.15}
@@ -81,7 +80,6 @@ SpinBoxStyle {
             anchors.fill: parent
             anchors.margins: -1
             color: "transparent"
-            radius: 4
             opacity: 0.3
             visible: control.activeFocus
         }

share/qtcreator/qmldesigner/propertyEditorQmlSources/HelperWidgets/LineEdit.qml

@@ -123,7 +123,6 @@ Controls.TextField {
             implicitWidth: 100
             implicitHeight: 23
             border.color: borderColor
-            radius: 3
             gradient: Gradient {
                 GradientStop {color: "#2c2c2c" ; position: 0}
                 GradientStop {color: "#343434" ; position: 0.15}

share/qtcreator/qmldesigner/propertyEditorQmlSources/HelperWidgets/RoundedPanel.qml

@@ -48,7 +48,7 @@ Rectangle {
     property bool roundRight: false
 
 
-    radius: roundLeft || roundRight ? 4 : 0
+    radius: roundLeft || roundRight ? 1 : 0
     gradient: Gradient {
         GradientStop {color: '#555' ; position: 0}
         GradientStop {color: '#444' ; position: 1}

share/qtcreator/qmldesigner/propertyEditorQmlSources/HelperWidgets/Section.qml

@@ -68,12 +68,10 @@ Item {
             Behavior on rotation {NumberAnimation{duration: 80}}
         }
 
-        gradient: Gradient {
-            GradientStop {color: '#555' ; position: 0}
-            GradientStop {color: '#444' ; position: 1}
-        }
+        color: "#444"
 
         Rectangle {
+            visible: false
             color:"#333"
             width: parent.width
             height: 1

share/qtcreator/qmldesigner/statesEditorQmlSources/DesignerTextFieldStyle.qml

@@ -45,7 +45,6 @@ TextFieldStyle {
         implicitWidth: 100
         implicitHeight: font.pixelSize + padding.top + padding.bottom
         border.color: "#222222"
-        radius: 3
         gradient: Gradient {
             GradientStop {color: "#2c2c2c" ; position: 0}
             GradientStop {color: "#343434" ; position: 0.15}

share/qtcreator/qmldesigner/statesEditorQmlSources/StatesDelegate.qml

@@ -36,17 +36,12 @@ Rectangle {
     border.width: 1
     property bool isBaseState
     property bool isCurrentState
-    property color gradiantBaseColor
+    property color baseColor
     property string delegateStateName
     property string delegateStateImageSource
     property int delegateStateImageSize
 
-    gradient: Gradient {
-        GradientStop { position: 0.0; color: Qt.lighter(gradiantBaseColor, 1.5) }
-        GradientStop { position: 0.1; color: Qt.lighter(gradiantBaseColor, 1) }
-        GradientStop { position: 0.8; color: gradiantBaseColor }
-        GradientStop { position: 1.0; color: Qt.darker(gradiantBaseColor) }
-    }
+    color: baseColor
 
     MouseArea {
         anchors.fill: parent
@@ -63,7 +58,7 @@ Rectangle {
 
         style: ButtonStyle {
             background: Rectangle {
-                color: control.hovered ? Qt.lighter(gradiantBaseColor, 1.4)  : "transparent"
+                color: control.hovered ? Qt.lighter(baseColor, 1.2)  : "transparent"
                 radius: 2
             }
         }

share/qtcreator/qmldesigner/statesEditorQmlSources/StatesList.qml

@@ -102,14 +102,24 @@ FocusScope {
             id: addStateButton
             visible: canAddNewStates
 
+            tooltip: qsTr("Add a new state.")
+
             anchors.right: parent.right
-            anchors.rightMargin: padding
+            anchors.rightMargin: 8
             anchors.verticalCenter: parent.verticalCenter
-            width: Math.max(parent.height / 2, 24)
+            width: Math.max(parent.height / 2 - 8, 18)
             height: width
             iconSource: "images/plus.png"
 
             onClicked: root.createNewState()
+
+            style: ButtonStyle {
+                background: Rectangle {
+                    property color buttonBaseColor: "#6f6f6f"
+                    color: control.hovered ? Qt.lighter(buttonBaseColor, 1.2)  : buttonBaseColor
+                    border.width: 1
+                }
+            }
         }
     }
 
@@ -136,7 +146,7 @@ FocusScope {
                 height: delegateHeight
                 isBaseState: 0 == internalNodeId
                 isCurrentState: root.currentStateInternalId == internalNodeId
-                gradiantBaseColor: isCurrentState ? Qt.darker(highlightColor, 1.2) : background.color
+                baseColor: isCurrentState ? Qt.darker(highlightColor, 1.2) : background.color
                 delegateStateName: stateName
                 delegateStateImageSource: stateImageSource
                 delegateStateImageSize: stateImageSize