From 166d638bce081631705687501020725045920e50 Mon Sep 17 00:00:00 2001 From: "Danilo M." Date: Sat, 17 Oct 2026 10:43:38 +0200 Subject: settings: the sidebar is grouped Ten pages in one flat list had stopped reading as a list. A module now names its group, and the sidebar sorts by it and draws a small heading where it changes: Account (user, git), Appearance (wallpaper, theme, icons), Desktop (HyprSunset, HyprIdle, autostart) and Assistant (the daemon, Ask presets). Groups keep the order their first page is declared in, so shell.qml's module order still decides. Co-Authored-By: Claude Opus 5.5 --- desktop/Settings.qml | 91 +++++++++++++++++++++++++++++++++------------------- 1 file changed, 58 insertions(+), 33 deletions(-) (limited to 'desktop/Settings.qml') diff --git a/desktop/Settings.qml b/desktop/Settings.qml index e8895a4..dd376c7 100644 --- a/desktop/Settings.qml +++ b/desktop/Settings.qml @@ -24,11 +24,17 @@ Scope { property bool open: false property string page: "" + // Grouped: a group's pages together, groups in the order their first + // page is declared, pages in declaration order within a group. readonly property var pages: { const out = []; for (let i = 0; i < root.modules.length; i++) if (root.modules[i].settings) out.push(root.modules[i]); - return out; + const order = []; + for (const m of out) if (!order.includes(m.group)) order.push(m.group); + return out.map((m, i) => ({ m, i })) + .sort((a, b) => order.indexOf(a.m.group) - order.indexOf(b.m.group) || a.i - b.i) + .map(x => x.m); } property string query: "" @@ -166,48 +172,67 @@ Scope { spacing: 4 model: root.found - delegate: Rectangle { - id: entry + // A group's heading above its first entry, then the entry. + delegate: Column { + id: slot required property var modelData - readonly property bool selected: root.current === modelData.mod && modelData.key === "" + required property int index width: side.width - height: modelData.hit ? 46 : 36 - radius: 8 - color: selected ? Qt.alpha(Theme.accent, 0.22) - : area.containsMouse ? Qt.alpha(Theme.text, 0.06) : "transparent" Text { - id: entryIcon - anchors { left: parent.left; leftMargin: 10; verticalCenter: parent.verticalCenter } - text: entry.modelData.mod.icon - font { family: Theme.iconFamily; pixelSize: Theme.fontSize } - color: Theme.text + visible: slot.modelData.mod.group !== "" + && (slot.index === 0 || root.found[slot.index - 1].mod.group !== slot.modelData.mod.group) + leftPadding: 10 + topPadding: slot.index === 0 ? 4 : 14 + bottomPadding: 4 + text: slot.modelData.mod.group.toUpperCase() + font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 5; bold: true; letterSpacing: 1 } + color: Theme.overlay } - Column { - anchors { left: entryIcon.right; leftMargin: 10; right: parent.right; rightMargin: 8 - verticalCenter: parent.verticalCenter } + + Rectangle { + id: entry + readonly property var modelData: slot.modelData + readonly property bool selected: root.current === modelData.mod && modelData.key === "" + width: side.width + height: modelData.hit ? 46 : 36 + radius: 8 + color: selected ? Qt.alpha(Theme.accent, 0.22) + : area.containsMouse ? Qt.alpha(Theme.text, 0.06) : "transparent" + Text { - text: entry.modelData.mod.label - font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 2 } + id: entryIcon + anchors { left: parent.left; leftMargin: 10; verticalCenter: parent.verticalCenter } + text: entry.modelData.mod.icon + font { family: Theme.iconFamily; pixelSize: Theme.fontSize } color: Theme.text } - // Which buried setting matched, when the label did not. - Text { - visible: entry.modelData.hit !== "" - width: parent.width - elide: Text.ElideRight - text: entry.modelData.hit - font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 5 } - color: Theme.subtext + Column { + anchors { left: entryIcon.right; leftMargin: 10; right: parent.right; rightMargin: 8 + verticalCenter: parent.verticalCenter } + Text { + text: entry.modelData.mod.label + font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 2 } + color: Theme.text + } + // Which buried setting matched, when the label did not. + Text { + visible: entry.modelData.hit !== "" + width: parent.width + elide: Text.ElideRight + text: entry.modelData.hit + font { family: Theme.fontFamily; pixelSize: Theme.fontSize - 5 } + color: Theme.subtext + } } - } - MouseArea { - id: area - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.PointingHandCursor - onClicked: root.go(entry.modelData) + MouseArea { + id: area + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.PointingHandCursor + onClicked: root.go(entry.modelData) + } } } } -- cgit v1.2.3