Salastil/DankMaterialShell
1
0
Fork 0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2026-04-03 20:32:07 -04:00
Code Packages Releases Activity

Finalize m3 shadow & elevation

Browse Source
This commit is contained in:
purian23
2026-03-01 00:43:46 -05:00
parent 36951f82c6
commit 1452c85946
21 changed files with 290 additions and 428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
quickshell/Common/ElevationShadow.qml Normal file
View File

@@ -0,0 +1,54 @@
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Effects
import qs.Common
Item {
id: root
property var level: Theme.elevationLevel2
property string direction: Theme.elevationLightDirection
property real fallbackOffset: 4
property color targetColor: "white"
property real targetRadius: Theme.cornerRadius
property color borderColor: "transparent"
property real borderWidth: 0
property bool shadowEnabled: Theme.elevationEnabled
property real shadowBlurPx: level && level.blurPx !== undefined ? level.blurPx : 0
property real shadowSpreadPx: level && level.spreadPx !== undefined ? level.spreadPx : 0
property real shadowOffsetX: Theme.elevationOffsetXFor(level, direction, fallbackOffset)
property real shadowOffsetY: Theme.elevationOffsetYFor(level, direction, fallbackOffset)
property color shadowColor: Theme.elevationShadowColor(level)
property real shadowOpacity: 1
property real blurMax: Theme.elevationBlurMax
property alias sourceRect: sourceRect
layer.enabled: shadowEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, root.shadowBlurPx / Math.max(1, root.blurMax)))
shadowScale: 1 + (2 * root.shadowSpreadPx) / Math.max(1, Math.min(root.width, root.height))
shadowHorizontalOffset: root.shadowOffsetX
shadowVerticalOffset: root.shadowOffsetY
blurMax: root.blurMax
shadowColor: root.shadowColor
shadowOpacity: root.shadowOpacity
}
Rectangle {
id: sourceRect
anchors.fill: parent
radius: root.targetRadius
color: root.targetColor
border.color: root.borderColor
border.width: root.borderWidth
}
}

12
quickshell/Common/Theme.qml
View File

@@ -838,6 +838,18 @@ Singleton {
return elevationOffsetYFor(level, elevationLightDirection, fallback);
}
function elevationRenderPadding(level, direction, fallbackOffset, extraPadding, minPadding) {
const dir = direction !== undefined ? direction : elevationLightDirection;
const blur = (level && level.blurPx !== undefined) ? Math.max(0, level.blurPx) : 0;
const spread = (level && level.spreadPx !== undefined) ? Math.max(0, level.spreadPx) : 0;
const fallback = fallbackOffset !== undefined ? fallbackOffset : 0;
const extra = extraPadding !== undefined ? extraPadding : 8;
const minPad = minPadding !== undefined ? minPadding : 16;
const offsetX = Math.abs(elevationOffsetXFor(level, dir, fallback));
const offsetY = Math.abs(elevationOffsetYFor(level, dir, fallback));
return Math.max(minPad, blur + spread + Math.max(offsetX, offsetY) + extra);
}
function elevationShadowColor(level) {
const alpha = (level && level.alpha !== undefined) ? level.alpha : 0.3;
let r = 0;

41
quickshell/Modals/Common/DankModal.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import Quickshell
import Quickshell.Wayland
import qs.Common
@@ -143,7 +142,11 @@ Item {
}
}
readonly property real shadowBuffer: Theme.elevationBlurMax * 1.5 + 24
readonly property var shadowLevel: Theme.elevationLevel3
readonly property real shadowFallbackOffset: 6
readonly property real shadowRenderPadding: (root.enableShadow && Theme.elevationEnabled && SettingsData.modalElevationEnabled) ? Theme.elevationRenderPadding(shadowLevel, Theme.elevationLightDirection, shadowFallbackOffset, 8, 16) : 0
readonly property real shadowMotionPadding: animationType === "slide" ? 30 : Math.max(0, animationOffset)
readonly property real shadowBuffer: Theme.snap(shadowRenderPadding + shadowMotionPadding, dpr)
readonly property real alignedWidth: Theme.px(modalWidth, dpr)
readonly property real alignedHeight: Theme.px(modalHeight, dpr)
@@ -378,34 +381,16 @@ Item {
}
}
readonly property var elev: Theme.elevationLevel3
readonly property real shadowBlurNorm: Math.max(0, Math.min(1, (elev && elev.blurPx !== undefined ? elev.blurPx : 12) / Theme.elevationBlurMax))
Item {
ElevationShadow {
id: modalShadowLayer
anchors.fill: parent
layer.enabled: root.enableShadow && Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: animatedContent.shadowBlurNorm
shadowScale: 1
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel3, 6)
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel3)
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
}
Rectangle {
anchors.fill: parent
radius: root.cornerRadius
color: root.backgroundColor
border.color: root.borderColor
border.width: root.borderWidth
}
level: root.shadowLevel
fallbackOffset: root.shadowFallbackOffset
targetRadius: root.cornerRadius
targetColor: root.backgroundColor
borderColor: root.borderColor
borderWidth: root.borderWidth
shadowEnabled: root.enableShadow && Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
}
FocusScope {

30
quickshell/Modals/DankLauncherV2/DankLauncherV2Modal.qml
View File

@@ -391,30 +391,16 @@ Item {
}
}
Item {
ElevationShadow {
id: launcherShadowLayer
anchors.fill: parent
layer.enabled: Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, Theme.elevationLevel3.blurPx / Theme.elevationBlurMax))
shadowScale: 1
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel3, 6)
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel3)
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
}
Rectangle {
anchors.fill: parent
color: root.backgroundColor
border.color: root.borderColor
border.width: root.borderWidth
radius: root.cornerRadius
}
level: Theme.elevationLevel3
fallbackOffset: 6
targetColor: root.backgroundColor
borderColor: root.borderColor
borderWidth: root.borderWidth
targetRadius: root.cornerRadius
shadowEnabled: Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
}
MouseArea {

2
quickshell/Modules/ControlCenter/ControlCenterPopout.qml
View File

@@ -12,7 +12,7 @@ DankPopout {
id: root
layerNamespace: "dms:control-center"
fullHeightSurface: true
fullHeightSurface: false
property string expandedSection: ""
property var triggerScreen: null

55
quickshell/Modules/DankBar/BarCanvas.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import QtQuick.Shapes
import qs.Common
import qs.Services
@@ -105,7 +104,6 @@ Item {
// Resolved values — per-bar override wins if set, otherwise use global M3 elevation
readonly property real shadowBlurPx: hasPerBarOverride ? overrideBlurPx : (elevLevel.blurPx ?? 8)
readonly property real shadowBlur: Math.max(0, Math.min(1, shadowBlurPx / Theme.elevationBlurMax))
readonly property color shadowColor: hasPerBarOverride ? Theme.withAlpha(overrideBaseColor, overrideOpacity) : Theme.elevationShadowColor(elevLevel)
readonly property real shadowOffsetMagnitude: hasPerBarOverride ? (overrideBlurPx * 0.5) : Theme.elevationOffsetMagnitude(elevLevel, 4, effectiveShadowDirection)
readonly property real shadowOffsetX: Theme.elevationOffsetXFor(hasPerBarOverride ? null : elevLevel, effectiveShadowDirection, shadowOffsetMagnitude)
@@ -153,43 +151,28 @@ Item {
}
}
Loader {
id: shadowLoader
anchors.fill: parent
active: root.shadowEnabled && mainPathCorrectShape && (Theme.elevationEnabled || root.hasPerBarOverride)
asynchronous: false
sourceComponent: Item {
anchors.fill: parent
ElevationShadow {
id: barShadow
visible: root.shadowEnabled && root.width > 0 && root.height > 0
layer.enabled: true
layer.smooth: true
layer.samples: barWindow._dpr > 1.5 ? 4 : 2
layer.textureSize: Qt.size(Math.round(width * barWindow._dpr), Math.round(height * barWindow._dpr))
layer.effect: MultiEffect {
shadowEnabled: true
shadowBlur: root.shadowBlur
blurMax: Theme.elevationBlurMax
shadowColor: root.shadowColor
shadowVerticalOffset: root.shadowOffsetY
shadowHorizontalOffset: root.shadowOffsetX
autoPaddingEnabled: true
}
// Size to the bar's rectangular body, excluding gothic wing extensions
x: root.isRight ? root.wing : 0
y: root.isBottom ? root.wing : 0
width: axis.isVertical ? (parent.width - root.wing) : parent.width
height: axis.isVertical ? parent.height : (parent.height - root.wing)
Shape {
anchors.fill: parent
preferredRendererType: Shape.CurveRenderer
shadowEnabled: root.shadowEnabled
level: root.hasPerBarOverride ? null : root.elevLevel
direction: root.effectiveShadowDirection
fallbackOffset: 4
targetRadius: root.rt
targetColor: barWindow._bgColor
ShapePath {
fillColor: barWindow._bgColor
strokeColor: "transparent"
strokeWidth: 0
PathSvg {
path: root.mainPath
}
}
}
}
shadowBlurPx: root.shadowBlurPx
shadowOffsetX: root.shadowOffsetX
shadowOffsetY: root.shadowOffsetY
shadowColor: root.shadowColor
blurMax: Theme.elevationBlurMax
}
Loader {

18
quickshell/Modules/DankBar/DankBarWindow.qml
View File

@@ -140,6 +140,20 @@ PanelWindow {
}
readonly property real _dpr: CompositorService.getScreenScale(barWindow.screen)
// Shadow buffer: extra window space for shadow to render beyond bar bounds
readonly property bool _shadowActive: (Theme.elevationEnabled && (typeof SettingsData !== "undefined" ? (SettingsData.barElevationEnabled ?? true) : false)) || (barConfig?.shadowIntensity ?? 0) > 0
readonly property real _shadowBuffer: {
if (!_shadowActive)
return 0;
const hasOverride = (barConfig?.shadowIntensity ?? 0) > 0;
if (hasOverride) {
const blur = (barConfig.shadowIntensity ?? 0) * 0.2;
const offset = blur * 0.5;
return Theme.snap(Math.max(16, blur + offset + 8), _dpr);
}
return Theme.snap(Theme.elevationRenderPadding(Theme.elevationLevel2, "top", 4, 8, 16), _dpr);
}
property string screenName: modelData.name
property bool hasMaximizedToplevel: false
@@ -354,8 +368,8 @@ PanelWindow {
}
screen: modelData
implicitHeight: !isVertical ? Theme.px(effectiveBarThickness + effectiveSpacing + ((barConfig?.gothCornersEnabled ?? false) && !hasMaximizedToplevel ? _wingR : 0), _dpr) : 0
implicitWidth: isVertical ? Theme.px(effectiveBarThickness + effectiveSpacing + ((barConfig?.gothCornersEnabled ?? false) && !hasMaximizedToplevel ? _wingR : 0), _dpr) : 0
implicitHeight: !isVertical ? Theme.px(effectiveBarThickness + effectiveSpacing + ((barConfig?.gothCornersEnabled ?? false) && !hasMaximizedToplevel ? _wingR : 0), _dpr) + _shadowBuffer : 0
implicitWidth: isVertical ? Theme.px(effectiveBarThickness + effectiveSpacing + ((barConfig?.gothCornersEnabled ?? false) && !hasMaximizedToplevel ? _wingR : 0), _dpr) + _shadowBuffer : 0
color: "transparent"
property var nativeInhibitor: null

80
quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml
View File

@@ -964,39 +964,26 @@ BasePill {
}
}
Item {
ElevationShadow {
id: bgShadowLayer
anchors.fill: parent
layer.enabled: Theme.elevationEnabled
level: menuContainer.elev
fallbackOffset: 4
shadowBlurPx: menuContainer.shadowBlurPx
shadowSpreadPx: menuContainer.shadowSpreadPx
shadowColor: {
const baseColor = Theme.isLightMode ? Qt.rgba(0, 0, 0, 1) : Theme.surfaceContainerHighest;
return Theme.withAlpha(baseColor, menuContainer.effectiveShadowAlpha);
}
targetColor: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
targetRadius: Theme.cornerRadius
sourceRect.antialiasing: true
sourceRect.smooth: true
shadowEnabled: Theme.elevationEnabled
layer.smooth: true
layer.textureSize: Qt.size(Math.round(width * overflowMenu.dpr * 2), Math.round(height * overflowMenu.dpr * 2))
layer.textureMirroring: ShaderEffectSource.MirrorVertically
layer.samples: 4
readonly property int blurMax: 64
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, menuContainer.shadowBlurPx / bgShadowLayer.blurMax))
shadowScale: 1 + (2 * menuContainer.shadowSpreadPx) / Math.max(1, Math.min(bgShadowLayer.width, bgShadowLayer.height))
shadowHorizontalOffset: Theme.elevationOffsetX(menuContainer.elev)
shadowVerticalOffset: Theme.elevationOffsetY(menuContainer.elev, 4)
shadowColor: {
const baseColor = Theme.isLightMode ? Qt.rgba(0, 0, 0, 1) : Theme.surfaceContainerHighest;
return Theme.withAlpha(baseColor, menuContainer.effectiveShadowAlpha);
}
}
Rectangle {
anchors.fill: parent
color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
radius: Theme.cornerRadius
antialiasing: true
smooth: true
}
}
Grid {
@@ -1439,37 +1426,24 @@ BasePill {
}
}
Item {
ElevationShadow {
id: menuBgShadowLayer
anchors.fill: parent
layer.enabled: Theme.elevationEnabled
level: menuContainer.elev
fallbackOffset: 4
shadowBlurPx: menuContainer.shadowBlurPx
shadowSpreadPx: menuContainer.shadowSpreadPx
shadowColor: {
const baseColor = Theme.isLightMode ? Qt.rgba(0, 0, 0, 1) : Theme.surfaceContainerHighest;
return Theme.withAlpha(baseColor, menuContainer.effectiveShadowAlpha);
}
targetColor: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
targetRadius: Theme.cornerRadius
sourceRect.antialiasing: true
shadowEnabled: Theme.elevationEnabled
layer.smooth: true
layer.textureSize: Qt.size(Math.round(width * menuWindow.dpr), Math.round(height * menuWindow.dpr))
layer.textureMirroring: ShaderEffectSource.MirrorVertically
readonly property int blurMax: 64
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, menuContainer.shadowBlurPx / menuBgShadowLayer.blurMax))
shadowScale: 1 + (2 * menuContainer.shadowSpreadPx) / Math.max(1, Math.min(menuBgShadowLayer.width, menuBgShadowLayer.height))
shadowHorizontalOffset: Theme.elevationOffsetX(menuContainer.elev)
shadowVerticalOffset: Theme.elevationOffsetY(menuContainer.elev, 4)
shadowColor: {
const baseColor = Theme.isLightMode ? Qt.rgba(0, 0, 0, 1) : Theme.surfaceContainerHighest;
return Theme.withAlpha(baseColor, menuContainer.effectiveShadowAlpha);
}
}
Rectangle {
anchors.fill: parent
color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
radius: Theme.cornerRadius
antialiasing: true
}
}
QsMenuAnchor {

90
quickshell/Modules/DankDash/MediaDropdownOverlay.qml
View File

@@ -89,30 +89,18 @@ Item {
}
}
Item {
ElevationShadow {
id: volumeShadowLayer
anchors.fill: parent
z: -1
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: Theme.elevationEnabled
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
}
Rectangle {
anchors.fill: parent
radius: volumePanel.radius
color: volumePanel.color
border.color: volumePanel.border.color
border.width: volumePanel.border.width
}
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: volumePanel.radius
targetColor: volumePanel.color
borderColor: volumePanel.border.color
borderWidth: volumePanel.border.width
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
shadowEnabled: Theme.elevationEnabled
}
MouseArea {
@@ -239,30 +227,18 @@ Item {
}
}
Item {
ElevationShadow {
id: audioDevicesShadowLayer
anchors.fill: parent
z: -1
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: Theme.elevationEnabled
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
}
Rectangle {
anchors.fill: parent
radius: audioDevicesPanel.radius
color: audioDevicesPanel.color
border.color: audioDevicesPanel.border.color
border.width: audioDevicesPanel.border.width
}
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: audioDevicesPanel.radius
targetColor: audioDevicesPanel.color
borderColor: audioDevicesPanel.border.color
borderWidth: audioDevicesPanel.border.width
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
shadowEnabled: Theme.elevationEnabled
}
Column {
@@ -405,30 +381,18 @@ Item {
}
}
Item {
ElevationShadow {
id: playersShadowLayer
anchors.fill: parent
z: -1
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: Theme.elevationEnabled
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
}
Rectangle {
anchors.fill: parent
radius: playersPanel.radius
color: playersPanel.color
border.color: playersPanel.border.color
border.width: playersPanel.border.width
}
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: playersPanel.radius
targetColor: playersPanel.color
borderColor: playersPanel.border.color
borderWidth: playersPanel.border.width
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
shadowEnabled: Theme.elevationEnabled
}
Column {

16
quickshell/Modules/DankDash/MediaPlayerTab.qml
View File

@@ -529,15 +529,15 @@ Item {
onClicked: activePlayer && activePlayer.togglePlaying()
}
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
shadowEnabled: Theme.elevationEnabled
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel1)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel1, 1)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel1 && Theme.elevationLevel1.blurPx !== undefined ? Theme.elevationLevel1.blurPx : 4) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel1)
ElevationShadow {
anchors.fill: parent
z: -1
level: Theme.elevationLevel1
fallbackOffset: 1
targetRadius: parent.radius
targetColor: parent.color
shadowOpacity: Theme.elevationLevel1 && Theme.elevationLevel1.alpha !== undefined ? Theme.elevationLevel1.alpha : 0.2
shadowEnabled: Theme.elevationEnabled
}
}
}

31
quickshell/Modules/Notifications/Center/HistoryNotificationCard.qml
View File

@@ -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: {

35
quickshell/Modules/Notifications/Center/NotificationCard.qml
View File

@@ -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 {

2
quickshell/Modules/Notifications/Center/NotificationCenterPopout.qml
View File

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

56
quickshell/Modules/Notifications/Popup/NotificationPopup.qml
View File

@@ -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

18
quickshell/Modules/Settings/AboutTab.qml
View File

@@ -878,15 +878,17 @@ Item {
x: hoveredButton ? hoveredButton.mapToItem(aboutTab, hoveredButton.width / 2, 0).x - width / 2 : 0
y: hoveredButton ? communityIcons.mapToItem(aboutTab, 0, 0).y - height - 8 : 0
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
shadowEnabled: Theme.elevationEnabled
ElevationShadow {
anchors.fill: parent
z: -1
level: Theme.elevationLevel1
fallbackOffset: 1
targetRadius: communityTooltip.radius
targetColor: communityTooltip.color
borderColor: communityTooltip.border.color
borderWidth: communityTooltip.border.width
shadowOpacity: Theme.elevationLevel1 && Theme.elevationLevel1.alpha !== undefined ? Theme.elevationLevel1.alpha : 0.2
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel1)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel1, 1)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel1 && Theme.elevationLevel1.blurPx !== undefined ? Theme.elevationLevel1.blurPx : 4) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel1)
shadowEnabled: Theme.elevationEnabled
}
StyledText {

18
quickshell/Modules/Toast.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import Quickshell
import Quickshell.Wayland
import qs.Common
@@ -96,7 +95,6 @@ PanelWindow {
}
}
radius: Theme.cornerRadius
layer.enabled: Theme.elevationEnabled
opacity: shouldBeVisible ? 1 : 0
Column {
@@ -406,15 +404,15 @@ PanelWindow {
onClicked: ToastService.hideToast()
}
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: Theme.elevationEnabled
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel3)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel3, 6)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel3 && Theme.elevationLevel3.blurPx !== undefined ? Theme.elevationLevel3.blurPx : 12) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
ElevationShadow {
anchors.fill: parent
z: -1
level: Theme.elevationLevel3
fallbackOffset: 6
targetRadius: toast.radius
targetColor: toast.color
shadowOpacity: Theme.elevationLevel3 && Theme.elevationLevel3.alpha !== undefined ? Theme.elevationLevel3.alpha : 0.3
shadowEnabled: Theme.elevationEnabled
}
Behavior on opacity {

17
quickshell/Modules/WorkspaceOverlays/OverviewWidget.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import QtQuick.Layouts
import Quickshell
import Quickshell.Hyprland
@@ -153,15 +152,15 @@ Item {
radius: Theme.cornerRadius
color: Theme.surfaceContainer
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
shadowEnabled: Theme.elevationEnabled
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
ElevationShadow {
anchors.fill: parent
z: -1
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: Theme.cornerRadius
targetColor: Theme.surfaceContainer
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
shadowEnabled: Theme.elevationEnabled
}
ColumnLayout {

31
quickshell/Widgets/DankDropdown.qml
View File

@@ -1,7 +1,6 @@
import "../Common/fzf.js" as Fzf
import QtQuick
import QtQuick.Controls
import QtQuick.Effects
import Quickshell
import qs.Common
import qs.Widgets
@@ -263,31 +262,17 @@ Item {
border.width: 2
radius: Theme.cornerRadius
Item {
ElevationShadow {
id: shadowLayer
anchors.fill: parent
z: -1
layer.enabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
blurEnabled: false
maskEnabled: false
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
}
Rectangle {
anchors.fill: parent
radius: contentSurface.radius
color: contentSurface.color
border.color: contentSurface.border.color
border.width: contentSurface.border.width
}
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: contentSurface.radius
targetColor: contentSurface.color
borderColor: contentSurface.border.color
borderWidth: contentSurface.border.width
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled
}
Column {

27
quickshell/Widgets/DankIconPicker.qml
View File

@@ -1,6 +1,5 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Effects
import qs.Common
import qs.Widgets
@@ -136,28 +135,16 @@ Rectangle {
color: Theme.surface
radius: Theme.cornerRadius
Item {
ElevationShadow {
id: shadowLayer
anchors.fill: parent
z: -1
layer.enabled: Theme.elevationEnabled
layer.effect: MultiEffect {
autoPaddingEnabled: true
shadowEnabled: Theme.elevationEnabled
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
}
Rectangle {
anchors.fill: parent
radius: contentSurface.radius
color: contentSurface.color
}
level: Theme.elevationLevel2
fallbackOffset: 4
targetRadius: contentSurface.radius
targetColor: contentSurface.color
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
shadowEnabled: Theme.elevationEnabled
}
Rectangle {

41
quickshell/Widgets/DankOSD.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import Quickshell
import Quickshell.Wayland
import qs.Common
@@ -257,12 +256,7 @@ PanelWindow {
scale: shouldBeVisible ? 1 : 0.9
property bool childHovered: false
readonly property var elev: Theme.elevationLevel3
property real shadowBlurPx: elev && elev.blurPx !== undefined ? elev.blurPx : 12
property real shadowSpreadPx: elev && elev.spreadPx !== undefined ? elev.spreadPx : 0
property real shadowBaseAlpha: elev && elev.alpha !== undefined ? elev.alpha : 0.3
readonly property real popupSurfaceAlpha: SettingsData.popupTransparency
readonly property real effectiveShadowAlpha: shouldBeVisible ? Math.max(0, Math.min(1, shadowBaseAlpha * popupSurfaceAlpha)) : 0
Rectangle {
id: background
@@ -274,37 +268,20 @@ PanelWindow {
z: -1
}
Item {
ElevationShadow {
id: bgShadowLayer
anchors.fill: parent
visible: osdContainer.popupSurfaceAlpha >= 0.95
layer.enabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
z: -1
level: Theme.elevationLevel3
fallbackOffset: 6
targetRadius: Theme.cornerRadius
targetColor: Theme.surfaceContainer
borderColor: Theme.outlineMedium
borderWidth: 1
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
layer.textureSize: Qt.size(Math.round(width * root.dpr), Math.round(height * root.dpr))
layer.textureMirroring: ShaderEffectSource.MirrorVertically
readonly property int blurMax: Theme.elevationBlurMax
layer.effect: MultiEffect {
id: shadowFx
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, osdContainer.shadowBlurPx / bgShadowLayer.blurMax))
shadowScale: 1 + (2 * osdContainer.shadowSpreadPx) / Math.max(1, Math.min(bgShadowLayer.width, bgShadowLayer.height))
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel3)
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel3, 6)
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
}
Rectangle {
anchors.fill: parent
radius: Theme.cornerRadius
color: Theme.surfaceContainer
border.color: Theme.outlineMedium
border.width: 1
}
}
MouseArea {

44
quickshell/Widgets/DankPopout.qml
View File

@@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import Quickshell
import Quickshell.Wayland
import qs.Common
@@ -239,7 +238,11 @@ Item {
readonly property real screenHeight: screen ? screen.height : 0
readonly property real dpr: screen ? screen.devicePixelRatio : 1
readonly property real shadowBuffer: Theme.elevationBlurMax * 1.5 + 24
readonly property var shadowLevel: Theme.elevationLevel3
readonly property real shadowFallbackOffset: 6
readonly property real shadowRenderPadding: (Theme.elevationEnabled && SettingsData.popoutElevationEnabled) ? Theme.elevationRenderPadding(shadowLevel, effectiveShadowDirection, shadowFallbackOffset, 8, 16) : 0
readonly property real shadowMotionPadding: Math.max(0, animationOffset)
readonly property real shadowBuffer: Theme.snap(shadowRenderPadding + shadowMotionPadding, dpr)
readonly property real alignedWidth: Theme.px(popupWidth, dpr)
readonly property real alignedHeight: Theme.px(popupHeight, dpr)
@@ -523,43 +526,20 @@ Item {
}
}
Rectangle {
ElevationShadow {
id: shadowSource
anchors.centerIn: parent
width: parent.width
height: parent.height
radius: Theme.cornerRadius
color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
opacity: contentWrapper.opacity
scale: contentWrapper.scale
x: contentWrapper.x
y: contentWrapper.y
readonly property var elev: Theme.elevationLevel3
property real shadowBlurPx: elev && elev.blurPx !== undefined ? elev.blurPx : 12
property real shadowSpreadPx: elev && elev.spreadPx !== undefined ? elev.spreadPx : 0
property real shadowBaseAlpha: elev && elev.alpha !== undefined ? elev.alpha : 0.3
property real shadowOffsetX: Theme.elevationOffsetXFor(Theme.elevationLevel3, root.effectiveShadowDirection, 6)
property real shadowOffsetY: Theme.elevationOffsetYFor(Theme.elevationLevel3, root.effectiveShadowDirection, 6)
readonly property real popupSurfaceAlpha: SettingsData.popupTransparency
readonly property real effectiveShadowAlpha: Math.max(0, Math.min(1, shadowBaseAlpha * popupSurfaceAlpha))
readonly property int blurMax: Theme.elevationBlurMax
layer.enabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1" && !(root.suspendShadowWhileResizing && root._resizeActive)
layer.effect: MultiEffect {
id: shadowFx
autoPaddingEnabled: true
shadowEnabled: true
blurEnabled: false
maskEnabled: false
shadowBlur: Math.max(0, Math.min(1, shadowSource.shadowBlurPx / shadowSource.blurMax))
shadowScale: 1 + (2 * shadowSource.shadowSpreadPx) / Math.max(1, Math.min(shadowSource.width, shadowSource.height))
shadowHorizontalOffset: shadowSource.shadowOffsetX
shadowVerticalOffset: shadowSource.shadowOffsetY
blurMax: Theme.elevationBlurMax
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
}
level: root.shadowLevel
direction: root.effectiveShadowDirection
fallbackOffset: root.shadowFallbackOffset
targetRadius: Theme.cornerRadius
targetColor: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1" && !(root.suspendShadowWhileResizing && root._resizeActive)
}
Item {