Custom buttons: refactored files structure

Modules/Bar/Widgets/CustomButton.qml

@@ -1,19 +1,21 @@
 import QtQuick
 import QtQuick.Layouts
+import Quickshell
 import qs.Commons
 import qs.Services
 import qs.Widgets
 
 NIconButton {
   id: root
-  
+
   // Widget properties passed from Bar.qml
   property var screen
   property real scaling: 1.0
+
   property string barSection: ""
   property int sectionWidgetIndex: -1
   property int sectionWidgetsCount: 0
-  
+
   // Get user settings from Settings data
   property var widgetSettings: {
     var section = barSection.replace("Section", "").toLowerCase()
@@ -25,19 +27,15 @@ NIconButton {
     }
     return {}
   }
-  
+
   // Use settings or defaults from BarWidgetRegistry
   property string userIcon: widgetSettings.icon || BarWidgetRegistry.widgetMetadata["CustomButton"].icon
   property string userExecute: widgetSettings.execute || BarWidgetRegistry.widgetMetadata["CustomButton"].execute
-  
+
   icon: userIcon
   tooltipText: userExecute ? `Execute: ${userExecute}` : "Custom Button - Configure in settings"
-  
-  colorBg: Color.transparent
-  colorFg: Color.mOnSurface
-  colorBgHover: Color.applyOpacity(Color.mPrimary, "20")
-  colorFgHover: Color.mPrimary
-  
+  opacity: userExecute ? Style.opacityFull : Style.opacityMedium
+
   onClicked: {
     if (userExecute) {
       // Execute the user's command
@@ -47,11 +45,8 @@ NIconButton {
       Logger.warn("CustomButton", "No command configured for this button")
     }
   }
-  
-  // Visual feedback when no command is set
-  opacity: userExecute ? 1.0 : 0.6
-  
+
   Component.onCompleted: {
     Logger.log("CustomButton", `Initialized with icon: ${userIcon}, command: ${userExecute}`)
   }
-}
+}