Settings: Rounded borders slider.

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

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

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 => {

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
+            }
+          }
+        }
       }
     }
   }

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
     }
   }