sidebar calendar thingie: navrail

.config/quickshell/modules/sidebarRight/QuickToggleButton.qml

@@ -30,7 +30,7 @@ Button {
         
         MaterialSymbol {
             anchors.centerIn: parent
-            font.pointSize: Appearance.font.pointSize.larger
+            font.pixelSize: Appearance.font.pixelSize.larger
             text: buttonIcon
             color: toggled ? Appearance.m3colors.m3onPrimary : Appearance.colors.colOnLayer1
 

.config/quickshell/modules/sidebarRight/SidebarCalendar.qml

@@ -0,0 +1,50 @@
+import "root:/modules/common"
+import "root:/modules/common/widgets"
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Quickshell
+
+Rectangle {
+    Layout.alignment: Qt.AlignHCenter
+    Layout.fillHeight: false
+    Layout.fillWidth: true
+    radius: Appearance.rounding.normal
+    color: Appearance.colors.colLayer1
+    height: 300
+
+    RowLayout {
+        id: calendarRow
+        anchors.centerIn: parent
+        width: parent.width - 10 * 2
+        height: parent.height - 10 * 2
+        spacing: 10
+        property int selectedTab: 0
+        
+        ColumnLayout {
+            id: tabBar
+            Layout.fillHeight: true
+            Layout.leftMargin: 10
+            spacing: 10
+            Repeater {
+                model: [ 
+                    {"name": "Calendar", "icon": "calendar_month"}, 
+                    {"name": "To Do", "icon": "done_outline"} 
+                ]
+                NavRailButton {
+                    toggled: calendarRow.selectedTab == index
+                    buttonText: modelData.name
+                    buttonIcon: modelData.icon
+                    onClicked: {
+                        calendarRow.selectedTab = index
+                        console.log("Selected tab:", calendarRow.selectedTab)
+                    }
+                }
+            }
+        }
+        Item { // Todo the real content goes here!
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+        }
+    }
+}

.config/quickshell/modules/sidebarRight/SidebarRight.qml

@@ -44,7 +44,6 @@ Scope {
                 windows: [ sidebarRoot ]
                 active: false
                 onCleared: () => {
-                    // sidebarRoot.visible = false
                     if (!active) sidebarRoot.visible = false
                 }
             }
@@ -102,9 +101,10 @@ Scope {
                         }
 
                         StyledText {
-                            font.pointSize: Appearance.font.pointSize.normal
+                            font.pixelSize: Appearance.font.pixelSize.normal
                             color: Appearance.colors.colOnLayer0
                             text: `Uptime: ${DateTime.uptime}`
+                            textFormat: Text.MarkdownText
                         }
 
                         Item {
@@ -138,9 +138,16 @@ Scope {
                         }
                     }
 
-                    Item {
+                    Rectangle {
+                        Layout.alignment: Qt.AlignHCenter
                         Layout.fillHeight: true
+                        Layout.fillWidth: true
+                        radius: Appearance.rounding.normal
+                        color: Appearance.colors.colLayer1
                     }
+
+                    // Calendar
+                    SidebarCalendar {}
                 }
             }
 
@@ -179,6 +186,15 @@ Scope {
                 }
             }
         }
+
+        function open(): void {
+            for (let i = 0; i < sidebarVariants.instances.length; i++) {
+                let panelWindow = sidebarVariants.instances[i];
+                if (panelWindow.modelData.name == Hyprland.focusedMonitor.name) {
+                    panelWindow.visible = true;
+                }
+            }
+        }
     }
 
 }