NCombox + NTextInput proper label/description support

+ Associated changes in window settings

Modules/DemoPanel/DemoPanel.qml

@@ -146,6 +146,8 @@ NLoader {
             }
 
             NComboBox {
+              label: "Animal"
+              description: "What's your favorite"
               optionsKeys: ["cat", "dog", "bird", "monkey", "fish", "turtle", "elephant", "tiger"]
               optionsLabels: ["Cat", "Dog", "Bird", "Monkey", "Fish", "Turtle", "Elephant", "Tiger"]
               currentKey: "cat"
@@ -169,14 +171,16 @@ NLoader {
             }
 
             NTextInput {
+              label: "Input label"
+              description: "A cool description"
               text: "Type anything"
               Layout.fillWidth: true
               onEditingFinished: {
 
               }
-              NDivider {
-                Layout.fillWidth: true
-              }
+            }
+            NDivider {
+              Layout.fillWidth: true
             }
           }
 

Modules/Settings/Tabs/General.qml

@@ -58,26 +58,15 @@ ColumnLayout {
               borderColor: Colors.accentPrimary
               borderWidth: Math.max(1, Style.borderMedium)
             }
-            ColumnLayout {
+
+            NTextInput {
+              label: "Profile Picture"
+              description: "Your profile picture displayed in various places throughout the shell"
+              text: Settings.data.general.avatarImage
+              placeholderText: "/home/user/.face"
               Layout.fillWidth: true
-              spacing: Style.marginTiny * scaling
-              NText {
-                text: "Profile Picture"
-                color: Colors.textPrimary
-                font.weight: Style.fontWeightBold
-              }
-              NText {
-                text: "Your profile picture displayed in various places throughout the shell"
-                color: Colors.textSecondary
-                font.pointSize: Style.fontSizeSmall * scaling
-              }
-              NTextInput {
-                text: Settings.data.general.avatarImage
-                placeholderText: "/home/user/.face"
-                Layout.fillWidth: true
-                onEditingFinished: {
-                  Settings.data.general.avatarImage = text
-                }
+              onEditingFinished: {
+                Settings.data.general.avatarImage = text
               }
             }
           }

Modules/Settings/Tabs/Network.qml

@@ -16,8 +16,7 @@ ColumnLayout {
 
     Layout.fillWidth: true
     Layout.fillHeight: true
-    padding: 16
-    rightPadding: 12
+    padding: Style.marginMedium * scaling
     clip: true
     ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
     ScrollBar.vertical.policy: ScrollBar.AsNeeded
@@ -32,46 +31,31 @@ ColumnLayout {
       }
 
       ColumnLayout {
-        spacing: 4
+        spacing: Style.marginLarge * scaling
         Layout.fillWidth: true
 
         NText {
           text: "Network Settings"
-          font.pointSize: 18
+          font.pointSize: Style.fontSizeXL * scaling
           font.weight: Style.fontWeightBold
           color: Colors.textPrimary
-          Layout.bottomMargin: 8
         }
 
-        // Network interfaces section
-        ColumnLayout {
-          spacing: 8
-          Layout.fillWidth: true
-          Layout.topMargin: 8
-
-          NText {
-            text: "Network Interfaces"
-            font.pointSize: 13
-            font.weight: Style.fontWeightBold
-            color: Colors.textPrimary
+        NToggle {
+          label: "WiFi Enabled"
+          description: "Enable WiFi connectivity"
+          value: Settings.data.network.wifiEnabled
+          onToggled: function (newValue) {
+            Settings.data.network.wifiEnabled = newValue
           }
+        }
 
-          NToggle {
-            label: "WiFi Enabled"
-            description: "Enable WiFi connectivity"
-            value: Settings.data.network.wifiEnabled
-            onToggled: function (newValue) {
-              Settings.data.network.wifiEnabled = newValue
-            }
-          }
-
-          NToggle {
-            label: "Bluetooth Enabled"
-            description: "Enable Bluetooth connectivity"
-            value: Settings.data.network.bluetoothEnabled
-            onToggled: function (newValue) {
-              Settings.data.network.bluetoothEnabled = newValue
-            }
+        NToggle {
+          label: "Bluetooth Enabled"
+          description: "Enable Bluetooth connectivity"
+          value: Settings.data.network.bluetoothEnabled
+          onToggled: function (newValue) {
+            Settings.data.network.bluetoothEnabled = newValue
           }
         }
       }

Modules/Settings/Tabs/ScreenRecorder.qml

@@ -33,7 +33,7 @@ ColumnLayout {
         Layout.fillWidth: true
 
         NText {
-          text: "Screen Recording"
+          text: "Recording"
           font.pointSize: Style.fontSizeXL * scaling
           font.weight: Style.fontWeightBold
           color: Colors.textPrimary
@@ -46,24 +46,10 @@ ColumnLayout {
           Layout.fillWidth: true
           Layout.topMargin: Style.marginSmall * scaling
 
-          ColumnLayout {
-            spacing: Style.marginTiny * scaling
-
-            NText {
-              text: "Output Directory"
-              font.weight: Style.fontWeightBold
-              color: Colors.textPrimary
-            }
-
-            NText {
-              text: "Directory where screen recordings will be saved"
-              font.pointSize: Style.fontSizeSmall * scaling
-              color: Colors.textSecondary
-              wrapMode: Text.WordWrap
-            }
-          }
-
           NTextInput {
+            label: "Output Directory"
+            description: "Directory where screen recordings will be saved"
+            placeholderText: "/home/xxx/Videos"
             text: Settings.data.screenRecorder.directory
             onEditingFinished: {
               Settings.data.screenRecorder.directory = text

Modules/Settings/Tabs/TimeWeather.qml

@@ -47,8 +47,10 @@ ColumnLayout {
           Layout.topMargin: Style.marginSmall * scaling
 
           NTextInput {
+            label: "Location name"
+            description: "Choose a known location near you"
             text: Settings.data.location.name
-            placeholderText: "Enter city name"
+            placeholderText: "Enter the location name"
             Layout.fillWidth: true
             onEditingFinished: {
               Settings.data.location.name = text
@@ -64,7 +66,7 @@ ColumnLayout {
 
         // Time section
         ColumnLayout {
-                    spacing: Style.marginLarge * scaling
+          spacing: Style.marginLarge * scaling
           Layout.fillWidth: true
 
           NText {

Modules/Settings/Tabs/Wallpaper.qml

@@ -14,8 +14,7 @@ ColumnLayout {
 
     Layout.fillWidth: true
     Layout.fillHeight: true
-    padding: 16
-    rightPadding: 12
+    padding: Style.marginMedium * scaling
     clip: true
     ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
     ScrollBar.vertical.policy: ScrollBar.AsNeeded