controlcenter: changed to popout vs floating to match the other settings buttons (fixed issues with resizing)

7 files changed, 14 insertions, 123 deletions

diff --git a/modules/bar/components/Settings.qml b/modules/bar/components/Settings.qml
index e92fc46..0eceea7 100644
--- a/modules/bar/components/Settings.qml
+++ b/modules/bar/components/Settings.qml
@@ -21,7 +21,9 @@ Item {
         radius: Appearance.rounding.full
 
         function onClicked(): void {
-            WindowFactory.create();
+            WindowFactory.create(null, {
+                active: "appearance"
+            });
         }
     }
 
diff --git a/modules/bar/components/SettingsIcon.qml b/modules/bar/components/SettingsIcon.qml
index e92fc46..0eceea7 100644
--- a/modules/bar/components/SettingsIcon.qml
+++ b/modules/bar/components/SettingsIcon.qml
@@ -21,7 +21,9 @@ Item {
         radius: Appearance.rounding.full
 
         function onClicked(): void {
-            WindowFactory.create();
+            WindowFactory.create(null, {
+                active: "appearance"
+            });
         }
     }
 
diff --git a/modules/controlcenter/NavRail.qml b/modules/controlcenter/NavRail.qml
index 234f447..8432f17 100644
--- a/modules/controlcenter/NavRail.qml
+++ b/modules/controlcenter/NavRail.qml
@@ -30,129 +30,12 @@ Item {
 
             PropertyChanges {
                 layout.spacing: Appearance.spacing.small
-                menuIcon.opacity: 0
-                menuIconExpanded.opacity: 1
-                menuIcon.rotation: 180
-                menuIconExpanded.rotation: 0
             }
         }
 
         transitions: Transition {
             Anim {
-                properties: "spacing,opacity,rotation"
-            }
-        }
-
-        Item {
-            id: menuBtn
-
-            Layout.topMargin: Appearance.spacing.large
-            implicitWidth: menuIcon.implicitWidth + menuIcon.anchors.leftMargin * 2
-            implicitHeight: menuIcon.implicitHeight + Appearance.padding.normal * 2
-
-            StateLayer {
-                radius: Appearance.rounding.small
-
-                function onClicked(): void {
-                    root.session.navExpanded = !root.session.navExpanded;
-                }
-            }
-
-            MaterialIcon {
-                id: menuIcon
-
-                anchors.left: parent.left
-                anchors.verticalCenter: parent.verticalCenter
-                anchors.leftMargin: Appearance.padding.large
-
-                text: "menu"
-                font.pointSize: Appearance.font.size.large
-            }
-
-            MaterialIcon {
-                id: menuIconExpanded
-
-                anchors.fill: menuIcon
-                text: "menu_open"
-                font.pointSize: menuIcon.font.pointSize
-                opacity: 0
-                rotation: -180
-            }
-        }
-
-        Loader {
-            asynchronous: true
-            active: !root.session.floating
-            visible: active
-
-            sourceComponent: StyledRect {
-                readonly property int nonAnimWidth: normalWinIcon.implicitWidth + (root.session.navExpanded ? normalWinLabel.anchors.leftMargin + normalWinLabel.implicitWidth : 0) + normalWinIcon.anchors.leftMargin * 2
-
-                implicitWidth: nonAnimWidth
-                implicitHeight: root.session.navExpanded ? normalWinIcon.implicitHeight + Appearance.padding.normal * 2 : nonAnimWidth
-
-                color: Colours.palette.m3primaryContainer
-                radius: Appearance.rounding.small
-
-                StateLayer {
-                    id: normalWinState
-
-                    color: Colours.palette.m3onPrimaryContainer
-
-                    function onClicked(): void {
-                        root.session.root.close();
-                        WindowFactory.create(null, {
-                            screen: root.screen,
-                            active: root.session.active,
-                            navExpanded: root.session.navExpanded
-                        });
-                    }
-                }
-
-                MaterialIcon {
-                    id: normalWinIcon
-
-                    anchors.left: parent.left
-                    anchors.verticalCenter: parent.verticalCenter
-                    anchors.leftMargin: Appearance.padding.large
-
-                    text: "select_window"
-                    color: Colours.palette.m3onPrimaryContainer
-                    font.pointSize: Appearance.font.size.large
-                    fill: 1
-                }
-
-                StyledText {
-                    id: normalWinLabel
-
-                    anchors.left: normalWinIcon.right
-                    anchors.verticalCenter: parent.verticalCenter
-                    anchors.leftMargin: Appearance.spacing.normal
-
-                    text: qsTr("Float window")
-                    color: Colours.palette.m3onPrimaryContainer
-                    opacity: root.session.navExpanded ? 1 : 0
-
-                    Behavior on opacity {
-                        Anim {
-                            duration: Appearance.anim.durations.small
-                        }
-                    }
-                }
-
-                Behavior on implicitWidth {
-                    Anim {
-                        duration: Appearance.anim.durations.expressiveDefaultSpatial
-                        easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
-                    }
-                }
-
-                Behavior on implicitHeight {
-                    Anim {
-                        duration: Appearance.anim.durations.expressiveDefaultSpatial
-                        easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
-                    }
-                }
+                properties: "spacing"
             }
         }
 
diff --git a/modules/drawers/Panels.qml b/modules/drawers/Panels.qml
index 4ce1182..7705732 100644
--- a/modules/drawers/Panels.qml
+++ b/modules/drawers/Panels.qml
@@ -109,6 +109,7 @@ Item {
 
         visibilities: root.visibilities
         sidebar: sidebar
+        popouts: popouts
 
         anchors.bottom: parent.bottom
         anchors.right: parent.right
diff --git a/modules/utilities/Content.qml b/modules/utilities/Content.qml
index d5be824..902656d 100644
--- a/modules/utilities/Content.qml
+++ b/modules/utilities/Content.qml
@@ -8,6 +8,7 @@ Item {
 
     required property var props
     required property var visibilities
+    required property Item popouts
 
     implicitWidth: layout.implicitWidth
     implicitHeight: layout.implicitHeight
@@ -28,6 +29,7 @@ Item {
 
         Toggles {
             visibilities: root.visibilities
+            popouts: root.popouts
         }
     }
 
diff --git a/modules/utilities/Wrapper.qml b/modules/utilities/Wrapper.qml
index dd784bc..77178e3 100644
--- a/modules/utilities/Wrapper.qml
+++ b/modules/utilities/Wrapper.qml
@@ -10,6 +10,7 @@ Item {
 
     required property var visibilities
     required property Item sidebar
+    required property Item popouts
 
     readonly property PersistentProperties props: PersistentProperties {
         property bool recordingListExpanded: false
@@ -89,6 +90,7 @@ Item {
             implicitWidth: root.implicitWidth - Appearance.padding.large * 2
             props: root.props
             visibilities: root.visibilities
+            popouts: root.popouts
         }
     }
 }
diff --git a/modules/utilities/cards/Toggles.qml b/modules/utilities/cards/Toggles.qml
index d3ad51e..71f4d1d 100644
--- a/modules/utilities/cards/Toggles.qml
+++ b/modules/utilities/cards/Toggles.qml
@@ -12,6 +12,7 @@ StyledRect {
     id: root
 
     required property var visibilities
+    required property Item popouts
 
     Layout.fillWidth: true
     implicitHeight: layout.implicitHeight + Appearance.padding.large * 2
@@ -67,9 +68,7 @@ StyledRect {
                 toggle: false
                 onClicked: {
                     root.visibilities.utilities = false;
-                    WindowFactory.create(null, {
-                        screen: QsWindow.window?.screen ?? null
-                    });
+                    root.popouts.detach("appearance");
                 }
             }