fixed the 'today' button

modules/bar/popouts/Calendar.qml

@@ -236,6 +236,35 @@ Column {
         }
     }
 
+    // Today button between controls and calendar
+    Rectangle {
+        id: todayButton
+        visible: root.currentYear !== new Date().getFullYear() || monthView.currentIndex !== new Date().getMonth()
+        anchors.horizontalCenter: parent.horizontalCenter
+        width: todayText.width + 20
+        height: 25
+        color: mouseArea.containsMouse ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3surfaceContainer
+        radius: Appearance.rounding.small
+
+        Text {
+            id: todayText
+            anchors.centerIn: parent
+            text: "Today"
+            color: Colours.palette.m3onSurface
+            font.pixelSize: 12
+        }
+
+        MouseArea {
+            id: mouseArea
+            anchors.fill: parent
+            hoverEnabled: true
+            onClicked: {
+                root.currentYear = new Date().getFullYear()
+                monthView.currentIndex = new Date().getMonth()
+            }
+        }
+    }
+
     // Calendar grid
     Rectangle {
         width: 280
@@ -264,7 +293,7 @@ Column {
                 anchors.fill: parent
                 property bool canScroll: true
                 property Timer scrollTimer: Timer {
-                    interval: 100  // Debounce time between scrolls
+                    interval: 200  // Increased debounce time for smoother scrolling
                     onTriggered: parent.canScroll = true
                 }
 
@@ -274,7 +303,7 @@ Column {
                 onWheel: {
                     if (!canScroll) return
                     
-                    // Handle two-finger scroll (horizontal)
+                    // Handle trackpad horizontal scroll
                     if (wheel.angleDelta.x !== 0) {
                         const scrollRight = wheel.angleDelta.x > 0
                         const shouldGoBack = invertScrollDirection ? !scrollRight : scrollRight
@@ -297,7 +326,7 @@ Column {
                             }
                         }
                     }
-                    // Handle vertical scroll (optional, can be removed if not needed)
+                    // Handle mouse wheel vertical scroll
                     else if (wheel.angleDelta.y !== 0) {
                         const scrollDown = wheel.angleDelta.y < 0
                         const shouldGoBack = invertScrollDirection ? !scrollDown : scrollDown
@@ -333,7 +362,7 @@ Column {
                 property real startX: 0
                 property bool isDragging: false
                 property real scrollPercentage: 0.0  // 0.0 to 1.0, represents progress to next/prev month
-                property real scrollSpeed: 0.1  // Adjust this to control how fast months change (lower = slower)
+                property real scrollSpeed: 0.15  // Increased threshold for more deliberate scrolling
 
                 onPressed: (mouse) => {
                     startX = mouse.x
@@ -350,7 +379,7 @@ Column {
                     if (!isDragging) return
                     
                     const dragDistance = mouse.x - startX
-                    const maxDragDistance = monthView.width * 0.5  // Half the width for full month transition
+                    const maxDragDistance = monthView.width * 0.4  // Reduced to 40% of width for more responsive feel
                     
                     // Calculate scroll percentage (-1.0 to 1.0)
                     scrollPercentage = Math.max(-1.0, Math.min(1.0, dragDistance / maxDragDistance))
@@ -381,45 +410,19 @@ Column {
                 }
             }
 
-            // Add Today button
-            Rectangle {
-                id: todayButton
-                visible: root.currentYear !== new Date().getFullYear() || monthView.currentIndex !== new Date().getMonth()
-                anchors {
-                    top: parent.top
-                    horizontalCenter: parent.horizontalCenter
-                    topMargin: -24
-                }
-                width: todayText.width + 20
-                height: 25
-                color: mouseArea.containsMouse ? "#3d3d3d" : "#2d2d2d"
-                radius: 4
-
-                Text {
-                    id: todayText
-                    anchors.centerIn: parent
-                    text: "Today"
-                    color: "#ffffff"
-                    font.pixelSize: 12
-                }
-
-                MouseArea {
-                    id: mouseArea
-                    anchors.fill: parent
-                    hoverEnabled: true
-                    onClicked: {
-                        root.currentYear = new Date().getFullYear()
-                        monthView.currentIndex = new Date().getMonth()
-                    }
-                }
-            }
-
             model: 12 // Show all months
             currentIndex: new Date().getMonth()
 
-            // Ensure current month is active when calendar opens
+            // Ensure current month is active and fully visible when calendar opens
             Component.onCompleted: {
                 currentIndex = new Date().getMonth()
+                // Force immediate opacity update for current month
+                for (let i = 0; i < count; i++) {
+                    const item = itemAt(i)
+                    if (item) {
+                        item.opacity = i === currentIndex ? 1 : 0.2
+                    }
+                }
             }
 
             delegate: Grid {