QmlDesigner: Add UX approved gradient background to 3D edit view

Change-Id: I18b976324f57cf559a43d9ff239796cf25b3cb2f
Fixes: QDS-1202
Reviewed-by: Mahmoud Badri <mahmoud.badri@qt.io>
Reviewed-by: Thomas Hartmann <thomas.hartmann@qt.io>

share/qtcreator/qml/qmlpuppet/mockfiles/EditView3D.qml

@@ -174,11 +174,14 @@ Window {
     }
 
     Rectangle {
-        id: sceneBg
-        color: "#FFFFFF"
         anchors.fill: parent
         focus: true
 
+        gradient: Gradient {
+            GradientStop { position: 1.0; color: "#222222" }
+            GradientStop { position: 0.0; color: "#999999" }
+        }
+
         TapHandler { // check tapping/clicking an object in the scene
             onTapped: {
                 var pickResult = editView.pick(eventPoint.scenePosition.x,
@@ -397,6 +400,18 @@ Window {
         selectedNode : viewWindow.selectedNode ? selectionBox.model : null
     }
 
+    Item {
+        anchors.left: parent.left
+        anchors.bottom: parent.bottom
+        width: 200
+        height: 120
+
+        Rectangle {
+            anchors.fill: parent
+            color: "white"
+            opacity: 0.3
+        }
+
         Column {
             anchors.left: parent.left
             anchors.bottom: parent.bottom
@@ -419,9 +434,11 @@ Window {
                 text: qsTr("Use Global Orientation")
             }
         }
+    }
 
     Text {
         id: helpText
+        color: "white"
         text: qsTr("Camera controls: ALT + mouse press and drag. Left: Rotate, Middle: Pan, Right/Wheel: Zoom.")
         anchors.bottom: parent.bottom
     }