Compare commits

..

No commits in common. "81d0da4cd713fbfb15a6e3d00f29049e864e4c8b" and "bf40be76c5f09d149a9730eb99dd887edc238fe1" have entirely different histories.

View file

@ -1,5 +1,4 @@
import QtQuick
import QtQuick.Effects
import Quickshell
import Quickshell.Wayland
import "." as M
@ -28,70 +27,18 @@ PanelWindow {
Column {
anchors.centerIn: parent
spacing: 12
spacing: 8
// Neon clock
Item {
Row {
anchors.horizontalCenter: parent.horizontalCenter
width: clockRow.width
height: clockRow.height
// Glow layer rendered offscreen, only its neon halo is visible
Row {
id: glowSource
visible: false
anchors.centerIn: parent
Text {
text: Qt.formatDateTime(clock.date, "HH")
color: M.Theme.base0D
color: M.Theme.base05
opacity: 0.7
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
anchors.verticalCenter: parent.verticalCenter
}
Text {
text: ":"
color: colon._colors[colon._colorIdx % colon._colors.length]
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
opacity: colon.opacity
anchors.verticalCenter: parent.verticalCenter
}
Text {
text: Qt.formatDateTime(clock.date, "mm")
color: M.Theme.base0E
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
anchors.verticalCenter: parent.verticalCenter
}
}
MultiEffect {
source: glowSource
anchors.fill: glowSource
shadowEnabled: true
shadowColor: M.Theme.base0D
shadowBlur: 1.0
shadowVerticalOffset: 0
shadowHorizontalOffset: 0
}
// Actual visible text on top of the glow
Row {
id: clockRow
anchors.centerIn: parent
Text {
text: Qt.formatDateTime(clock.date, "HH")
color: M.Theme.base0D
opacity: 0.85
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
anchors.verticalCenter: parent.verticalCenter
}
Text {
id: colon
@ -99,7 +46,6 @@ PanelWindow {
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
anchors.verticalCenter: parent.verticalCenter
property int _colorIdx: 0
readonly property var _colors: [M.Theme.base08, M.Theme.base09, M.Theme.base0A, M.Theme.base0B, M.Theme.base0C, M.Theme.base0D, M.Theme.base0E, M.Theme.base05]
@ -121,7 +67,7 @@ PanelWindow {
NumberAnimation {
target: colon
property: "opacity"
to: 0.85
to: 0.7
duration: 1000
easing.type: Easing.InOutSine
}
@ -129,62 +75,21 @@ PanelWindow {
}
Text {
text: Qt.formatDateTime(clock.date, "mm")
color: M.Theme.base0E
opacity: 0.85
color: M.Theme.base05
opacity: 0.7
font.pixelSize: 72
font.family: M.Theme.fontFamily
font.bold: true
anchors.verticalCenter: parent.verticalCenter
}
}
}
// Date with subtle glow
Text {
id: dateText
anchors.horizontalCenter: parent.horizontalCenter
text: Qt.formatDateTime(clock.date, "dddd, dd MMMM yyyy")
color: M.Theme.base05
opacity: 0.5
font.pixelSize: 18
font.family: M.Theme.fontFamily
font.letterSpacing: 4
layer.enabled: true
layer.effect: MultiEffect {
shadowEnabled: true
shadowColor: M.Theme.base0D
shadowBlur: 0.4
shadowVerticalOffset: 0
shadowHorizontalOffset: 0
}
}
// Seconds as a thin animated progress bar
Item {
anchors.horizontalCenter: parent.horizontalCenter
width: clockRow.width
height: 2
Rectangle {
anchors.fill: parent
color: M.Theme.base02
radius: 1
opacity: 0.3
}
Rectangle {
width: parent.width * (clock.date.getSeconds() / 59)
height: parent.height
color: colon._colors[colon._colorIdx % colon._colors.length]
radius: 1
opacity: 0.6
Behavior on width {
NumberAnimation {
duration: 300
}
}
}
}
}
}