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

cookie clock: cleaner date indicator, adjust colors

Browse Source
This commit is contained in:
end-4
2025-10-11 17:40:24 +02:00
parent c197f6eab2
commit 41c2814610
7 changed files with 55 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/ii/modules/background/cookieClock/CookieClock.qml
+10 -8
View File
@@ -26,7 +26,8 @@ Item {
property color colShadow: Appearance.colors.colShadow
property color colBackground: Appearance.colors.colSecondaryContainer
property color colOnBackground: ColorUtils.mix(Appearance.colors.colPrimary, Appearance.colors.colSecondaryContainer, 0.5)
property color colOnBackground: ColorUtils.mix(Appearance.colors.colSecondary, Appearance.colors.colSecondaryContainer, 0.3)
property color colBackgroundInfo: ColorUtils.mix(Appearance.colors.colPrimary, Appearance.colors.colSecondaryContainer, 0.55)
property color colHourHand: Appearance.colors.colPrimary
property color colMinuteHand: Appearance.colors.colSecondary
property color colSecondHand: Appearance.colors.colTertiary
@@ -75,8 +76,8 @@ Item {
shown: Config.options.background.clock.cookie.hourMarks
sourceComponent: HourMarks {
implicitSize: 135 * (1.75 - 0.75 * hourMarksLoader.opacity)
color: root.colTimeIndicators
colOnBackground: root.colOnBackground
color: root.colOnBackground
colOnBackground: ColorUtils.mix(root.colBackgroundInfo, root.colOnBackground, 0.5)
}
}
@@ -91,14 +92,14 @@ Item {
}
sourceComponent: TimeColumn {
color: root.colOnBackground
color: root.colBackgroundInfo
}
}
// Hour hand
FadeLoader {
anchors.fill: parent
z: Config.options.background.clock.cookie.hourHandStyle === "fill" ? 3 : 1
z: 1
shown: Config.options.background.clock.cookie.hourHandStyle !== "hide"
sourceComponent: HourHand {
clockHour: root.clockHour
@@ -111,6 +112,7 @@ Item {
// Minute hand
FadeLoader {
anchors.fill: parent
z: 2
shown: Config.options.background.clock.cookie.minuteHandStyle !== "hide"
sourceComponent: MinuteHand {
anchors.fill: parent
@@ -124,7 +126,7 @@ Item {
FadeLoader {
id: secondHandLoader
z: (Config.options.background.clock.cookie.secondHandStyle === "line") ? 2 : 3
shown: Config.options.time.secondPrecision && Config.options.background.clock.cookie.secondHandStyle !== "none"
shown: Config.options.time.secondPrecision && Config.options.background.clock.cookie.secondHandStyle !== "hide"
anchors.fill: parent
sourceComponent: SecondHand {
id: secondHand
@@ -141,7 +143,7 @@ Item {
shown: Config.options.background.clock.cookie.minuteHandStyle !== "bold"
sourceComponent: Rectangle {
color: Config.options.background.clock.cookie.minuteHandStyle === "medium" ? root.colBackground : root.colMinuteHand
implicitWidth: 8
implicitWidth: 6
implicitHeight: implicitWidth
radius: width / 2
}
@@ -150,7 +152,7 @@ Item {
// Date
DateIndicator {
anchors.fill: parent
colOnBackground: root.colOnBackground
colOnBackground: root.colBackgroundInfo
style: Config.options.background.clock.cookie.dateStyle
dateSquareSize: root.dateSquareSize
}
.config/quickshell/ii/modules/background/cookieClock/CookieQuote.qml
+1
View File
@@ -50,6 +50,7 @@ Item {
id: quoteStyledText
horizontalAlignment: Text.AlignLeft
text: Config.options.background.quote
color: Appearance.colors.colOnSecondaryContainer
font {
family: Appearance.font.family.reading
pixelSize: Appearance.font.pixelSize.large
.config/quickshell/ii/modules/background/cookieClock/HourMarks.qml
+1 -1
View File
@@ -13,7 +13,7 @@ Item {
property real markWidth: 4
property color color: Appearance.colors.colOnSecondaryContainer
property color colOnBackground: Appearance.colors.colSecondaryContainer
property real padding: 10
property real padding: 8
Rectangle {
color: root.color
.config/quickshell/ii/modules/background/cookieClock/MinuteHand.qml
-1
View File
@@ -13,7 +13,6 @@ Item {
property real handWidth: style === "bold" ? 18 : style === "medium" ? 12 : 5
property color color: Appearance.colors.colSecondary
z: root.style === "thin" ? 1 : 3
rotation: -90 + (360 / 60) * root.clockMinute
Behavior on rotation {
.config/quickshell/ii/modules/background/cookieClock/dateIndicator/DateIndicator.qml
+27 -41
View File
@@ -9,83 +9,69 @@ import QtQuick
Item {
id: root
readonly property string dialStyle: Config.options.background.clock.cookie.dialNumberStyle
property string style: "rotating"
property color colOnBackground: Appearance.colors.colOnSecondaryContainer
property color colBackground: Appearance.colors.colOnSecondaryContainer
property real dateSquareSize: 64
// Rotating date
Loader {
FadeLoader {
anchors.fill: parent
active: opacity > 0
shown: Config.options.background.clock.cookie.dateStyle === "rotating"
sourceComponent: RotatingDate {
style: root.style
color: root.colOnBackground
}
}
// Rectangle date (only today's number) in right side of the clock
Loader {
FadeLoader {
id: rectLoader
property real animIndex: root.style === "rect" ? 1.0 : 0.0
Behavior on animIndex {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
shown: root.style === "rect"
anchors {
verticalCenter: parent.verticalCenter
right: parent.right
rightMargin: 40 - rectLoader.opacity * 30
}
active: animIndex > 0
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
sourceComponent: RectangleDate {
color: Appearance.colors.colSecondaryContainerHover
radius: Appearance.rounding.small
animIndex: rectLoader.animIndex
implicitWidth: 45 * rectLoader.opacity
implicitHeight: 30 * rectLoader.opacity
}
}
// Date bubble / day
Loader {
// Bubble style: day of month
FadeLoader {
id: dayBubbleLoader
property real targetSize: root.style === "bubble" ? root.dateSquareSize : 0
Behavior on targetSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
active: targetSize > 0
width: targetSize
height: targetSize
shown: root.style === "bubble"
property real targetSize: root.dateSquareSize * opacity
anchors {
left: parent.left
bottom: parent.bottom
topMargin: 50
top: parent.top
}
sourceComponent: BubbleDate {
implicitWidth: dayBubbleLoader.targetSize
implicitHeight: dayBubbleLoader.targetSize
bubbleIndex: 0
targetSize: dayBubbleLoader.targetSize
}
}
// Date bubble / month
Loader {
// Bubble style: month
FadeLoader {
id: monthBubbleLoader
property real targetSize: root.style === "bubble" ? root.dateSquareSize : 0
Behavior on targetSize {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
width: targetSize
height: targetSize
active: targetSize > 0
shown: root.style === "bubble"
property real targetSize: root.dateSquareSize * opacity
anchors {
right: parent.right
top: parent.top
bottomMargin: 50
bottom: parent.bottom
}
sourceComponent: BubbleDate {
implicitWidth: monthBubbleLoader.targetSize
implicitHeight: monthBubbleLoader.targetSize
bubbleIndex: 1
targetSize: monthBubbleLoader.targetSize
}
.config/quickshell/ii/modules/background/cookieClock/dateIndicator/RectangleDate.qml
+2 -21
View File
@@ -8,34 +8,15 @@ import QtQuick
Rectangle {
id: rect
readonly property string dialStyle: Config.options.background.clock.cookie.dialNumberStyle
property real animIndex: 0
opacity: animIndex
width: 45 * animIndex
height: 30 * animIndex
x: root.dialStyle === "numbers" ? -40 : -10
y: root.dialStyle === "numbers" ? 55 : 0
Behavior on x {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Behavior on y {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
StyledText {
opacity: root.style === "rect" ? 1.0 : 0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
anchors.centerIn: parent
color: Appearance.colors.colSecondaryHover
text: DateTime.date.substring(5, 7)
text: Qt.locale().toString(DateTime.clock.date, "dd")
font {
family: Appearance.font.family.expressive
pixelSize: 20
weight: 1000
}
}
}
}
.config/quickshell/ii/modules/background/cookieClock/dateIndicator/RotatingDate.qml
+14 -22
View File
@@ -10,6 +10,11 @@ Item {
id: root
property string style: Config.options.background.clock.cookie.dateStyle
property color color: Appearance.colors.colOnSecondaryContainer
property real angleStep: 12 * Math.PI / 180
property string dateText: Qt.locale().toString(DateTime.clock.date, "ddd dd")
readonly property int clockSecond: DateTime.clock.seconds
readonly property string dialStyle: Config.options.background.clock.cookie.dialNumberStyle
readonly property bool timeIndicators: Config.options.background.clock.cookie.timeIndicators
@@ -18,20 +23,9 @@ Item {
animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
}
property string dateText: Qt.locale().toString(DateTime.clock.date, "ddd dd")
property real angleStep: Math.PI / 2.35 / dateText.length
property color dayColor: Appearance.colors.colSecondary
property color monthColor: Appearance.colors.colSecondaryHover
opacity: style === "rotating" ? 1.0 : 0.0
Behavior on opacity {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
rotation: {
if (!Config.options.time.secondPrecision) return 0
else return secondHandLoader.item.rotation + 45 // +45 to center the text
else return (360 / 60 * clockSecond) + 180 - (angleStep / Math.PI * 180 * dateText.length) / 2
}
Repeater {
@@ -40,20 +34,18 @@ Item {
delegate: Text {
required property int index
property real angle: index * root.angleStep - Math.PI / 2
x: root.width / 2 + root.radius * Math.cos(angle) - width / 2
y: root.height / 2 + root.radius * Math.sin(angle) - height / 2
text: root.dateText.charAt(index)
font.family: Appearance.font.family.title
font.pixelSize: 30
font.weight: Font.DemiBold
color: index < 3 ? root.dayColor : root.monthColor
rotation: angle * 180 / Math.PI + 90
color: root.color
font {
family: Appearance.font.family.title
pixelSize: 30
weight: Font.DemiBold
}
text: root.dateText.charAt(index)
}
}
}