NPanel fixes

Commons/Settings.qml

@@ -188,8 +188,9 @@ Singleton {
       property JsonObject appLauncher: JsonObject {
         // When disabled, Launcher hides clipboard command and ignores cliphist
         property bool enableClipboardHistory: true
-        // Position: center, top_left, top_right, bottom_left, bottom_right
+        // Position: center, top_left, top_right, bottom_left, bottom_right, bottom_center, top_center
         property string position: "center"
+        property real backgroundOpacity: 1.0
         property list<string> pinnedExecs: []
       }
 

Modules/Launcher/Launcher.qml

@@ -18,11 +18,19 @@ NPanel {
   panelHeight: Math.min(550 * scaling, screen?.height * 0.8)
   // Positioning derives from Settings.data.bar.position for vertical (top/bottom)
   // and from Settings.data.appLauncher.position for horizontal vs center.
-  // Options: center, top_left, top_right, bottom_left, bottom_right
+  // Options: center, top_left, top_right, bottom_left, bottom_right, bottom_center, top_center
   readonly property string launcherPosition: Settings.data.appLauncher.position
-  panelAnchorCentered: launcherPosition === "center"
+
+  panelAnchorHorizontalCenter: launcherPosition === "center" || (launcherPosition.endsWith("_center"))
+  panelAnchorVerticalCenter: launcherPosition === "center"
   panelAnchorLeft: launcherPosition !== "center" && (launcherPosition.endsWith("_left"))
   panelAnchorRight: launcherPosition !== "center" && (launcherPosition.endsWith("_right"))
+  panelAnchorBottom: launcherPosition.startsWith("bottom_")
+  panelAnchorTop: launcherPosition.startsWith("top_")
+
+  // Background opacity following bar's approach
+  panelBackgroundColor: Qt.rgba(Color.mSurface.r, Color.mSurface.g, Color.mSurface.b,
+                                Settings.data.appLauncher.backgroundOpacity)
 
   // Properties
   property string searchText: ""
@@ -41,6 +49,8 @@ NPanel {
       searchText = ""
       selectedIndex = 0
     }
+
+
   }
 
   onClosed: {

Modules/PowerPanel/PowerPanel.qml

@@ -14,7 +14,8 @@ NPanel {
 
   panelWidth: 440 * scaling
   panelHeight: 380 * scaling
-  panelAnchorCentered: true
+  panelAnchorHorizontalCenter: true
+  panelAnchorVerticalCenter: true
 
   // Timer properties
   property int timerDuration: 9000 // 9 seconds

Modules/SettingsPanel/SettingsPanel.qml

@@ -13,7 +13,8 @@ NPanel {
 
   panelWidth: Math.max(screen?.width * 0.5, 1280) * scaling
   panelHeight: Math.max(screen?.height * 0.5, 720) * scaling
-  panelAnchorCentered: true
+  panelAnchorHorizontalCenter: true
+  panelAnchorVerticalCenter: true
 
   // Tabs enumeration, order is NOT relevant
   enum Tab {

Modules/SettingsPanel/Tabs/LauncherTab.qml

@@ -89,12 +89,54 @@ ColumnLayout {
               key: "bottom_right"
               name: "Bottom Right"
             }
+            ListElement {
+              key: "bottom_center"
+              name: "Bottom Center"
+            }
+            ListElement {
+              key: "top_center"
+              name: "Top Center"
+            }
           }
           currentKey: Settings.data.appLauncher.position
           onSelected: function (key) {
             Settings.data.appLauncher.position = key
           }
         }
+
+        NDivider {
+          Layout.fillWidth: true
+          Layout.topMargin: Style.marginL * scaling
+          Layout.bottomMargin: Style.marginS * scaling
+        }
+
+        NText {
+          text: "Launcher Background"
+          font.pointSize: Style.fontSizeXXL * scaling
+          font.weight: Style.fontWeightBold
+          color: Color.mOnSurface
+          Layout.bottomMargin: Style.marginS * scaling
+        }
+
+        RowLayout {
+          NSlider {
+            id: launcherBgOpacity
+            Layout.fillWidth: true
+            from: 0.0
+            to: 1.0
+            stepSize: 0.01
+            value: Settings.data.appLauncher.backgroundOpacity
+            onMoved: Settings.data.appLauncher.backgroundOpacity = value
+            cutoutColor: Color.mSurface
+          }
+
+          NText {
+            text: Math.floor(Settings.data.appLauncher.backgroundOpacity * 100) + "%"
+            Layout.alignment: Qt.AlignVCenter
+            Layout.leftMargin: Style.marginS * scaling
+            color: Color.mOnSurface
+          }
+        }
       }
     }
   }

Widgets/NPanel.qml

@@ -16,7 +16,12 @@ Loader {
   property Component panelContent: null
   property int panelWidth: 1500
   property int panelHeight: 400
-  property bool panelAnchorCentered: false
+  property color panelBackgroundColor: Color.mSurface
+
+  property bool panelAnchorHorizontalCenter: false
+  property bool panelAnchorVerticalCenter: false
+  property bool panelAnchorTop: false
+  property bool panelAnchorBottom: false
   property bool panelAnchorLeft: false
   property bool panelAnchorRight: false
 
@@ -153,7 +158,7 @@ Loader {
 
       Rectangle {
         id: panelBackground
-        color: Color.mSurface
+        color: panelBackgroundColor
         radius: Style.radiusL * scaling
         border.color: Color.mOutline
         border.width: Math.max(1, Style.borderS * scaling)
@@ -161,6 +166,12 @@ Loader {
         width: panelWidth
         height: panelHeight
 
+        scale: root.scaleValue
+        opacity: root.opacityValue
+
+        x: calculatedX
+        y: calculatedY
+
         property int calculatedX: {
           if (root.useButtonPosition) {
             // Position panel relative to button
@@ -171,9 +182,9 @@ Loader {
             var minX = Style.marginS * scaling
 
             return Math.max(minX, Math.min(targetX, maxX))
-          } else if (!panelAnchorCentered && panelAnchorLeft) {
+          } else if (!panelAnchorHorizontalCenter && panelAnchorLeft) {
             return Style.marginS * scaling
-          } else if (!panelAnchorCentered && panelAnchorRight) {
+          } else if (!panelAnchorHorizontalCenter && panelAnchorRight) {
             return panelWindow.width - panelWidth - (Style.marginS * scaling)
           } else {
             return (panelWindow.width - panelWidth) / 2
@@ -181,24 +192,27 @@ Loader {
         }
 
         property int calculatedY: {
-          // Position panel below or above the bar
+          if (panelAnchorVerticalCenter) {
-          if (!panelAnchorCentered) {
-            if (!barAtBottom) {
-              return Style.marginS * scaling
-            } else {
-              return panelWindow.height - panelHeight - (Style.marginS * scaling)
-            }
-          } else {
             return (panelWindow.height - panelHeight) / 2
           }
+          else if (panelAnchorBottom) {
+            return panelWindow.height - panelHeight - (Style.marginS * scaling)
+          }
+          else if (panelAnchorTop) {
+            return (Style.marginS * scaling)
+          }
+          else if (panelAnchorBottom) {
+            panelWindow.height - panelHeight - (Style.marginS * scaling)
+          }
+          else if (!barAtBottom) {
+            // Below the top bar
+            return Style.marginS * scaling
+          } else {
+            // Above the bottom bar
+            return panelWindow.height - panelHeight - (Style.marginS * scaling)
+          }
         }
 
-        x: calculatedX
-        y: calculatedY
-
-        scale: root.scaleValue
-        opacity: root.opacityValue
-
         // Animate in when component is completed
         Component.onCompleted: {
           root.scaleValue = 1.0