diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml
index 2b3385ece..4d45df92e 100644
--- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml
+++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml
@@ -12,7 +12,7 @@ import qs.modules.waffle.actionCenter.mainPage
 WBarAttachedPanelContent {
     id: root
 
-    contentItem: StackView { // TODO: Make this a WStackView with proper anim
+    contentItem: WStackView {
         id: stackView
         anchors.fill: parent
         implicitWidth: initItem.implicitWidth
diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml
index 07aa54df9..4317d8205 100644
--- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml
+++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml
@@ -11,9 +11,7 @@ Singleton {
 
     function push(component) {
         if (stackView) {
-            item = stackView.push(component)
-            stackView.implicitWidth = item.implicitWidth
-            stackView.implicitHeight = item.implicitHeight
+            stackView.push(component)
         }
     }
 
diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/volumeControl/VolumeControl.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/volumeControl/VolumeControl.qml
index d4150ab7a..fc6979d9b 100644
--- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/volumeControl/VolumeControl.qml
+++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/volumeControl/VolumeControl.qml
@@ -10,7 +10,7 @@ import qs.modules.common.widgets
 import qs.modules.waffle.looks
 import qs.modules.waffle.actionCenter
 
-Rectangle {
+Item {
     id: root
     implicitWidth: 360
     implicitHeight: 352
diff --git a/dots/.config/quickshell/ii/modules/waffle/looks/WBarAttachedPanelContent.qml b/dots/.config/quickshell/ii/modules/waffle/looks/WBarAttachedPanelContent.qml
index 9dfdc43f7..ee2c91ff5 100644
--- a/dots/.config/quickshell/ii/modules/waffle/looks/WBarAttachedPanelContent.qml
+++ b/dots/.config/quickshell/ii/modules/waffle/looks/WBarAttachedPanelContent.qml
@@ -78,9 +78,8 @@ Item {
         }
     }
 
-    Rectangle {
+    Item {
         id: contentArea
-        color: "red"
         z: 0
         anchors.fill: borderRect
         anchors.margins: borderRect.border.width
diff --git a/dots/.config/quickshell/ii/modules/waffle/looks/WStackView.qml b/dots/.config/quickshell/ii/modules/waffle/looks/WStackView.qml
new file mode 100644
index 000000000..52a703792
--- /dev/null
+++ b/dots/.config/quickshell/ii/modules/waffle/looks/WStackView.qml
@@ -0,0 +1,86 @@
+import QtQuick
+import QtQuick.Controls
+import qs.modules.waffle.looks
+
+StackView {
+    id: root
+    property real moveDistance: 20
+    property int pushDuration: 100
+    property list<real> bezierCurve: Looks.transition.easing.bezierCurve.easeIn
+    clip: true
+
+    property alias color: background.color
+    background: Rectangle {
+        id: background
+        color: Looks.colors.bgPanelBody
+    }
+
+    pushEnter: Transition {
+        XAnimator {
+            from: -root.moveDistance
+            to: 0
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+        NumberAnimation {
+            properties: "opacity"
+            from: 0
+            to: 1
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+    }
+    pushExit: Transition {
+        XAnimator {
+            from: 0
+            to: root.moveDistance
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+        NumberAnimation {
+            properties: "opacity"
+            from: 1
+            to: 0
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+    }
+    popEnter: Transition {
+        XAnimator {
+            from: root.moveDistance
+            to: 0
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+        NumberAnimation {
+            properties: "opacity"
+            from: 0
+            to: 1
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+    }
+    popExit: Transition {
+        XAnimator {
+            from: 0
+            to: -root.moveDistance
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+        NumberAnimation {
+            properties: "opacity"
+            from: 1
+            to: 0
+            duration: root.pushDuration
+            easing.type: Easing.BezierSpline
+            easing.bezierCurve: root.bezierCurve
+        }
+    }
+}