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

widgets: add a button color setting

Browse Source
This commit is contained in:
bbedward
2026-02-03 11:03:33 -05:00
parent 22ab5b9660
commit 3c4749ead0
7 changed files with 105 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
quickshell/Common/SettingsData.qml
View File

@@ -134,6 +134,7 @@ Singleton {
property string widgetBackgroundColor: "sch"
property string widgetColorMode: "default"
property string controlCenterTileColorMode: "primary"
property string buttonColorMode: "primary"
property real cornerRadius: 12
property int niriLayoutGapsOverride: -1
property int niriLayoutRadiusOverride: -1

52
quickshell/Common/Theme.qml
View File

@@ -606,6 +606,58 @@ Singleton {
}
}
readonly property color buttonBg: {
switch (SettingsData.buttonColorMode) {
case "primaryContainer":
return primaryContainer;
case "secondary":
return secondary;
case "surfaceVariant":
return surfaceVariant;
default:
return primary;
}
}
readonly property color buttonText: {
switch (SettingsData.buttonColorMode) {
case "primaryContainer":
return primary;
case "secondary":
return surfaceText;
case "surfaceVariant":
return surfaceText;
default:
return primaryText;
}
}
readonly property color buttonHover: {
switch (SettingsData.buttonColorMode) {
case "primaryContainer":
return Qt.rgba(primary.r, primary.g, primary.b, 0.12);
case "secondary":
return Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.12);
case "surfaceVariant":
return Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.12);
default:
return primaryHover;
}
}
readonly property color buttonPressed: {
switch (SettingsData.buttonColorMode) {
case "primaryContainer":
return Qt.rgba(primary.r, primary.g, primary.b, 0.16);
case "secondary":
return Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.16);
case "surfaceVariant":
return Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.16);
default:
return primaryPressed;
}
}
property color shadowMedium: Qt.rgba(0, 0, 0, 0.08)
property color shadowStrong: Qt.rgba(0, 0, 0, 0.3)

1
quickshell/Common/settings/SettingsSpec.js
View File

@@ -20,6 +20,7 @@ var SPEC = {
widgetBackgroundColor: { def: "sch" },
widgetColorMode: { def: "default" },
controlCenterTileColorMode: { def: "primary" },
buttonColorMode: { def: "primary" },
cornerRadius: { def: 12, onChange: "updateCompositorLayout" },
niriLayoutGapsOverride: { def: -1, onChange: "updateCompositorLayout" },
niriLayoutRadiusOverride: { def: -1, onChange: "updateCompositorLayout" },

24
quickshell/Modals/Settings/SettingsSidebar.qml
View File

@@ -689,7 +689,7 @@ Rectangle {
radius: Theme.cornerRadius
color: {
if (root.searchSelectedIndex === index)
return Theme.primary;
return Theme.buttonBg;
if (resultMouseArea.containsMouse)
return Theme.surfaceHover;
return "transparent";
@@ -707,7 +707,7 @@ Rectangle {
DankIcon {
name: resultDelegate.modelData.icon || "settings"
size: Theme.iconSize - 2
color: root.searchSelectedIndex === resultDelegate.index ? Theme.primaryText : Theme.surfaceText
color: root.searchSelectedIndex === resultDelegate.index ? Theme.buttonText : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -720,7 +720,7 @@ Rectangle {
text: resultDelegate.modelData.label
font.pixelSize: Theme.fontSizeMedium
font.weight: Font.Medium
color: root.searchSelectedIndex === resultDelegate.index ? Theme.primaryText : Theme.surfaceText
color: root.searchSelectedIndex === resultDelegate.index ? Theme.buttonText : Theme.surfaceText
width: parent.width
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignLeft
@@ -729,7 +729,7 @@ Rectangle {
StyledText {
text: resultDelegate.modelData.category
font.pixelSize: Theme.fontSizeSmall - 1
color: root.searchSelectedIndex === resultDelegate.index ? Theme.withAlpha(Theme.primaryText, 0.7) : Theme.surfaceVariantText
color: root.searchSelectedIndex === resultDelegate.index ? Theme.withAlpha(Theme.buttonText, 0.7) : Theme.surfaceVariantText
width: parent.width
wrapMode: Text.Wrap
horizontalAlignment: Text.AlignLeft
@@ -810,9 +810,9 @@ Rectangle {
color: {
if (isActive)
return Theme.primary;
return Theme.buttonBg;
if (isHighlighted)
return Theme.primaryHover;
return Theme.buttonHover;
if (categoryMouseArea.containsMouse)
return Theme.surfaceHover;
return "transparent";
@@ -828,7 +828,7 @@ Rectangle {
DankIcon {
name: categoryDelegate.modelData.icon || ""
size: Theme.iconSize - 2
color: categoryRow.isActive ? Theme.primaryText : Theme.surfaceText
color: categoryRow.isActive ? Theme.buttonText : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -836,7 +836,7 @@ Rectangle {
text: categoryDelegate.modelData.text || ""
font.pixelSize: Theme.fontSizeMedium
font.weight: (categoryRow.isActive || root.isChildActive(categoryDelegate.modelData)) ? Font.Medium : Font.Normal
color: categoryRow.isActive ? Theme.primaryText : Theme.surfaceText
color: categoryRow.isActive ? Theme.buttonText : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}
@@ -900,9 +900,9 @@ Rectangle {
visible: root.isItemVisible(modelData)
color: {
if (isActive)
return Theme.primary;
return Theme.buttonBg;
if (isHighlighted)
return Theme.primaryHover;
return Theme.buttonHover;
if (childMouseArea.containsMouse)
return Theme.surfaceHover;
return "transparent";
@@ -918,7 +918,7 @@ Rectangle {
DankIcon {
name: childDelegate.modelData.icon || ""
size: Theme.iconSize - 4
color: childDelegate.isActive ? Theme.primaryText : Theme.surfaceVariantText
color: childDelegate.isActive ? Theme.buttonText : Theme.surfaceVariantText
anchors.verticalCenter: parent.verticalCenter
}
@@ -926,7 +926,7 @@ Rectangle {
text: childDelegate.modelData.text || ""
font.pixelSize: Theme.fontSizeSmall + 1
font.weight: childDelegate.isActive ? Font.Medium : Font.Normal
color: childDelegate.isActive ? Theme.primaryText : Theme.surfaceText
color: childDelegate.isActive ? Theme.buttonText : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
}

32
quickshell/Modules/Settings/ThemeColorsTab.qml
View File

@@ -1516,6 +1516,38 @@ Item {
}
}
SettingsDropdownRow {
tab: "theme"
tags: ["button", "color", "primary", "accent"]
settingKey: "buttonColorMode"
text: I18n.tr("Button Color")
description: I18n.tr("Color for primary action buttons")
options: [I18n.tr("Primary", "button color option"), I18n.tr("Primary Container", "button color option"), I18n.tr("Secondary", "button color option"), I18n.tr("Surface Variant", "button color option")]
currentValue: {
switch (SettingsData.buttonColorMode) {
case "primaryContainer":
return I18n.tr("Primary Container", "button color option");
case "secondary":
return I18n.tr("Secondary", "button color option");
case "surfaceVariant":
return I18n.tr("Surface Variant", "button color option");
default:
return I18n.tr("Primary", "button color option");
}
}
onValueChanged: value => {
if (value === I18n.tr("Primary Container", "button color option")) {
SettingsData.set("buttonColorMode", "primaryContainer");
} else if (value === I18n.tr("Secondary", "button color option")) {
SettingsData.set("buttonColorMode", "secondary");
} else if (value === I18n.tr("Surface Variant", "button color option")) {
SettingsData.set("buttonColorMode", "surfaceVariant");
} else {
SettingsData.set("buttonColorMode", "primary");
}
}
}
SettingsSliderRow {
tab: "theme"
tags: ["popup", "transparency", "opacity", "modal"]

4
quickshell/Widgets/DankButton.qml
View File

@@ -11,8 +11,8 @@ Rectangle {
property bool enabled: true
property bool hovered: mouseArea.containsMouse
property bool pressed: mouseArea.pressed
property color backgroundColor: Theme.primary
property color textColor: Theme.primaryText
property color backgroundColor: Theme.buttonBg
property color textColor: Theme.buttonText
property int buttonHeight: 40
property int horizontalPadding: Theme.spacingL

10
quickshell/Widgets/DankButtonGroup.qml
View File

@@ -89,7 +89,7 @@ Flow {
width: Math.max(contentItem.implicitWidth + root.buttonPadding * 2, root.minButtonWidth) + (selected ? 4 : 0)
height: root.buttonHeight
color: selected ? Theme.primary : Theme.surfaceVariant
color: selected ? Theme.buttonBg : Theme.surfaceVariant
border.color: "transparent"
border.width: 0
@@ -155,9 +155,9 @@ Flow {
bottomRightRadius: parent.bottomRightRadius
color: {
if (pressed)
return selected ? Theme.primaryPressed : Theme.surfaceTextHover;
return selected ? Theme.buttonPressed : Theme.surfaceTextHover;
if (hovered)
return selected ? Theme.primaryHover : Theme.surfaceTextHover;
return selected ? Theme.buttonHover : Theme.surfaceTextHover;
return "transparent";
}
@@ -183,7 +183,7 @@ Flow {
id: checkIcon
name: "check"
size: root.checkIconSize
color: segment.selected ? Theme.primaryText : Theme.surfaceVariantText
color: segment.selected ? Theme.buttonText : Theme.surfaceVariantText
visible: root.checkEnabled && segment.selected
opacity: segment.selected ? 1 : 0
scale: segment.selected ? 1 : 0.6
@@ -211,7 +211,7 @@ Flow {
text: typeof modelData === "string" ? modelData : modelData.text || ""
font.pixelSize: root.textSize
font.weight: segment.selected ? Font.Medium : Font.Normal
color: segment.selected ? Theme.primaryText : Theme.surfaceVariantText
color: segment.selected ? Theme.buttonText : Theme.surfaceVariantText
anchors.verticalCenter: parent.verticalCenter
}
}