sidebar calendar thingie: navrail

.config/quickshell/modules/common/Appearance.qml

@@ -122,6 +122,10 @@ Singleton {
         property color colLayer3Active: mix(colLayer3, colOnLayer3, 0.80);
         property color colPrimaryHover: mix(m3colors.m3primary, colLayer1Hover, 0.7)
         property color colPrimaryActive: mix(m3colors.m3primary, colLayer1Active, 0.4)
+        property color colSecondaryHover: mix(m3colors.m3secondary, colLayer1Hover, 0.7)
+        property color colSecondaryActive: mix(m3colors.m3secondary, colLayer1Active, 0.4)
+        property color colSecondaryContainerHover: mix(m3colors.m3secondaryContainer, colLayer1Hover, 0.8)
+        property color colSecondaryContainerActive: mix(m3colors.m3secondaryContainer, colLayer1Active, 0.6)
         property color colTooltip: m3colors.m3inverseSurface
         property color colOnTooltip: m3colors.m3inverseOnSurface
     }
@@ -145,13 +149,14 @@ Singleton {
             property string monospace: "JetBrains Mono NF"
             property string reading: "Readex Pro"
         }
-        property QtObject pointSize: QtObject {
-            property int smaller: 10
-            property int small: 11
-            property int normal: 12
-            property int large: 13
-            property int larger: 14
-            property int huge: 16
+        property QtObject pixelSize: QtObject {
+            property int smaller: 13
+            property int small: 15
+            property int normal: 16
+            property int large: 17
+            property int larger: 19
+            property int huge: 22
+            property int hugeass: 23
         }
     }
 

.config/quickshell/modules/common/widgets/CustomIcon.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import Qt.labs.platform
 import Quickshell
 import Quickshell.Widgets
 
@@ -7,7 +6,7 @@ Item {
     id: root
     
     property string source: ""
-    property string iconFolder: StandardPaths.standardLocations(StandardPaths.ConfigLocation)[0] + "/quickshell/assets/icons"  // The folder to check first
+    property string iconFolder: "root:/assets/icons"  // The folder to check first
     width: 30
     height: 30
     

.config/quickshell/modules/common/widgets/MaterialSymbol.qml

@@ -6,6 +6,6 @@ Text {
     renderType: Text.NativeRendering
     verticalAlignment: Text.AlignVCenter
     font.family: Appearance.font.family.iconMaterial
-    font.pointSize: Appearance.font.pointSize.small
+    font.pixelSize: Appearance.font.pixelSize.small
     color: Appearance.colors.colOnBackground
 }

.config/quickshell/modules/common/widgets/NavRailButton.qml

@@ -0,0 +1,64 @@
+import "root:/modules/common"
+import "root:/modules/common/widgets"
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Quickshell.Io
+
+Button {
+    id: button
+
+    property bool toggled
+    property string buttonIcon
+    property string buttonText
+
+    Layout.alignment: Qt.AlignHCenter
+    implicitHeight: columnLayout.implicitHeight
+    implicitWidth: columnLayout.implicitWidth
+
+    background: Item{} // No ugly bg
+
+    // Real stuff
+    ColumnLayout {
+        id: columnLayout
+        spacing: 5
+        Rectangle {
+            width: 62
+            implicitHeight: navRailButtonIcon.height + 2*2
+            Layout.alignment: Qt.AlignHCenter
+            radius: Appearance.rounding.full
+            color: toggled ? 
+                (button.down ? Appearance.colors.colSecondaryContainerActive : button.hovered ? Appearance.colors.colSecondaryContainerHover : Appearance.m3colors.m3secondaryContainer) :
+                (button.down ? Appearance.colors.colLayer1Active : button.hovered ? Appearance.colors.colLayer1Hover : Appearance.transparentize(Appearance.colors.colLayer1Hover, 1))
+
+            Behavior on color {
+                ColorAnimation {
+                    duration: Appearance.animation.elementDecel.duration
+                    easing.type: Appearance.animation.elementDecel.type
+                }
+
+            }
+            MaterialSymbol {
+                id: navRailButtonIcon
+                anchors.centerIn: parent
+                font.pixelSize: Appearance.font.pixelSize.hugeass
+                text: buttonIcon
+                color: toggled ? Appearance.m3colors.m3onSecondaryContainer : Appearance.colors.colOnLayer1
+
+                Behavior on color {
+                    ColorAnimation {
+                        duration: Appearance.animation.elementDecel.duration
+                        easing.type: Appearance.animation.elementDecel.type
+                    }
+                }
+            }
+        }
+
+        StyledText {
+            Layout.alignment: Qt.AlignHCenter
+            text: buttonText
+            color: Appearance.colors.colOnLayer1
+        }
+    }
+
+}

.config/quickshell/modules/common/widgets/StyledText.qml

@@ -6,6 +6,6 @@ Text {
     renderType: Text.NativeRendering
     verticalAlignment: Text.AlignVCenter
     font.family: Appearance.font.family.main
-    font.pointSize: Appearance.font.pointSize.small
+    font.pixelSize: Appearance.font.pixelSize.small
     color: Appearance.colors.colOnBackground
 }