Update startupscreen to match current brand guide

Task-number: QTBUG-120618
Change-Id: I511558ec7213af8e5be12093982a0d4e40145271
Reviewed-by: Samuli Piippo <samuli.piippo@qt.io>

15 files changed, 48 insertions, 110 deletions

diff --git a/startupscreen/GuideView.qml b/startupscreen/GuideView.qml
index 3e980e3..f4c952e 100644
--- a/startupscreen/GuideView.qml
+++ b/startupscreen/GuideView.qml
@@ -53,7 +53,7 @@ import QtQuick.Layouts
 import QtQuick.Controls
 import StartupScreen
 
-Item  {
+Item {
     id: root
     width: parent.width
     height: parent.height
diff --git a/startupscreen/MainView.qml b/startupscreen/MainView.qml
index 03eed0b..693682b 100644
--- a/startupscreen/MainView.qml
+++ b/startupscreen/MainView.qml
@@ -54,99 +54,53 @@ import StartupScreen
 Item {
     id: root
 
-    property var textNormal: panel.height / 9
-    property var textLarge: panel.height / 7
-
-    Image {
-        id: backgroundImage
-        source: "assets/background.png"
-        anchors.fill: parent
-    }
+    property int textNormal: panel.height / 9
+    property int textLarge: panel.height / 7
 
     Item {
         id: panel
         anchors.top: root.top
         anchors.topMargin: height / 10
-
         anchors.left: root.left
+        anchors.leftMargin: panel.width *.1
         height: width / 2
         width: root.width * 0.6
 
-        Item {
-            id: headerBackground
-
-            height: parent.height / 3
+        Text {
+            id: headerText_1
+            color: "#2cde85"
+            text: qsTr("Get Started with Boot to Qt ") + Qt.application.version
             anchors.top: panel.top
             anchors.left: panel.left
-            anchors.right: panel.right
-
-            Image {
-                id: headerBackgroundRight
-                source: "assets/headerBackgroundRight.png"
-                width: height
-                anchors.right: parent.right
-                anchors.top: parent.top
-                anchors.bottom: parent.bottom
-            }
-            Image {
-                id: headerBackgroundLeft
-                source: "assets/headerBackgroundLeft.png"
-                anchors.left: parent.left
-                anchors.top: parent.top
-                anchors.bottom: parent.bottom
-                anchors.right: headerBackgroundRight.left
-            }
-            Text {
-                id: headerText_1
-                color: "#ffffff"
-                text: qsTr("Get started with")
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.top: parent.top
-                font.pixelSize: textNormal
-                font.family: "Titillium Web"
-            }
-            Text {
-                id: headerText_2
-                color: "#ffffff"
-                text: qsTr("Boot to Qt ") + Qt.application.version
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.bottom: parent.bottom
-                font.bold: true
-                font.pixelSize: textLarge
-                font.family: "Titillium Web"
-            }
+            font.pixelSize: textNormal
+            font.family: "Titillium Web"
         }
 
-        // body of the text panel
-        Rectangle {
-            id: bodyBackground
-            color: "#000000"
-            anchors.right: panel.right
+        Text {
+            id: bodyText
+            color: "#ffffff"
+            text: qsTr("How to install demo application\nfrom Qt Creator?")
+            font.pixelSize: textNormal
+            font.family: "Titillium Web"
             anchors.left: panel.left
-            anchors.top: headerBackground.bottom
-            anchors.bottom: panel.bottom
-
-            Text {
-                id: bodyText
-                color: "#ffffff"
-                text: qsTr("How to install demo\napplication from Qt Creator?")
-                font.pixelSize: textNormal
-                font.family: "Titillium Web"
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.top: parent.top
-                horizontalAlignment: Text.AlignHCenter
-                lineHeight: 0.8
-                wrapMode: Text.WordWrap
-            }
+            anchors.top: headerText_1.bottom
+            anchors.topMargin: textNormal
+            wrapMode: Text.WordWrap
+        }
 
-            TextButton {
-                id: textButton
-                width: parent.width * 0.9
-                height: parent.height / 3
-                fontSize: textNormal
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.bottom: parent.bottom
-                anchors.bottomMargin: height / 4
+        Text {
+            id: buttonLabel
+            color: "#2cde85"
+            text: qsTr("Click to learn more!")
+            anchors.left: panel.left
+            anchors.top: bodyText.bottom
+            anchors.topMargin: textLarge
+            font.pixelSize: textLarge
+            font.family: "Titillium Web"
+
+            MouseArea {
+                anchors.fill: parent
+                anchors.margins: -height * .5
                 onPressed: guide.visible = true
             }
         }
@@ -169,7 +123,6 @@ Item {
         anchors.topMargin: height * 0.1
     }
 
-
     // Button row
     Row {
         id: buttonRow
diff --git a/startupscreen/NetworkSettings/QtButton.qml b/startupscreen/NetworkSettings/QtButton.qml
index 3363e55..e9f222e 100644
--- a/startupscreen/NetworkSettings/QtButton.qml
+++ b/startupscreen/NetworkSettings/QtButton.qml
@@ -37,7 +37,7 @@ Image {
     property string state: "enabled"
     property int cutSize: 10
     property color fillColor: viewSettings.buttonGreenColor
-    property color borderColor: mouseArea.pressed ? viewSettings.buttonActiveColor : viewSettings.buttonGreenColor
+    property color borderColor: viewSettings.buttonGreenColor
     property alias text: buttonText.text
     property alias fontFamily: buttonText.font.family
 
diff --git a/startupscreen/NetworkSettings/ViewSettings.qml b/startupscreen/NetworkSettings/ViewSettings.qml
index 121bdbc..99c5a82 100644
--- a/startupscreen/NetworkSettings/ViewSettings.qml
+++ b/startupscreen/NetworkSettings/ViewSettings.qml
@@ -31,12 +31,12 @@ import QtQuick
 QtObject {
     id: viewSettings
     readonly property string appFont: "Titillium Web"
-    readonly property color backgroundColor: "#09102b"
+    readonly property color backgroundColor: "#00414a"
     readonly property color borderColor: "#9d9faa"
-    readonly property color buttonGreenColor: "#41cd52"
+    readonly property color buttonGreenColor: "#2cde85"
     readonly property color buttonGrayColor: "#9d9faa"
     readonly property color buttonActiveColor: "#216729"
-    readonly property color scrollBarColor: "#41cd52"
+    readonly property color scrollBarColor: "#2cde85"
 
     readonly property real spacing: 0.5
     readonly property real titleFontSize: 0.04
diff --git a/startupscreen/SplashView.ui.qml b/startupscreen/SplashView.ui.qml
index 07b339b..831ef8c 100644
--- a/startupscreen/SplashView.ui.qml
+++ b/startupscreen/SplashView.ui.qml
@@ -51,17 +51,12 @@
 import QtQuick
 import QtQuick.Controls
 
-Rectangle {
+Image {
     id: root
+    source: "assets/background.png"
 
     Image {
-        id: backgroundImage
-        source: "assets/background.png"
-        anchors.fill: root
-    }
-
-    Image {
-        id: builtwithQtImage
+        id: logo
         source: "assets/builtwithQt.png"
         anchors.centerIn: root
     }
diff --git a/startupscreen/StartupScreen.qml b/startupscreen/StartupScreen.qml
index 7b09a83..e749812 100644
--- a/startupscreen/StartupScreen.qml
+++ b/startupscreen/StartupScreen.qml
@@ -61,6 +61,12 @@ ApplicationWindow {
     width: 960
     height: 540
 
+    Image {
+        id: backgroundImage
+        source: "assets/background.png"
+        anchors.fill: parent
+    }
+
     Timer {
           interval: 1000
           running: true
diff --git a/startupscreen/UsbButton.qml b/startupscreen/UsbButton.qml
index 315f9c8..ce4a554 100644
--- a/startupscreen/UsbButton.qml
+++ b/startupscreen/UsbButton.qml
@@ -60,13 +60,6 @@ Item {
 
     state: !available ? "" : (connected ? "connected" : "error")
 
-    Rectangle {
-        id: buttonBackground
-        anchors.fill: parent
-        color: "#3a4055"
-        radius: 0
-    }
-
     // changing button state
     MouseArea {
         anchors.fill: parent
diff --git a/startupscreen/WifiButton.qml b/startupscreen/WifiButton.qml
index 72ed86a..9ae76ac 100644
--- a/startupscreen/WifiButton.qml
+++ b/startupscreen/WifiButton.qml
@@ -59,13 +59,6 @@ Item {
 
     Component.onCompleted: NetworkSettingsManager.services.type = NetworkSettingsType.Wifi;
 
-    Rectangle {
-        id: buttonBackground
-        anchors.fill: parent
-        color: "#3a4055"
-        radius: 0
-    }
-
     MouseArea {
         id: mouseArea
         anchors.fill: parent
diff --git a/startupscreen/assets/background.png b/startupscreen/assets/background.png
index e15fc1b..b91de6f 100644
--- a/startupscreen/assets/background.png
+++ b/startupscreen/assets/background.png
diff --git a/startupscreen/assets/builtwithQt.png b/startupscreen/assets/builtwithQt.png
index cbec44b..976ead7 100644
--- a/startupscreen/assets/builtwithQt.png
+++ b/startupscreen/assets/builtwithQt.png
diff --git a/startupscreen/assets/headerBackgroundLeft.png b/startupscreen/assets/headerBackgroundLeft.png
deleted file mode 100644
index f6981a9..0000000
--- a/startupscreen/assets/headerBackgroundLeft.png
+++ /dev/null
diff --git a/startupscreen/assets/headerBackgroundRight.png b/startupscreen/assets/headerBackgroundRight.png
deleted file mode 100644
index 5d409f5..0000000
--- a/startupscreen/assets/headerBackgroundRight.png
+++ /dev/null
diff --git a/startupscreen/assets/icon_ok.png b/startupscreen/assets/icon_ok.png
index 14b1eae..6a9b683 100644
--- a/startupscreen/assets/icon_ok.png
+++ b/startupscreen/assets/icon_ok.png
diff --git a/startupscreen/qml.qrc b/startupscreen/qml.qrc
index d0660e8..2b4023d 100644
--- a/startupscreen/qml.qrc
+++ b/startupscreen/qml.qrc
@@ -18,8 +18,6 @@
         <file>assets/background.png</file>
         <file>assets/builtwithQt.png</file>
         <file>assets/clockFace.png</file>
-        <file>assets/headerBackgroundLeft.png</file>
-        <file>assets/headerBackgroundRight.png</file>
         <file>assets/icon_SDcard.png</file>
         <file>assets/icon_error.png</file>
         <file>assets/icon_markerBackground.png</file>
diff --git a/startupscreen/qtquickcontrols2.conf b/startupscreen/qtquickcontrols2.conf
index 7da18fc..7e4bead 100644
--- a/startupscreen/qtquickcontrols2.conf
+++ b/startupscreen/qtquickcontrols2.conf
@@ -3,6 +3,6 @@ Style=Universal
 
 [Universal]
 Theme=Dark
-Accent=#41CD52
-Background=#222840
+Accent=#2cde85
+Background=#002e34
 Foreground=#f3f3f4