Gave plasmoid some love

Summary:
Make the plasmoid content transparent
Include battery info in header
Only show remotekeyboard input if available
Make header always centered

before:
{F3820966}

after:
{F3820965}

Reviewers: #kde_connect, apol

Reviewed By: #kde_connect, apol

Subscribers: jeanv, albertvaka, apol, #kde_connect

Tags: #kde_connect

Differential Revision: https://phabricator.kde.org/D6943

plasmoid/package/contents/ui/Battery.qml

@@ -37,7 +37,7 @@ QtObject {
 
     property bool charging: false
     property int charge: -1
-    property string displayString: (available && charge > -1) ? ((charging) ? (i18n("Charging: %1%", charge)) : (i18n("Discharging: %1%", charge))) : i18n("No info")
+    property string displayString: (available && charge > -1) ? ((charging) ? (i18n("%1% charging", charge)) : (i18n("%1%", charge))) : i18n("No info")
     property variant battery: null
 
     property variant nested1: DBusAsyncResponse {

plasmoid/package/contents/ui/DeviceDelegate.qml

@@ -94,13 +94,18 @@ PlasmaComponents.ListItem
         {
             Item {
                 //spacer to make the label centre aligned in a row yet still elide and everything
-                implicitWidth: ring.width + browse.width + parent.spacing
+                implicitWidth: (ring.visible? ring.width : 0) + (browse.visible? browse.width : 0) + parent.spacing
+            }
+
+            Battery {
+                id: battery
+                device: root.device
             }
             
             PlasmaComponents.Label {
                 horizontalAlignment: Text.AlignHCenter
                 elide: Text.ElideRight
-                text: display
+                text: (battery.available && battery.charge > -1) ? i18n("%1 (%2)", display, battery.displayString) : display
                 Layout.fillWidth: true
                 textFormat: Text.PlainText
             }
@@ -147,8 +152,7 @@ PlasmaComponents.ListItem
 
         //RemoteKeyboard
         PlasmaComponents.ListItem {
-            sectionDelegate: true
+            visible: remoteKeyboardInput.available
-            visible: remoteKeyboard.available
             width: parent.width
 
             Row {
@@ -157,7 +161,6 @@ PlasmaComponents.ListItem
 
                 PlasmaComponents.Label {
                     id: remoteKeyboardLabel
-                    //font.bold: true
                     text: i18n("Remote Keyboard")
                 }
 
@@ -191,34 +194,12 @@ PlasmaComponents.ListItem
             }
         }
 
-        //Battery
-        PlasmaComponents.ListItem {
-
-            Battery {
-                id: battery
-                device: root.device
-            }
-
-            sectionDelegate: true
-            visible: battery.available
-            PlasmaComponents.Label {
-                //font.bold: true
-                text: i18n("Battery")
-            }
-            PlasmaComponents.Label {
-                text: battery.displayString
-                anchors.right: parent.right
-            }
-        }
-
         //Notifications
         PlasmaComponents.ListItem {
             visible: notificationsModel.count>0
             enabled: true
-            sectionDelegate: true
             PlasmaComponents.Label {
-                //font.bold: true
+                text: i18n("Notifications:")
-                text: i18n("Notifications")
             }
             PlasmaComponents.ToolButton {
                 enabled: true