Formatting

Modules/Settings/Tabs/About.qml

@@ -23,12 +23,15 @@ Item {
   function loadFromFile() {
     const now = Date.now()
     const data = githubData
-    if (!data.timestamp || (now - data.timestamp > 3600 * 1000)) { // 1h cache
+    if (!data.timestamp || (now - data.timestamp > 3600 * 1000)) {
+      // 1h cache
       fetchFromGitHub()
       return
     }
-    if (data.version) root.latestVersion = data.version
+    if (data.version)
-    if (data.contributors) root.contributors = data.contributors
+      root.latestVersion = data.version
+    if (data.contributors)
+      root.contributors = data.contributors
   }
 
   function fetchFromGitHub() {
@@ -38,7 +41,9 @@ Item {
 
   function saveData() {
     githubData.timestamp = Date.now()
-    Qt.callLater(function () { githubDataFile.writeAdapter() })
+    Qt.callLater(function () {
+      githubDataFile.writeAdapter()
+    })
   }
 
   ColumnLayout {
@@ -47,27 +52,67 @@ Item {
     spacing: Style.marginMedium * scaling
 
     // Header
-    NText { text: "Noctalia: quiet by design"; font.weight: Style.fontWeightBold; color: Colors.textPrimary }
+    NText {
-    NText { text: "It may just be another quickshell setup but it won't get in your way."; color: Colors.textSecondary }
+      text: "Noctalia: quiet by design"
+      font.weight: Style.fontWeightBold
+      color: Colors.textPrimary
+    }
+    NText {
+      text: "It may just be another quickshell setup but it won't get in your way."
+      color: Colors.textSecondary
+    }
 
     // Versions grid
     RowLayout {
       spacing: Style.marginLarge * scaling
-      ColumnLayout { NText { text: "Latest Version:"; color: Colors.textSecondary }; NText { text: root.latestVersion; font.weight: Style.fontWeightBold; color: Colors.textPrimary } }
+      ColumnLayout {
-      ColumnLayout { NText { text: "Installed Version:"; color: Colors.textSecondary }; NText { text: root.currentVersion; font.weight: Style.fontWeightBold; color: Colors.textPrimary } }
+        NText {
-      Item { Layout.fillWidth: true }
+          text: "Latest Version:"
+          color: Colors.textSecondary
+        }
+        NText {
+          text: root.latestVersion
+          font.weight: Style.fontWeightBold
+          color: Colors.textPrimary
+        }
+      }
+      ColumnLayout {
+        NText {
+          text: "Installed Version:"
+          color: Colors.textSecondary
+        }
+        NText {
+          text: root.currentVersion
+          font.weight: Style.fontWeightBold
+          color: Colors.textPrimary
+        }
+      }
+      Item {
+        Layout.fillWidth: true
+      }
       NIconButton {
         icon: "system_update"
         tooltipText: "Open latest release"
-        onClicked: Quickshell.execDetached(["xdg-open", "https://github.com/Ly-sec/Noctalia/releases/latest"]) }
+        onClicked: Quickshell.execDetached(["xdg-open", "https://github.com/Ly-sec/Noctalia/releases/latest"])
+      }
     }
 
-    NDivider { Layout.fillWidth: true }
+    NDivider {
+      Layout.fillWidth: true
+    }
 
     // Contributors
-    RowLayout { spacing: Style.marginSmall * scaling
+    RowLayout {
-      NText { text: "Contributors"; font.weight: Style.fontWeightBold; color: Colors.textPrimary }
+      spacing: Style.marginSmall * scaling
-      NText { text: "(" + root.contributors.length + ")"; color: Colors.textSecondary }
+      NText {
+        text: "Contributors"
+        font.weight: Style.fontWeightBold
+        color: Colors.textPrimary
+      }
+      NText {
+        text: "(" + root.contributors.length + ")"
+        color: Colors.textSecondary
+      }
     }
 
     GridView {
@@ -89,21 +134,64 @@ Item {
           Item {
             Layout.preferredWidth: 40 * scaling
             Layout.preferredHeight: 40 * scaling
-            Image { id: avatarImage; anchors.fill: parent; source: modelData.avatar_url || ""; asynchronous: true; visible: false; fillMode: Image.PreserveAspectCrop }
+            Image {
-            MultiEffect { anchors.fill: parent; source: avatarImage; maskEnabled: true; maskSource: mask }
+              id: avatarImage
-            Item { id: mask; anchors.fill: parent; visible: false; Rectangle { anchors.fill: parent; radius: width / 2 } }
+              anchors.fill: parent
-            NText { anchors.centerIn: parent; text: "person"; font.family: "Material Symbols Outlined"; color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary; visible: !avatarImage.source || avatarImage.status !== Image.Ready }
+              source: modelData.avatar_url || ""
+              asynchronous: true
+              visible: false
+              fillMode: Image.PreserveAspectCrop
+            }
+            MultiEffect {
+              anchors.fill: parent
+              source: avatarImage
+              maskEnabled: true
+              maskSource: mask
+            }
+            Item {
+              id: mask
+              anchors.fill: parent
+              visible: false
+              Rectangle {
+                anchors.fill: parent
+                radius: width / 2
+              }
+            }
+            NText {
+              anchors.centerIn: parent
+              text: "person"
+              font.family: "Material Symbols Outlined"
+              color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary
+              visible: !avatarImage.source || avatarImage.status !== Image.Ready
+            }
           }
-          ColumnLayout { Layout.fillWidth: true; spacing: 2 * scaling
+          ColumnLayout {
-            NText { text: modelData.login || "Unknown"; color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary }
+            Layout.fillWidth: true
-            NText { text: (modelData.contributions || 0) + " commits"; color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textSecondary }
+            spacing: 2 * scaling
+            NText {
+              text: modelData.login || "Unknown"
+              color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary
+            }
+            NText {
+              text: (modelData.contributions || 0) + " commits"
+              color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textSecondary
+            }
           }
         }
-        MouseArea { id: contributorArea; anchors.fill: parent; hoverEnabled: true; cursorShape: Qt.PointingHandCursor; onClicked: if (modelData.html_url) Quickshell.execDetached(["xdg-open", modelData.html_url]) }
+        MouseArea {
+          id: contributorArea
+          anchors.fill: parent
+          hoverEnabled: true
+          cursorShape: Qt.PointingHandCursor
+          onClicked: if (modelData.html_url)
+                       Quickshell.execDetached(["xdg-open", modelData.html_url])
+        }
       }
     }
 
-    Item { Layout.fillHeight: true }
+    Item {
+      Layout.fillHeight: true
+    }
   }
 
   // Processes and persistence
@@ -117,7 +205,8 @@ Item {
         if (version && version !== "Unknown") {
           root.currentVersion = version
         } else {
-          currentVersionProcess.command = ["sh", "-c", "cd " + Quickshell.shellDir + " && cat package.json 2>/dev/null | grep '\"version\"' | cut -d'\"' -f4 || echo 'Unknown'"]
+          currentVersionProcess.command = ["sh", "-c", "cd " + Quickshell.shellDir
+                                           + " && cat package.json 2>/dev/null | grep '\"version\"' | cut -d'\"' -f4 || echo 'Unknown'"]
           currentVersionProcess.running = true
         }
       }
@@ -133,10 +222,22 @@ Item {
     onFileChanged: githubDataFile.reload()
     onLoaded: loadFromFile()
     onLoadFailed: {
-      githubData.version = "Unknown"; githubData.contributors = []; githubData.timestamp = 0; githubDataFile.writeAdapter(); fetchFromGitHub()
+      githubData.version = "Unknown"
+      githubData.contributors = []
+      githubData.timestamp = 0
+      githubDataFile.writeAdapter()
+      fetchFromGitHub()
+    }
+    Component.onCompleted: {
+      if (path)
+        reload()
+    }
+    JsonAdapter {
+      id: githubData
+      property string version: "Unknown"
+      property var contributors: []
+      property double timestamp: 0
     }
-    Component.onCompleted: { if (path) reload() }
-    JsonAdapter { id: githubData; property string version: "Unknown"; property var contributors: []; property double timestamp: 0 }
   }
 
   Process {
@@ -146,9 +247,15 @@ Item {
       onStreamFinished: {
         try {
           const data = JSON.parse(text)
-          if (data.tag_name) { const version = data.tag_name; githubData.version = version; root.latestVersion = version }
+          if (data.tag_name) {
+            const version = data.tag_name
+            githubData.version = version
+            root.latestVersion = version
+          }
           saveData()
-        } catch (e) { console.error("Failed to parse version:", e) }
+        } catch (e) {
+          console.error("Failed to parse version:", e)
+        }
       }
     }
   }
@@ -163,7 +270,10 @@ Item {
           githubData.contributors = data || []
           root.contributors = githubData.contributors
           saveData()
-        } catch (e) { console.error("Failed to parse contributors:", e); root.contributors = [] }
+        } catch (e) {
+          console.error("Failed to parse contributors:", e)
+          root.contributors = []
+        }
       }
     }
   }

Modules/Settings/Tabs/Wallpaper.qml

@@ -14,59 +14,104 @@ Item {
     anchors.fill: parent
     spacing: Style.marginMedium * scaling
 
-    NText { text: "Wallpaper Settings"; font.weight: Style.fontWeightBold; color: Colors.accentSecondary }
+    NText {
+      text: "Wallpaper Settings"
+      font.weight: Style.fontWeightBold
+      color: Colors.accentSecondary
+    }
 
     // Folder
-    NText { text: "Wallpaper Folder"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+    NText {
-    NText { text: "Path to your wallpaper folder"; color: Colors.textSecondary; wrapMode: Text.WordWrap }
+      text: "Wallpaper Folder"
+
+      font.weight: Style.fontWeightBold
+    }
+    NText {
+      text: "Path to your wallpaper folder"
+      color: Colors.textSecondary
+      wrapMode: Text.WordWrap
+    }
     NTextBox {
       text: Settings.data.wallpaper.directory
       Layout.fillWidth: true
       onEditingFinished: Settings.data.wallpaper.directory = text
     }
 
-    NDivider { Layout.fillWidth: true }
+    NDivider {
+      Layout.fillWidth: true
+    }
 
-    NText { text: "Automation"; font.weight: Style.fontWeightBold; color: Colors.accentSecondary }
+    // ----------------------------
+    NText {
+      text: "Automation"
+      font.weight: Style.fontWeightBold
+      color: Colors.accentSecondary
+    }
 
     NToggle {
       label: "Random Wallpaper"
       description: "Automatically select random wallpapers from the folder"
       value: Settings.data.wallpaper.isRandom
-      onToggled: function (newValue) { Settings.data.wallpaper.isRandom = newValue }
+      onToggled: function (newValue) {
+        Settings.data.wallpaper.isRandom = newValue
+      }
     }
 
     NToggle {
       label: "Use Wallpaper Theme"
       description: "Automatically adjust theme colors based on wallpaper"
       value: Settings.data.wallpaper.generateTheme
-      onToggled: function (newValue) { Settings.data.wallpaper.generateTheme = newValue }
+      onToggled: function (newValue) {
+        Settings.data.wallpaper.generateTheme = newValue
+      }
     }
 
-    NText { text: "Wallpaper Interval"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+    NText {
-    NText { text: "How often to change wallpapers automatically (in seconds)"; color: Colors.textSecondary }
+      text: "Wallpaper Interval"
+      color: Colors.textPrimary
+      font.weight: Style.fontWeightBold
+    }
+    NText {
+      text: "How often to change wallpapers automatically (in seconds)"
+      color: Colors.textSecondary
+    }
     RowLayout {
       Layout.fillWidth: true
-      NText { text: Settings.data.wallpaper.randomInterval + " seconds"; color: Colors.textPrimary }
+      NText {
-      Item { Layout.fillWidth: true }
+        text: Settings.data.wallpaper.randomInterval + " seconds"
+        color: Colors.textPrimary
+      }
+      Item {
+        Layout.fillWidth: true
+      }
     }
     NSlider {
       Layout.fillWidth: true
-      from: 10; to: 900; stepSize: 10
+      from: 10
+      to: 900
+      stepSize: 10
       value: Settings.data.wallpaper.randomInterval
       onMoved: Settings.data.wallpaper.randomInterval = Math.round(value)
       cutoutColor: Colors.backgroundPrimary
     }
 
-    NDivider { Layout.fillWidth: true }
+    NDivider {
+      Layout.fillWidth: true
+    }
 
-    NText { text: "SWWW"; font.weight: Style.fontWeightBold; color: Colors.accentSecondary }
+    NText {
+      text: "SWWW"
+      font.weight: Style.fontWeightBold
+      color: Colors.accentSecondary
+    }
 
     NToggle {
       label: "Use SWWW"
       description: "Use SWWW daemon for advanced wallpaper management"
       value: Settings.data.wallpaper.swww.enabled
-      onToggled: function (newValue) { Settings.data.wallpaper.swww.enabled = newValue }
+      onToggled: function (newValue) {
+        Settings.data.wallpaper.swww.enabled = newValue
+      }
     }
 
     // SWWW settings
@@ -74,45 +119,94 @@ Item {
       spacing: Style.marginSmall * scaling
       visible: Settings.data.wallpaper.swww.enabled
 
-      NText { text: "Resize Mode"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+      NText {
-      NText { text: "How SWWW should resize wallpapers to fit the screen"; color: Colors.textSecondary; wrapMode: Text.WordWrap }
+        text: "Resize Mode"
+        font.weight: Style.fontWeightBold
+      }
+      NText {
+        text: "How SWWW should resize wallpapers to fit the screen"
+        color: Colors.textSecondary
+        wrapMode: Text.WordWrap
+      }
       NComboBox {
         optionsKeys: ["no", "crop", "fit", "stretch"]
         optionsLabels: ["No", "Crop", "Fit", "Stretch"]
         currentKey: Settings.data.wallpaper.swww.resizeMethod
-        onSelected: function (key) { Settings.data.wallpaper.swww.resizeMethod = key }
+        onSelected: function (key) {
+          Settings.data.wallpaper.swww.resizeMethod = key
+        }
       }
 
-      NText { text: "Transition Type"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+      NText {
-      NText { text: "Animation type when switching between wallpapers"; color: Colors.textSecondary; wrapMode: Text.WordWrap }
+        text: "Transition Type"
+        font.weight: Style.fontWeightBold
+      }
+      NText {
+        text: "Animation type when switching between wallpapers"
+        color: Colors.textSecondary
+        wrapMode: Text.WordWrap
+      }
       NComboBox {
         optionsKeys: ["none", "simple", "fade", "left", "right", "top", "bottom", "wipe", "wave", "grow", "center", "any", "outer", "random"]
         optionsLabels: ["None", "Simple", "Fade", "Left", "Right", "Top", "Bottom", "Wipe", "Wave", "Grow", "Center", "Any", "Outer", "Random"]
         currentKey: Settings.data.wallpaper.swww.transitionType
-        onSelected: function (key) { Settings.data.wallpaper.swww.transitionType = key }
+        onSelected: function (key) {
+          Settings.data.wallpaper.swww.transitionType = key
+        }
       }
 
-      NText { text: "Transition FPS"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+      NText {
-      RowLayout { Layout.fillWidth: true; NText { text: Settings.data.wallpaper.swww.transitionFps + " FPS"; color: Colors.textPrimary }; Item { Layout.fillWidth: true } }
+        text: "Transition FPS"
+        font.weight: Style.fontWeightBold
+      }
+      RowLayout {
+        Layout.fillWidth: true
+        NText {
+          text: Settings.data.wallpaper.swww.transitionFps + " FPS"
+          color: Colors.textPrimary
+        }
+        Item {
+          Layout.fillWidth: true
+        }
+      }
       NSlider {
         Layout.fillWidth: true
-        from: 30; to: 500; stepSize: 5
+        from: 30
+        to: 500
+        stepSize: 5
         value: Settings.data.wallpaper.swww.transitionFps
         onMoved: Settings.data.wallpaper.swww.transitionFps = Math.round(value)
         cutoutColor: Colors.backgroundPrimary
       }
 
-      NText { text: "Transition Duration"; color: Colors.textPrimary; font.weight: Style.fontWeightBold }
+      NText {
-      RowLayout { Layout.fillWidth: true; NText { text: Settings.data.wallpaper.swww.transitionDuration.toFixed(2) + " s"; color: Colors.textPrimary }; Item { Layout.fillWidth: true } }
+        text: "Transition Duration"
+        color: Colors.textPrimary
+        font.weight: Style.fontWeightBold
+      }
+      RowLayout {
+        Layout.fillWidth: true
+        NText {
+          text: Settings.data.wallpaper.swww.transitionDuration.toFixed(2) + " s"
+          color: Colors.textPrimary
+        }
+        Item {
+          Layout.fillWidth: true
+        }
+      }
       NSlider {
         Layout.fillWidth: true
-        from: 0.25; to: 10; stepSize: 0.05
+        from: 0.25
+        to: 10
+        stepSize: 0.05
         value: Settings.data.wallpaper.swww.transitionDuration
         onMoved: Settings.data.wallpaper.swww.transitionDuration = value
         cutoutColor: Colors.backgroundPrimary
       }
     }
 
-    Item { Layout.fillHeight: true }
+    Item {
+      Layout.fillHeight: true
+    }
   }
 }