mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-04-03 20:32:07 -04:00
Core m3 spec complete
This commit is contained in:
@@ -179,6 +179,8 @@ Singleton {
|
||||
onModalElevationEnabledChanged: saveSettings()
|
||||
property bool popoutElevationEnabled: true
|
||||
onPopoutElevationEnabledChanged: saveSettings()
|
||||
property bool barElevationEnabled: true
|
||||
onBarElevationEnabledChanged: saveSettings()
|
||||
property string wallpaperFillMode: "Fill"
|
||||
property bool blurredWallpaperLayer: false
|
||||
property bool blurWallpaperOnOverview: false
|
||||
|
||||
@@ -53,6 +53,7 @@ var SPEC = {
|
||||
m3ElevationCustomColor: { def: "#000000" },
|
||||
modalElevationEnabled: { def: true },
|
||||
popoutElevationEnabled: { def: true },
|
||||
barElevationEnabled: { def: true },
|
||||
wallpaperFillMode: { def: "Fill" },
|
||||
blurredWallpaperLayer: { def: false },
|
||||
blurWallpaperOnOverview: { def: false },
|
||||
|
||||
@@ -53,15 +53,19 @@ Item {
|
||||
}
|
||||
}
|
||||
|
||||
readonly property real shadowIntensity: barConfig?.shadowIntensity ?? 0
|
||||
readonly property bool shadowEnabled: shadowIntensity > 0
|
||||
readonly property int blurMax: 64
|
||||
readonly property real shadowBlurPx: shadowIntensity * 0.2
|
||||
readonly property real shadowBlur: Math.max(0, Math.min(1, shadowBlurPx / blurMax))
|
||||
readonly property real shadowOpacity: (barConfig?.shadowOpacity ?? 60) / 100
|
||||
readonly property string shadowColorMode: barConfig?.shadowColorMode ?? "default"
|
||||
readonly property color shadowBaseColor: {
|
||||
switch (shadowColorMode) {
|
||||
// M3 elevation shadow — Level 2 baseline (navigation bar), with per-bar override support
|
||||
readonly property bool hasPerBarOverride: (barConfig?.shadowIntensity ?? 0) > 0
|
||||
readonly property var elevLevel: Theme.elevationLevel2
|
||||
readonly property bool shadowEnabled: (Theme.elevationEnabled
|
||||
&& (typeof SettingsData !== "undefined" ? (SettingsData.barElevationEnabled ?? true) : false))
|
||||
|| hasPerBarOverride
|
||||
|
||||
// Per-bar override values (when barConfig.shadowIntensity > 0)
|
||||
readonly property real overrideBlurPx: (barConfig?.shadowIntensity ?? 0) * 0.2
|
||||
readonly property real overrideOpacity: (barConfig?.shadowOpacity ?? 60) / 100
|
||||
readonly property string overrideColorMode: barConfig?.shadowColorMode ?? "default"
|
||||
readonly property color overrideBaseColor: {
|
||||
switch (overrideColorMode) {
|
||||
case "surface":
|
||||
return Theme.surface;
|
||||
case "primary":
|
||||
@@ -74,7 +78,16 @@ Item {
|
||||
return "#000000";
|
||||
}
|
||||
}
|
||||
readonly property color shadowColor: Theme.withAlpha(shadowBaseColor, shadowOpacity * barWindow._backgroundAlpha)
|
||||
|
||||
// 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 shadowOffsetY: hasPerBarOverride
|
||||
? overrideBlurPx * 0.5
|
||||
: (elevLevel.offsetY ?? 4)
|
||||
|
||||
readonly property string mainPath: generatePathForPosition(width, height)
|
||||
readonly property string borderFullPath: generateBorderFullPath(width, height)
|
||||
@@ -133,9 +146,10 @@ Item {
|
||||
layer.effect: MultiEffect {
|
||||
shadowEnabled: true
|
||||
shadowBlur: root.shadowBlur
|
||||
blurMax: Theme.elevationBlurMax
|
||||
shadowColor: root.shadowColor
|
||||
shadowVerticalOffset: root.isTop ? root.shadowBlurPx * 0.5 : (root.isBottom ? -root.shadowBlurPx * 0.5 : 0)
|
||||
shadowHorizontalOffset: root.isLeft ? root.shadowBlurPx * 0.5 : (root.isRight ? -root.shadowBlurPx * 0.5 : 0)
|
||||
shadowVerticalOffset: root.isTop ? root.shadowOffsetY : (root.isBottom ? -root.shadowOffsetY : 0)
|
||||
shadowHorizontalOffset: root.isLeft ? root.shadowOffsetY : (root.isRight ? -root.shadowOffsetY : 0)
|
||||
autoPaddingEnabled: true
|
||||
}
|
||||
|
||||
|
||||
@@ -813,12 +813,12 @@ Item {
|
||||
x: (pos?.h ?? 0) * skyBox.effectiveWidth - (moonPhase.width / 2) + skyBox.hMargin
|
||||
y: (pos?.v ?? 0) * -(skyBox.effectiveHeight / 2) + skyBox.effectiveHeight / 2 - (moonPhase.height / 2) + skyBox.vMargin
|
||||
|
||||
layer.enabled: true
|
||||
layer.enabled: Theme.elevationEnabled
|
||||
layer.effect: MultiEffect {
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
shadowHorizontalOffset: 0
|
||||
shadowVerticalOffset: 4
|
||||
shadowBlur: 0.8
|
||||
shadowVerticalOffset: Theme.elevationLevel2 && Theme.elevationLevel2.offsetY !== undefined ? Theme.elevationLevel2.offsetY : 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)
|
||||
}
|
||||
@@ -835,12 +835,12 @@ Item {
|
||||
x: (pos?.h ?? 0) * skyBox.effectiveWidth - (sun.width / 2) + skyBox.hMargin
|
||||
y: (pos?.v ?? 0) * -(skyBox.effectiveHeight / 2) + skyBox.effectiveHeight / 2 - (sun.height / 2) + skyBox.vMargin
|
||||
|
||||
layer.enabled: true
|
||||
layer.enabled: Theme.elevationEnabled
|
||||
layer.effect: MultiEffect {
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
shadowHorizontalOffset: 0
|
||||
shadowVerticalOffset: 4
|
||||
shadowBlur: 0.8
|
||||
shadowVerticalOffset: Theme.elevationLevel2 && Theme.elevationLevel2.offsetY !== undefined ? Theme.elevationLevel2.offsetY : 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)
|
||||
}
|
||||
|
||||
@@ -1045,7 +1045,7 @@ Item {
|
||||
SettingsCard {
|
||||
id: shadowCard
|
||||
iconName: "layers"
|
||||
title: I18n.tr("Shadow", "bar shadow settings card")
|
||||
title: I18n.tr("Shadow Override", "bar shadow settings card")
|
||||
settingKey: "barShadow"
|
||||
collapsible: true
|
||||
expanded: true
|
||||
@@ -1054,9 +1054,18 @@ Item {
|
||||
readonly property bool shadowActive: (selectedBarConfig?.shadowIntensity ?? 0) > 0
|
||||
readonly property bool isCustomColor: (selectedBarConfig?.shadowColorMode ?? "default") === "custom"
|
||||
|
||||
StyledText {
|
||||
width: parent.width
|
||||
text: I18n.tr("Enable a custom override below to set per-bar shadow intensity, opacity, and color.")
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
color: Theme.surfaceVariantText
|
||||
wrapMode: Text.WordWrap
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
}
|
||||
|
||||
SettingsToggleRow {
|
||||
text: I18n.tr("Enable Shadow")
|
||||
description: I18n.tr("Toggle M3 baseline shadow on or off for this bar")
|
||||
text: I18n.tr("Custom Shadow Override")
|
||||
description: I18n.tr("Override the global shadow with per-bar settings")
|
||||
checked: shadowCard.shadowActive
|
||||
onToggled: checked => {
|
||||
if (checked) {
|
||||
|
||||
@@ -1607,7 +1607,7 @@ Item {
|
||||
tags: ["elevation", "shadow", "lift", "m3", "material"]
|
||||
settingKey: "m3ElevationEnabled"
|
||||
text: I18n.tr("Shadows")
|
||||
description: I18n.tr("Material Design 3 shadows and elevation on modals, popouts, and dialogs")
|
||||
description: I18n.tr("Material inspired shadows and elevation on modals, popouts, and dialogs")
|
||||
checked: SettingsData.m3ElevationEnabled ?? true
|
||||
onToggled: checked => SettingsData.set("m3ElevationEnabled", checked)
|
||||
}
|
||||
@@ -1736,6 +1736,17 @@ Item {
|
||||
visible: SettingsData.m3ElevationEnabled ?? true
|
||||
onToggled: checked => SettingsData.set("popoutElevationEnabled", checked)
|
||||
}
|
||||
|
||||
SettingsToggleRow {
|
||||
tab: "theme"
|
||||
tags: ["elevation", "shadow", "bar", "panel", "navigation", "m3"]
|
||||
settingKey: "barElevationEnabled"
|
||||
text: I18n.tr("Bar Shadows")
|
||||
description: I18n.tr("Shadow elevation on bars and panels")
|
||||
checked: SettingsData.barElevationEnabled ?? true
|
||||
visible: SettingsData.m3ElevationEnabled ?? true
|
||||
onToggled: checked => SettingsData.set("barElevationEnabled", checked)
|
||||
}
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
|
||||
@@ -96,7 +96,7 @@ PanelWindow {
|
||||
}
|
||||
}
|
||||
radius: Theme.cornerRadius
|
||||
layer.enabled: true
|
||||
layer.enabled: Theme.elevationEnabled
|
||||
opacity: shouldBeVisible ? 1 : 0
|
||||
|
||||
Column {
|
||||
@@ -407,6 +407,7 @@ PanelWindow {
|
||||
}
|
||||
|
||||
layer.effect: MultiEffect {
|
||||
autoPaddingEnabled: true
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
shadowHorizontalOffset: 0
|
||||
shadowVerticalOffset: Theme.elevationLevel3 && Theme.elevationLevel3.offsetY !== undefined ? Theme.elevationLevel3.offsetY : 6
|
||||
|
||||
@@ -261,8 +261,11 @@ Item {
|
||||
border.width: 2
|
||||
radius: Theme.cornerRadius
|
||||
|
||||
layer.enabled: true
|
||||
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
|
||||
|
||||
@@ -137,6 +137,7 @@ Rectangle {
|
||||
|
||||
layer.enabled: Theme.elevationEnabled
|
||||
layer.effect: MultiEffect {
|
||||
autoPaddingEnabled: true
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
blurMax: Theme.elevationBlurMax
|
||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
|
||||
|
||||
@@ -2417,6 +2417,57 @@
|
||||
],
|
||||
"description": "Material Design 3 shadows and elevation on modals, popouts, and dialogs"
|
||||
},
|
||||
{
|
||||
"section": "modalElevationEnabled",
|
||||
"label": "Modal Shadows",
|
||||
"tabIndex": 10,
|
||||
"category": "Theme & Colors",
|
||||
"keywords": [
|
||||
"dialog",
|
||||
"elevation",
|
||||
"m3",
|
||||
"material",
|
||||
"modal",
|
||||
"shadow",
|
||||
"shadows"
|
||||
],
|
||||
"description": "Shadow elevation on modals and dialogs"
|
||||
},
|
||||
{
|
||||
"section": "popoutElevationEnabled",
|
||||
"label": "Popout Shadows",
|
||||
"tabIndex": 10,
|
||||
"category": "Theme & Colors",
|
||||
"keywords": [
|
||||
"dropdown",
|
||||
"elevation",
|
||||
"m3",
|
||||
"material",
|
||||
"osd",
|
||||
"popout",
|
||||
"popup",
|
||||
"shadow",
|
||||
"shadows"
|
||||
],
|
||||
"description": "Shadow elevation on popouts, OSDs, and dropdowns"
|
||||
},
|
||||
{
|
||||
"section": "barElevationEnabled",
|
||||
"label": "Bar Shadows",
|
||||
"tabIndex": 10,
|
||||
"category": "Theme & Colors",
|
||||
"keywords": [
|
||||
"bar",
|
||||
"elevation",
|
||||
"m3",
|
||||
"material",
|
||||
"navigation",
|
||||
"panel",
|
||||
"shadow",
|
||||
"shadows"
|
||||
],
|
||||
"description": "Shadow elevation on bars and panels"
|
||||
},
|
||||
{
|
||||
"section": "cursorSize",
|
||||
"label": "Cursor Size",
|
||||
|
||||
Reference in New Issue
Block a user