brightess and volume control

TopBar.qml

@@ -36,7 +36,7 @@ PanelWindow {
 
     GlobalShortcut {
         id: shortcut
-        name: "topbar"
+        name: "peek_bar"
         description: "Hold to peek, tap to toggle topbar"
         onPressed: {
             background.index = 0
@@ -70,7 +70,7 @@ PanelWindow {
         id: background
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.top: parent.top
-        color: "#222222"
+        color: "#181818"
         radius: 16
         width: children[0].width + radius*2
         height: children[0].height
@@ -107,6 +107,7 @@ PanelWindow {
             }
             width: children[0].width
             height: children[0].height
+            visible: opacity
             opacity: 0
             property var fadeIn: SequentialAnimation {
                 PauseAnimation {duration: 200}
@@ -156,6 +157,8 @@ PanelWindow {
         Pane { Panes.Battery {} }
         Pane { Panes.NotificationCenter {} }
         Pane { Panes.Notifications {} }
+        Pane { Panes.Volume {} }
+        Pane { Panes.Brightness {} }
 
         property var entry: SequentialAnimation {
             PauseAnimation {duration: 2}
@@ -180,6 +183,9 @@ PanelWindow {
                 launcher.clear()
             }
         }
-        HoverHandler {id: hover}
+        HoverHandler {
+            id: hover
+            onHoveredChanged: { if (!hovered && background.index === 0) root.close() }
+        }
     }
 }