Added inlineButton for lineEdit and worked on network status progress bar + text

LeftPanel.qml

@@ -127,9 +127,11 @@ Rectangle {
                     anchors.top: parent.top
                     anchors.topMargin: 8
                     anchors.left: parent.left
-                    anchors.leftMargin: 184
+                    anchors.leftMargin: 192
                     font.bold: true
+                    font.pixelSize: 12
                     color: "white"
+                    opacity: 0.6
                 }
 
                 // @TODO: implement
@@ -245,7 +247,7 @@ Rectangle {
         anchors.bottom: parent.bottom
         anchors.top: (isMobile)? parent.top : column1.bottom
         anchors.topMargin: (isMobile)? 0 : 32
-        color: "#1C1C1C"
+        color: "black"
 
 
         Flickable {
@@ -572,7 +574,7 @@ Rectangle {
             anchors.right: parent.right
             anchors.bottom: (progressBar.visible)? progressBar.top : parent.bottom;
             connected: Wallet.ConnectionStatus_Disconnected
-            height: 58 * scaleRatio
+            height: 40 * scaleRatio
         }
 
         ProgressBar {
@@ -590,9 +592,9 @@ Rectangle {
             anchors.left: parent.left
             anchors.right: parent.right
             anchors.bottom: parent.bottom
-            height: 35 * scaleRatio
             syncType: qsTr("Daemon")
             visible: networkStatus.connected
+            height: 62 * scaleRatio
         }
     } // menuRect
 

components/InlineButton.qml

@@ -0,0 +1,86 @@
+// Copyright (c) 2014-2015, The Monero Project
+//
+// All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without modification, are
+// permitted provided that the following conditions are met:
+//
+// 1. Redistributions of source code must retain the above copyright notice, this list of
+//    conditions and the following disclaimer.
+//
+// 2. Redistributions in binary form must reproduce the above copyright notice, this list
+//    of conditions and the following disclaimer in the documentation and/or other
+//    materials provided with the distribution.
+//
+// 3. Neither the name of the copyright holder nor the names of its contributors may be
+//    used to endorse or promote products derived from this software without specific
+//    prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
+// EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+// MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL
+// THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+// PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
+// INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT,
+// STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF
+// THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+import QtQuick 2.0
+import QtQuick.Layouts 1.1
+
+Item {
+    id: inlineButton
+    height: 32 * scaleRatio
+    property string shadowPressedColor: "#B32D00"
+    property string shadowReleasedColor: "#FF4304"
+    property string pressedColor: "#FF4304"
+    property string releasedColor: "#FF6C3C"
+    property string icon: ""
+    property string textColor: "#FFFFFF"
+    property int fontSize: 12 * scaleRatio
+    property alias text: inlineText.text
+    signal clicked()
+
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.rightMargin: 8
+    anchors.topMargin: 8
+
+    function onClicked(){}
+
+    function doClick() {
+        // Android workaround
+        releaseFocus();
+        clicked();
+    }
+
+    Rectangle{
+        color: "#808080"
+        border.color: "black"
+        height: 32
+        width: inlineText.width + 20
+        radius: 4
+
+        anchors.top: parent.top
+        anchors.right: parent.right
+
+        Text {
+            id: inlineText
+            font.family: Style.fontBold.name
+            font.pixelSize: 16 * scaleRatio
+            color: "#FFFFFF"
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.horizontalCenter: parent.horizontalCenter
+        }
+
+        MouseArea {
+            id: buttonArea
+            anchors.fill: parent
+            onClicked: doClick()
+        }
+    }
+
+    Keys.onSpacePressed: doClick()
+    Keys.onReturnPressed: doClick()
+}

components/LineEdit.qml

@@ -37,6 +37,7 @@ Item {
     property alias readOnly : input.readOnly
     property alias cursorPosition: input.cursorPosition
     property alias echoMode: input.echoMode
+    property alias inlineButtonText: inlineButtonId.text
     property int fontSize: 18 * scaleRatio
     property bool showBorder: true
     property bool error: false
@@ -102,4 +103,9 @@ Item {
         onAccepted: item.accepted();
         onTextChanged: item.textUpdated()
     }
+
+    InlineButton {
+        id: inlineButtonId
+        visible: item.inlineButtonText ? true : false
+    }
 }

components/NetworkStatusItem.qml

@@ -28,21 +28,23 @@
 
 import QtQuick 2.0
 import moneroComponents.Wallet 1.0
+import "." 1.0
 
 Rectangle {
     id: item
+    color: "transparent"
     property var connected: Wallet.ConnectionStatus_Disconnected
 
     function getConnectionStatusImage(status) {
         if (status == Wallet.ConnectionStatus_Connected)
-            return "../images/statusConnected.png"
+            return "../images/lightning.png"
         else
             return "../images/statusDisconnected.png"
     }
 
     function getConnectionStatusColor(status) {
         if (status == Wallet.ConnectionStatus_Connected)
-            return "#FF6C3B"
+            return "white"
         else
             return "#AAAAAA"
     }
@@ -62,39 +64,50 @@ Rectangle {
         return qsTr("Invalid connection status")
     }
 
-
-    color: "#1C1C1C"
     Row {
-        height: 60 * scaleRatio
+        height: 40 * scaleRatio
+
         Item {
             id: iconItem
-            anchors.bottom: parent.bottom
+            anchors.top: parent.top
-            width: 50 * scaleRatio
+            width: 40 * scaleRatio
-            height: 50 * scaleRatio
+            height: 40 * scaleRatio
 
             Image {
-                anchors.centerIn: parent
+                anchors.top: parent.top
+                anchors.topMargin: 6
+                anchors.right: parent.right
+                anchors.rightMargin: 11
                 source: getConnectionStatusImage(item.connected)
             }
         }
 
-        Column {
+        Item {
-            anchors.bottom: parent.bottom
+            anchors.top: parent.top
-            height: 53 * scaleRatio
+            anchors.left: iconItem.right
-            spacing: 3 * scaleRatio
+            height: 40 * scaleRatio
+            width: 260 * scaleRatio
 
             Text {
+                id: statusText
                 anchors.left: parent.left
-                font.family: "Arial"
+                anchors.top: parent.top
-                font.pixelSize: 12 * scaleRatio
+                anchors.topMargin: 0
-                color: "#545454"
+                font.family: Style.fontMedium.name
+                font.bold: true
+                font.pixelSize: 13 * scaleRatio
+                color: "white"
+                opacity: 0.5
                 text: qsTr("Network status") + translationManager.emptyString
             }
 
             Text {
+                id: statusTextVal
                 anchors.left: parent.left
-                font.family: "Arial"
+                anchors.top: parent.top
-                font.pixelSize: 18 * scaleRatio
+                anchors.topMargin: 14
+                font.family: Style.fontMedium.name
+                font.pixelSize: 20 * scaleRatio
                 color: getConnectionStatusColor(item.connected)
                 text: getConnectionStatusString(item.connected) + translationManager.emptyString
             }

components/ProgressBar.qml

@@ -28,13 +28,15 @@
 
 import QtQuick 2.0
 import moneroComponents.Wallet 1.0
+import "." 1.0
 
 Rectangle {
     id: item
     property int fillLevel: 0
     property string syncType // Wallet or Daemon
     property string syncText: qsTr("%1 blocks remaining: ").arg(syncType)
-    color: "#1C1C1C"
+    visible: false
+    color: "transparent"
 
     function updateProgress(currentBlock,targetBlock, blocksToSync, statusTxt){
         if(targetBlock > 0) {
@@ -50,29 +52,57 @@ Rectangle {
     }
 
     Item {
+        anchors.topMargin: 10 * scaleRatio
         anchors.leftMargin: 15 * scaleRatio
         anchors.rightMargin: 15 * scaleRatio
         anchors.fill: parent
+
+        Text {
+            id: progressText
+            anchors.top: item.top
+            anchors.topMargin: 6
+            font.family: Style.fontMedium.name
+            font.pixelSize: 13 * scaleRatio
+            font.bold: true
+            color: "white"
+            text: qsTr("Synchronizing blocks")
+            height:18 * scaleRatio
+        }
+
+        Text {
+            id: progressTextValue
+            anchors.top: item.top
+            anchors.topMargin: 6
+            anchors.right: parent.right
+            font.family: Style.fontMedium.name
+            font.pixelSize: 13 * scaleRatio
+            font.bold: true
+            color: "white"
+            height:18 * scaleRatio
+        }
+
+
         Rectangle {
             id: bar
             anchors.left: parent.left
             anchors.right: parent.right
-            anchors.top: parent.top
+            anchors.top: progressText.bottom
-            height: 22 * scaleRatio
+            anchors.topMargin: 4
-            radius: 2 * scaleRatio
+            height: 8 * scaleRatio
-            color: "#FFFFFF"
+            radius: 8 * scaleRatio
+            color: "#333333" // progressbar bg
 
             Rectangle {
                 id: fillRect
                 anchors.top: parent.top
                 anchors.bottom: parent.bottom
                 anchors.left: parent.left
-                anchors.margins: 2 * scaleRatio
                 height: bar.height
                 property int maxWidth: parent.width - 4 * scaleRatio
                 width: (maxWidth * fillLevel) / 100
+                radius: 8
                 color: {
-                   if(item.fillLevel < 99 ) return "#FF6C3C"
+                   if(item.fillLevel < 99 ) return "#FA6800"
                    //if(item.fillLevel < 99) return "#FFE00A"
                     return "#36B25C"
                 }

pages/Transfer.qml

@@ -231,7 +231,7 @@ Rectangle {
               width: mainLayout.labelWidth
           }
 
-            // this LineEdit is for testing purposes
+          // this LineEdit is for testing purposes
           LineEdit {
               id: amountLinex
               fontSize: mainLayout.lineEditFontSize
@@ -239,46 +239,7 @@ Rectangle {
               readOnly: false
               width: mainLayout.editWidth
               Layout.fillWidth: true
-//              validator: DoubleValidator {
+              inlineButtonText: "Testy"
-//                  bottom: 0.0
-//                  top: 18446744.073709551615
-//                  decimals: 12
-//                  notation: DoubleValidator.StandardNotation
-//                  locale: "C"
-//              }
-
-              Rectangle{
-                  color: "#808080"
-                  border.color: "black"
-                  height: 20
-                  width: 40
-                  radius: 3
-
-                  anchors.top: parent.top
-                  anchors.right: parent.right
-                  anchors.rightMargin: 8
-                  anchors.topMargin: 8
-
-                  Text {
-                      id: xee
-                      font.family: Style.fontBold.name
-                      font.pixelSize: 16 * scaleRatio
-                      color: "#FFFFFF"
-                      text: "Send"
-                      anchors.top: parent.top + 2
-                      anchors.left: parent.left + 6
-                  }
-              }
-
-//                IconButton {
-//                    imageSource: "../images/copyToClipboard.png"
-//                    onClicked: {
-//                        if (integratedAddressLine.text.length > 0) {
-//                            clipboard.setText(integratedAddressLine.text)
-//                            appWindow.showStatusMessage(qsTr("Integrated address copied to clipboard"),3)
-//                        }
-//                    }
-//                }
           }
       }
 

qml.qrc

@@ -185,5 +185,7 @@
         <file>fonts/SFUIDisplay-Bold.otf</file>
         <file>components/Style.qml</file>
         <file>components/qmldir</file>
+        <file>components/InlineButton.qml</file>
+        <file>images/lightning.png</file>
     </qresource>
 </RCC>