Finalize m3 shadow & elevation

quickshell/Modules/Notifications/Center/HistoryNotificationCard.qml

@@ -34,32 +34,17 @@ Rectangle {
     clip: false
     readonly property bool shadowsAllowed: Theme.elevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
 
-    Item {
+    ElevationShadow {
         id: shadowLayer
         anchors.fill: parent
         z: -1
-
-        layer.enabled: root.shadowsAllowed
-        layer.effect: MultiEffect {
-            autoPaddingEnabled: true
-            shadowEnabled: root.shadowsAllowed
-            blurEnabled: false
-            maskEnabled: false
-            shadowBlur: Math.max(0, Math.min(1, ((Theme.elevationLevel1 && Theme.elevationLevel1.blurPx !== undefined) ? Theme.elevationLevel1.blurPx : 4) / Theme.elevationBlurMax))
-            shadowScale: 1
-            shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel1, 1)
-            shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel1)
-            blurMax: Theme.elevationBlurMax
-            shadowColor: Theme.elevationShadowColor(Theme.elevationLevel1)
-        }
-
-        Rectangle {
-            anchors.fill: parent
-            radius: root.radius
-            color: root.color
-            border.color: root.border.color
-            border.width: root.border.width
-        }
+        level: Theme.elevationLevel1
+        fallbackOffset: 1
+        targetRadius: root.radius
+        targetColor: root.color
+        borderColor: root.border.color
+        borderWidth: root.border.width
+        shadowEnabled: root.shadowsAllowed
     }
 
     color: {

quickshell/Modules/Notifications/Center/NotificationCard.qml

@@ -132,32 +132,21 @@ Rectangle {
         id: cardHoverHandler
     }
 
-    Item {
+    ElevationShadow {
         id: shadowLayer
         anchors.fill: parent
         z: -1
-
-        layer.enabled: root.shadowsAllowed
-        layer.effect: MultiEffect {
-            autoPaddingEnabled: true
-            shadowEnabled: root.shadowsAllowed
-            blurEnabled: false
-            maskEnabled: false
-            shadowBlur: Math.max(0, Math.min(1, root.shadowBlurPx / Theme.elevationBlurMax))
-            shadowScale: 1
-            shadowVerticalOffset: root.shadowOffsetYPx
-            shadowHorizontalOffset: root.shadowOffsetXPx
-            blurMax: Theme.elevationBlurMax
-            shadowColor: root.shadowElevation ? Theme.elevationShadowColor(root.shadowElevation) : "transparent"
-        }
-
-        Rectangle {
-            anchors.fill: parent
-            radius: root.radius
-            color: root.color
-            border.color: root.border.color
-            border.width: root.border.width
-        }
+        level: root.shadowElevation
+        targetRadius: root.radius
+        targetColor: root.color
+        borderColor: root.border.color
+        borderWidth: root.border.width
+        shadowBlurPx: root.shadowBlurPx
+        shadowSpreadPx: 0
+        shadowOffsetX: root.shadowOffsetXPx
+        shadowOffsetY: root.shadowOffsetYPx
+        shadowColor: root.shadowElevation ? Theme.elevationShadowColor(root.shadowElevation) : "transparent"
+        shadowEnabled: root.shadowsAllowed
     }
 
     Rectangle {

quickshell/Modules/Notifications/Center/NotificationCenterPopout.qml

@@ -7,7 +7,7 @@ DankPopout {
     id: root
 
     layerNamespace: "dms:notification-center-popout"
-    fullHeightSurface: true
+    fullHeightSurface: false
 
     property bool notificationHistoryVisible: false
     property var triggerScreen: null

quickshell/Modules/Notifications/Popup/NotificationPopup.qml

@@ -381,48 +381,36 @@ PanelWindow {
             }
         }
 
-        Item {
+        ElevationShadow {
             id: bgShadowLayer
             anchors.fill: parent
             anchors.margins: -content.shadowRenderPadding
-            layer.enabled: !win._isDestroying && win.screenValid && content.shadowsAllowed
+            level: content.elevLevel
+            fallbackOffset: 6
+            shadowBlurPx: content.shadowBlurPx
+            shadowOffsetX: content.shadowOffsetX
+            shadowOffsetY: content.shadowOffsetY
+            shadowColor: content.shadowsAllowed && content.elevLevel ? Theme.elevationShadowColor(content.elevLevel) : "transparent"
+            shadowEnabled: !win._isDestroying && win.screenValid && content.shadowsAllowed
             layer.textureSize: Qt.size(Math.round(width * win.dpr), Math.round(height * win.dpr))
             layer.textureMirroring: ShaderEffectSource.MirrorVertically
 
-            readonly property int blurMax: Theme.elevationBlurMax
-
-            layer.effect: MultiEffect {
-                id: shadowFx
-                autoPaddingEnabled: true
-                shadowEnabled: content.shadowsAllowed
-                blurEnabled: false
-                maskEnabled: false
-                shadowBlur: Math.max(0, Math.min(1, content.shadowBlurPx / bgShadowLayer.blurMax))
-                shadowScale: 1
-                shadowHorizontalOffset: content.shadowOffsetX
-                shadowVerticalOffset: content.shadowOffsetY
-                blurMax: Theme.elevationBlurMax
-                shadowColor: content.shadowsAllowed && content.elevLevel ? Theme.elevationShadowColor(content.elevLevel) : "transparent"
-            }
+            sourceRect.anchors.fill: undefined
+            sourceRect.x: content.shadowRenderPadding + content.cardInset
+            sourceRect.y: content.shadowRenderPadding + content.cardInset
+            sourceRect.width: Math.max(0, content.width - (content.cardInset * 2))
+            sourceRect.height: Math.max(0, content.height - (content.cardInset * 2))
+            sourceRect.radius: Theme.cornerRadius
+            sourceRect.color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            sourceRect.border.color: notificationData && notificationData.urgency === NotificationUrgency.Critical ? Theme.withAlpha(Theme.primary, 0.3) : Theme.withAlpha(Theme.outline, 0.08)
+            sourceRect.border.width: notificationData && notificationData.urgency === NotificationUrgency.Critical ? 2 : 0
 
             Rectangle {
-                id: shadowShapeSource
-                x: content.shadowRenderPadding + content.cardInset
-                y: content.shadowRenderPadding + content.cardInset
-                width: Math.max(0, content.width - (content.cardInset * 2))
-                height: Math.max(0, content.height - (content.cardInset * 2))
-                radius: Theme.cornerRadius
-                color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
-                border.color: notificationData && notificationData.urgency === NotificationUrgency.Critical ? Theme.withAlpha(Theme.primary, 0.3) : Theme.withAlpha(Theme.outline, 0.08)
-                border.width: notificationData && notificationData.urgency === NotificationUrgency.Critical ? 2 : 0
-            }
-
-            Rectangle {
-                x: shadowShapeSource.x
-                y: shadowShapeSource.y
-                width: shadowShapeSource.width
-                height: shadowShapeSource.height
-                radius: shadowShapeSource.radius
+                x: bgShadowLayer.sourceRect.x
+                y: bgShadowLayer.sourceRect.y
+                width: bgShadowLayer.sourceRect.width
+                height: bgShadowLayer.sourceRect.height
+                radius: bgShadowLayer.sourceRect.radius
                 visible: notificationData && notificationData.urgency === NotificationUrgency.Critical
                 opacity: 1
                 clip: true