From 0718546167fc7c1386c0c10a529fba328ac8044f Mon Sep 17 00:00:00 2001
From: end-4 <97237370+end-4@users.noreply.github.com>
Date: Wed, 22 Oct 2025 01:27:29 +0200
Subject: [PATCH] refractor icon toolbar buttons

---
 .../common/widgets/IconToolbarButton.qml      | 21 +++++++++++
 .../ii/modules/lock/LockSurface.qml           | 26 +++-----------
 .../WallpaperSelectorContent.qml              | 36 +++++--------------
 3 files changed, 33 insertions(+), 50 deletions(-)
 create mode 100644 dots/.config/quickshell/ii/modules/common/widgets/IconToolbarButton.qml

diff --git a/dots/.config/quickshell/ii/modules/common/widgets/IconToolbarButton.qml b/dots/.config/quickshell/ii/modules/common/widgets/IconToolbarButton.qml
new file mode 100644
index 000000000..8532d0cd4
--- /dev/null
+++ b/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
+    }
+}
diff --git a/dots/.config/quickshell/ii/modules/lock/LockSurface.qml b/dots/.config/quickshell/ii/modules/lock/LockSurface.qml
index 7a4340705..5feba6c72 100644
--- a/dots/.config/quickshell/ii/modules/lock/LockSurface.qml
+++ b/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
diff --git a/dots/.config/quickshell/ii/modules/wallpaperSelector/WallpaperSelectorContent.qml b/dots/.config/quickshell/ii/modules/wallpaperSelector/WallpaperSelectorContent.qml
index 9d89dfd7d..a093d38ca 100644
--- a/dots/.config/quickshell/ii/modules/wallpaperSelector/WallpaperSelectorContent.qml
+++ b/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 {
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "open_in_new"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
+                            text: "open_in_new"
                             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 {
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "ifl"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
+                            text: "ifl"
                             StyledToolTip {
                                 text: Translation.tr("Pick random from this folder")
                             }
                         }
 
-                        ToolbarButton {
+                        IconToolbarButton {
                             implicitWidth: height
                             onClicked: root.useDarkMode = !root.useDarkMode
-                            contentItem: MaterialSymbol {
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: root.useDarkMode ? "dark_mode" : "light_mode"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
+                            text: root.useDarkMode ? "dark_mode" : "light_mode"
                             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 {
-                                anchors.centerIn: parent
-                                horizontalAlignment: Text.AlignHCenter
-                                text: "cancel_presentation"
-                                iconSize: Appearance.font.pixelSize.larger
-                            }
+                            text: "close"
                             StyledToolTip {
                                 text: Translation.tr("Cancel wallpaper selection")
                             }