finish style bar(almost)

1 files changed, 52 insertions, 20 deletions

diff --git a/bar/Network.qml b/bar/Network.qml
index 3559df0..14e8851 100644
--- a/bar/Network.qml
+++ b/bar/Network.qml
@@ -6,29 +6,61 @@ import qs.components
 import qs.config as Config
 
 Item {
-    id: root
 
-    RowLayout {
-        Item {
-            Layout.fillWidth: true
-        }
-        anchors.fill: parent
-        spacing: Config.Bar.resourceIconTextSpacing
+    implicitWidth: container.implicitWidth
+    implicitHeight: container.implicitHeight - Config.General.rectMargin
 
-        Icons {
-            text: Services.Network.state
-        }
-        Text {
-            text: Math.round(Services.Resource.cpuUsage * 100)
-        }
-        Text {
-            text: Services.NetworkUsage.up + " " + Services.NetworkUsage.upUnit
+    Rectangle {
+        id: container
+        anchors {
+            fill: parent
+            verticalCenter: parent.verticalCenter
+            horizontalCenter: parent.horizontalCenter
         }
-        Text {
-            text: Services.NetworkUsage.down + " " + Services.NetworkUsage.downUnit
-        }
-        Item {
-            Layout.fillWidth: true
+
+        implicitWidth: layout.implicitWidth + Config.General.rectMargin * 2
+        implicitHeight: Config.Bar.height
+        color: Config.Colors.alt
+        radius: Config.Style.rounding.large
+
+        RowLayout {
+            id: layout
+            anchors {
+                verticalCenter: parent.verticalCenter
+                horizontalCenter: parent.horizontalCenter
+            }
+            spacing: Config.Bar.resourceIconTextSpacing
+
+            Item {
+                Layout.fillWidth: true
+            }
+
+            Icons {
+                text: Services.Network.state
+            }
+
+            RowLayout {
+                spacing: Config.Bar.resourceIconTextSpacing / 2
+                Text {
+                    text: Config.Icons.resource.network.download
+                }
+                Text {
+                    text: Services.NetworkUsage.down + Services.NetworkUsage.downUnit
+                }
+            }
+            RowLayout {
+                spacing: Config.Bar.resourceIconTextSpacing / 2
+                Text {
+                    text: Config.Icons.resource.network.upload
+                }
+                Text {
+                    text: Services.NetworkUsage.up + Services.NetworkUsage.upUnit
+                }
+            }
+
+            Item {
+                Layout.fillWidth: true
+            }
         }
     }
 }