added center glow , wave animation etc.

.config/quickshell/ii/modules/background/CookieClock.qml

@@ -24,6 +24,9 @@ Item {
     property real minuteHandWidth: Config.options.background.clock.cookie.minuteHandSizeAdjust ? hourHandWidth : 12
     property real centerDotSize: 10
     property real hourDotSize: 12
+    property real centerGlowSize: 135
+
+    
 
     property color colShadow: Appearance.colors.colShadow
     property color colBackground: Appearance.colors.colSecondaryContainer
@@ -31,10 +34,11 @@ Item {
     property color colHourHand: Appearance.colors.colPrimary
     property color colMinuteHand: Appearance.colors.colSecondaryActive
     property color colOnHourHand: Appearance.colors.colOnPrimary
-
+    property color colTimeIndicators: Appearance.colors.colSecondaryContainerHover
     readonly property list<string> clockNumbers: DateTime.time.split(/[: ]/)
     readonly property int clockHour: parseInt(clockNumbers[0]) % 12
     readonly property int clockMinute: parseInt(clockNumbers[1])
+
     
     implicitWidth: implicitSize
     implicitHeight: implicitSize
@@ -72,7 +76,10 @@ Item {
         Repeater {
             model: 12
             Item {
-                visible: Config.options.background.clock.cookie.hourDots
+                opacity: Config.options.background.clock.cookie.hourDots ? 1.0 : 0 // Not using visible to allow smooth transition
+                Behavior on opacity {
+                    animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                }
                 required property int index
                 rotation: 360 / 12 * index 
                 anchors.fill: parent
@@ -90,6 +97,41 @@ Item {
                 }
             }
         }
+        
+    }
+
+    // Center glow behind the cookie
+    Rectangle {
+        id: glowLines
+        z: 1
+        anchors.centerIn: cookie
+        Repeater {
+            model: 12
+            Item {
+                opacity: Config.options.background.clock.cookie.centerGlow ? 1.0 : 0 // Not using visible to allow smooth transition
+                Behavior on opacity {
+                    animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                }
+                required property int index
+                rotation: 360 / 12 * index 
+                anchors.fill: parent
+                Rectangle {
+                    anchors {
+                        left: parent.left
+                        verticalCenter: parent.verticalCenter
+                        leftMargin: 50
+                    }
+                    implicitWidth: root.hourDotSize
+                    implicitHeight: implicitWidth / 2 
+                    radius: implicitWidth / 2
+                    color: root.colOnBackground
+                    opacity: Config.options.background.clock.cookie.centerGlow ? 0.5 : 0 
+                    Behavior on opacity {
+                        animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                    }
+                }
+            }
+        }
     }
 
     Column {
@@ -97,7 +139,6 @@ Item {
         z: 1
         anchors.centerIn: cookie
         spacing: -16
-        visible: Config.options.background.clock.cookie.timeIndicators
 
         // Numbers
         Repeater {
@@ -105,9 +146,19 @@ Item {
             delegate: StyledText {
                 required property string modelData
 
+                opacity: Config.options.background.clock.cookie.timeIndicators ? 1.0 : 0 // Not using visible to allow smooth transition
+                Behavior on opacity { // LOOK
+                    animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+                }
                 anchors.horizontalCenter: parent?.horizontalCenter
                 font {
-                    pixelSize: modelData.match(/am|pm/i) ? 26 : 68
+                    // A better way to do this? probably yes, do i know : no
+                    property real numberSizeWithoutGlow: modelData.match(/am|pm/i) ? 26 : 68
+                    property real numberSizeWithGlow: modelData.match(/am|pm/i) ? 10 : 40
+                    pixelSize: Config.options.background.clock.cookie.centerGlow ? numberSizeWithGlow : numberSizeWithoutGlow 
+                    Behavior on pixelSize {
+                        animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
+                    }
                     family: Appearance.font.family.expressive
                     weight: Font.Bold
                 }
@@ -138,6 +189,9 @@ Item {
         z: 3
         rotation: -90 + (360 / 60) * root.clockMinute
         Rectangle {
+            Behavior on height {
+                animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
+            }
             anchors.verticalCenter: parent.verticalCenter
             x: parent.width / 2 - minuteHandWidth / 2
             width: minuteHandLength
@@ -149,7 +203,10 @@ Item {
 
     // Center dot
     Rectangle {
-        visible: !Config.options.background.clock.cookie.minuteHandSizeAdjust
+        opacity: !Config.options.background.clock.cookie.minuteHandSizeAdjust ? 1.0 : 0 // Not using visible to allow smooth transition
+        Behavior on opacity {
+            animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
+        }
         z: 4
         color: root.colOnHourHand
         anchors.centerIn: parent
@@ -158,6 +215,17 @@ Item {
         radius: implicitWidth / 2
     }
 
+    // Center glow
+    Rectangle {
+        visible: Config.options.background.clock.cookie.centerGlow
+        z: 0
+        color: root.colTimeIndicators
+        anchors.centerIn: parent
+        implicitWidth: centerGlowSize
+        implicitHeight: centerGlowSize
+        radius: implicitWidth / 2
+    }
+
     // Quote
     Rectangle{
         id: quoteBox

.config/quickshell/ii/modules/common/Config.qml

@@ -134,6 +134,8 @@ Singleton {
                         property bool hourDots: true
                         property bool timeIndicators: true
                         property bool minuteHandSizeAdjust: true
+                        property bool centerGlow: true
+                        property bool waveAnimation: true
                     }
                     
                 }

.config/quickshell/ii/modules/common/widgets/MaterialCookie.qml

@@ -1,6 +1,8 @@
 import QtQuick
 import QtQuick.Shapes
 import Quickshell
+import qs.modules.common
+
 
 Item {
     id: root
@@ -12,9 +14,25 @@ Item {
     property color color: "#605790"
     property alias strokeWidth: shapePath.strokeWidth
 
+    property bool waveAnimation: Config.options.background.clock.cookie.waveAnimation
+
+
     implicitWidth: implicitSize
     implicitHeight: implicitSize
 
+    property real waveTime: 0
+    Loader{
+        active: waveAnimation
+        sourceComponent: Timer{
+            interval: 16  // Does it effect performance, probably, is it noticeable, not really
+            running: true; repeat: true
+            onTriggered: {
+                root.waveTime += 0.05
+            }
+        }
+    }
+
+
     Shape {
         id: shape
         anchors.fill: parent
@@ -35,7 +53,7 @@ Item {
                     var radius = root.implicitSize / 2 - root.amplitude
                     for (var i = 0; i <= steps; i++) {
                         var angle = (i / steps) * 2 * Math.PI
-                        var wave = Math.sin(angle * root.sides + Math.PI/2) * root.amplitude
+                        var wave = waveAnimation ? Math.sin(angle * root.sides + Math.PI/2 + root.waveTime) * root.amplitude : Math.sin(angle * root.sides + Math.PI/2) * root.amplitude
                         var x = Math.cos(angle) * (radius + wave) + cx
                         var y = Math.sin(angle) * (radius + wave) + cy
                         points.push(Qt.point(x, y))
@@ -45,6 +63,7 @@ Item {
 
                 path: pointsList
             }
+            
         }
     }
 }

.config/quickshell/ii/modules/settings/InterfaceConfig.qml

@@ -69,16 +69,41 @@ ContentPage {
             }
         }
 
-        ConfigSpinBox {
+        ConfigRow{
             enabled: Config.options.background.clock.style === "cookie"
-            icon: "support"
+            ConfigSpinBox {
-            text: Translation.tr("Clock sides")
+                icon: "support"
-            value: Config.options.background.clock.clockSides
+                text: Translation.tr("Clock sides")
-            from: 1
+                value: Config.options.background.clock.clockSides
-            to: 36
+                from: 1
-            stepSize: 1
+                to: 36
-            onValueChanged: {
+                stepSize: 1
-                Config.options.background.clock.clockSides = value;
+                onValueChanged: {
+                    Config.options.background.clock.clockSides = value;
+                }
+            }
+            ConfigSwitch {
+                enabled: Config.options.background.clock.cookie.hourDots
+                buttonIcon: "brightness_7"
+                text: Translation.tr("Center glow")
+                checked: Config.options.background.clock.cookie.centerGlow
+                onEnabledChanged: {
+                    checked = Config.options.background.clock.cookie.centerGlow
+                }
+                onCheckedChanged: {
+                    Config.options.background.clock.cookie.centerGlow = checked;
+                }
+            }
+            ConfigSwitch {
+                buttonIcon: "waves"
+                text: Translation.tr("Wave animation")
+                checked: Config.options.background.clock.cookie.waveAnimation
+                onCheckedChanged: {
+                    Config.options.background.clock.cookie.waveAnimation = checked;
+                }
+                StyledToolTip {
+                    text: "It may effect performance"
+                }
             }
         }
         ConfigRow{
@@ -89,6 +114,7 @@ ContentPage {
                 checked: Config.options.background.clock.cookie.hourDots
                 onCheckedChanged: {
                     Config.options.background.clock.cookie.hourDots = checked;
+                    Config.options.background.clock.cookie.centerGlow = checked ? Config.options.background.clock.cookie.centerGlow : false;
                 }
             }
             ConfigSwitch {