kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

more hacking friendliness

Browse Source
This commit is contained in:
end-4
2025-05-26 12:10:03 +02:00
parent 5434771d77
commit bca1a77ae3
12 changed files with 75 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/modules/common/widgets/ButtonGroup.qml
+2 -2
View File
@@ -6,8 +6,8 @@ import QtQuick.Controls
import QtQuick.Layouts import QtQuick.Layouts
/** /**
* A container that supports bouncy children. * A container that supports GroupButton children for bounciness.
* https://m3.material.io/components/button-groups/overview * See https://m3.material.io/components/button-groups/overview
*/ */
Rectangle { Rectangle {
id: root id: root
.config/quickshell/modules/common/widgets/CircularProgress.qml
+5 -2
View File
@@ -1,9 +1,12 @@
// From https://github.com/rafzby/circular-progressbar // From https://github.com/rafzby/circular-progressbar with modifications
// License: LGPL-3.0 - A copy can be found in `licenses` folder of repo // License: LGPL-3.0 - A copy can be found in `licenses` folder of repo
// Modified so it looks like in Material 3: https://m3.material.io/components/progress-indicators/specs
import QtQuick import QtQuick
import "root:/modules/common" import "root:/modules/common"
/**
* Material 3 circular progress. See https://m3.material.io/components/progress-indicators/specs
*/
Item { Item {
id: root id: root
.config/quickshell/modules/common/widgets/DialogButton.qml
+9 -3
View File
@@ -6,13 +6,19 @@ import QtQuick.Layouts
import Quickshell import Quickshell
import Quickshell.Io import Quickshell.Io
/**
* Material 3 dialog button. See https://m3.material.io/components/dialogs/overview
*/
RippleButton { RippleButton {
id: button id: button
property string buttonText property string buttonText
implicitHeight: 30 implicitHeight: 30
implicitWidth: buttonTextWidget.implicitWidth + 15 * 2 implicitWidth: buttonTextWidget.implicitWidth + 15 * 2
buttonRadius: Appearance.rounding.full buttonRadius: Appearance?.rounding.full ?? 9999
property color colEnabled: Appearance?.m3colors.m3primary ?? "#65558F"
property color colDisabled: Appearance?.m3colors.m3outline ?? "#8D8C96"
contentItem: StyledText { contentItem: StyledText {
id: buttonTextWidget id: buttonTextWidget
@@ -21,8 +27,8 @@ RippleButton {
anchors.rightMargin: 15 anchors.rightMargin: 15
text: buttonText text: buttonText
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
font.pixelSize: Appearance.font.pixelSize.small font.pixelSize: Appearance?.font.pixelSize.small ?? 12
color: button.enabled ? Appearance.m3colors.m3primary : Appearance.m3colors.m3outline color: button.enabled ? button.colEnabled : button.colDisabled
Behavior on color { Behavior on color {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this) animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
.config/quickshell/modules/common/widgets/DragManager.qml
+4 -1
View File
@@ -4,7 +4,10 @@ import QtQuick
import QtQuick.Controls import QtQuick.Controls
import QtQuick.Layouts import QtQuick.Layouts
MouseArea { // Flick to dismiss /**
* A convenience MouseArea for handling drag events.
*/
MouseArea {
id: root id: root
hoverEnabled: true hoverEnabled: true
acceptedButtons: Qt.LeftButton acceptedButtons: Qt.LeftButton
.config/quickshell/modules/common/widgets/FlowButtonGroup.qml
+3
View File
@@ -1,5 +1,8 @@
import QtQuick import QtQuick
/**
* This is just to make sure `RippleButton`s can be used in a Flow layout.
*/
Flow { Flow {
property int clickIndex: -1 property int clickIndex: -1
} }
.config/quickshell/modules/common/widgets/GroupButton.qml
+10 -6
View File
@@ -8,6 +8,10 @@ import QtQuick.Layouts
import Quickshell.Io import Quickshell.Io
import Quickshell.Widgets import Quickshell.Widgets
/**
* Material 3 button with expressive bounciness.
* See https://m3.material.io/components/button-groups/overview
*/
Button { Button {
id: root id: root
property bool toggled property bool toggled
@@ -35,12 +39,12 @@ Button {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this) animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
} }
property color colBackground: ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1) property color colBackground: ColorUtils.transparentize(Appearance?.colors.colLayer1Hover, 1) || "transparent"
property color colBackgroundHover: Appearance.colors.colLayer1Hover property color colBackgroundHover: Appearance?.colors.colLayer1Hover ?? "#E5DFED"
property color colBackgroundActive: Appearance.colors.colLayer1Active property color colBackgroundActive: Appearance?.colors.colLayer1Active ?? "#D6CEE2"
property color colBackgroundToggled: Appearance.m3colors.m3primary property color colBackgroundToggled: Appearance?.m3colors.m3primary ?? "#65558F"
property color colBackgroundToggledHover: Appearance.colors.colPrimaryHover property color colBackgroundToggledHover: Appearance?.colors.colPrimaryHover ?? "#77699C"
property color colBackgroundToggledActive: Appearance.colors.colPrimaryActive property color colBackgroundToggledActive: Appearance?.colors.colPrimaryActive ?? "#D6CEE2"
property real radius: root.down ? root.buttonRadiusPressed : root.buttonRadius property real radius: root.down ? root.buttonRadiusPressed : root.buttonRadius
property color color: root.enabled ? (root.toggled ? property color color: root.enabled ? (root.toggled ?
.config/quickshell/modules/common/widgets/MaterialSymbol.qml
+5 -5
View File
@@ -4,20 +4,20 @@ import QtQuick.Layouts
Text { Text {
id: root id: root
property real iconSize: Appearance.font.pixelSize.small property real iconSize: Appearance?.font.pixelSize.small ?? 16
property real fill: 0 property real fill: 0
renderType: Text.NativeRendering renderType: Text.NativeRendering
font.hintingPreference: Font.PreferFullHinting font.hintingPreference: Font.PreferFullHinting
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
font.family: Appearance.font.family.iconMaterial font.family: Appearance?.font.family.iconMaterial ?? "Material Symbols Rounded"
font.pixelSize: iconSize font.pixelSize: iconSize
color: Appearance.m3colors.m3onBackground color: Appearance.m3colors.m3onBackground
Behavior on fill { Behavior on fill {
NumberAnimation { NumberAnimation {
duration: Appearance.animation.elementMoveFast.duration duration: Appearance?.animation.elementMoveFast.duration ?? 200
easing.type: Appearance.animation.elementMoveFast.type easing.type: Appearance?.animation.elementMoveFast.type ?? Easing.BezierSpline
easing.bezierCurve: Appearance.animation.elementMoveFast.bezierCurve easing.bezierCurve: Appearance?.animation.elementMoveFast.bezierCurve ?? [0.34, 0.80, 0.34, 1.00, 1, 1]
} }
} }
.config/quickshell/modules/common/widgets/MenuButton.qml
+3 -3
View File
@@ -7,7 +7,7 @@ import Quickshell
import Quickshell.Io import Quickshell.Io
RippleButton { RippleButton {
id: button id: root
buttonRadius: 0 buttonRadius: 0
implicitHeight: 36 implicitHeight: 36
@@ -18,10 +18,10 @@ RippleButton {
anchors.fill: parent anchors.fill: parent
anchors.leftMargin: 14 anchors.leftMargin: 14
anchors.rightMargin: 14 anchors.rightMargin: 14
text: button.buttonText text: root.buttonText
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
font.pixelSize: Appearance.font.pixelSize.small font.pixelSize: Appearance.font.pixelSize.small
color: button.enabled ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3outline color: root.enabled ? Appearance.m3colors.m3onSurface : Appearance.m3colors.m3outline
Behavior on color { Behavior on color {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this) animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this)
.config/quickshell/modules/common/widgets/NotificationGroupExpandButton.qml
+6 -5
View File
@@ -12,16 +12,17 @@ RippleButton { // Expand button
id: root id: root
required property int count required property int count
required property bool expanded required property bool expanded
property real fontSize: Appearance.font.pixelSize.small property real fontSize: Appearance?.font.pixelSize.small ?? 12
property real iconSize: Appearance?.font.pixelSize.normal ?? 16
implicitHeight: fontSize + 4 * 2 implicitHeight: fontSize + 4 * 2
implicitWidth: Math.max(contentItem.implicitWidth + 5 * 2, 30) implicitWidth: Math.max(contentItem.implicitWidth + 5 * 2, 30)
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
Layout.fillHeight: false Layout.fillHeight: false
buttonRadius: Appearance.rounding.full buttonRadius: Appearance.rounding.full
colBackground: ColorUtils.mix(Appearance.colors.colLayer2, Appearance.colors.colLayer2Hover, 0.5) colBackground: ColorUtils.mix(Appearance?.colors.colLayer2, Appearance?.colors.colLayer2Hover, 0.5)
colBackgroundHover: Appearance.colors.colLayer2Hover colBackgroundHover: Appearance?.colors.colLayer2Hover ?? "#E5DFED"
colRipple: Appearance.colors.colLayer2Active colRipple: Appearance?.colors.colLayer2Active ?? "#D6CEE2"
contentItem: Item { contentItem: Item {
anchors.centerIn: parent anchors.centerIn: parent
@@ -38,7 +39,7 @@ RippleButton { // Expand button
} }
MaterialSymbol { MaterialSymbol {
text: "keyboard_arrow_down" text: "keyboard_arrow_down"
iconSize: Appearance.font.pixelSize.normal iconSize: root.iconSize
color: Appearance.colors.colOnLayer2 color: Appearance.colors.colOnLayer2
rotation: expanded ? 180 : 0 rotation: expanded ? 180 : 0
Behavior on rotation { Behavior on rotation {
.config/quickshell/modules/common/widgets/PrimaryTabBar.qml
+8 -6
View File
@@ -10,6 +10,8 @@ ColumnLayout {
required property var tabButtonList // Something like [{"icon": "notifications", "name": qsTr("Notifications")}, {"icon": "volume_up", "name": qsTr("Volume mixer")}] required property var tabButtonList // Something like [{"icon": "notifications", "name": qsTr("Notifications")}, {"icon": "volume_up", "name": qsTr("Volume mixer")}]
required property var externalTrackedTab required property var externalTrackedTab
property bool enableIndicatorAnimation: false property bool enableIndicatorAnimation: false
property color colIndicator: Appearance?.m3colors.m3primary ?? "#65558F"
property color colBorder: Appearance?.m3colors.m3outlineVariant ?? "#C6C6D0"
signal currentIndexChanged(int index) signal currentIndexChanged(int index)
TabBar { TabBar {
@@ -67,15 +69,15 @@ ColumnLayout {
x: tabBar.currentIndex * fullTabSize + (fullTabSize - targetWidth) / 2 x: tabBar.currentIndex * fullTabSize + (fullTabSize - targetWidth) / 2
color: Appearance.m3colors.m3primary color: root.colIndicator
radius: Appearance.rounding.full radius: Appearance?.rounding.full ?? 9999
Behavior on x { Behavior on x {
animation: Appearance.animation.elementMove.numberAnimation.createObject(this) animation: Appearance?.animation.elementMove.numberAnimation.createObject(this)
} }
Behavior on implicitWidth { Behavior on implicitWidth {
animation: Appearance.animation.elementMove.numberAnimation.createObject(this) animation: Appearance?.animation.elementMove.numberAnimation.createObject(this)
} }
} }
} }
@@ -83,7 +85,7 @@ ColumnLayout {
Rectangle { // Tabbar bottom border Rectangle { // Tabbar bottom border
id: tabBarBottomBorder id: tabBarBottomBorder
Layout.fillWidth: true Layout.fillWidth: true
height: 1 implicitHeight: 1
color: Appearance.m3colors.m3outlineVariant color: root.colBorder
} }
} }
.config/quickshell/modules/common/widgets/PrimaryTabButton.qml
+19 -13
View File
@@ -17,10 +17,16 @@ TabButton {
property int rippleDuration: 1200 property int rippleDuration: 1200
height: buttonBackground.height height: buttonBackground.height
property color colBackground: ColorUtils.transparentize(Appearance?.colors.colLayer1Hover, 1) || "transparent"
property color colBackgroundHover: Appearance?.colors.colLayer1Hover ?? "#E5DFED"
property color colRipple: Appearance?.colors.colLayer1Active ?? "#D6CEE2"
property color colActive: Appearance?.m3colors.m3primary ?? "#65558F"
property color colInactive: Appearance?.colors.colOnLayer1 ?? "#45464F"
component RippleAnim: NumberAnimation { component RippleAnim: NumberAnimation {
duration: rippleDuration duration: rippleDuration
easing.type: Appearance.animation.elementMoveEnter.type easing.type: Appearance?.animation.elementMoveEnter.type
easing.bezierCurve: Appearance.animationCurves.standardDecel easing.bezierCurve: Appearance?.animationCurves.standardDecel
} }
MouseArea { MouseArea {
@@ -86,9 +92,9 @@ TabButton {
background: Rectangle { background: Rectangle {
id: buttonBackground id: buttonBackground
radius: Appearance.rounding.small radius: Appearance?.rounding.small
implicitHeight: 50 implicitHeight: 50
color: (button.hovered ? Appearance.colors.colLayer1Hover : ColorUtils.transparentize(Appearance.colors.colLayer1Hover, 1)) color: (button.hovered ? button.colBackgroundHover : button.colBackground)
layer.enabled: true layer.enabled: true
layer.effect: OpacityMask { layer.effect: OpacityMask {
maskSource: Rectangle { maskSource: Rectangle {
@@ -99,14 +105,14 @@ TabButton {
} }
Behavior on color { Behavior on color {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this) animation: Appearance?.animation.elementMoveFast.colorAnimation.createObject(this)
} }
Rectangle { Rectangle {
id: ripple id: ripple
radius: Appearance.rounding.full radius: Appearance?.rounding.full ?? 9999
color: Appearance.colors.colLayer1Active color: button.colRipple
opacity: 0 opacity: 0
transform: Translate { transform: Translate {
@@ -126,22 +132,22 @@ TabButton {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: buttonIcon text: buttonIcon
iconSize: Appearance.font.pixelSize.hugeass iconSize: Appearance?.font.pixelSize.hugeass ?? 25
fill: selected ? 1 : 0 fill: selected ? 1 : 0
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1 color: selected ? button.colActive : button.colInactive
Behavior on color { Behavior on color {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this) animation: Appearance?.animation.elementMoveFast.colorAnimation.createObject(this)
} }
} }
StyledText { StyledText {
id: buttonTextWidget id: buttonTextWidget
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
font.pixelSize: Appearance.font.pixelSize.small font.pixelSize: Appearance?.font.pixelSize.small
color: selected ? Appearance.m3colors.m3primary : Appearance.colors.colOnLayer1 color: selected ? button.colActive : button.colInactive
text: buttonText text: buttonText
Behavior on color { Behavior on color {
animation: Appearance.animation.elementMoveFast.colorAnimation.createObject(this) animation: Appearance?.animation.elementMoveFast.colorAnimation.createObject(this)
} }
} }
} }
.config/quickshell/modules/common/widgets/RippleButton.qml
+1 -1
View File
@@ -22,7 +22,7 @@ Button {
property bool rippleEnabled: true property bool rippleEnabled: true
property var altAction property var altAction
property color colBackground: ColorUtils.transparentize(Appearance?.colors.colLayer1Hover, 1) || "#00000000" property color colBackground: ColorUtils.transparentize(Appearance?.colors.colLayer1Hover, 1) || "transparent"
property color colBackgroundHover: Appearance?.colors.colLayer1Hover ?? "#E5DFED" property color colBackgroundHover: Appearance?.colors.colLayer1Hover ?? "#E5DFED"
property color colBackgroundToggled: Appearance?.m3colors.m3primary ?? "#65558F" property color colBackgroundToggled: Appearance?.m3colors.m3primary ?? "#65558F"
property color colBackgroundToggledHover: Appearance?.colors.colPrimaryHover ?? "#77699C" property color colBackgroundToggledHover: Appearance?.colors.colPrimaryHover ?? "#77699C"