cookie clock: adjust colors and terminology

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

@@ -26,7 +26,7 @@ Item {
 
     property color colShadow: Appearance.colors.colShadow
     property color colBackground: Appearance.colors.colSecondaryContainer
-    property color colOnBackground: ColorUtils.mix(Appearance.colors.colSecondary, Appearance.colors.colSecondaryContainer, 0.3)
+    property color colOnBackground: ColorUtils.mix(Appearance.colors.colSecondary, Appearance.colors.colSecondaryContainer, 0.15)
     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
@@ -58,7 +58,7 @@ Item {
         z: 0
         implicitSize: root.implicitSize
         amplitude: implicitSize / 70
-        sides: Config.options.background.clock.clockSides
+        sides: Config.options.background.clock.cookie.sides
         color: root.colBackground
         constantlyRotate: Config.options.background.clock.cookie.constantlyRotate
     }
@@ -150,10 +150,14 @@ Item {
     }
 
     // Date
-    DateIndicator {
+    FadeLoader {
         anchors.fill: parent
-        colOnBackground: root.colBackgroundInfo
-        style: Config.options.background.clock.cookie.dateStyle
-        dateSquareSize: root.dateSquareSize
+        shown: Config.options.background.clock.cookie.dateStyle !== "hide"
+
+        sourceComponent: DateIndicator {
+            color: root.colBackgroundInfo
+            style: Config.options.background.clock.cookie.dateStyle
+            dateSquareSize: root.dateSquareSize
+        }
     }
 }

.config/quickshell/ii/modules/background/cookieClock/HourHand.qml

@@ -13,7 +13,7 @@ Item {
     property string style: "fill"
     property color color: Appearance.colors.colPrimary
 
-    property real fillColorAlpha: root.style === "stroke" ? 0 : 1
+    property real fillColorAlpha: root.style === "hollow" ? 0 : 1
     Behavior on fillColorAlpha {
         animation: Appearance.animation.elementResize.numberAnimation.createObject(this)
     }

.config/quickshell/ii/modules/background/cookieClock/dateIndicator/BubbleDate.qml

@@ -14,7 +14,7 @@ Item {
         z: 5
         sides: bubbleIndex === 0 ? 4 : 1
         anchors.centerIn: parent
-        color: bubbleIndex === 0.0 ? Appearance.colors.colPrimaryContainer : Appearance.colors.colTertiaryContainer
+        color: bubbleIndex === 0.0 ? Appearance.colors.colTertiaryContainer : Appearance.colors.colPrimaryContainer
         implicitSize: targetSize
         constantlyRotate: Config.options.background.clock.cookie.constantlyRotate
     }
@@ -22,7 +22,7 @@ Item {
         z: 6
         anchors.centerIn: parent
         text: bubbleIndex === 0.0 ? DateTime.date.substring(5, 7) : DateTime.date.substring(8, 10)
-        color: bubbleIndex === 0.0 ? Appearance.colors.colPrimary : Appearance.colors.colTertiary
+        color: bubbleIndex === 0.0 ? Appearance.colors.colTertiary : Appearance.colors.colPrimary
         opacity: root.style === "bubble" ? 1.0 : 0
         font {
             family: Appearance.font.family.expressive

.config/quickshell/ii/modules/background/cookieClock/dateIndicator/DateIndicator.qml

@@ -10,8 +10,7 @@ import QtQuick
 Item {
     id: root
     property string style: "rotating"
-    property color colOnBackground: Appearance.colors.colOnSecondaryContainer
-    property color colBackground: Appearance.colors.colOnSecondaryContainer
+    property color color: Appearance.colors.colOnSecondaryContainer
     property real dateSquareSize: 64
 
     // Rotating date
@@ -19,7 +18,7 @@ Item {
         anchors.fill: parent
         shown: Config.options.background.clock.cookie.dateStyle === "rotating"
         sourceComponent: RotatingDate {
-            color: root.colOnBackground
+            color: root.color
         }
     }
 
@@ -34,7 +33,7 @@ Item {
         }
 
         sourceComponent: RectangleDate {
-            color: Appearance.colors.colSecondaryContainerHover
+            color: ColorUtils.mix(root.color, Appearance.colors.colSecondaryContainerHover, 0.5)
             radius: Appearance.rounding.small
             implicitWidth: 45 * rectLoader.opacity
             implicitHeight: 30 * rectLoader.opacity
@@ -50,7 +49,7 @@ Item {
             left: parent.left
             top: parent.top
         }
-        
+
         sourceComponent: BubbleDate {
             implicitWidth: dayBubbleLoader.targetSize
             implicitHeight: dayBubbleLoader.targetSize