Shinonome/dots-hyprland
1
0
Fork 1
mirror of https://github.com/end-4/dots-hyprland.git synced 2026-06-05 23:09:26 -05:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

settings: add material palette and transparency

Browse Source
This commit is contained in:
end-4
2025-06-19 19:32:31 +02:00
parent e8414c88ba
commit eaa56ff555
5 changed files with 103 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/modules/common/Appearance.qml
+1 -1
View File
@@ -130,7 +130,7 @@ Singleton {
property color colSecondary: m3colors.m3secondary
property color colSecondaryHover: ColorUtils.mix(m3colors.m3secondary, colLayer1Hover, 0.85)
property color colSecondaryActive: ColorUtils.mix(m3colors.m3secondary, colLayer1Active, 0.4)
property color colSecondaryContainer: ColorUtils.transparentize(m3colors.m3secondaryContainer, root.contentTransparency)
property color colSecondaryContainer: m3colors.m3secondaryContainer
property color colSecondaryContainerHover: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Hover, 0.6)
property color colSecondaryContainerActive: ColorUtils.mix(m3colors.m3secondaryContainer, colLayer1Active, 0.54)
property color colOnSecondaryContainer: m3colors.m3onSecondaryContainer
.config/quickshell/modules/common/widgets/ConfigSwitch.qml
+29
View File
@@ -0,0 +1,29 @@
import "root:/modules/common/widgets/"
import "root:/modules/common/"
import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
RippleButton {
id: root
Layout.fillWidth: true
contentItem: RowLayout {
spacing: 10
StyledText {
id: labelWidget
Layout.fillWidth: true
text: root.text
font.pixelSize: Appearance.font.pixelSize.normal
color: Appearance.colors.colOnSecondaryContainer
}
StyledSwitch {
id: switchWidget
down: root.down
scale: 0.75
Layout.fillWidth: false
checked: root.checked
}
}
}
.config/quickshell/modules/common/widgets/KeyboardKey.qml
+1 -1
View File
@@ -15,7 +15,7 @@ Rectangle {
property real extraBottomBorderWidth: 2
property color borderColor: Appearance.colors.colOnLayer0
property real borderRadius: 5
property color keyColor: Appearance.colors.colSurfaceContainerLow
property color keyColor: Appearance.m3colors.m3surfaceContainerLow
implicitWidth: keyFace.implicitWidth + borderWidth * 2
implicitHeight: keyFace.implicitHeight + borderWidth * 2 + extraBottomBorderWidth
radius: borderRadius
.config/quickshell/modules/common/widgets/StyledSwitch.qml
+3 -3
View File
@@ -36,13 +36,13 @@ Switch {
// Custom thumb styling
indicator: Rectangle {
width: root.pressed ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
height: root.pressed ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
width: (root.pressed || root.down) ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
height: (root.pressed || root.down) ? (28 * root.scale) : root.checked ? (24 * root.scale) : (16 * root.scale)
radius: Appearance.rounding.full
color: root.checked ? Appearance.m3colors.m3onPrimary : Appearance.m3colors.m3outline
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
anchors.leftMargin: root.checked ? (root.pressed ? (22 * root.scale) : 24 * root.scale) : (root.pressed ? (2 * root.scale) : 8 * root.scale)
anchors.leftMargin: root.checked ? ((root.pressed || root.down) ? (22 * root.scale) : 24 * root.scale) : ((root.pressed || root.down) ? (2 * root.scale) : 8 * root.scale)
Behavior on anchors.leftMargin {
animation: Appearance.animation.elementMove.numberAnimation.createObject(this)
.config/quickshell/modules/settings/Style.qml
+69
View File
@@ -11,6 +11,8 @@ import "root:/modules/common/functions/color_utils.js" as ColorUtils
import "root:/modules/common/functions/file_utils.js" as FileUtils
ContentPage {
baseWidth: lightDarkButtonGroup.implicitWidth
forceWidth: true
Process {
id: konachanWallProc
@@ -27,7 +29,9 @@ ContentPage {
ContentSection {
title: "Colors & Wallpaper"
// Light/Dark mode preference
ButtonGroup {
id: lightDarkButtonGroup
Layout.fillWidth: true
LightDarkPreferenceButton {
dark: false
@@ -37,6 +41,59 @@ ContentPage {
}
}
// Material palette selection
StyledText {
text: "Material palette"
color: Appearance.colors.colSubtext
}
Flow {
id: paletteFlow
Layout.fillWidth: true
spacing: 2
property list<var> palettes: [
{"value": "auto", "displayName": "Auto"},
{"value": "scheme-content", "displayName": "Content"},
{"value": "scheme-expressive", "displayName": "Expressive"},
{"value": "scheme-fidelity", "displayName": "Fidelty"},
{"value": "scheme-fruit-salad", "displayName": "Fruit Salad"},
{"value": "scheme-monochrome", "displayName": "Monochrome"},
{"value": "scheme-neutral", "displayName": "Neutral"},
{"value": "scheme-rainbow", "displayName": "Rainbow"},
{"value": "scheme-tonal-spot", "displayName": "Tonal Spot"},
]
Repeater {
model: paletteFlow.palettes
delegate: SelectionGroupButton {
id: paletteButton
required property var modelData
required property int index
onYChanged: {
if (index === 0) {
paletteButton.leftmost = true
} else {
var prev = paletteFlow.children[index - 1]
var thisIsOnNewLine = prev && prev.y !== paletteButton.y
paletteButton.leftmost = thisIsOnNewLine
prev.rightmost = thisIsOnNewLine
}
}
leftmost: index === 0
rightmost: index === paletteFlow.palettes.length - 1
buttonText: modelData.displayName;
toggled: ConfigOptions.appearance.palette.type === modelData.value
onClicked: {
ConfigLoader.setConfigValueAndSave("appearance.palette.type", modelData.value);
}
}
}
}
// Wallpaper selection
StyledText {
text: "Wallpaper"
color: Appearance.colors.colSubtext
}
RowLayout {
Layout.alignment: Qt.AlignHCenter
RippleButtonWithIcon {
@@ -139,5 +196,17 @@ ContentPage {
}
}
}
ConfigSwitch {
text: "Transparency"
checked: ConfigOptions.appearance.transparency
onClicked: checked = !checked;
onCheckedChanged: {
ConfigLoader.setConfigValueAndSave("appearance.transparency", checked);
}
StyledToolTip {
content: "Might look ass. Unsupported."
}
}
}
}