From ba1c30ef5471dc14af2c44ab88de46f585136ad8 Mon Sep 17 00:00:00 2001
From: quadbyte <studio@quadbyte.net>
Date: Sun, 17 Aug 2025 14:29:18 -0400
Subject: [PATCH] Settings: Rounded borders slider.

---
 Commons/Settings.qml                      |  1 +
 Commons/Style.qml                         |  8 ++---
 Modules/SettingsPanel/Tabs/AudioTab.qml   |  3 +-
 Modules/SettingsPanel/Tabs/GeneralTab.qml | 39 +++++++++++++++++++++++
 Widgets/NImageRounded.qml                 | 10 +++---
 5 files changed, 52 insertions(+), 9 deletions(-)

diff --git a/Commons/Settings.qml b/Commons/Settings.qml
index 009cdc9..eed8bbe 100644
--- a/Commons/Settings.qml
+++ b/Commons/Settings.qml
@@ -88,6 +88,7 @@ Singleton {
         property string avatarImage: defaultAvatar
         property bool dimDesktop: true
         property bool showScreenCorners: false
+        property real radiusRatio: 1.0
       }
 
       // location
diff --git a/Commons/Style.qml b/Commons/Style.qml
index db80b1d..c1f4e95 100644
--- a/Commons/Style.qml
+++ b/Commons/Style.qml
@@ -29,10 +29,10 @@ Singleton {
   property int fontWeightBold: 700
 
   // Radii
-  property int radiusTiny: 8
-  property int radiusSmall: 12
-  property int radiusMedium: 16
-  property int radiusLarge: 20
+  property int radiusTiny: 8 * Settings.data.general.radiusRatio
+  property int radiusSmall: 12 * Settings.data.general.radiusRatio
+  property int radiusMedium: 16 * Settings.data.general.radiusRatio
+  property int radiusLarge: 20 * Settings.data.general.radiusRatio
 
   // Border
   property int borderThin: 1
diff --git a/Modules/SettingsPanel/Tabs/AudioTab.qml b/Modules/SettingsPanel/Tabs/AudioTab.qml
index d454f2b..b79a943 100644
--- a/Modules/SettingsPanel/Tabs/AudioTab.qml
+++ b/Modules/SettingsPanel/Tabs/AudioTab.qml
@@ -109,6 +109,7 @@ ColumnLayout {
               NText {
                 text: Math.floor(AudioService.volume * 100) + "%"
                 Layout.alignment: Qt.AlignVCenter
+                Layout.leftMargin: Style.marginSmall * scaling
                 color: Color.mOnSurface
               }
             }
@@ -121,7 +122,7 @@ ColumnLayout {
             Layout.topMargin: Style.marginMedium * scaling
 
             NToggle {
-              label: "Mute AudioService"
+              label: "Mute Audio Output"
               description: "Mute or unmute the default audio output"
               checked: AudioService.muted
               onToggled: checked => {
diff --git a/Modules/SettingsPanel/Tabs/GeneralTab.qml b/Modules/SettingsPanel/Tabs/GeneralTab.qml
index 9e32849..f7aa623 100644
--- a/Modules/SettingsPanel/Tabs/GeneralTab.qml
+++ b/Modules/SettingsPanel/Tabs/GeneralTab.qml
@@ -118,6 +118,45 @@ ColumnLayout {
                        Settings.data.dock.autoHide = checked
                      }
         }
+
+        ColumnLayout {
+          spacing: Style.marginTiniest * scaling
+          Layout.fillWidth: true
+
+          NText {
+            text: "Border radius"
+            font.pointSize: Style.fontSizeLarge * scaling
+            font.weight: Style.fontWeightBold
+            color: Color.mOnSurface
+          }
+
+          NText {
+            text: "Adjust the rounded border of all UI elements"
+            font.pointSize: Style.fontSizeSmall * scaling
+            color: Color.mOnSurfaceVariant
+            wrapMode: Text.WordWrap
+            Layout.fillWidth: true
+          }
+
+          RowLayout {
+            NSlider {
+              Layout.fillWidth: true
+              from: 0
+              to: 1
+              stepSize: 0.01
+              value: Settings.data.general.radiusRatio
+              onMoved: Settings.data.general.radiusRatio = value
+              cutoutColor: Color.mSurface
+            }
+
+            NText {
+              text: Math.floor(Settings.data.general.radiusRatio * 100) + "%"
+              Layout.alignment: Qt.AlignVCenter
+              Layout.leftMargin: Style.marginSmall * scaling
+              color: Color.mOnSurface
+            }
+          }
+        }
       }
     }
   }
diff --git a/Widgets/NImageRounded.qml b/Widgets/NImageRounded.qml
index ad2915f..20adac3 100644
--- a/Widgets/NImageRounded.qml
+++ b/Widgets/NImageRounded.qml
@@ -7,15 +7,17 @@ import qs.Services
 
 Rectangle {
   id: root
-  color: Color.transparent
-  property real imageRadius: width * 0.5
-  radius: imageRadius
 
   property string imagePath: ""
   property string fallbackIcon: ""
   property color borderColor: Color.transparent
   property real borderWidth: 0
+  property real imageRadius: width * 0.5
 
+  property real scaledRadius: imageRadius * Settings.data.general.radiusRatio
+
+  color: Color.transparent
+  radius: scaledRadius
   anchors.margins: Style.marginTiniest * scaling
 
   // Border
@@ -54,7 +56,7 @@ Rectangle {
     visible: false
     Rectangle {
       anchors.fill: parent
-      radius: root.imageRadius
+      radius: scaledRadius
     }
   }