feat: replace control center popout with nexus

modules/bar/popouts/Wrapper.qml

@@ -7,7 +7,7 @@ import Quickshell.Wayland
 import Caelestia.Config
 import qs.components
 import qs.services
-import qs.modules.controlcenter
+import qs.modules.nexus
 import qs.modules.windowinfo
 
 Item {
@@ -18,7 +18,7 @@ Item {
 
     readonly property alias content: content
     readonly property alias winfo: winfo
-    readonly property alias controlCenter: controlCenter
+    readonly property alias nexus: nexus
 
     readonly property real nonAnimWidth: children.find(c => c.shouldBeActive)?.implicitWidth ?? content.implicitWidth
     readonly property real nonAnimHeight: children.find(c => c.shouldBeActive)?.implicitHeight ?? content.implicitHeight
@@ -128,15 +128,24 @@ Item {
     }
 
     Comp {
-        id: controlCenter
+        id: nexus
 
         shouldBeActive: root.detachedMode === "any"
         anchors.centerIn: parent
 
-        sourceComponent: ControlCenter {
-            screen: root.screen
-            active: root.queuedMode
-            onClose: root.close()
+        sourceComponent: StyledClippingRect {
+            radius: Tokens.rounding.extraLarge
+            implicitWidth: nexusInner.implicitWidth
+            implicitHeight: nexusInner.implicitHeight
+
+            Nexus {
+                id: nexusInner
+
+                anchors.fill: parent
+                nState.screen: root.screen
+                nState.currentPageIdx: ["appearance", "network", "bluetooth", "audio"].indexOf(root.queuedMode)
+                onClose: root.close()
+            }
         }
     }
 

modules/nexus/Nexus.qml

@@ -51,13 +51,14 @@ Item {
 
         anchors.right: parent.right
         anchors.top: parent.top
+        anchors.margins: root.nState.isWindow ? 0 : Tokens.padding.extraSmall
 
         group: blobGroup
         opacity: root.blobColour.a
         radius: Tokens.rounding.medium
 
-        implicitWidth: windowBtn.implicitWidth + Tokens.padding.extraSmall * 2
-        implicitHeight: windowBtn.implicitHeight + Tokens.padding.extraSmall
+        implicitWidth: windowBtn.implicitWidth + (root.nState.isWindow ? Tokens.padding.extraSmall : Tokens.padding.small) * 2
+        implicitHeight: windowBtn.implicitHeight + (root.nState.isWindow ? Tokens.padding.extraSmall : Tokens.padding.small)
     }
 
     IconButton {

modules/utilities/cards/Toggles.qml

@@ -8,6 +8,7 @@ import Caelestia.Config
 import qs.components
 import qs.components.controls
 import qs.services
+import qs.modules.nexus
 import qs.modules.bar.popouts as BarPopouts
 
 StyledRect {
@@ -118,7 +119,7 @@ StyledRect {
                         isToggle: false
                         onClicked: {
                             root.visibilities.utilities = false;
-                            root.popouts.detach("network");
+                            WindowFactory.create();
                         }
                     }
                 }