refractor icon toolbar buttons

dots/.config/quickshell/ii/modules/common/widgets/IconToolbarButton.qml

@@ -0,0 +1,21 @@
+import QtQuick
+import QtQuick.Layouts
+import qs.modules.common
+
+ToolbarButton {
+    id: iconBtn
+    implicitWidth: height
+
+    colBackgroundToggled: Appearance.colors.colSecondaryContainer
+    colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
+    colRippleToggled: Appearance.colors.colSecondaryContainerActive
+
+    contentItem: MaterialSymbol {
+        anchors.centerIn: parent
+        horizontalAlignment: Text.AlignHCenter
+        verticalAlignment: Text.AlignVCenter
+        iconSize: 22
+        text: iconBtn.text
+        color: iconBtn.toggled ? Appearance.colors.colOnSecondaryContainer : Appearance.colors.colOnSurfaceVariant
+    }
+}

dots/.config/quickshell/ii/modules/lock/LockSurface.qml

@@ -234,26 +234,26 @@ MouseArea {
             color: (Battery.isLow && !Battery.isCharging) ? Appearance.colors.colError : Appearance.colors.colOnSurfaceVariant
         }
 
-        ActionToolbarIconButton {
+        IconToolbarButton {
             id: sleepButton
             onClicked: Session.suspend()
             text: "dark_mode"
         }
 
-        PasswordGuardedActionToolbarIconButton {
+        PasswordGuardedIconToolbarButton {
             id: powerButton
             text: "power_settings_new"
             targetAction: LockContext.ActionEnum.Poweroff
         }
 
-        PasswordGuardedActionToolbarIconButton {
+        PasswordGuardedIconToolbarButton {
             id: rebootButton
             text: "restart_alt"
             targetAction: LockContext.ActionEnum.Reboot
         }
     }
 
-    component PasswordGuardedActionToolbarIconButton: ActionToolbarIconButton {
+    component PasswordGuardedIconToolbarButton: IconToolbarButton {
         id: guardedBtn
         required property var targetAction
 
@@ -273,24 +273,6 @@ MouseArea {
         }
     }
 
-    component ActionToolbarIconButton: ToolbarButton {
-        id: iconBtn
-        implicitWidth: height
-
-        colBackgroundToggled: Appearance.colors.colSecondaryContainer
-        colBackgroundToggledHover: Appearance.colors.colSecondaryContainerHover
-        colRippleToggled: Appearance.colors.colSecondaryContainerActive
-
-        contentItem: MaterialSymbol {
-            anchors.centerIn: parent
-            horizontalAlignment: Text.AlignHCenter
-            verticalAlignment: Text.AlignVCenter
-            iconSize: 24
-            text: iconBtn.text
-            color: iconBtn.toggled ? Appearance.colors.colOnSecondaryContainer : Appearance.colors.colOnSurfaceVariant
-        }
-    }
-
     component IconAndTextPair: Row {
         id: pair
         required property string icon

dots/.config/quickshell/ii/modules/wallpaperSelector/WallpaperSelectorContent.qml

@@ -316,7 +316,7 @@ MouseArea {
                             bottomMargin: 8
                         }
 
-                        ToolbarButton {
+                        IconToolbarButton {
                             implicitWidth: height
                             onClicked: {
                                 Wallpapers.openFallbackPicker(root.useDarkMode);
@@ -327,42 +327,27 @@ MouseArea {
                                 GlobalStates.wallpaperSelectorOpen = false;
                                 Config.options.wallpaperSelector.useSystemFileDialog = true
                             }
-                            contentItem: MaterialSymbol {
+                            text: "open_in_new"
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "open_in_new"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
                             StyledToolTip {
                                 text: Translation.tr("Use the system file picker instead\nRight-click to make this the default behavior")
                             }
                         }
 
-                        ToolbarButton {
+                        IconToolbarButton {
                             implicitWidth: height
                             onClicked: {
                                 Wallpapers.randomFromCurrentFolder();
                             }
-                            contentItem: MaterialSymbol {
+                            text: "ifl"
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "ifl"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
                             StyledToolTip {
                                 text: Translation.tr("Pick random from this folder")
                             }
                         }
 
-                        ToolbarButton {
+                        IconToolbarButton {
                             implicitWidth: height
                             onClicked: root.useDarkMode = !root.useDarkMode
-                            contentItem: MaterialSymbol {
+                            text: root.useDarkMode ? "dark_mode" : "light_mode"
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: root.useDarkMode ? "dark_mode" : "light_mode"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
                             StyledToolTip {
                                 text: Translation.tr("Click to toggle light/dark mode\n(applied when wallpaper is chosen)")
                             }
@@ -403,17 +388,12 @@ MouseArea {
                             }
                         }
 
-                        ToolbarButton {
+                        IconToolbarButton {
                             implicitWidth: height
                             onClicked: {
                                 GlobalStates.wallpaperSelectorOpen = false;
                             }
-                            contentItem: MaterialSymbol {
+                            text: "close"
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "cancel_presentation"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
                             StyledToolTip {
                                 text: Translation.tr("Cancel wallpaper selection")
                             }