mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-04-03 20:32:07 -04:00
Finalize m3 shadow & elevation
This commit is contained in:
54
quickshell/Common/ElevationShadow.qml
Normal file
54
quickshell/Common/ElevationShadow.qml
Normal 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
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -838,6 +838,18 @@ Singleton {
|
|||||||
return elevationOffsetYFor(level, elevationLightDirection, fallback);
|
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) {
|
function elevationShadowColor(level) {
|
||||||
const alpha = (level && level.alpha !== undefined) ? level.alpha : 0.3;
|
const alpha = (level && level.alpha !== undefined) ? level.alpha : 0.3;
|
||||||
let r = 0;
|
let r = 0;
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import Quickshell.Wayland
|
import Quickshell.Wayland
|
||||||
import qs.Common
|
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 alignedWidth: Theme.px(modalWidth, dpr)
|
||||||
readonly property real alignedHeight: Theme.px(modalHeight, dpr)
|
readonly property real alignedHeight: Theme.px(modalHeight, dpr)
|
||||||
|
|
||||||
@@ -378,34 +381,16 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
readonly property var elev: Theme.elevationLevel3
|
ElevationShadow {
|
||||||
readonly property real shadowBlurNorm: Math.max(0, Math.min(1, (elev && elev.blurPx !== undefined ? elev.blurPx : 12) / Theme.elevationBlurMax))
|
|
||||||
|
|
||||||
Item {
|
|
||||||
id: modalShadowLayer
|
id: modalShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
layer.enabled: root.enableShadow && Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
level: root.shadowLevel
|
||||||
|
fallbackOffset: root.shadowFallbackOffset
|
||||||
layer.effect: MultiEffect {
|
targetRadius: root.cornerRadius
|
||||||
autoPaddingEnabled: true
|
targetColor: root.backgroundColor
|
||||||
shadowEnabled: true
|
borderColor: root.borderColor
|
||||||
blurEnabled: false
|
borderWidth: root.borderWidth
|
||||||
maskEnabled: false
|
shadowEnabled: root.enableShadow && Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
FocusScope {
|
FocusScope {
|
||||||
|
|||||||
@@ -391,30 +391,16 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: launcherShadowLayer
|
id: launcherShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
layer.enabled: Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
level: Theme.elevationLevel3
|
||||||
layer.effect: MultiEffect {
|
fallbackOffset: 6
|
||||||
autoPaddingEnabled: true
|
targetColor: root.backgroundColor
|
||||||
shadowEnabled: true
|
borderColor: root.borderColor
|
||||||
blurEnabled: false
|
borderWidth: root.borderWidth
|
||||||
maskEnabled: false
|
targetRadius: root.cornerRadius
|
||||||
shadowBlur: Math.max(0, Math.min(1, Theme.elevationLevel3.blurPx / Theme.elevationBlurMax))
|
shadowEnabled: Theme.elevationEnabled && SettingsData.modalElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
|
|||||||
@@ -12,7 +12,7 @@ DankPopout {
|
|||||||
id: root
|
id: root
|
||||||
|
|
||||||
layerNamespace: "dms:control-center"
|
layerNamespace: "dms:control-center"
|
||||||
fullHeightSurface: true
|
fullHeightSurface: false
|
||||||
|
|
||||||
property string expandedSection: ""
|
property string expandedSection: ""
|
||||||
property var triggerScreen: null
|
property var triggerScreen: null
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import QtQuick.Shapes
|
import QtQuick.Shapes
|
||||||
import qs.Common
|
import qs.Common
|
||||||
import qs.Services
|
import qs.Services
|
||||||
@@ -105,7 +104,6 @@ Item {
|
|||||||
|
|
||||||
// Resolved values — per-bar override wins if set, otherwise use global M3 elevation
|
// 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 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 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 shadowOffsetMagnitude: hasPerBarOverride ? (overrideBlurPx * 0.5) : Theme.elevationOffsetMagnitude(elevLevel, 4, effectiveShadowDirection)
|
||||||
readonly property real shadowOffsetX: Theme.elevationOffsetXFor(hasPerBarOverride ? null : elevLevel, effectiveShadowDirection, shadowOffsetMagnitude)
|
readonly property real shadowOffsetX: Theme.elevationOffsetXFor(hasPerBarOverride ? null : elevLevel, effectiveShadowDirection, shadowOffsetMagnitude)
|
||||||
@@ -153,43 +151,28 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Loader {
|
ElevationShadow {
|
||||||
id: shadowLoader
|
id: barShadow
|
||||||
anchors.fill: parent
|
visible: root.shadowEnabled && root.width > 0 && root.height > 0
|
||||||
active: root.shadowEnabled && mainPathCorrectShape && (Theme.elevationEnabled || root.hasPerBarOverride)
|
|
||||||
asynchronous: false
|
|
||||||
sourceComponent: Item {
|
|
||||||
anchors.fill: parent
|
|
||||||
|
|
||||||
layer.enabled: true
|
// Size to the bar's rectangular body, excluding gothic wing extensions
|
||||||
layer.smooth: true
|
x: root.isRight ? root.wing : 0
|
||||||
layer.samples: barWindow._dpr > 1.5 ? 4 : 2
|
y: root.isBottom ? root.wing : 0
|
||||||
layer.textureSize: Qt.size(Math.round(width * barWindow._dpr), Math.round(height * barWindow._dpr))
|
width: axis.isVertical ? (parent.width - root.wing) : parent.width
|
||||||
layer.effect: MultiEffect {
|
height: axis.isVertical ? parent.height : (parent.height - root.wing)
|
||||||
shadowEnabled: true
|
|
||||||
shadowBlur: root.shadowBlur
|
|
||||||
blurMax: Theme.elevationBlurMax
|
|
||||||
shadowColor: root.shadowColor
|
|
||||||
shadowVerticalOffset: root.shadowOffsetY
|
|
||||||
shadowHorizontalOffset: root.shadowOffsetX
|
|
||||||
autoPaddingEnabled: true
|
|
||||||
}
|
|
||||||
|
|
||||||
Shape {
|
shadowEnabled: root.shadowEnabled
|
||||||
anchors.fill: parent
|
level: root.hasPerBarOverride ? null : root.elevLevel
|
||||||
preferredRendererType: Shape.CurveRenderer
|
direction: root.effectiveShadowDirection
|
||||||
|
fallbackOffset: 4
|
||||||
|
targetRadius: root.rt
|
||||||
|
targetColor: barWindow._bgColor
|
||||||
|
|
||||||
ShapePath {
|
shadowBlurPx: root.shadowBlurPx
|
||||||
fillColor: barWindow._bgColor
|
shadowOffsetX: root.shadowOffsetX
|
||||||
strokeColor: "transparent"
|
shadowOffsetY: root.shadowOffsetY
|
||||||
strokeWidth: 0
|
shadowColor: root.shadowColor
|
||||||
|
blurMax: Theme.elevationBlurMax
|
||||||
PathSvg {
|
|
||||||
path: root.mainPath
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Loader {
|
Loader {
|
||||||
|
|||||||
@@ -140,6 +140,20 @@ PanelWindow {
|
|||||||
}
|
}
|
||||||
readonly property real _dpr: CompositorService.getScreenScale(barWindow.screen)
|
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 string screenName: modelData.name
|
||||||
|
|
||||||
property bool hasMaximizedToplevel: false
|
property bool hasMaximizedToplevel: false
|
||||||
@@ -354,8 +368,8 @@ PanelWindow {
|
|||||||
}
|
}
|
||||||
|
|
||||||
screen: modelData
|
screen: modelData
|
||||||
implicitHeight: !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) : 0
|
implicitWidth: isVertical ? Theme.px(effectiveBarThickness + effectiveSpacing + ((barConfig?.gothCornersEnabled ?? false) && !hasMaximizedToplevel ? _wingR : 0), _dpr) + _shadowBuffer : 0
|
||||||
color: "transparent"
|
color: "transparent"
|
||||||
|
|
||||||
property var nativeInhibitor: null
|
property var nativeInhibitor: null
|
||||||
|
|||||||
@@ -964,39 +964,26 @@ BasePill {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: bgShadowLayer
|
id: bgShadowLayer
|
||||||
anchors.fill: parent
|
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.smooth: true
|
||||||
layer.textureSize: Qt.size(Math.round(width * overflowMenu.dpr * 2), Math.round(height * overflowMenu.dpr * 2))
|
layer.textureSize: Qt.size(Math.round(width * overflowMenu.dpr * 2), Math.round(height * overflowMenu.dpr * 2))
|
||||||
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
||||||
layer.samples: 4
|
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 {
|
Grid {
|
||||||
@@ -1439,37 +1426,24 @@ BasePill {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: menuBgShadowLayer
|
id: menuBgShadowLayer
|
||||||
anchors.fill: parent
|
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.smooth: true
|
||||||
layer.textureSize: Qt.size(Math.round(width * menuWindow.dpr), Math.round(height * menuWindow.dpr))
|
layer.textureSize: Qt.size(Math.round(width * menuWindow.dpr), Math.round(height * menuWindow.dpr))
|
||||||
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
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 {
|
QsMenuAnchor {
|
||||||
|
|||||||
@@ -89,30 +89,18 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: volumeShadowLayer
|
id: volumeShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel2
|
||||||
layer.enabled: Theme.elevationEnabled
|
fallbackOffset: 4
|
||||||
layer.effect: MultiEffect {
|
targetRadius: volumePanel.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: volumePanel.color
|
||||||
shadowEnabled: Theme.elevationEnabled
|
borderColor: volumePanel.border.color
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
|
borderWidth: volumePanel.border.width
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
|
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
shadowEnabled: Theme.elevationEnabled
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
@@ -239,30 +227,18 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: audioDevicesShadowLayer
|
id: audioDevicesShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel2
|
||||||
layer.enabled: Theme.elevationEnabled
|
fallbackOffset: 4
|
||||||
layer.effect: MultiEffect {
|
targetRadius: audioDevicesPanel.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: audioDevicesPanel.color
|
||||||
shadowEnabled: Theme.elevationEnabled
|
borderColor: audioDevicesPanel.border.color
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
|
borderWidth: audioDevicesPanel.border.width
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
|
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
shadowEnabled: Theme.elevationEnabled
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Column {
|
Column {
|
||||||
@@ -405,30 +381,18 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: playersShadowLayer
|
id: playersShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel2
|
||||||
layer.enabled: Theme.elevationEnabled
|
fallbackOffset: 4
|
||||||
layer.effect: MultiEffect {
|
targetRadius: playersPanel.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: playersPanel.color
|
||||||
shadowEnabled: Theme.elevationEnabled
|
borderColor: playersPanel.border.color
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
|
borderWidth: playersPanel.border.width
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
|
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
shadowEnabled: Theme.elevationEnabled
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Column {
|
Column {
|
||||||
|
|||||||
@@ -529,15 +529,15 @@ Item {
|
|||||||
onClicked: activePlayer && activePlayer.togglePlaying()
|
onClicked: activePlayer && activePlayer.togglePlaying()
|
||||||
}
|
}
|
||||||
|
|
||||||
layer.enabled: Theme.elevationEnabled
|
ElevationShadow {
|
||||||
layer.effect: MultiEffect {
|
anchors.fill: parent
|
||||||
shadowEnabled: Theme.elevationEnabled
|
z: -1
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel1)
|
level: Theme.elevationLevel1
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel1, 1)
|
fallbackOffset: 1
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel1 && Theme.elevationLevel1.blurPx !== undefined ? Theme.elevationLevel1.blurPx : 4) / Theme.elevationBlurMax)) : 0
|
targetRadius: parent.radius
|
||||||
blurMax: Theme.elevationBlurMax
|
targetColor: parent.color
|
||||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel1)
|
|
||||||
shadowOpacity: Theme.elevationLevel1 && Theme.elevationLevel1.alpha !== undefined ? Theme.elevationLevel1.alpha : 0.2
|
shadowOpacity: Theme.elevationLevel1 && Theme.elevationLevel1.alpha !== undefined ? Theme.elevationLevel1.alpha : 0.2
|
||||||
|
shadowEnabled: Theme.elevationEnabled
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -34,32 +34,17 @@ Rectangle {
|
|||||||
clip: false
|
clip: false
|
||||||
readonly property bool shadowsAllowed: Theme.elevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
readonly property bool shadowsAllowed: Theme.elevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: shadowLayer
|
id: shadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel1
|
||||||
layer.enabled: root.shadowsAllowed
|
fallbackOffset: 1
|
||||||
layer.effect: MultiEffect {
|
targetRadius: root.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: root.color
|
||||||
shadowEnabled: root.shadowsAllowed
|
borderColor: root.border.color
|
||||||
blurEnabled: false
|
borderWidth: root.border.width
|
||||||
maskEnabled: false
|
shadowEnabled: root.shadowsAllowed
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
color: {
|
color: {
|
||||||
|
|||||||
@@ -132,32 +132,21 @@ Rectangle {
|
|||||||
id: cardHoverHandler
|
id: cardHoverHandler
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: shadowLayer
|
id: shadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: root.shadowElevation
|
||||||
layer.enabled: root.shadowsAllowed
|
targetRadius: root.radius
|
||||||
layer.effect: MultiEffect {
|
targetColor: root.color
|
||||||
autoPaddingEnabled: true
|
borderColor: root.border.color
|
||||||
shadowEnabled: root.shadowsAllowed
|
borderWidth: root.border.width
|
||||||
blurEnabled: false
|
shadowBlurPx: root.shadowBlurPx
|
||||||
maskEnabled: false
|
shadowSpreadPx: 0
|
||||||
shadowBlur: Math.max(0, Math.min(1, root.shadowBlurPx / Theme.elevationBlurMax))
|
shadowOffsetX: root.shadowOffsetXPx
|
||||||
shadowScale: 1
|
shadowOffsetY: root.shadowOffsetYPx
|
||||||
shadowVerticalOffset: root.shadowOffsetYPx
|
shadowColor: root.shadowElevation ? Theme.elevationShadowColor(root.shadowElevation) : "transparent"
|
||||||
shadowHorizontalOffset: root.shadowOffsetXPx
|
shadowEnabled: root.shadowsAllowed
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ DankPopout {
|
|||||||
id: root
|
id: root
|
||||||
|
|
||||||
layerNamespace: "dms:notification-center-popout"
|
layerNamespace: "dms:notification-center-popout"
|
||||||
fullHeightSurface: true
|
fullHeightSurface: false
|
||||||
|
|
||||||
property bool notificationHistoryVisible: false
|
property bool notificationHistoryVisible: false
|
||||||
property var triggerScreen: null
|
property var triggerScreen: null
|
||||||
|
|||||||
@@ -381,48 +381,36 @@ PanelWindow {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: bgShadowLayer
|
id: bgShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
anchors.margins: -content.shadowRenderPadding
|
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.textureSize: Qt.size(Math.round(width * win.dpr), Math.round(height * win.dpr))
|
||||||
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
||||||
|
|
||||||
readonly property int blurMax: Theme.elevationBlurMax
|
sourceRect.anchors.fill: undefined
|
||||||
|
sourceRect.x: content.shadowRenderPadding + content.cardInset
|
||||||
layer.effect: MultiEffect {
|
sourceRect.y: content.shadowRenderPadding + content.cardInset
|
||||||
id: shadowFx
|
sourceRect.width: Math.max(0, content.width - (content.cardInset * 2))
|
||||||
autoPaddingEnabled: true
|
sourceRect.height: Math.max(0, content.height - (content.cardInset * 2))
|
||||||
shadowEnabled: content.shadowsAllowed
|
sourceRect.radius: Theme.cornerRadius
|
||||||
blurEnabled: false
|
sourceRect.color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
|
||||||
maskEnabled: false
|
sourceRect.border.color: notificationData && notificationData.urgency === NotificationUrgency.Critical ? Theme.withAlpha(Theme.primary, 0.3) : Theme.withAlpha(Theme.outline, 0.08)
|
||||||
shadowBlur: Math.max(0, Math.min(1, content.shadowBlurPx / bgShadowLayer.blurMax))
|
sourceRect.border.width: notificationData && notificationData.urgency === NotificationUrgency.Critical ? 2 : 0
|
||||||
shadowScale: 1
|
|
||||||
shadowHorizontalOffset: content.shadowOffsetX
|
|
||||||
shadowVerticalOffset: content.shadowOffsetY
|
|
||||||
blurMax: Theme.elevationBlurMax
|
|
||||||
shadowColor: content.shadowsAllowed && content.elevLevel ? Theme.elevationShadowColor(content.elevLevel) : "transparent"
|
|
||||||
}
|
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: shadowShapeSource
|
x: bgShadowLayer.sourceRect.x
|
||||||
x: content.shadowRenderPadding + content.cardInset
|
y: bgShadowLayer.sourceRect.y
|
||||||
y: content.shadowRenderPadding + content.cardInset
|
width: bgShadowLayer.sourceRect.width
|
||||||
width: Math.max(0, content.width - (content.cardInset * 2))
|
height: bgShadowLayer.sourceRect.height
|
||||||
height: Math.max(0, content.height - (content.cardInset * 2))
|
radius: bgShadowLayer.sourceRect.radius
|
||||||
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
|
|
||||||
visible: notificationData && notificationData.urgency === NotificationUrgency.Critical
|
visible: notificationData && notificationData.urgency === NotificationUrgency.Critical
|
||||||
opacity: 1
|
opacity: 1
|
||||||
clip: true
|
clip: true
|
||||||
|
|||||||
@@ -878,15 +878,17 @@ Item {
|
|||||||
x: hoveredButton ? hoveredButton.mapToItem(aboutTab, hoveredButton.width / 2, 0).x - width / 2 : 0
|
x: hoveredButton ? hoveredButton.mapToItem(aboutTab, hoveredButton.width / 2, 0).x - width / 2 : 0
|
||||||
y: hoveredButton ? communityIcons.mapToItem(aboutTab, 0, 0).y - height - 8 : 0
|
y: hoveredButton ? communityIcons.mapToItem(aboutTab, 0, 0).y - height - 8 : 0
|
||||||
|
|
||||||
layer.enabled: Theme.elevationEnabled
|
ElevationShadow {
|
||||||
layer.effect: MultiEffect {
|
anchors.fill: parent
|
||||||
shadowEnabled: Theme.elevationEnabled
|
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
|
shadowOpacity: Theme.elevationLevel1 && Theme.elevationLevel1.alpha !== undefined ? Theme.elevationLevel1.alpha : 0.2
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel1)
|
shadowEnabled: Theme.elevationEnabled
|
||||||
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)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
StyledText {
|
StyledText {
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import Quickshell.Wayland
|
import Quickshell.Wayland
|
||||||
import qs.Common
|
import qs.Common
|
||||||
@@ -96,7 +95,6 @@ PanelWindow {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
radius: Theme.cornerRadius
|
radius: Theme.cornerRadius
|
||||||
layer.enabled: Theme.elevationEnabled
|
|
||||||
opacity: shouldBeVisible ? 1 : 0
|
opacity: shouldBeVisible ? 1 : 0
|
||||||
|
|
||||||
Column {
|
Column {
|
||||||
@@ -406,15 +404,15 @@ PanelWindow {
|
|||||||
onClicked: ToastService.hideToast()
|
onClicked: ToastService.hideToast()
|
||||||
}
|
}
|
||||||
|
|
||||||
layer.effect: MultiEffect {
|
ElevationShadow {
|
||||||
autoPaddingEnabled: true
|
anchors.fill: parent
|
||||||
shadowEnabled: Theme.elevationEnabled
|
z: -1
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel3)
|
level: Theme.elevationLevel3
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel3, 6)
|
fallbackOffset: 6
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel3 && Theme.elevationLevel3.blurPx !== undefined ? Theme.elevationLevel3.blurPx : 12) / Theme.elevationBlurMax)) : 0
|
targetRadius: toast.radius
|
||||||
blurMax: Theme.elevationBlurMax
|
targetColor: toast.color
|
||||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
|
|
||||||
shadowOpacity: Theme.elevationLevel3 && Theme.elevationLevel3.alpha !== undefined ? Theme.elevationLevel3.alpha : 0.3
|
shadowOpacity: Theme.elevationLevel3 && Theme.elevationLevel3.alpha !== undefined ? Theme.elevationLevel3.alpha : 0.3
|
||||||
|
shadowEnabled: Theme.elevationEnabled
|
||||||
}
|
}
|
||||||
|
|
||||||
Behavior on opacity {
|
Behavior on opacity {
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import Quickshell.Hyprland
|
import Quickshell.Hyprland
|
||||||
@@ -153,15 +152,15 @@ Item {
|
|||||||
radius: Theme.cornerRadius
|
radius: Theme.cornerRadius
|
||||||
color: Theme.surfaceContainer
|
color: Theme.surfaceContainer
|
||||||
|
|
||||||
layer.enabled: Theme.elevationEnabled
|
ElevationShadow {
|
||||||
layer.effect: MultiEffect {
|
anchors.fill: parent
|
||||||
shadowEnabled: Theme.elevationEnabled
|
z: -1
|
||||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
level: Theme.elevationLevel2
|
||||||
shadowHorizontalOffset: Theme.elevationOffsetX(Theme.elevationLevel2)
|
fallbackOffset: 4
|
||||||
shadowVerticalOffset: Theme.elevationOffsetY(Theme.elevationLevel2, 4)
|
targetRadius: Theme.cornerRadius
|
||||||
blurMax: Theme.elevationBlurMax
|
targetColor: Theme.surfaceContainer
|
||||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
|
|
||||||
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||||
|
shadowEnabled: Theme.elevationEnabled
|
||||||
}
|
}
|
||||||
|
|
||||||
ColumnLayout {
|
ColumnLayout {
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import "../Common/fzf.js" as Fzf
|
import "../Common/fzf.js" as Fzf
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import qs.Common
|
import qs.Common
|
||||||
import qs.Widgets
|
import qs.Widgets
|
||||||
@@ -263,31 +262,17 @@ Item {
|
|||||||
border.width: 2
|
border.width: 2
|
||||||
radius: Theme.cornerRadius
|
radius: Theme.cornerRadius
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: shadowLayer
|
id: shadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel2
|
||||||
layer.enabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled
|
fallbackOffset: 4
|
||||||
layer.effect: MultiEffect {
|
targetRadius: contentSurface.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: contentSurface.color
|
||||||
blurEnabled: false
|
borderColor: contentSurface.border.color
|
||||||
maskEnabled: false
|
borderWidth: contentSurface.border.width
|
||||||
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled
|
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Column {
|
Column {
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
import QtQuick.Effects
|
|
||||||
import qs.Common
|
import qs.Common
|
||||||
import qs.Widgets
|
import qs.Widgets
|
||||||
|
|
||||||
@@ -136,28 +135,16 @@ Rectangle {
|
|||||||
color: Theme.surface
|
color: Theme.surface
|
||||||
radius: Theme.cornerRadius
|
radius: Theme.cornerRadius
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: shadowLayer
|
id: shadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
z: -1
|
z: -1
|
||||||
|
level: Theme.elevationLevel2
|
||||||
layer.enabled: Theme.elevationEnabled
|
fallbackOffset: 4
|
||||||
layer.effect: MultiEffect {
|
targetRadius: contentSurface.radius
|
||||||
autoPaddingEnabled: true
|
targetColor: contentSurface.color
|
||||||
shadowEnabled: Theme.elevationEnabled
|
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||||
blurMax: Theme.elevationBlurMax
|
shadowEnabled: Theme.elevationEnabled
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import Quickshell.Wayland
|
import Quickshell.Wayland
|
||||||
import qs.Common
|
import qs.Common
|
||||||
@@ -257,12 +256,7 @@ PanelWindow {
|
|||||||
scale: shouldBeVisible ? 1 : 0.9
|
scale: shouldBeVisible ? 1 : 0.9
|
||||||
|
|
||||||
property bool childHovered: false
|
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 popupSurfaceAlpha: SettingsData.popupTransparency
|
||||||
readonly property real effectiveShadowAlpha: shouldBeVisible ? Math.max(0, Math.min(1, shadowBaseAlpha * popupSurfaceAlpha)) : 0
|
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: background
|
id: background
|
||||||
@@ -274,37 +268,20 @@ PanelWindow {
|
|||||||
z: -1
|
z: -1
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
ElevationShadow {
|
||||||
id: bgShadowLayer
|
id: bgShadowLayer
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
visible: osdContainer.popupSurfaceAlpha >= 0.95
|
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.textureSize: Qt.size(Math.round(width * root.dpr), Math.round(height * root.dpr))
|
||||||
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
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 {
|
MouseArea {
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Effects
|
|
||||||
import Quickshell
|
import Quickshell
|
||||||
import Quickshell.Wayland
|
import Quickshell.Wayland
|
||||||
import qs.Common
|
import qs.Common
|
||||||
@@ -239,7 +238,11 @@ Item {
|
|||||||
readonly property real screenHeight: screen ? screen.height : 0
|
readonly property real screenHeight: screen ? screen.height : 0
|
||||||
readonly property real dpr: screen ? screen.devicePixelRatio : 1
|
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 alignedWidth: Theme.px(popupWidth, dpr)
|
||||||
readonly property real alignedHeight: Theme.px(popupHeight, dpr)
|
readonly property real alignedHeight: Theme.px(popupHeight, dpr)
|
||||||
|
|
||||||
@@ -523,43 +526,20 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
ElevationShadow {
|
||||||
id: shadowSource
|
id: shadowSource
|
||||||
anchors.centerIn: parent
|
|
||||||
width: parent.width
|
width: parent.width
|
||||||
height: parent.height
|
height: parent.height
|
||||||
radius: Theme.cornerRadius
|
|
||||||
color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
|
|
||||||
opacity: contentWrapper.opacity
|
opacity: contentWrapper.opacity
|
||||||
scale: contentWrapper.scale
|
scale: contentWrapper.scale
|
||||||
x: contentWrapper.x
|
x: contentWrapper.x
|
||||||
y: contentWrapper.y
|
y: contentWrapper.y
|
||||||
|
level: root.shadowLevel
|
||||||
readonly property var elev: Theme.elevationLevel3
|
direction: root.effectiveShadowDirection
|
||||||
property real shadowBlurPx: elev && elev.blurPx !== undefined ? elev.blurPx : 12
|
fallbackOffset: root.shadowFallbackOffset
|
||||||
property real shadowSpreadPx: elev && elev.spreadPx !== undefined ? elev.spreadPx : 0
|
targetRadius: Theme.cornerRadius
|
||||||
property real shadowBaseAlpha: elev && elev.alpha !== undefined ? elev.alpha : 0.3
|
targetColor: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
|
||||||
property real shadowOffsetX: Theme.elevationOffsetXFor(Theme.elevationLevel3, root.effectiveShadowDirection, 6)
|
shadowEnabled: Theme.elevationEnabled && SettingsData.popoutElevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1" && !(root.suspendShadowWhileResizing && root._resizeActive)
|
||||||
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)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
|||||||
Reference in New Issue
Block a user