From 7ad940ea9f651187118048179689dfdbbdc71427 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 10 Nov 2025 15:57:11 -0500 Subject: controlcenter: taskbar object toggles --- modules/controlcenter/taskbar/TaskbarPane.qml | 402 ++++++++++++++++++++++++++ 1 file changed, 402 insertions(+) create mode 100644 modules/controlcenter/taskbar/TaskbarPane.qml (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml new file mode 100644 index 0000000..a367635 --- /dev/null +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -0,0 +1,402 @@ +pragma ComponentBehavior: Bound + +import ".." +import qs.components +import qs.components.controls +import qs.components.effects +import qs.components.containers +import qs.services +import qs.config +import qs.utils +import Quickshell +import Quickshell.Io +import QtQuick +import QtQuick.Layouts + +RowLayout { + id: root + + required property Session session + + anchors.fill: parent + + spacing: 0 + + FileView { + id: configFile + + path: `${Paths.config}/shell.json` + watchChanges: true + + onLoaded: { + try { + const config = JSON.parse(text()); + updateFromConfig(config); + } catch (e) { + console.error("Failed to parse config:", e); + } + } + } + + function updateFromConfig(config) { + // Update clock toggle + if (config.bar && config.bar.clock) { + clockShowIconSwitch.checked = config.bar.clock.showIcon !== false; + } + + // Update entries + if (config.bar && config.bar.entries) { + entriesModel.clear(); + for (const entry of config.bar.entries) { + entriesModel.append({ + id: entry.id, + enabled: entry.enabled !== false + }); + } + } + } + + function saveConfig(entryIndex, entryEnabled) { + if (!configFile.loaded) { + root.lastSaveStatus = "Error: Config file not loaded yet"; + root.debugInfo = "Config file not loaded yet, cannot save"; + return; + } + + try { + const config = JSON.parse(configFile.text()); + + // Update clock setting (same simple approach - read directly from the switch) + if (!config.bar) config.bar = {}; + if (!config.bar.clock) config.bar.clock = {}; + config.bar.clock.showIcon = clockShowIconSwitch.checked; + + // Update entries from the model (same approach as clock - use provided value if available) + if (!config.bar.entries) config.bar.entries = []; + config.bar.entries = []; + + let debugInfo = `saveConfig called\n`; + debugInfo += `entryIndex: ${entryIndex}\n`; + debugInfo += `entryEnabled: ${entryEnabled}\n`; + debugInfo += `entriesModel.count: ${entriesModel.count}\n\n`; + + for (let i = 0; i < entriesModel.count; i++) { + const entry = entriesModel.get(i); + // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) + // Otherwise use the value from the model + let enabled = entry.enabled; + if (entryIndex !== undefined && i === entryIndex) { + enabled = entryEnabled; + debugInfo += `Entry ${i} (${entry.id}): Using provided value = ${entryEnabled}\n`; + } else { + debugInfo += `Entry ${i} (${entry.id}): Using model value = ${entry.enabled}\n`; + } + config.bar.entries.push({ + id: entry.id, + enabled: enabled + }); + } + + debugInfo += `\nFinal entries array:\n${JSON.stringify(config.bar.entries, null, 2)}\n`; + debugInfo += `\nFinal clock.showIcon: ${config.bar.clock.showIcon}\n`; + root.debugInfo = debugInfo; + + // Write back to file using setText (same simple approach that worked for clock) + const jsonString = JSON.stringify(config, null, 4); + configFile.setText(jsonString); + root.lastSaveStatus = `Saved! Entries count: ${config.bar.entries.length}`; + } catch (e) { + root.lastSaveStatus = `Error: ${e.message}`; + root.debugInfo = `Failed to save config:\n${e.message}\n${e.stack}`; + } + } + + ListModel { + id: entriesModel + } + + // Debug info + property string debugInfo: "" + property string lastSaveStatus: "" + + Item { + Layout.preferredWidth: Math.floor(parent.width * 0.4) + Layout.minimumWidth: 420 + Layout.fillHeight: true + + ColumnLayout { + anchors.fill: parent + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + + spacing: Appearance.spacing.small + + RowLayout { + spacing: Appearance.spacing.smaller + + StyledText { + text: qsTr("Settings") + font.pointSize: Appearance.font.size.large + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + } + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Clock") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + StyledText { + text: qsTr("Clock display settings") + color: Colours.palette.m3outline + } + + StyledRect { + Layout.fillWidth: true + implicitHeight: clockRow.implicitHeight + Appearance.padding.large * 2 + + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + RowLayout { + id: clockRow + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show clock icon") + } + + StyledSwitch { + id: clockShowIconSwitch + checked: true + onToggled: { + root.saveConfig(); + } + } + } + } + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Taskbar Entries") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + StyledText { + text: qsTr("Enable or disable taskbar entries") + color: Colours.palette.m3outline + } + + StyledListView { + Layout.fillWidth: true + Layout.fillHeight: true + Layout.topMargin: 0 + + model: entriesModel + spacing: Appearance.spacing.small / 2 + clip: true + + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent + } + + delegate: StyledRect { + id: delegate + required property string id + required property bool enabled + required property int index + + anchors.left: parent.left + anchors.right: parent.right + + color: Colours.tPalette.m3surfaceContainer + radius: Appearance.rounding.normal + + RowLayout { + id: entryRow + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal + + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: id.charAt(0).toUpperCase() + id.slice(1) + font.weight: enabled ? 500 : 400 + } + + StyledSwitch { + checked: enabled + onToggled: { + // Store the values in local variables to ensure they're accessible + // Access index from the delegate + const entryIndex = delegate.index; + const entryEnabled = checked; + console.log(`Entry toggle: index=${entryIndex}, checked=${entryEnabled}`); + // Update the model first + entriesModel.setProperty(entryIndex, "enabled", entryEnabled); + // Save immediately with the value directly (same technique as clock toggle) + // Clock toggle reads directly from clockShowIconSwitch.checked + // We pass the value directly here (same approach) + root.saveConfig(entryIndex, entryEnabled); + } + } + } + + implicitHeight: entryRow.implicitHeight + Appearance.padding.normal * 2 + } + } + } + + InnerBorder { + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + } + + Item { + Layout.fillWidth: true + Layout.fillHeight: true + + StyledFlickable { + anchors.fill: parent + anchors.margins: Appearance.padding.large * 2 + + flickableDirection: Flickable.VerticalFlick + contentHeight: contentLayout.implicitHeight + + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent + } + + ColumnLayout { + id: contentLayout + + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + + spacing: Appearance.spacing.normal + + MaterialIcon { + Layout.alignment: Qt.AlignHCenter + text: "task_alt" + font.pointSize: Appearance.font.size.extraLarge * 3 + font.bold: true + } + + StyledText { + Layout.alignment: Qt.AlignHCenter + text: qsTr("Taskbar settings") + font.pointSize: Appearance.font.size.large + font.bold: true + } + + StyledText { + Layout.topMargin: Appearance.spacing.large + Layout.alignment: Qt.AlignHCenter + text: qsTr("Clock") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + StyledText { + Layout.alignment: Qt.AlignHCenter + text: clockShowIconSwitch.checked ? qsTr("Clock icon enabled") : qsTr("Clock icon disabled") + color: Colours.palette.m3outline + } + + StyledText { + Layout.topMargin: Appearance.spacing.large + Layout.alignment: Qt.AlignHCenter + text: qsTr("Taskbar Entries") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + StyledText { + Layout.alignment: Qt.AlignHCenter + text: qsTr("Configure which entries appear in the taskbar") + color: Colours.palette.m3outline + } + + StyledText { + Layout.topMargin: Appearance.spacing.large + Layout.alignment: Qt.AlignHCenter + text: qsTr("Debug Info") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + StyledRect { + Layout.fillWidth: true + Layout.preferredHeight: 200 + Layout.maximumHeight: 300 + + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + clip: true + + StyledFlickable { + id: debugFlickable + anchors.fill: parent + anchors.margins: Appearance.padding.normal + contentHeight: debugText.implicitHeight + clip: true + + StyledScrollBar.vertical: StyledScrollBar { + flickable: debugFlickable + } + + TextEdit { + id: debugText + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + width: parent.width + + text: root.debugInfo || "No debug info yet" + font.pointSize: Appearance.font.size.small + color: Colours.palette.m3onSurface + wrapMode: TextEdit.Wrap + readOnly: true + selectByMouse: true + selectByKeyboard: true + } + } + } + + StyledText { + Layout.topMargin: Appearance.spacing.small + Layout.alignment: Qt.AlignHCenter + text: root.lastSaveStatus || "" + font.pointSize: Appearance.font.size.small + color: root.lastSaveStatus.includes("Error") ? Colours.palette.m3error : Colours.palette.m3primary + } + } + } + + InnerBorder { + leftThickness: Appearance.padding.normal / 2 + } + } +} + -- cgit v1.2.3-freya From d2c5065aa9fe39e5a9bbbc96e1882dcb73acdab2 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Tue, 11 Nov 2025 11:44:47 -0500 Subject: controlcenter: added debug toggle to taskbar objects --- modules/controlcenter/taskbar/TaskbarPane.qml | 37 ++++++++++++++++++++++++++- 1 file changed, 36 insertions(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index a367635..7ada7b1 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -18,6 +18,8 @@ RowLayout { required property Session session + property bool showDebugInfo: false + anchors.fill: parent spacing: 0 @@ -98,7 +100,6 @@ RowLayout { } debugInfo += `\nFinal entries array:\n${JSON.stringify(config.bar.entries, null, 2)}\n`; - debugInfo += `\nFinal clock.showIcon: ${config.bar.clock.showIcon}\n`; root.debugInfo = debugInfo; // Write back to file using setText (same simple approach that worked for clock) @@ -338,9 +339,41 @@ RowLayout { color: Colours.palette.m3outline } + StyledRect { + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.large + implicitHeight: debugToggleRow.implicitHeight + Appearance.padding.large * 2 + color: Colours.tPalette.m3surfaceContainer + radius: Appearance.rounding.normal + + RowLayout { + id: debugToggleRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show debug information") + font.pointSize: Appearance.font.size.normal + } + + StyledSwitch { + id: showDebugInfoSwitch + checked: root.showDebugInfo + onToggled: { + root.showDebugInfo = checked; + } + } + } + } + StyledText { Layout.topMargin: Appearance.spacing.large Layout.alignment: Qt.AlignHCenter + visible: root.showDebugInfo text: qsTr("Debug Info") font.pointSize: Appearance.font.size.larger font.weight: 500 @@ -350,6 +383,7 @@ RowLayout { Layout.fillWidth: true Layout.preferredHeight: 200 Layout.maximumHeight: 300 + visible: root.showDebugInfo radius: Appearance.rounding.normal color: Colours.tPalette.m3surfaceContainer @@ -387,6 +421,7 @@ RowLayout { StyledText { Layout.topMargin: Appearance.spacing.small Layout.alignment: Qt.AlignHCenter + visible: root.showDebugInfo text: root.lastSaveStatus || "" font.pointSize: Appearance.font.size.small color: root.lastSaveStatus.includes("Error") ? Colours.palette.m3error : Colours.palette.m3primary -- cgit v1.2.3-freya From 5a0c2171d39f118025ec52432cb538ebda72f9a8 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Tue, 11 Nov 2025 12:25:51 -0500 Subject: controlcenter: taskbar panel now configures all aspects of shell.json bar object except for scroll actions --- modules/controlcenter/taskbar/TaskbarPane.qml | 1273 +++++++++++++++++++++---- 1 file changed, 1097 insertions(+), 176 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 7ada7b1..105bbe1 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -20,252 +20,1174 @@ RowLayout { property bool showDebugInfo: false + // Bar Behavior + property bool persistent: true + property bool showOnHover: true + property int dragThreshold: 20 + + // Status Icons + property bool showAudio: true + property bool showMicrophone: true + property bool showKbLayout: false + property bool showNetwork: true + property bool showBluetooth: true + property bool showBattery: true + property bool showLockStatus: true + + // Tray Settings + property bool trayBackground: false + property bool trayCompact: false + property bool trayRecolour: false + + // Workspaces + property int workspacesShown: 5 + property bool workspacesActiveIndicator: true + property bool workspacesOccupiedBg: false + property bool workspacesShowWindows: false + property bool workspacesPerMonitor: true + anchors.fill: parent - spacing: 0 + spacing: 0 + + FileView { + id: configFile + + path: `${Paths.config}/shell.json` + watchChanges: true + + onLoaded: { + try { + const config = JSON.parse(text()); + updateFromConfig(config); + } catch (e) { + console.error("Failed to parse config:", e); + } + } + } + + function updateFromConfig(config) { + // Update clock toggle + if (config.bar && config.bar.clock) { + clockShowIconSwitch.checked = config.bar.clock.showIcon !== false; + } + + // Update entries + if (config.bar && config.bar.entries) { + entriesModel.clear(); + for (const entry of config.bar.entries) { + entriesModel.append({ + id: entry.id, + enabled: entry.enabled !== false + }); + } + } + + // Update bar behavior + if (config.bar) { + root.persistent = config.bar.persistent !== false; + root.showOnHover = config.bar.showOnHover !== false; + root.dragThreshold = config.bar.dragThreshold || 20; + } + + // Update status icons + if (config.bar && config.bar.status) { + root.showAudio = config.bar.status.showAudio !== false; + root.showMicrophone = config.bar.status.showMicrophone !== false; + root.showKbLayout = config.bar.status.showKbLayout === true; + root.showNetwork = config.bar.status.showNetwork !== false; + root.showBluetooth = config.bar.status.showBluetooth !== false; + root.showBattery = config.bar.status.showBattery !== false; + root.showLockStatus = config.bar.status.showLockStatus !== false; + } + + // Update tray settings + if (config.bar && config.bar.tray) { + root.trayBackground = config.bar.tray.background === true; + root.trayCompact = config.bar.tray.compact === true; + root.trayRecolour = config.bar.tray.recolour === true; + } + + // Update workspaces + if (config.bar && config.bar.workspaces) { + root.workspacesShown = config.bar.workspaces.shown || 5; + root.workspacesActiveIndicator = config.bar.workspaces.activeIndicator !== false; + root.workspacesOccupiedBg = config.bar.workspaces.occupiedBg === true; + root.workspacesShowWindows = config.bar.workspaces.showWindows === true; + root.workspacesPerMonitor = config.bar.workspaces.perMonitorWorkspaces !== false; + } + } + + function saveConfig(entryIndex, entryEnabled) { + if (!configFile.loaded) { + root.lastSaveStatus = "Error: Config file not loaded yet"; + root.debugInfo = "Config file not loaded yet, cannot save"; + return; + } + + try { + const config = JSON.parse(configFile.text()); + + // Ensure bar object exists + if (!config.bar) config.bar = {}; + + // Update clock setting + if (!config.bar.clock) config.bar.clock = {}; + config.bar.clock.showIcon = clockShowIconSwitch.checked; + + // Update bar behavior + config.bar.persistent = root.persistent; + config.bar.showOnHover = root.showOnHover; + config.bar.dragThreshold = root.dragThreshold; + + // Update status icons + if (!config.bar.status) config.bar.status = {}; + config.bar.status.showAudio = root.showAudio; + config.bar.status.showMicrophone = root.showMicrophone; + config.bar.status.showKbLayout = root.showKbLayout; + config.bar.status.showNetwork = root.showNetwork; + config.bar.status.showBluetooth = root.showBluetooth; + config.bar.status.showBattery = root.showBattery; + config.bar.status.showLockStatus = root.showLockStatus; + + // Update tray settings + if (!config.bar.tray) config.bar.tray = {}; + config.bar.tray.background = root.trayBackground; + config.bar.tray.compact = root.trayCompact; + config.bar.tray.recolour = root.trayRecolour; + + // Update workspaces + if (!config.bar.workspaces) config.bar.workspaces = {}; + config.bar.workspaces.shown = root.workspacesShown; + config.bar.workspaces.activeIndicator = root.workspacesActiveIndicator; + config.bar.workspaces.occupiedBg = root.workspacesOccupiedBg; + config.bar.workspaces.showWindows = root.workspacesShowWindows; + config.bar.workspaces.perMonitorWorkspaces = root.workspacesPerMonitor; + + // Update entries from the model (same approach as clock - use provided value if available) + if (!config.bar.entries) config.bar.entries = []; + config.bar.entries = []; + + let debugInfo = `saveConfig called\n`; + debugInfo += `entryIndex: ${entryIndex}\n`; + debugInfo += `entryEnabled: ${entryEnabled}\n`; + debugInfo += `entriesModel.count: ${entriesModel.count}\n\n`; + + for (let i = 0; i < entriesModel.count; i++) { + const entry = entriesModel.get(i); + // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) + // Otherwise use the value from the model + let enabled = entry.enabled; + if (entryIndex !== undefined && i === entryIndex) { + enabled = entryEnabled; + debugInfo += `Entry ${i} (${entry.id}): Using provided value = ${entryEnabled}\n`; + } else { + debugInfo += `Entry ${i} (${entry.id}): Using model value = ${entry.enabled}\n`; + } + config.bar.entries.push({ + id: entry.id, + enabled: enabled + }); + } + + debugInfo += `\nFinal entries array:\n${JSON.stringify(config.bar.entries, null, 2)}\n`; + root.debugInfo = debugInfo; + + // Write back to file using setText (same simple approach that worked for clock) + const jsonString = JSON.stringify(config, null, 4); + configFile.setText(jsonString); + root.lastSaveStatus = `Saved! Entries count: ${config.bar.entries.length}`; + } catch (e) { + root.lastSaveStatus = `Error: ${e.message}`; + root.debugInfo = `Failed to save config:\n${e.message}\n${e.stack}`; + } + } + + ListModel { + id: entriesModel + } + + // Debug info + property string debugInfo: "" + property string lastSaveStatus: "" + + function collapseAllSections(exceptSection) { + if (exceptSection !== clockSection) clockSection.expanded = false; + if (exceptSection !== barBehaviorSection) barBehaviorSection.expanded = false; + if (exceptSection !== statusIconsSection) statusIconsSection.expanded = false; + if (exceptSection !== traySettingsSection) traySettingsSection.expanded = false; + if (exceptSection !== workspacesSection) workspacesSection.expanded = false; + } + + Item { + Layout.preferredWidth: Math.floor(parent.width * 0.4) + Layout.minimumWidth: 420 + Layout.fillHeight: true + + StyledFlickable { + id: sidebarFlickable + anchors.fill: parent + flickableDirection: Flickable.VerticalFlick + contentHeight: sidebarLayout.implicitHeight + Appearance.padding.large * 2 + + StyledScrollBar.vertical: StyledScrollBar { + flickable: sidebarFlickable + } + + ColumnLayout { + id: sidebarLayout + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + + spacing: Appearance.spacing.small + + RowLayout { + spacing: Appearance.spacing.smaller + + StyledText { + text: qsTr("Settings") + font.pointSize: Appearance.font.size.large + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + } + + Item { + id: clockSection + Layout.fillWidth: true + Layout.preferredHeight: clockSectionHeader.implicitHeight + property bool expanded: false + + ColumnLayout { + id: clockSectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Clock") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + + MaterialIcon { + text: "expand_more" + rotation: clockSection.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } + + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + const wasExpanded = clockSection.expanded; + root.collapseAllSections(clockSection); + clockSection.expanded = !wasExpanded; + } + } + + StyledText { + visible: clockSection.expanded + text: qsTr("Clock display settings") + color: Colours.palette.m3outline + Layout.fillWidth: true + } + } + } + + StyledRect { + Layout.fillWidth: true + visible: clockSection.expanded + implicitHeight: clockSection.expanded ? clockRow.implicitHeight + Appearance.padding.large * 2 : 0 + + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: clockRow + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show clock icon") + } + + StyledSwitch { + id: clockShowIconSwitch + checked: true + onToggled: { + root.saveConfig(); + } + } + } + } + + Item { + id: barBehaviorSection + Layout.fillWidth: true + Layout.preferredHeight: barBehaviorSectionHeader.implicitHeight + property bool expanded: false + + ColumnLayout { + id: barBehaviorSectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Bar Behavior") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + + MaterialIcon { + text: "expand_more" + rotation: barBehaviorSection.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } + + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + const wasExpanded = barBehaviorSection.expanded; + root.collapseAllSections(barBehaviorSection); + barBehaviorSection.expanded = !wasExpanded; + } + } + } + } + + StyledRect { + visible: barBehaviorSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: barBehaviorSection.expanded ? persistentRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: persistentRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Persistent") + } + + StyledSwitch { + checked: root.persistent + onToggled: { + root.persistent = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: barBehaviorSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: barBehaviorSection.expanded ? showOnHoverRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showOnHoverRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show on hover") + } + + StyledSwitch { + checked: root.showOnHover + onToggled: { + root.showOnHover = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: barBehaviorSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: barBehaviorSection.expanded ? dragThresholdRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: dragThresholdRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Drag threshold") + } + + CustomSpinBox { + min: 0 + max: 100 + value: root.dragThreshold + onValueModified: value => { + root.dragThreshold = value; + root.saveConfig(); + } + } + } + } + + Item { + id: statusIconsSection + Layout.fillWidth: true + Layout.preferredHeight: statusIconsSectionHeader.implicitHeight + property bool expanded: false + + ColumnLayout { + id: statusIconsSectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Status Icons") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + + MaterialIcon { + text: "expand_more" + rotation: statusIconsSection.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } + + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + const wasExpanded = statusIconsSection.expanded; + root.collapseAllSections(statusIconsSection); + statusIconsSection.expanded = !wasExpanded; + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showAudioRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showAudioRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show audio") + } + + StyledSwitch { + checked: root.showAudio + onToggled: { + root.showAudio = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showMicrophoneRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showMicrophoneRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show microphone") + } + + StyledSwitch { + checked: root.showMicrophone + onToggled: { + root.showMicrophone = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showKbLayoutRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showKbLayoutRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show keyboard layout") + } + + StyledSwitch { + checked: root.showKbLayout + onToggled: { + root.showKbLayout = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showNetworkRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showNetworkRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show network") + } + + StyledSwitch { + checked: root.showNetwork + onToggled: { + root.showNetwork = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showBluetoothRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showBluetoothRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show bluetooth") + } + + StyledSwitch { + checked: root.showBluetooth + onToggled: { + root.showBluetooth = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showBatteryRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showBatteryRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show battery") + } + + StyledSwitch { + checked: root.showBattery + onToggled: { + root.showBattery = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: statusIconsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: statusIconsSection.expanded ? showLockStatusRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: showLockStatusRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show lock status") + } + + StyledSwitch { + checked: root.showLockStatus + onToggled: { + root.showLockStatus = checked; + root.saveConfig(); + } + } + } + } + + Item { + id: traySettingsSection + Layout.fillWidth: true + Layout.preferredHeight: traySettingsSectionHeader.implicitHeight + property bool expanded: false + + ColumnLayout { + id: traySettingsSectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Tray Settings") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + + MaterialIcon { + text: "expand_more" + rotation: traySettingsSection.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } + + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + const wasExpanded = traySettingsSection.expanded; + root.collapseAllSections(traySettingsSection); + traySettingsSection.expanded = !wasExpanded; + } + } + } + } + + StyledRect { + visible: traySettingsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: traySettingsSection.expanded ? trayBackgroundRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: trayBackgroundRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Background") + } + + StyledSwitch { + checked: root.trayBackground + onToggled: { + root.trayBackground = checked; + root.saveConfig(); + } + } + } + } + + StyledRect { + visible: traySettingsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: traySettingsSection.expanded ? trayCompactRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } - FileView { - id: configFile + RowLayout { + id: trayCompactRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - path: `${Paths.config}/shell.json` - watchChanges: true + StyledText { + Layout.fillWidth: true + text: qsTr("Compact") + } - onLoaded: { - try { - const config = JSON.parse(text()); - updateFromConfig(config); - } catch (e) { - console.error("Failed to parse config:", e); + StyledSwitch { + checked: root.trayCompact + onToggled: { + root.trayCompact = checked; + root.saveConfig(); + } + } + } } - } - } - function updateFromConfig(config) { - // Update clock toggle - if (config.bar && config.bar.clock) { - clockShowIconSwitch.checked = config.bar.clock.showIcon !== false; - } + StyledRect { + visible: traySettingsSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: traySettingsSection.expanded ? trayRecolourRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - // Update entries - if (config.bar && config.bar.entries) { - entriesModel.clear(); - for (const entry of config.bar.entries) { - entriesModel.append({ - id: entry.id, - enabled: entry.enabled !== false - }); - } - } - } + Behavior on implicitHeight { + Anim {} + } - function saveConfig(entryIndex, entryEnabled) { - if (!configFile.loaded) { - root.lastSaveStatus = "Error: Config file not loaded yet"; - root.debugInfo = "Config file not loaded yet, cannot save"; - return; - } - - try { - const config = JSON.parse(configFile.text()); - - // Update clock setting (same simple approach - read directly from the switch) - if (!config.bar) config.bar = {}; - if (!config.bar.clock) config.bar.clock = {}; - config.bar.clock.showIcon = clockShowIconSwitch.checked; + RowLayout { + id: trayRecolourRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - // Update entries from the model (same approach as clock - use provided value if available) - if (!config.bar.entries) config.bar.entries = []; - config.bar.entries = []; - - let debugInfo = `saveConfig called\n`; - debugInfo += `entryIndex: ${entryIndex}\n`; - debugInfo += `entryEnabled: ${entryEnabled}\n`; - debugInfo += `entriesModel.count: ${entriesModel.count}\n\n`; - - for (let i = 0; i < entriesModel.count; i++) { - const entry = entriesModel.get(i); - // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) - // Otherwise use the value from the model - let enabled = entry.enabled; - if (entryIndex !== undefined && i === entryIndex) { - enabled = entryEnabled; - debugInfo += `Entry ${i} (${entry.id}): Using provided value = ${entryEnabled}\n`; - } else { - debugInfo += `Entry ${i} (${entry.id}): Using model value = ${entry.enabled}\n`; + StyledText { + Layout.fillWidth: true + text: qsTr("Recolour") + } + + StyledSwitch { + checked: root.trayRecolour + onToggled: { + root.trayRecolour = checked; + root.saveConfig(); + } + } } - config.bar.entries.push({ - id: entry.id, - enabled: enabled - }); } - debugInfo += `\nFinal entries array:\n${JSON.stringify(config.bar.entries, null, 2)}\n`; - root.debugInfo = debugInfo; + Item { + id: workspacesSection + Layout.fillWidth: true + Layout.preferredHeight: workspacesSectionHeader.implicitHeight + property bool expanded: false - // Write back to file using setText (same simple approach that worked for clock) - const jsonString = JSON.stringify(config, null, 4); - configFile.setText(jsonString); - root.lastSaveStatus = `Saved! Entries count: ${config.bar.entries.length}`; - } catch (e) { - root.lastSaveStatus = `Error: ${e.message}`; - root.debugInfo = `Failed to save config:\n${e.message}\n${e.stack}`; - } - } + ColumnLayout { + id: workspacesSectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small - ListModel { - id: entriesModel - } + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small - // Debug info - property string debugInfo: "" - property string lastSaveStatus: "" + StyledText { + Layout.topMargin: Appearance.spacing.large + text: qsTr("Workspaces") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } - Item { - Layout.preferredWidth: Math.floor(parent.width * 0.4) - Layout.minimumWidth: 420 - Layout.fillHeight: true + Item { + Layout.fillWidth: true + } - ColumnLayout { - anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + MaterialIcon { + text: "expand_more" + rotation: workspacesSection.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } - spacing: Appearance.spacing.small + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + const wasExpanded = workspacesSection.expanded; + root.collapseAllSections(workspacesSection); + workspacesSection.expanded = !wasExpanded; + } + } + } + } - RowLayout { - spacing: Appearance.spacing.smaller + StyledRect { + visible: workspacesSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: workspacesSection.expanded ? workspacesShownRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledText { - text: qsTr("Settings") - font.pointSize: Appearance.font.size.large - font.weight: 500 + Behavior on implicitHeight { + Anim {} } - Item { - Layout.fillWidth: true - } - } + RowLayout { + id: workspacesShownRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Clock") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } + StyledText { + Layout.fillWidth: true + text: qsTr("Shown") + } - StyledText { - text: qsTr("Clock display settings") - color: Colours.palette.m3outline + CustomSpinBox { + min: 1 + max: 20 + value: root.workspacesShown + onValueModified: value => { + root.workspacesShown = value; + root.saveConfig(); + } + } + } } StyledRect { + visible: workspacesSection.expanded Layout.fillWidth: true - implicitHeight: clockRow.implicitHeight + Appearance.padding.large * 2 - + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: workspacesSection.expanded ? workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 : 0 radius: Appearance.rounding.normal color: Colours.tPalette.m3surfaceContainer - RowLayout { - id: clockRow + Behavior on implicitHeight { + Anim {} + } + RowLayout { + id: workspacesActiveIndicatorRow anchors.left: parent.left anchors.right: parent.right anchors.verticalCenter: parent.verticalCenter anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal StyledText { Layout.fillWidth: true - text: qsTr("Show clock icon") + text: qsTr("Active indicator") } StyledSwitch { - id: clockShowIconSwitch - checked: true + checked: root.workspacesActiveIndicator onToggled: { + root.workspacesActiveIndicator = checked; root.saveConfig(); } } } } - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Taskbar Entries") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } + StyledRect { + visible: workspacesSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: workspacesSection.expanded ? workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledText { - text: qsTr("Enable or disable taskbar entries") - color: Colours.palette.m3outline - } + Behavior on implicitHeight { + Anim {} + } - StyledListView { - Layout.fillWidth: true - Layout.fillHeight: true - Layout.topMargin: 0 + RowLayout { + id: workspacesOccupiedBgRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - model: entriesModel - spacing: Appearance.spacing.small / 2 - clip: true + StyledText { + Layout.fillWidth: true + text: qsTr("Occupied background") + } - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + StyledSwitch { + checked: root.workspacesOccupiedBg + onToggled: { + root.workspacesOccupiedBg = checked; + root.saveConfig(); + } + } } + } + + StyledRect { + visible: workspacesSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: workspacesSection.expanded ? workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - delegate: StyledRect { - id: delegate - required property string id - required property bool enabled - required property int index + Behavior on implicitHeight { + Anim {} + } + RowLayout { + id: workspacesShowWindowsRow anchors.left: parent.left anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - color: Colours.tPalette.m3surfaceContainer - radius: Appearance.rounding.normal + StyledText { + Layout.fillWidth: true + text: qsTr("Show windows") + } - RowLayout { - id: entryRow + StyledSwitch { + checked: root.workspacesShowWindows + onToggled: { + root.workspacesShowWindows = checked; + root.saveConfig(); + } + } + } + } - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal + StyledRect { + visible: workspacesSection.expanded + Layout.fillWidth: true + Layout.topMargin: Appearance.spacing.small / 2 + implicitHeight: workspacesSection.expanded ? workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 : 0 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - spacing: Appearance.spacing.normal + Behavior on implicitHeight { + Anim {} + } - StyledText { - Layout.fillWidth: true - text: id.charAt(0).toUpperCase() + id.slice(1) - font.weight: enabled ? 500 : 400 - } + RowLayout { + id: workspacesPerMonitorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledSwitch { - checked: enabled - onToggled: { - // Store the values in local variables to ensure they're accessible - // Access index from the delegate - const entryIndex = delegate.index; - const entryEnabled = checked; - console.log(`Entry toggle: index=${entryIndex}, checked=${entryEnabled}`); - // Update the model first - entriesModel.setProperty(entryIndex, "enabled", entryEnabled); - // Save immediately with the value directly (same technique as clock toggle) - // Clock toggle reads directly from clockShowIconSwitch.checked - // We pass the value directly here (same approach) - root.saveConfig(entryIndex, entryEnabled); - } - } + StyledText { + Layout.fillWidth: true + text: qsTr("Per monitor workspaces") } - implicitHeight: entryRow.implicitHeight + Appearance.padding.normal * 2 + StyledSwitch { + checked: root.workspacesPerMonitor + onToggled: { + root.workspacesPerMonitor = checked; + root.saveConfig(); + } + } } } } + } InnerBorder { leftThickness: 0 @@ -434,4 +1356,3 @@ RowLayout { } } } - -- cgit v1.2.3-freya From 90bb8b1d006eaa4223c27754d621e6e26162003f Mon Sep 17 00:00:00 2001 From: ATMDA Date: Tue, 11 Nov 2025 16:28:59 -0500 Subject: controlcenter: removed debug info toggles --- modules/controlcenter/launcher/LauncherPane.qml | 114 ------------------------ modules/controlcenter/taskbar/TaskbarPane.qml | 109 +--------------------- 2 files changed, 1 insertion(+), 222 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 7377f42..82e145a 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -22,7 +22,6 @@ RowLayout { required property Session session property var selectedApp: null - property bool showDebugInfo: false anchors.fill: parent @@ -321,119 +320,6 @@ RowLayout { } } - StyledRect { - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.normal - implicitHeight: debugToggleRow.implicitHeight + Appearance.padding.large * 2 - color: Colours.tPalette.m3surfaceContainer - radius: Appearance.rounding.normal - - RowLayout { - id: debugToggleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show debug information") - font.pointSize: Appearance.font.size.normal - } - - StyledSwitch { - id: showDebugInfoSwitch - checked: root.showDebugInfo - onToggled: { - root.showDebugInfo = checked; - } - } - } - } - - StyledRect { - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.normal - Layout.preferredHeight: 300 - visible: root.showDebugInfo - color: Colours.tPalette.m3surfaceContainer - radius: Appearance.rounding.normal - clip: true - - ColumnLayout { - anchors.fill: parent - anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.small - - StyledText { - Layout.alignment: Qt.AlignHCenter - text: qsTr("Debug Info - All Available Properties") - font.pointSize: Appearance.font.size.normal - font.weight: 500 - } - - StyledFlickable { - Layout.fillWidth: true - Layout.fillHeight: true - flickableDirection: Flickable.VerticalFlick - contentHeight: debugText.implicitHeight - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent - } - - TextEdit { - id: debugText - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - width: parent.width - - text: { - if (!root.selectedApp) return "No app selected"; - - let debug = ""; - const app = root.selectedApp; - const entry = app.entry; - - debug += "=== App Properties ===\n"; - for (let prop in app) { - try { - const value = app[prop]; - debug += prop + ": " + (value !== null && value !== undefined ? String(value) : "null/undefined") + "\n"; - } catch (e) { - debug += prop + ": [error accessing]\n"; - } - } - - debug += "\n=== Entry Properties ===\n"; - if (entry) { - for (let prop in entry) { - try { - const value = entry[prop]; - debug += prop + ": " + (value !== null && value !== undefined ? String(value) : "null/undefined") + "\n"; - } catch (e) { - debug += prop + ": [error accessing]\n"; - } - } - } else { - debug += "entry is null\n"; - } - - return debug; - } - font.pointSize: Appearance.font.size.small - color: Colours.palette.m3onSurfaceVariant - wrapMode: TextEdit.Wrap - readOnly: true - selectByMouse: true - selectByKeyboard: true - } - } - } - } } } } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 105bbe1..22414c7 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -18,8 +18,6 @@ RowLayout { required property Session session - property bool showDebugInfo: false - // Bar Behavior property bool persistent: true property bool showOnHover: true @@ -120,8 +118,6 @@ RowLayout { function saveConfig(entryIndex, entryEnabled) { if (!configFile.loaded) { - root.lastSaveStatus = "Error: Config file not loaded yet"; - root.debugInfo = "Config file not loaded yet, cannot save"; return; } @@ -168,11 +164,6 @@ RowLayout { if (!config.bar.entries) config.bar.entries = []; config.bar.entries = []; - let debugInfo = `saveConfig called\n`; - debugInfo += `entryIndex: ${entryIndex}\n`; - debugInfo += `entryEnabled: ${entryEnabled}\n`; - debugInfo += `entriesModel.count: ${entriesModel.count}\n\n`; - for (let i = 0; i < entriesModel.count; i++) { const entry = entriesModel.get(i); // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) @@ -180,9 +171,6 @@ RowLayout { let enabled = entry.enabled; if (entryIndex !== undefined && i === entryIndex) { enabled = entryEnabled; - debugInfo += `Entry ${i} (${entry.id}): Using provided value = ${entryEnabled}\n`; - } else { - debugInfo += `Entry ${i} (${entry.id}): Using model value = ${entry.enabled}\n`; } config.bar.entries.push({ id: entry.id, @@ -190,16 +178,11 @@ RowLayout { }); } - debugInfo += `\nFinal entries array:\n${JSON.stringify(config.bar.entries, null, 2)}\n`; - root.debugInfo = debugInfo; - // Write back to file using setText (same simple approach that worked for clock) const jsonString = JSON.stringify(config, null, 4); configFile.setText(jsonString); - root.lastSaveStatus = `Saved! Entries count: ${config.bar.entries.length}`; } catch (e) { - root.lastSaveStatus = `Error: ${e.message}`; - root.debugInfo = `Failed to save config:\n${e.message}\n${e.stack}`; + console.error("Failed to save config:", e); } } @@ -207,9 +190,6 @@ RowLayout { id: entriesModel } - // Debug info - property string debugInfo: "" - property string lastSaveStatus: "" function collapseAllSections(exceptSection) { if (exceptSection !== clockSection) clockSection.expanded = false; @@ -1261,93 +1241,6 @@ RowLayout { color: Colours.palette.m3outline } - StyledRect { - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.large - implicitHeight: debugToggleRow.implicitHeight + Appearance.padding.large * 2 - color: Colours.tPalette.m3surfaceContainer - radius: Appearance.rounding.normal - - RowLayout { - id: debugToggleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show debug information") - font.pointSize: Appearance.font.size.normal - } - - StyledSwitch { - id: showDebugInfoSwitch - checked: root.showDebugInfo - onToggled: { - root.showDebugInfo = checked; - } - } - } - } - - StyledText { - Layout.topMargin: Appearance.spacing.large - Layout.alignment: Qt.AlignHCenter - visible: root.showDebugInfo - text: qsTr("Debug Info") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledRect { - Layout.fillWidth: true - Layout.preferredHeight: 200 - Layout.maximumHeight: 300 - visible: root.showDebugInfo - - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - clip: true - - StyledFlickable { - id: debugFlickable - anchors.fill: parent - anchors.margins: Appearance.padding.normal - contentHeight: debugText.implicitHeight - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: debugFlickable - } - - TextEdit { - id: debugText - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - width: parent.width - - text: root.debugInfo || "No debug info yet" - font.pointSize: Appearance.font.size.small - color: Colours.palette.m3onSurface - wrapMode: TextEdit.Wrap - readOnly: true - selectByMouse: true - selectByKeyboard: true - } - } - } - - StyledText { - Layout.topMargin: Appearance.spacing.small - Layout.alignment: Qt.AlignHCenter - visible: root.showDebugInfo - text: root.lastSaveStatus || "" - font.pointSize: Appearance.font.size.small - color: root.lastSaveStatus.includes("Error") ? Colours.palette.m3error : Colours.palette.m3primary - } } } -- cgit v1.2.3-freya From e92187293e4afa046ca05bd80796c1fa193097e5 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Wed, 12 Nov 2025 15:58:42 -0500 Subject: controlcenter: refactoring into components --- components/controls/CollapsibleSection.qml | 85 + components/controls/SpinBoxRow.qml | 51 + components/controls/SwitchRow.qml | 47 + components/controls/ToggleButton.qml | 82 + .../controlcenter/appearance/AppearancePane.qml | 1872 ++++++-------------- modules/controlcenter/ethernet/EthernetList.qml | 77 +- modules/controlcenter/network/NetworkList.qml | 81 +- modules/controlcenter/taskbar/TaskbarPane.qml | 1013 +++-------- 8 files changed, 1014 insertions(+), 2294 deletions(-) create mode 100644 components/controls/CollapsibleSection.qml create mode 100644 components/controls/SpinBoxRow.qml create mode 100644 components/controls/SwitchRow.qml create mode 100644 components/controls/ToggleButton.qml (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/components/controls/CollapsibleSection.qml b/components/controls/CollapsibleSection.qml new file mode 100644 index 0000000..945386c --- /dev/null +++ b/components/controls/CollapsibleSection.qml @@ -0,0 +1,85 @@ +import ".." +import qs.components +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +ColumnLayout { + id: root + + required property string title + property string description: "" + property bool expanded: false + + signal toggleRequested + + spacing: Appearance.spacing.small / 2 + Layout.fillWidth: true + + Item { + id: sectionHeaderItem + Layout.fillWidth: true + Layout.preferredHeight: sectionHeader.implicitHeight + + ColumnLayout { + id: sectionHeader + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + StyledText { + Layout.topMargin: Appearance.spacing.large + text: root.title + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + Item { + Layout.fillWidth: true + } + + MaterialIcon { + text: "expand_more" + rotation: root.expanded ? 180 : 0 + color: Colours.palette.m3onSurface + Behavior on rotation { + Anim {} + } + } + } + + StateLayer { + anchors.fill: parent + anchors.leftMargin: -Appearance.padding.normal + anchors.rightMargin: -Appearance.padding.normal + function onClicked(): void { + root.toggleRequested(); + root.expanded = !root.expanded; + } + } + + StyledText { + visible: root.expanded && root.description !== "" + text: root.description + color: Colours.palette.m3outline + Layout.fillWidth: true + } + } + } + + default property alias content: contentColumn.data + + ColumnLayout { + id: contentColumn + Layout.fillWidth: true + visible: root.expanded + spacing: Appearance.spacing.small / 2 + } +} + diff --git a/components/controls/SpinBoxRow.qml b/components/controls/SpinBoxRow.qml new file mode 100644 index 0000000..a4441c5 --- /dev/null +++ b/components/controls/SpinBoxRow.qml @@ -0,0 +1,51 @@ +import ".." +import qs.components +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +StyledRect { + id: root + + required property string label + required property real value + required property real min + required property real max + property var onValueModified: function(value) {} + + Layout.fillWidth: true + implicitHeight: row.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: row + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: root.label + } + + CustomSpinBox { + min: root.min + max: root.max + value: root.value + onValueModified: value => { + root.onValueModified(value); + } + } + } +} + diff --git a/components/controls/SwitchRow.qml b/components/controls/SwitchRow.qml new file mode 100644 index 0000000..a486ee2 --- /dev/null +++ b/components/controls/SwitchRow.qml @@ -0,0 +1,47 @@ +import ".." +import qs.components +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +StyledRect { + id: root + + required property string label + required property bool checked + property var onToggled: function(checked) {} + + Layout.fillWidth: true + implicitHeight: row.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: row + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: root.label + } + + StyledSwitch { + checked: root.checked + onToggled: { + root.onToggled(checked); + } + } + } +} + diff --git a/components/controls/ToggleButton.qml b/components/controls/ToggleButton.qml new file mode 100644 index 0000000..9d8e094 --- /dev/null +++ b/components/controls/ToggleButton.qml @@ -0,0 +1,82 @@ +import ".." +import qs.components +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +StyledRect { + id: root + + required property bool toggled + property string icon + property string label + property string accent: "Secondary" + + signal clicked + + Layout.preferredWidth: implicitWidth + (toggleStateLayer.pressed ? Appearance.padding.normal * 2 : toggled ? Appearance.padding.small * 2 : 0) + implicitWidth: toggleBtnInner.implicitWidth + Appearance.padding.large * 2 + implicitHeight: toggleBtnIcon.implicitHeight + Appearance.padding.normal * 2 + + radius: toggled || toggleStateLayer.pressed ? Appearance.rounding.small : Math.min(width, height) / 2 * Math.min(1, Appearance.rounding.scale) + color: toggled ? Colours.palette[`m3${accent.toLowerCase()}`] : Colours.palette[`m3${accent.toLowerCase()}Container`] + + StateLayer { + id: toggleStateLayer + + color: root.toggled ? Colours.palette[`m3on${root.accent}`] : Colours.palette[`m3on${root.accent}Container`] + + function onClicked(): void { + root.clicked(); + } + } + + RowLayout { + id: toggleBtnInner + + anchors.centerIn: parent + spacing: Appearance.spacing.normal + + MaterialIcon { + id: toggleBtnIcon + + visible: !!text + fill: root.toggled ? 1 : 0 + text: root.icon + color: root.toggled ? Colours.palette[`m3on${root.accent}`] : Colours.palette[`m3on${root.accent}Container`] + font.pointSize: Appearance.font.size.large + + Behavior on fill { + Anim {} + } + } + + Loader { + asynchronous: true + active: !!root.label + visible: active + + sourceComponent: StyledText { + text: root.label + color: root.toggled ? Colours.palette[`m3on${root.accent}`] : Colours.palette[`m3on${root.accent}Container`] + } + } + } + + Behavior on radius { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } + } + + Behavior on Layout.preferredWidth { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } + } +} + diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index e3600ed..cfe5b56 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -255,1588 +255,770 @@ RowLayout { } } - Item { + CollapsibleSection { id: themeModeSection - Layout.fillWidth: true - Layout.preferredHeight: themeModeSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: themeModeSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Theme mode") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: themeModeSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = themeModeSection.expanded; - root.collapseAllSections(themeModeSection); - themeModeSection.expanded = !wasExpanded; - } - } - - StyledText { - visible: themeModeSection.expanded - text: qsTr("Light or dark theme") - color: Colours.palette.m3outline - Layout.fillWidth: true - } - } - } - - StyledRect { - visible: themeModeSection.expanded - Layout.fillWidth: true - implicitHeight: themeModeSection.expanded ? modeToggle.implicitHeight + Appearance.padding.large * 2 : 0 - - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + title: qsTr("Theme mode") + description: qsTr("Light or dark theme") + onToggleRequested: { + root.collapseAllSections(themeModeSection); } - RowLayout { - id: modeToggle - - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - - spacing: Appearance.spacing.normal + StyledRect { + Layout.fillWidth: true + implicitHeight: modeToggle.implicitHeight + Appearance.padding.large * 2 - StyledText { - Layout.fillWidth: true - text: qsTr("Dark mode") - } + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledSwitch { - checked: !Colours.currentLight - onToggled: { - Colours.setMode(checked ? "dark" : "light"); - } + Behavior on implicitHeight { + Anim {} } - } - } - Item { - id: colorVariantSection - Layout.fillWidth: true - Layout.preferredHeight: colorVariantSectionHeader.implicitHeight - property bool expanded: false + RowLayout { + id: modeToggle - ColumnLayout { - id: colorVariantSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Color variant") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { Layout.fillWidth: true + text: qsTr("Dark mode") } - MaterialIcon { - text: "expand_more" - rotation: colorVariantSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + StyledSwitch { + checked: !Colours.currentLight + onToggled: { + Colours.setMode(checked ? "dark" : "light"); } } } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = colorVariantSection.expanded; - root.collapseAllSections(colorVariantSection); - colorVariantSection.expanded = !wasExpanded; - } - } - - StyledText { - visible: colorVariantSection.expanded - text: qsTr("Material theme variant") - color: Colours.palette.m3outline - Layout.fillWidth: true - } } } - StyledListView { - visible: colorVariantSection.expanded - Layout.fillWidth: true - implicitHeight: colorVariantSection.expanded ? Math.min(400, M3Variants.list.length * 60) : 0 - Layout.topMargin: 0 - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: colorVariantSection + title: qsTr("Color variant") + description: qsTr("Material theme variant") + onToggleRequested: { + root.collapseAllSections(colorVariantSection); } - model: M3Variants.list - spacing: Appearance.spacing.small / 2 - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent - } + StyledListView { + Layout.fillWidth: true + implicitHeight: colorVariantSection.expanded ? Math.min(400, M3Variants.list.length * 60) : 0 - delegate: StyledRect { - required property var modelData + Behavior on implicitHeight { + Anim {} + } - anchors.left: parent.left - anchors.right: parent.right + model: M3Variants.list + spacing: Appearance.spacing.small / 2 + clip: true - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, modelData.variant === Schemes.currentVariant ? Colours.tPalette.m3surfaceContainer.a : 0) - radius: Appearance.rounding.normal - border.width: modelData.variant === Schemes.currentVariant ? 1 : 0 - border.color: Colours.palette.m3primary - - StateLayer { - function onClicked(): void { - const variant = modelData.variant; - - // Optimistic update - set immediately - Schemes.currentVariant = variant; - - // Execute the command - Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]); - - // Reload after a delay to confirm - Qt.callLater(() => { - reloadTimer.restart(); - }); - } - } - - Timer { - id: reloadTimer - interval: 300 - onTriggered: { - Schemes.reload(); - } + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent } - RowLayout { - id: variantRow + delegate: StyledRect { + required property var modelData anchors.left: parent.left anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.normal - - MaterialIcon { - text: modelData.icon - font.pointSize: Appearance.font.size.large - fill: modelData.variant === Schemes.currentVariant ? 1 : 0 - } + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, modelData.variant === Schemes.currentVariant ? Colours.tPalette.m3surfaceContainer.a : 0) + radius: Appearance.rounding.normal + border.width: modelData.variant === Schemes.currentVariant ? 1 : 0 + border.color: Colours.palette.m3primary - StyledText { - Layout.fillWidth: true - text: modelData.name - font.weight: modelData.variant === Schemes.currentVariant ? 500 : 400 + StateLayer { + function onClicked(): void { + const variant = modelData.variant; + + // Optimistic update - set immediately + Schemes.currentVariant = variant; + + // Execute the command + Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]); + + // Reload after a delay to confirm + Qt.callLater(() => { + reloadTimer.restart(); + }); + } } - - MaterialIcon { - visible: modelData.variant === Schemes.currentVariant - text: "check" - color: Colours.palette.m3primary - font.pointSize: Appearance.font.size.large + + Timer { + id: reloadTimer + interval: 300 + onTriggered: { + Schemes.reload(); + } } - } - implicitHeight: variantRow.implicitHeight + Appearance.padding.normal * 2 - } - } + RowLayout { + id: variantRow - Item { - id: colorSchemeSection - Layout.fillWidth: true - Layout.preferredHeight: colorSchemeSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: colorSchemeSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Color scheme") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } + MaterialIcon { + text: modelData.icon + font.pointSize: Appearance.font.size.large + fill: modelData.variant === Schemes.currentVariant ? 1 : 0 + } - MaterialIcon { - text: "expand_more" - rotation: colorSchemeSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + StyledText { + Layout.fillWidth: true + text: modelData.name + font.weight: modelData.variant === Schemes.currentVariant ? 500 : 400 } - } - } - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = colorSchemeSection.expanded; - root.collapseAllSections(colorSchemeSection); - colorSchemeSection.expanded = !wasExpanded; + MaterialIcon { + visible: modelData.variant === Schemes.currentVariant + text: "check" + color: Colours.palette.m3primary + font.pointSize: Appearance.font.size.large + } } - } - StyledText { - visible: colorSchemeSection.expanded - text: qsTr("Available color schemes") - color: Colours.palette.m3outline - Layout.fillWidth: true + implicitHeight: variantRow.implicitHeight + Appearance.padding.normal * 2 } } } - StyledListView { - visible: colorSchemeSection.expanded - Layout.fillWidth: true - implicitHeight: colorSchemeSection.expanded ? Math.min(400, Schemes.list.length * 80) : 0 - Layout.topMargin: 0 - - Behavior on implicitHeight { - Anim {} - } - - model: Schemes.list - spacing: Appearance.spacing.small / 2 - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + CollapsibleSection { + id: colorSchemeSection + title: qsTr("Color scheme") + description: qsTr("Available color schemes") + onToggleRequested: { + root.collapseAllSections(colorSchemeSection); } - delegate: StyledRect { - required property var modelData + StyledListView { + Layout.fillWidth: true + implicitHeight: colorSchemeSection.expanded ? Math.min(400, Schemes.list.length * 80) : 0 - anchors.left: parent.left - anchors.right: parent.right + Behavior on implicitHeight { + Anim {} + } - readonly property string schemeKey: `${modelData.name} ${modelData.flavour}` - readonly property bool isCurrent: schemeKey === Schemes.currentScheme + model: Schemes.list + spacing: Appearance.spacing.small / 2 + clip: true - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) - radius: Appearance.rounding.normal - border.width: isCurrent ? 1 : 0 - border.color: Colours.palette.m3primary - - StateLayer { - function onClicked(): void { - const name = modelData.name; - const flavour = modelData.flavour; - const schemeKey = `${name} ${flavour}`; - - // Optimistic update - set immediately - Schemes.currentScheme = schemeKey; - - // Execute the command - Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]); - - // Reload after a delay to confirm - Qt.callLater(() => { - reloadTimer.restart(); - }); - } - } - - Timer { - id: reloadTimer - interval: 300 - onTriggered: { - Schemes.reload(); - } + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent } - RowLayout { - id: schemeRow + delegate: StyledRect { + required property var modelData anchors.left: parent.left anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.normal + readonly property string schemeKey: `${modelData.name} ${modelData.flavour}` + readonly property bool isCurrent: schemeKey === Schemes.currentScheme + + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) + radius: Appearance.rounding.normal + border.width: isCurrent ? 1 : 0 + border.color: Colours.palette.m3primary + + StateLayer { + function onClicked(): void { + const name = modelData.name; + const flavour = modelData.flavour; + const schemeKey = `${name} ${flavour}`; + + // Optimistic update - set immediately + Schemes.currentScheme = schemeKey; + + // Execute the command + Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]); + + // Reload after a delay to confirm + Qt.callLater(() => { + reloadTimer.restart(); + }); + } + } + + Timer { + id: reloadTimer + interval: 300 + onTriggered: { + Schemes.reload(); + } + } - StyledRect { - id: preview + RowLayout { + id: schemeRow + anchors.left: parent.left + anchors.right: parent.right anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal - border.width: 1 - border.color: Qt.alpha(`#${modelData.colours?.outline}`, 0.5) + spacing: Appearance.spacing.normal - color: `#${modelData.colours?.surface}` - radius: Appearance.rounding.full - implicitWidth: iconPlaceholder.implicitWidth - implicitHeight: iconPlaceholder.implicitWidth + StyledRect { + id: preview - MaterialIcon { - id: iconPlaceholder - visible: false - text: "circle" - font.pointSize: Appearance.font.size.large - } + anchors.verticalCenter: parent.verticalCenter - Item { - anchors.top: parent.top - anchors.bottom: parent.bottom - anchors.right: parent.right + border.width: 1 + border.color: Qt.alpha(`#${modelData.colours?.outline}`, 0.5) - implicitWidth: parent.implicitWidth / 2 - clip: true + color: `#${modelData.colours?.surface}` + radius: Appearance.rounding.full + implicitWidth: iconPlaceholder.implicitWidth + implicitHeight: iconPlaceholder.implicitWidth - StyledRect { + MaterialIcon { + id: iconPlaceholder + visible: false + text: "circle" + font.pointSize: Appearance.font.size.large + } + + Item { anchors.top: parent.top anchors.bottom: parent.bottom anchors.right: parent.right - implicitWidth: preview.implicitWidth - color: `#${modelData.colours?.primary}` - radius: Appearance.rounding.full - } - } - } + implicitWidth: parent.implicitWidth / 2 + clip: true - Column { - Layout.fillWidth: true - spacing: 0 + StyledRect { + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.right: parent.right - StyledText { - text: modelData.flavour ?? "" - font.pointSize: Appearance.font.size.normal + implicitWidth: preview.implicitWidth + color: `#${modelData.colours?.primary}` + radius: Appearance.rounding.full + } + } } - StyledText { - text: modelData.name ?? "" - font.pointSize: Appearance.font.size.small - color: Colours.palette.m3outline + Column { + Layout.fillWidth: true + spacing: 0 - elide: Text.ElideRight - anchors.left: parent.left - anchors.right: parent.right - } - } + StyledText { + text: modelData.flavour ?? "" + font.pointSize: Appearance.font.size.normal + } - Loader { - active: isCurrent - asynchronous: true + StyledText { + text: modelData.name ?? "" + font.pointSize: Appearance.font.size.small + color: Colours.palette.m3outline - sourceComponent: MaterialIcon { - text: "check" - color: Colours.palette.m3onSurfaceVariant - font.pointSize: Appearance.font.size.large + elide: Text.ElideRight + anchors.left: parent.left + anchors.right: parent.right + } } - } - } - - implicitHeight: schemeRow.implicitHeight + Appearance.padding.normal * 2 - } - } - Item { - id: animationsSection - Layout.fillWidth: true - Layout.preferredHeight: animationsSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: animationsSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + Loader { + active: isCurrent + asynchronous: true - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Animations") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: animationsSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + sourceComponent: MaterialIcon { + text: "check" + color: Colours.palette.m3onSurfaceVariant + font.pointSize: Appearance.font.size.large + } } } - } - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = animationsSection.expanded; - root.collapseAllSections(animationsSection); - animationsSection.expanded = !wasExpanded; - } + implicitHeight: schemeRow.implicitHeight + Appearance.padding.normal * 2 } } } - StyledRect { - visible: animationsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: animationsSection.expanded ? animDurationsScaleRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: animationsSection + title: qsTr("Animations") + onToggleRequested: { + root.collapseAllSections(animationsSection); } - RowLayout { - id: animDurationsScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Animation duration scale") - } - - CustomSpinBox { - id: animDurationsScaleSpinBox - min: 0.1 - max: 5 - value: root.animDurationsScale - onValueModified: value => { - root.animDurationsScale = value; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Animation duration scale") + min: 0.1 + max: 5 + value: root.animDurationsScale + onValueModified: value => { + root.animDurationsScale = value; + root.saveConfig(); } } } - Item { + CollapsibleSection { id: fontsSection - Layout.fillWidth: true - Layout.preferredHeight: fontsSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: fontsSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Fonts") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: fontsSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = fontsSection.expanded; - root.collapseAllSections(fontsSection); - fontsSection.expanded = !wasExpanded; - } - } + title: qsTr("Fonts") + onToggleRequested: { + root.collapseAllSections(fontsSection); } - } - StyledText { - visible: fontsSection.expanded - Layout.topMargin: Appearance.spacing.normal - text: qsTr("Material font family") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledListView { - visible: fontsSection.expanded - Layout.fillWidth: true - implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - Layout.topMargin: 0 - - Behavior on implicitHeight { - Anim {} - } - - model: Qt.fontFamilies() - spacing: Appearance.spacing.small / 2 - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + StyledText { + Layout.topMargin: Appearance.spacing.normal + text: qsTr("Material font family") + font.pointSize: Appearance.font.size.larger + font.weight: 500 } - delegate: StyledRect { - required property string modelData + StyledListView { + Layout.fillWidth: true + implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - anchors.left: parent.left - anchors.right: parent.right + Behavior on implicitHeight { + Anim {} + } - readonly property bool isCurrent: modelData === root.fontFamilyMaterial - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) - radius: Appearance.rounding.normal - border.width: isCurrent ? 1 : 0 - border.color: Colours.palette.m3primary + model: Qt.fontFamilies() + spacing: Appearance.spacing.small / 2 + clip: true - StateLayer { - function onClicked(): void { - root.fontFamilyMaterial = modelData; - root.saveConfig(); - } + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent } - RowLayout { - id: fontFamilyMaterialRow + delegate: StyledRect { + required property string modelData anchors.left: parent.left anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.normal - - StyledText { - text: modelData - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } + readonly property bool isCurrent: modelData === root.fontFamilyMaterial + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) + radius: Appearance.rounding.normal + border.width: isCurrent ? 1 : 0 + border.color: Colours.palette.m3primary - Loader { - active: isCurrent - asynchronous: true - - sourceComponent: MaterialIcon { - text: "check" - color: Colours.palette.m3onSurfaceVariant - font.pointSize: Appearance.font.size.large + StateLayer { + function onClicked(): void { + root.fontFamilyMaterial = modelData; + root.saveConfig(); } } - } - - implicitHeight: fontFamilyMaterialRow.implicitHeight + Appearance.padding.normal * 2 - } - } - - StyledText { - visible: fontsSection.expanded - Layout.topMargin: Appearance.spacing.normal - text: qsTr("Monospace font family") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledListView { - visible: fontsSection.expanded - Layout.fillWidth: true - implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - Layout.topMargin: 0 - - Behavior on implicitHeight { - Anim {} - } - - model: Qt.fontFamilies() - spacing: Appearance.spacing.small / 2 - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent - } - - delegate: StyledRect { - required property string modelData - - anchors.left: parent.left - anchors.right: parent.right - - readonly property bool isCurrent: modelData === root.fontFamilyMono - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) - radius: Appearance.rounding.normal - border.width: isCurrent ? 1 : 0 - border.color: Colours.palette.m3primary - - StateLayer { - function onClicked(): void { - root.fontFamilyMono = modelData; - root.saveConfig(); - } - } - RowLayout { - id: fontFamilyMonoRow + RowLayout { + id: fontFamilyMaterialRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.normal + spacing: Appearance.spacing.normal - StyledText { - text: modelData - font.pointSize: Appearance.font.size.normal - } + StyledText { + text: modelData + font.pointSize: Appearance.font.size.normal + } - Item { - Layout.fillWidth: true - } + Item { + Layout.fillWidth: true + } - Loader { - active: isCurrent - asynchronous: true + Loader { + active: isCurrent + asynchronous: true - sourceComponent: MaterialIcon { - text: "check" - color: Colours.palette.m3onSurfaceVariant - font.pointSize: Appearance.font.size.large + sourceComponent: MaterialIcon { + text: "check" + color: Colours.palette.m3onSurfaceVariant + font.pointSize: Appearance.font.size.large + } } } - } - - implicitHeight: fontFamilyMonoRow.implicitHeight + Appearance.padding.normal * 2 - } - } - - StyledText { - visible: fontsSection.expanded - Layout.topMargin: Appearance.spacing.normal - text: qsTr("Sans-serif font family") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledListView { - visible: fontsSection.expanded - Layout.fillWidth: true - implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - Layout.topMargin: 0 - Behavior on implicitHeight { - Anim {} + implicitHeight: fontFamilyMaterialRow.implicitHeight + Appearance.padding.normal * 2 + } } - model: Qt.fontFamilies() - spacing: Appearance.spacing.small / 2 - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + StyledText { + Layout.topMargin: Appearance.spacing.normal + text: qsTr("Monospace font family") + font.pointSize: Appearance.font.size.larger + font.weight: 500 } - delegate: StyledRect { - required property string modelData + StyledListView { + Layout.fillWidth: true + implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - anchors.left: parent.left - anchors.right: parent.right + Behavior on implicitHeight { + Anim {} + } - readonly property bool isCurrent: modelData === root.fontFamilySans - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) - radius: Appearance.rounding.normal - border.width: isCurrent ? 1 : 0 - border.color: Colours.palette.m3primary + model: Qt.fontFamilies() + spacing: Appearance.spacing.small / 2 + clip: true - StateLayer { - function onClicked(): void { - root.fontFamilySans = modelData; - root.saveConfig(); - } + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent } - RowLayout { - id: fontFamilySansRow + delegate: StyledRect { + required property string modelData anchors.left: parent.left anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.normal - spacing: Appearance.spacing.normal - - StyledText { - text: modelData - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } + readonly property bool isCurrent: modelData === root.fontFamilyMono + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) + radius: Appearance.rounding.normal + border.width: isCurrent ? 1 : 0 + border.color: Colours.palette.m3primary - Loader { - active: isCurrent - asynchronous: true - - sourceComponent: MaterialIcon { - text: "check" - color: Colours.palette.m3onSurfaceVariant - font.pointSize: Appearance.font.size.large + StateLayer { + function onClicked(): void { + root.fontFamilyMono = modelData; + root.saveConfig(); } } - } - - implicitHeight: fontFamilySansRow.implicitHeight + Appearance.padding.normal * 2 - } - } - StyledRect { - visible: fontsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: fontsSection.expanded ? fontSizeScaleRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + RowLayout { + id: fontFamilyMonoRow - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: fontSizeScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Font size scale") - } - - CustomSpinBox { - id: fontSizeScaleSpinBox - min: 0.1 - max: 5 - value: root.fontSizeScale - onValueModified: value => { - root.fontSizeScale = value; - root.saveConfig(); - } - } - } - } - - Item { - id: scalesSection - Layout.fillWidth: true - Layout.preferredHeight: scalesSectionHeader.implicitHeight - property bool expanded: false + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal - ColumnLayout { - id: scalesSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + StyledText { + text: modelData + font.pointSize: Appearance.font.size.normal + } - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Scales") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } + Item { + Layout.fillWidth: true + } - Item { - Layout.fillWidth: true - } + Loader { + active: isCurrent + asynchronous: true - MaterialIcon { - text: "expand_more" - rotation: scalesSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + sourceComponent: MaterialIcon { + text: "check" + color: Colours.palette.m3onSurfaceVariant + font.pointSize: Appearance.font.size.large + } } } - } - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = scalesSection.expanded; - root.collapseAllSections(scalesSection); - scalesSection.expanded = !wasExpanded; - } + implicitHeight: fontFamilyMonoRow.implicitHeight + Appearance.padding.normal * 2 } } - } - StyledRect { - visible: scalesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: scalesSection.expanded ? paddingScaleRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + StyledText { + Layout.topMargin: Appearance.spacing.normal + text: qsTr("Sans-serif font family") + font.pointSize: Appearance.font.size.larger + font.weight: 500 } - RowLayout { - id: paddingScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Padding scale") - } + StyledListView { + Layout.fillWidth: true + implicitHeight: fontsSection.expanded ? Math.min(300, Qt.fontFamilies().length * 50) : 0 - CustomSpinBox { - id: paddingScaleSpinBox - min: 0.1 - max: 5 - value: root.paddingScale - onValueModified: value => { - root.paddingScale = value; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - StyledRect { - visible: scalesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: scalesSection.expanded ? roundingScaleRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } + model: Qt.fontFamilies() + spacing: Appearance.spacing.small / 2 + clip: true - RowLayout { - id: roundingScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Rounding scale") + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent } - CustomSpinBox { - id: roundingScaleSpinBox - min: 0.1 - max: 5 - value: root.roundingScale - onValueModified: value => { - root.roundingScale = value; - root.saveConfig(); - } - } - } - } + delegate: StyledRect { + required property string modelData - StyledRect { - visible: scalesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: scalesSection.expanded ? spacingScaleRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } + anchors.left: parent.left + anchors.right: parent.right - RowLayout { - id: spacingScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Spacing scale") - } + readonly property bool isCurrent: modelData === root.fontFamilySans + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) + radius: Appearance.rounding.normal + border.width: isCurrent ? 1 : 0 + border.color: Colours.palette.m3primary - CustomSpinBox { - id: spacingScaleSpinBox - min: 0.1 - max: 5 - value: root.spacingScale - onValueModified: value => { - root.spacingScale = value; - root.saveConfig(); + StateLayer { + function onClicked(): void { + root.fontFamilySans = modelData; + root.saveConfig(); + } } - } - } - } - - Item { - id: transparencySection - Layout.fillWidth: true - Layout.preferredHeight: transparencySectionHeader.implicitHeight - property bool expanded: false - ColumnLayout { - id: transparencySectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small + RowLayout { + id: fontFamilySansRow - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.normal - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Transparency") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } + spacing: Appearance.spacing.normal - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: transparencySection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + StyledText { + text: modelData + font.pointSize: Appearance.font.size.normal } - } - } - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = transparencySection.expanded; - root.collapseAllSections(transparencySection); - transparencySection.expanded = !wasExpanded; - } - } - } - } - - StyledRect { - visible: transparencySection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: transparencySection.expanded ? transparencyEnabledRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } + Item { + Layout.fillWidth: true + } - RowLayout { - id: transparencyEnabledRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Transparency enabled") - } + Loader { + active: isCurrent + asynchronous: true - StyledSwitch { - id: transparencyEnabledSwitch - checked: root.transparencyEnabled - onToggled: { - root.transparencyEnabled = checked; - root.saveConfig(); + sourceComponent: MaterialIcon { + text: "check" + color: Colours.palette.m3onSurfaceVariant + font.pointSize: Appearance.font.size.large + } + } } - } - } - } - - StyledRect { - visible: transparencySection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: transparencySection.expanded ? transparencyBaseRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: transparencyBaseRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Transparency base") + implicitHeight: fontFamilySansRow.implicitHeight + Appearance.padding.normal * 2 } - - CustomSpinBox { - id: transparencyBaseSpinBox - min: 0 - max: 1 - value: root.transparencyBase - onValueModified: value => { - root.transparencyBase = value; - root.saveConfig(); - } - } - } - } - - StyledRect { - visible: transparencySection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: transparencySection.expanded ? transparencyLayersRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} } - RowLayout { - id: transparencyLayersRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Transparency layers") - } + StyledRect { + Layout.fillWidth: true + implicitHeight: fontSizeScaleRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - CustomSpinBox { - id: transparencyLayersSpinBox - min: 0 - max: 1 - value: root.transparencyLayers - onValueModified: value => { - root.transparencyLayers = value; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - - Item { - id: borderSection - Layout.fillWidth: true - Layout.preferredHeight: borderSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: borderSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + id: fontSizeScaleRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Border") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { Layout.fillWidth: true + text: qsTr("Font size scale") } - MaterialIcon { - text: "expand_more" - rotation: borderSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + CustomSpinBox { + id: fontSizeScaleSpinBox + min: 0.1 + max: 5 + value: root.fontSizeScale + onValueModified: value => { + root.fontSizeScale = value; + root.saveConfig(); } } } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = borderSection.expanded; - root.collapseAllSections(borderSection); - borderSection.expanded = !wasExpanded; - } - } } } - StyledRect { - visible: borderSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: borderSection.expanded ? borderRoundingRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: scalesSection + title: qsTr("Scales") + onToggleRequested: { + root.collapseAllSections(scalesSection); } - RowLayout { - id: borderRoundingRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Border rounding") + SpinBoxRow { + label: qsTr("Padding scale") + min: 0.1 + max: 5 + value: root.paddingScale + onValueModified: value => { + root.paddingScale = value; + root.saveConfig(); } - - CustomSpinBox { - id: borderRoundingSpinBox - min: 0.1 - max: 5 - value: root.borderRounding - onValueModified: value => { - root.borderRounding = value; - root.saveConfig(); - } - } - } - } - - StyledRect { - visible: borderSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: borderSection.expanded ? borderThicknessRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} } - RowLayout { - id: borderThicknessRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Border thickness") - } - - CustomSpinBox { - id: borderThicknessSpinBox - min: 0.1 - max: 5 - value: root.borderThickness - onValueModified: value => { - root.borderThickness = value; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Rounding scale") + min: 0.1 + max: 5 + value: root.roundingScale + onValueModified: value => { + root.roundingScale = value; + root.saveConfig(); } } - } - - Item { - id: backgroundSection - Layout.fillWidth: true - Layout.preferredHeight: backgroundSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: backgroundSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Background") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - MaterialIcon { - text: "expand_more" - rotation: backgroundSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = backgroundSection.expanded; - root.collapseAllSections(backgroundSection); - backgroundSection.expanded = !wasExpanded; - } + SpinBoxRow { + label: qsTr("Spacing scale") + min: 0.1 + max: 5 + value: root.spacingScale + onValueModified: value => { + root.spacingScale = value; + root.saveConfig(); } } } - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? desktopClockRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: transparencySection + title: qsTr("Transparency") + onToggleRequested: { + root.collapseAllSections(transparencySection); } - RowLayout { - id: desktopClockRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Desktop clock") + SwitchRow { + label: qsTr("Transparency enabled") + checked: root.transparencyEnabled + onToggled: checked => { + root.transparencyEnabled = checked; + root.saveConfig(); } - - StyledSwitch { - id: desktopClockSwitch - checked: root.desktopClockEnabled - onToggled: { - root.desktopClockEnabled = checked; - root.saveConfig(); - } - } - } - } - - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? backgroundEnabledRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} } - RowLayout { - id: backgroundEnabledRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Background enabled") + SpinBoxRow { + label: qsTr("Transparency base") + min: 0 + max: 1 + value: root.transparencyBase + onValueModified: value => { + root.transparencyBase = value; + root.saveConfig(); } + } - StyledSwitch { - id: backgroundEnabledSwitch - checked: root.backgroundEnabled - onToggled: { - root.backgroundEnabled = checked; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Transparency layers") + min: 0 + max: 1 + value: root.transparencyLayers + onValueModified: value => { + root.transparencyLayers = value; + root.saveConfig(); } } } - StyledText { - visible: backgroundSection.expanded - Layout.topMargin: Appearance.spacing.normal - text: qsTr("Visualiser") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? visualiserEnabledRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: borderSection + title: qsTr("Border") + onToggleRequested: { + root.collapseAllSections(borderSection); } - RowLayout { - id: visualiserEnabledRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Visualiser enabled") + SpinBoxRow { + label: qsTr("Border rounding") + min: 0.1 + max: 5 + value: root.borderRounding + onValueModified: value => { + root.borderRounding = value; + root.saveConfig(); } + } - StyledSwitch { - id: visualiserEnabledSwitch - checked: root.visualiserEnabled - onToggled: { - root.visualiserEnabled = checked; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Border thickness") + min: 0.1 + max: 5 + value: root.borderThickness + onValueModified: value => { + root.borderThickness = value; + root.saveConfig(); } } } - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? visualiserAutoHideRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: backgroundSection + title: qsTr("Background") + onToggleRequested: { + root.collapseAllSections(backgroundSection); } - RowLayout { - id: visualiserAutoHideRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Visualiser auto hide") + SwitchRow { + label: qsTr("Desktop clock") + checked: root.desktopClockEnabled + onToggled: checked => { + root.desktopClockEnabled = checked; + root.saveConfig(); } + } - StyledSwitch { - id: visualiserAutoHideSwitch - checked: root.visualiserAutoHide - onToggled: { - root.visualiserAutoHide = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Background enabled") + checked: root.backgroundEnabled + onToggled: checked => { + root.backgroundEnabled = checked; + root.saveConfig(); } } - } - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? visualiserRoundingRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + StyledText { + Layout.topMargin: Appearance.spacing.normal + text: qsTr("Visualiser") + font.pointSize: Appearance.font.size.larger + font.weight: 500 } - RowLayout { - id: visualiserRoundingRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Visualiser rounding") - } - - CustomSpinBox { - id: visualiserRoundingSpinBox - min: 0 - max: 10 - value: Math.round(root.visualiserRounding) - onValueModified: value => { - root.visualiserRounding = value; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Visualiser enabled") + checked: root.visualiserEnabled + onToggled: checked => { + root.visualiserEnabled = checked; + root.saveConfig(); } } - } - - StyledRect { - visible: backgroundSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: backgroundSection.expanded ? visualiserSpacingRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} + SwitchRow { + label: qsTr("Visualiser auto hide") + checked: root.visualiserAutoHide + onToggled: checked => { + root.visualiserAutoHide = checked; + root.saveConfig(); + } } - RowLayout { - id: visualiserSpacingRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Visualiser spacing") + SpinBoxRow { + label: qsTr("Visualiser rounding") + min: 0 + max: 10 + value: Math.round(root.visualiserRounding) + onValueModified: value => { + root.visualiserRounding = value; + root.saveConfig(); } + } - CustomSpinBox { - id: visualiserSpacingSpinBox - min: 0 - max: 10 - value: Math.round(root.visualiserSpacing) - onValueModified: value => { - root.visualiserSpacing = value; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Visualiser spacing") + min: 0 + max: 10 + value: Math.round(root.visualiserSpacing) + onValueModified: value => { + root.visualiserSpacing = value; + root.saveConfig(); } } } diff --git a/modules/controlcenter/ethernet/EthernetList.qml b/modules/controlcenter/ethernet/EthernetList.qml index ff7cee2..8b04c09 100644 --- a/modules/controlcenter/ethernet/EthernetList.qml +++ b/modules/controlcenter/ethernet/EthernetList.qml @@ -34,7 +34,7 @@ ColumnLayout { icon: "settings" accent: "Primary" - function onClicked(): void { + onClicked: { if (root.session.ethernet.active) root.session.ethernet.active = null; else { @@ -166,81 +166,6 @@ ColumnLayout { implicitHeight: rowLayout.implicitHeight + Appearance.padding.normal * 2 } } - - component ToggleButton: StyledRect { - id: toggleBtn - - required property bool toggled - property string icon - property string label - property string accent: "Secondary" - - function onClicked(): void { - } - - Layout.preferredWidth: implicitWidth + (toggleStateLayer.pressed ? Appearance.padding.normal * 2 : toggled ? Appearance.padding.small * 2 : 0) - implicitWidth: toggleBtnInner.implicitWidth + Appearance.padding.large * 2 - implicitHeight: toggleBtnIcon.implicitHeight + Appearance.padding.normal * 2 - - radius: toggled || toggleStateLayer.pressed ? Appearance.rounding.small : Math.min(width, height) / 2 * Math.min(1, Appearance.rounding.scale) - color: toggled ? Colours.palette[`m3${accent.toLowerCase()}`] : Colours.palette[`m3${accent.toLowerCase()}Container`] - - StateLayer { - id: toggleStateLayer - - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - - function onClicked(): void { - toggleBtn.onClicked(); - } - } - - RowLayout { - id: toggleBtnInner - - anchors.centerIn: parent - spacing: Appearance.spacing.normal - - MaterialIcon { - id: toggleBtnIcon - - visible: !!text - fill: toggleBtn.toggled ? 1 : 0 - text: toggleBtn.icon - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - font.pointSize: Appearance.font.size.large - - Behavior on fill { - Anim {} - } - } - - Loader { - asynchronous: true - active: !!toggleBtn.label - visible: active - - sourceComponent: StyledText { - text: toggleBtn.label - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - } - } - } - - Behavior on radius { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial - } - } - - Behavior on Layout.preferredWidth { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial - } - } - } } diff --git a/modules/controlcenter/network/NetworkList.qml b/modules/controlcenter/network/NetworkList.qml index 60bd857..09d7352 100644 --- a/modules/controlcenter/network/NetworkList.qml +++ b/modules/controlcenter/network/NetworkList.qml @@ -34,7 +34,7 @@ ColumnLayout { icon: "wifi" accent: "Tertiary" - function onClicked(): void { + onClicked: { Network.toggleWifi(); } } @@ -44,7 +44,7 @@ ColumnLayout { icon: "wifi_find" accent: "Secondary" - function onClicked(): void { + onClicked: { Network.rescanWifi(); } } @@ -54,7 +54,7 @@ ColumnLayout { icon: "settings" accent: "Primary" - function onClicked(): void { + onClicked: { if (root.session.network.active) root.session.network.active = null; else { @@ -224,79 +224,4 @@ ColumnLayout { implicitHeight: rowLayout.implicitHeight + Appearance.padding.normal * 2 } } - - component ToggleButton: StyledRect { - id: toggleBtn - - required property bool toggled - property string icon - property string label - property string accent: "Secondary" - - function onClicked(): void { - } - - Layout.preferredWidth: implicitWidth + (toggleStateLayer.pressed ? Appearance.padding.normal * 2 : toggled ? Appearance.padding.small * 2 : 0) - implicitWidth: toggleBtnInner.implicitWidth + Appearance.padding.large * 2 - implicitHeight: toggleBtnIcon.implicitHeight + Appearance.padding.normal * 2 - - radius: toggled || toggleStateLayer.pressed ? Appearance.rounding.small : Math.min(width, height) / 2 * Math.min(1, Appearance.rounding.scale) - color: toggled ? Colours.palette[`m3${accent.toLowerCase()}`] : Colours.palette[`m3${accent.toLowerCase()}Container`] - - StateLayer { - id: toggleStateLayer - - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - - function onClicked(): void { - toggleBtn.onClicked(); - } - } - - RowLayout { - id: toggleBtnInner - - anchors.centerIn: parent - spacing: Appearance.spacing.normal - - MaterialIcon { - id: toggleBtnIcon - - visible: !!text - fill: toggleBtn.toggled ? 1 : 0 - text: toggleBtn.icon - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - font.pointSize: Appearance.font.size.large - - Behavior on fill { - Anim {} - } - } - - Loader { - asynchronous: true - active: !!toggleBtn.label - visible: active - - sourceComponent: StyledText { - text: toggleBtn.label - color: toggleBtn.toggled ? Colours.palette[`m3on${toggleBtn.accent}`] : Colours.palette[`m3on${toggleBtn.accent}Container`] - } - } - } - - Behavior on radius { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial - } - } - - Behavior on Layout.preferredWidth { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial - } - } - } } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 22414c7..2bb50d8 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -239,73 +239,12 @@ RowLayout { } } - Item { + CollapsibleSection { id: clockSection - Layout.fillWidth: true - Layout.preferredHeight: clockSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: clockSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Clock") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: clockSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = clockSection.expanded; - root.collapseAllSections(clockSection); - clockSection.expanded = !wasExpanded; - } - } - - StyledText { - visible: clockSection.expanded - text: qsTr("Clock display settings") - color: Colours.palette.m3outline - Layout.fillWidth: true - } - } - } - - StyledRect { - Layout.fillWidth: true - visible: clockSection.expanded - implicitHeight: clockSection.expanded ? clockRow.implicitHeight + Appearance.padding.large * 2 : 0 - - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + title: qsTr("Clock") + description: qsTr("Clock display settings") + onToggleRequested: { + root.collapseAllSections(clockSection); } RowLayout { @@ -333,835 +272,319 @@ RowLayout { } } - Item { + CollapsibleSection { id: barBehaviorSection - Layout.fillWidth: true - Layout.preferredHeight: barBehaviorSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: barBehaviorSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Bar Behavior") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: barBehaviorSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = barBehaviorSection.expanded; - root.collapseAllSections(barBehaviorSection); - barBehaviorSection.expanded = !wasExpanded; - } - } + title: qsTr("Bar Behavior") + onToggleRequested: { + root.collapseAllSections(barBehaviorSection); } - } - - StyledRect { - visible: barBehaviorSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: barBehaviorSection.expanded ? persistentRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: persistentRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Persistent") - } - StyledSwitch { - checked: root.persistent - onToggled: { - root.persistent = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Persistent") + checked: root.persistent + onToggled: checked => { + root.persistent = checked; + root.saveConfig(); } } - } - - StyledRect { - visible: barBehaviorSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: barBehaviorSection.expanded ? showOnHoverRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: showOnHoverRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show on hover") - } - StyledSwitch { - checked: root.showOnHover - onToggled: { - root.showOnHover = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Show on hover") + checked: root.showOnHover + onToggled: checked => { + root.showOnHover = checked; + root.saveConfig(); } } - } - - StyledRect { - visible: barBehaviorSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: barBehaviorSection.expanded ? dragThresholdRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - RowLayout { - id: dragThresholdRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Drag threshold") - } - - CustomSpinBox { - min: 0 - max: 100 - value: root.dragThreshold - onValueModified: value => { - root.dragThreshold = value; - root.saveConfig(); - } + SpinBoxRow { + label: qsTr("Drag threshold") + min: 0 + max: 100 + value: root.dragThreshold + onValueModified: value => { + root.dragThreshold = value; + root.saveConfig(); } } } - Item { + CollapsibleSection { id: statusIconsSection - Layout.fillWidth: true - Layout.preferredHeight: statusIconsSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: statusIconsSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Status Icons") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { - Layout.fillWidth: true - } - - MaterialIcon { - text: "expand_more" - rotation: statusIconsSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} - } - } - } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = statusIconsSection.expanded; - root.collapseAllSections(statusIconsSection); - statusIconsSection.expanded = !wasExpanded; - } - } + title: qsTr("Status Icons") + onToggleRequested: { + root.collapseAllSections(statusIconsSection); } - } - - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showAudioRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: showAudioRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show audio") - } - StyledSwitch { - checked: root.showAudio - onToggled: { - root.showAudio = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Show audio") + checked: root.showAudio + onToggled: checked => { + root.showAudio = checked; + root.saveConfig(); } } - } - - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showMicrophoneRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - RowLayout { - id: showMicrophoneRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show microphone") + SwitchRow { + label: qsTr("Show microphone") + checked: root.showMicrophone + onToggled: checked => { + root.showMicrophone = checked; + root.saveConfig(); } - - StyledSwitch { - checked: root.showMicrophone - onToggled: { - root.showMicrophone = checked; - root.saveConfig(); - } - } - } - } - - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showKbLayoutRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} } - RowLayout { - id: showKbLayoutRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show keyboard layout") + SwitchRow { + label: qsTr("Show keyboard layout") + checked: root.showKbLayout + onToggled: checked => { + root.showKbLayout = checked; + root.saveConfig(); } + } - StyledSwitch { - checked: root.showKbLayout - onToggled: { - root.showKbLayout = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Show network") + checked: root.showNetwork + onToggled: checked => { + root.showNetwork = checked; + root.saveConfig(); } } - } - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showNetworkRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + SwitchRow { + label: qsTr("Show bluetooth") + checked: root.showBluetooth + onToggled: checked => { + root.showBluetooth = checked; + root.saveConfig(); + } } - RowLayout { - id: showNetworkRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show network") + SwitchRow { + label: qsTr("Show battery") + checked: root.showBattery + onToggled: checked => { + root.showBattery = checked; + root.saveConfig(); } + } - StyledSwitch { - checked: root.showNetwork - onToggled: { - root.showNetwork = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Show lock status") + checked: root.showLockStatus + onToggled: checked => { + root.showLockStatus = checked; + root.saveConfig(); } } } - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showBluetoothRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: traySettingsSection + title: qsTr("Tray Settings") + onToggleRequested: { + root.collapseAllSections(traySettingsSection); } - RowLayout { - id: showBluetoothRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show bluetooth") + SwitchRow { + label: qsTr("Background") + checked: root.trayBackground + onToggled: checked => { + root.trayBackground = checked; + root.saveConfig(); } - - StyledSwitch { - checked: root.showBluetooth - onToggled: { - root.showBluetooth = checked; - root.saveConfig(); - } - } - } - } - - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showBatteryRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} } - RowLayout { - id: showBatteryRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show battery") + SwitchRow { + label: qsTr("Compact") + checked: root.trayCompact + onToggled: checked => { + root.trayCompact = checked; + root.saveConfig(); } + } - StyledSwitch { - checked: root.showBattery - onToggled: { - root.showBattery = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Recolour") + checked: root.trayRecolour + onToggled: checked => { + root.trayRecolour = checked; + root.saveConfig(); } } } - StyledRect { - visible: statusIconsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: statusIconsSection.expanded ? showLockStatusRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} + CollapsibleSection { + id: workspacesSection + title: qsTr("Workspaces") + onToggleRequested: { + root.collapseAllSections(workspacesSection); } - RowLayout { - id: showLockStatusRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show lock status") - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledSwitch { - checked: root.showLockStatus - onToggled: { - root.showLockStatus = checked; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - - Item { - id: traySettingsSection - Layout.fillWidth: true - Layout.preferredHeight: traySettingsSectionHeader.implicitHeight - property bool expanded: false - - ColumnLayout { - id: traySettingsSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + id: workspacesShownRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Tray Settings") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { Layout.fillWidth: true + text: qsTr("Shown") } - MaterialIcon { - text: "expand_more" - rotation: traySettingsSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + CustomSpinBox { + min: 1 + max: 20 + value: root.workspacesShown + onValueModified: value => { + root.workspacesShown = value; + root.saveConfig(); } } } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = traySettingsSection.expanded; - root.collapseAllSections(traySettingsSection); - traySettingsSection.expanded = !wasExpanded; - } - } } - } - - StyledRect { - visible: traySettingsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: traySettingsSection.expanded ? trayBackgroundRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: trayBackgroundRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Background") - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledSwitch { - checked: root.trayBackground - onToggled: { - root.trayBackground = checked; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - - StyledRect { - visible: traySettingsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: traySettingsSection.expanded ? trayCompactRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: trayCompactRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Compact") - } + RowLayout { + id: workspacesActiveIndicatorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledSwitch { - checked: root.trayCompact - onToggled: { - root.trayCompact = checked; - root.saveConfig(); + StyledText { + Layout.fillWidth: true + text: qsTr("Active indicator") } - } - } - } - - StyledRect { - visible: traySettingsSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: traySettingsSection.expanded ? trayRecolourRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - RowLayout { - id: trayRecolourRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Recolour") - } - - StyledSwitch { - checked: root.trayRecolour - onToggled: { - root.trayRecolour = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesActiveIndicator + onToggled: { + root.workspacesActiveIndicator = checked; + root.saveConfig(); + } } } } - } - Item { - id: workspacesSection - Layout.fillWidth: true - Layout.preferredHeight: workspacesSectionHeader.implicitHeight - property bool expanded: false + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - ColumnLayout { - id: workspacesSectionHeader - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.small + Behavior on implicitHeight { + Anim {} + } RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small + id: workspacesOccupiedBgRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal StyledText { - Layout.topMargin: Appearance.spacing.large - text: qsTr("Workspaces") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - Item { Layout.fillWidth: true + text: qsTr("Occupied background") } - MaterialIcon { - text: "expand_more" - rotation: workspacesSection.expanded ? 180 : 0 - color: Colours.palette.m3onSurface - Behavior on rotation { - Anim {} + StyledSwitch { + checked: root.workspacesOccupiedBg + onToggled: { + root.workspacesOccupiedBg = checked; + root.saveConfig(); } } } - - StateLayer { - anchors.fill: parent - anchors.leftMargin: -Appearance.padding.normal - anchors.rightMargin: -Appearance.padding.normal - function onClicked(): void { - const wasExpanded = workspacesSection.expanded; - root.collapseAllSections(workspacesSection); - workspacesSection.expanded = !wasExpanded; - } - } } - } - StyledRect { - visible: workspacesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: workspacesSection.expanded ? workspacesShownRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: workspacesShownRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Shown") - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - CustomSpinBox { - min: 1 - max: 20 - value: root.workspacesShown - onValueModified: value => { - root.workspacesShown = value; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - StyledRect { - visible: workspacesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: workspacesSection.expanded ? workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: workspacesActiveIndicatorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Active indicator") - } + RowLayout { + id: workspacesShowWindowsRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledSwitch { - checked: root.workspacesActiveIndicator - onToggled: { - root.workspacesActiveIndicator = checked; - root.saveConfig(); + StyledText { + Layout.fillWidth: true + text: qsTr("Show windows") } - } - } - } - - StyledRect { - visible: workspacesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: workspacesSection.expanded ? workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: workspacesOccupiedBgRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Occupied background") - } - StyledSwitch { - checked: root.workspacesOccupiedBg - onToggled: { - root.workspacesOccupiedBg = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesShowWindows + onToggled: { + root.workspacesShowWindows = checked; + root.saveConfig(); + } } } } - } - StyledRect { - visible: workspacesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: workspacesSection.expanded ? workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: workspacesShowWindowsRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show windows") - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - StyledSwitch { - checked: root.workspacesShowWindows - onToggled: { - root.workspacesShowWindows = checked; - root.saveConfig(); - } + Behavior on implicitHeight { + Anim {} } - } - } - StyledRect { - visible: workspacesSection.expanded - Layout.fillWidth: true - Layout.topMargin: Appearance.spacing.small / 2 - implicitHeight: workspacesSection.expanded ? workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 : 0 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: workspacesPerMonitorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesPerMonitorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Per monitor workspaces") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Per monitor workspaces") + } - StyledSwitch { - checked: root.workspacesPerMonitor - onToggled: { - root.workspacesPerMonitor = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesPerMonitor + onToggled: { + root.workspacesPerMonitor = checked; + root.saveConfig(); + } } } } -- cgit v1.2.3-freya From 1da9c68be8f336a671f9514cf5feaaf5998da981 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Thu, 13 Nov 2025 14:41:14 -0500 Subject: cleanup: trailing whitespace removeal (entire project) --- components/controls/CollapsibleSection.qml | 2 +- .../controlcenter/appearance/AppearancePane.qml | 50 +++---- modules/controlcenter/launcher/LauncherPane.qml | 10 +- modules/controlcenter/network/WirelessDetails.qml | 6 +- modules/controlcenter/network/WirelessList.qml | 2 +- .../network/WirelessPasswordDialog.qml | 10 +- modules/controlcenter/taskbar/TaskbarPane.qml | 8 +- modules/drawers/Interactions.qml | 22 +-- services/Network.qml | 154 ++++++++++----------- services/VPN.qml | 6 +- utils/Icons.qml | 4 +- 11 files changed, 137 insertions(+), 137 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/components/controls/CollapsibleSection.qml b/components/controls/CollapsibleSection.qml index 945386c..cb6e62a 100644 --- a/components/controls/CollapsibleSection.qml +++ b/components/controls/CollapsibleSection.qml @@ -12,7 +12,7 @@ ColumnLayout { required property string title property string description: "" property bool expanded: false - + signal toggleRequested spacing: Appearance.spacing.small / 2 diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 68e2e2d..fc338f9 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -310,20 +310,20 @@ RowLayout { StateLayer { function onClicked(): void { const variant = modelData.variant; - + // Optimistic update - set immediately Schemes.currentVariant = variant; - + // Execute the command Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]); - + // Reload after a delay to confirm Qt.callLater(() => { reloadTimer.restart(); }); } } - + Timer { id: reloadTimer interval: 300 @@ -410,20 +410,20 @@ RowLayout { const name = modelData.name; const flavour = modelData.flavour; const schemeKey = `${name} ${flavour}`; - + // Optimistic update - set immediately Schemes.currentScheme = schemeKey; - + // Execute the command Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]); - + // Reload after a delay to confirm Qt.callLater(() => { reloadTimer.restart(); }); } } - + Timer { id: reloadTimer interval: 300 @@ -1053,7 +1053,7 @@ RowLayout { columns: Math.max(1, Math.floor(parent.width / 200)) rowSpacing: Appearance.spacing.normal columnSpacing: Appearance.spacing.normal - + // Center the grid content Layout.maximumWidth: { const cols = columns; @@ -1100,16 +1100,16 @@ RowLayout { path: modelData.path anchors.fill: parent - + // Ensure sourceSize is always set to valid dimensions sourceSize: Qt.size( Math.max(1, Math.floor(parent.width)), Math.max(1, Math.floor(parent.height)) ) - + // Show when ready, hide if fallback is showing opacity: status === Image.Ready && !fallbackImage.visible ? 1 : 0 - + Behavior on opacity { NumberAnimation { duration: 200 @@ -1129,11 +1129,11 @@ RowLayout { Math.max(1, Math.floor(parent.width)), Math.max(1, Math.floor(parent.height)) ) - + // Show if caching image hasn't loaded after a delay visible: opacity > 0 opacity: 0 - + Timer { id: fallbackTimer interval: 500 @@ -1144,7 +1144,7 @@ RowLayout { } } } - + // Also check status changes onStatusChanged: { if (status === Image.Ready && cachingImage.status !== Image.Ready) { @@ -1155,7 +1155,7 @@ RowLayout { }); } } - + Behavior on opacity { NumberAnimation { duration: 200 @@ -1182,26 +1182,26 @@ RowLayout { anchors.right: parent.right anchors.bottom: parent.bottom height: filenameText.implicitHeight + Appearance.padding.normal * 2 - + // Match the parent's rounded corners at the bottom radius: Appearance.rounding.normal - + gradient: Gradient { GradientStop { position: 0.0; color: Qt.rgba(0, 0, 0, 0) } GradientStop { position: 0.3; color: Qt.rgba(0, 0, 0, 0.3) } GradientStop { position: 0.7; color: Qt.rgba(0, 0, 0, 0.75) } GradientStop { position: 1.0; color: Qt.rgba(0, 0, 0, 0.85) } } - + opacity: 0 - + Behavior on opacity { NumberAnimation { duration: 200 easing.type: Easing.OutCubic } } - + Component.onCompleted: { opacity = 1; } @@ -1228,20 +1228,20 @@ RowLayout { color: isCurrent ? Colours.palette.m3primary : "#FFFFFF" elide: Text.ElideMiddle maximumLineCount: 1 - + // Text shadow for better readability style: Text.Outline styleColor: Qt.rgba(0, 0, 0, 0.6) - + opacity: 0 - + Behavior on opacity { NumberAnimation { duration: 200 easing.type: Easing.OutCubic } } - + Component.onCompleted: { opacity = 1; } diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 9b2570a..dd00877 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -53,7 +53,7 @@ RowLayout { try { const config = JSON.parse(configFile.text()); const appId = root.selectedApp.id || root.selectedApp.entry?.id; - + if (config.launcher && config.launcher.hiddenApps) { root.hideFromLauncherChecked = config.launcher.hiddenApps.includes(appId); } else { @@ -72,12 +72,12 @@ RowLayout { try { const config = JSON.parse(configFile.text()); const appId = root.selectedApp.id || root.selectedApp.entry?.id; - + if (!config.launcher) config.launcher = {}; if (!config.launcher.hiddenApps) config.launcher.hiddenApps = []; - + const hiddenApps = config.launcher.hiddenApps; - + if (isHidden) { // Add to hiddenApps if not already there if (!hiddenApps.includes(appId)) { @@ -90,7 +90,7 @@ RowLayout { hiddenApps.splice(index, 1); } } - + const jsonString = JSON.stringify(config, null, 4); configFile.setText(jsonString); } catch (e) { diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml index 7039720..d5abc9d 100644 --- a/modules/controlcenter/network/WirelessDetails.qml +++ b/modules/controlcenter/network/WirelessDetails.qml @@ -26,7 +26,7 @@ Item { updateDeviceDetails(); checkSavedProfile(); } - + function checkSavedProfile(): void { // Refresh saved connections list to ensure it's up to date // This ensures the "Forget Network" button visibility is accurate @@ -102,7 +102,7 @@ Item { color: Colours.palette.m3errorContainer onColor: Colours.palette.m3onErrorContainer text: qsTr("Forget Network") - + onClicked: { if (root.network && root.network.ssid) { // Disconnect first if connected @@ -184,7 +184,7 @@ Item { if (root.network.isSecure) { // Check if we have a saved connection profile for this network (by SSID) const hasSavedProfile = Network.hasSavedProfile(root.network.ssid); - + if (hasSavedProfile) { // Try connecting with saved password - don't show dialog if it fails // The saved password should work, but if connection fails for other reasons, diff --git a/modules/controlcenter/network/WirelessList.qml b/modules/controlcenter/network/WirelessList.qml index f861db4..ca6947a 100644 --- a/modules/controlcenter/network/WirelessList.qml +++ b/modules/controlcenter/network/WirelessList.qml @@ -230,7 +230,7 @@ ColumnLayout { if (network.isSecure) { // Check if we have a saved connection profile for this network (by SSID) const hasSavedProfile = Network.hasSavedProfile(network.ssid); - + if (hasSavedProfile) { // Try connecting with saved password - don't show dialog if it fails // The saved password should work, but if connection fails for other reasons, diff --git a/modules/controlcenter/network/WirelessPasswordDialog.qml b/modules/controlcenter/network/WirelessPasswordDialog.qml index 2b33b43..8a71fa8 100644 --- a/modules/controlcenter/network/WirelessPasswordDialog.qml +++ b/modules/controlcenter/network/WirelessPasswordDialog.qml @@ -15,7 +15,7 @@ Item { id: root required property Session session - + readonly property var network: { // Prefer pendingNetwork, then active network if (session.network.pendingNetwork) { @@ -105,7 +105,7 @@ Item { StyledText { id: statusText - + Layout.alignment: Qt.AlignHCenter Layout.topMargin: Appearance.spacing.small visible: Network.connectionStatus.length > 0 || connectButton.connecting @@ -251,15 +251,15 @@ Item { // Check connection status message for success indicators const status = Network.connectionStatus; const statusLower = status.toLowerCase(); - + // Check for success indicators in status message - const hasSuccessIndicator = statusLower.includes("connection activated") || + const hasSuccessIndicator = statusLower.includes("connection activated") || statusLower.includes("successfully") || statusLower.includes("connected successfully") || (statusLower.includes("connected") && !statusLower.includes("error") && !statusLower.includes("failed")); // Check if we're connected to the target network (case-insensitive SSID comparison) - const isConnected = root.network && Network.active && Network.active.ssid && + const isConnected = root.network && Network.active && Network.active.ssid && Network.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim(); if (isConnected || hasSuccessIndicator) { diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 2bb50d8..cf52fd3 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -120,13 +120,13 @@ RowLayout { if (!configFile.loaded) { return; } - + try { const config = JSON.parse(configFile.text()); - + // Ensure bar object exists if (!config.bar) config.bar = {}; - + // Update clock setting if (!config.bar.clock) config.bar.clock = {}; config.bar.clock.showIcon = clockShowIconSwitch.checked; @@ -163,7 +163,7 @@ RowLayout { // Update entries from the model (same approach as clock - use provided value if available) if (!config.bar.entries) config.bar.entries = []; config.bar.entries = []; - + for (let i = 0; i < entriesModel.count; i++) { const entry = entriesModel.get(i); // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) diff --git a/modules/drawers/Interactions.qml b/modules/drawers/Interactions.qml index 10190a4..2d0c115 100644 --- a/modules/drawers/Interactions.qml +++ b/modules/drawers/Interactions.qml @@ -204,18 +204,18 @@ CustomMouseArea { const panelWidth = panels.notifications.width || panels.notifications.implicitWidth || Config.notifs.sizes.width; const panelX = bar.implicitWidth + panels.notifications.x; const isPanelCollapsed = panelHeight < 10; // Consider collapsed if height is very small - + let showNotifications = inTopPanel(panels.notifications, x, y); - + // Only use fallback corner detection when panel is collapsed if (!showNotifications && isPanelCollapsed) { // Use panel's actual width and position for fallback, with some padding const cornerPadding = Config.border.rounding || 20; - showNotifications = x >= panelX - cornerPadding && - x <= panelX + panelWidth + cornerPadding && + showNotifications = x >= panelX - cornerPadding && + x <= panelX + panelWidth + cornerPadding && y < Config.border.thickness + cornerPadding; } - + // Check if mouse is over the clear all button area // Button is positioned to the left of the notification panel if (!showNotifications && panels.notifications.height > 0 && panels.clearAllButton && panels.clearAllButton.visible) { @@ -223,17 +223,17 @@ CustomMouseArea { const buttonY = Config.border.thickness + panels.clearAllButton.y; const buttonWidth = panels.clearAllButton.width; const buttonHeight = panels.clearAllButton.height; - - const inButtonArea = x >= buttonX && - x <= buttonX + buttonWidth && - y >= buttonY && + + const inButtonArea = x >= buttonX && + x <= buttonX + buttonWidth && + y >= buttonY && y <= buttonY + buttonHeight; - + if (inButtonArea) { showNotifications = true; } } - + // Show or hide notification panel based on hover if (panels.notifications.content) { if (showNotifications) { diff --git a/services/Network.qml b/services/Network.qml index 0b936b8..7732a1c 100644 --- a/services/Network.qml +++ b/services/Network.qml @@ -30,17 +30,17 @@ Singleton { property var wirelessDeviceDetails: null property string connectionStatus: "" property string connectionDebug: "" - + function clearConnectionStatus(): void { connectionStatus = ""; // Don't clear debug - keep it for reference // connectionDebug = ""; } - + function setConnectionStatus(status: string): void { connectionStatus = status; } - + function addDebugInfo(info: string): void { const timestamp = new Date().toLocaleTimeString(); const newInfo = "[" + timestamp + "] " + info; @@ -79,23 +79,23 @@ Singleton { // When no password, use SSID (will use saved password if available) const hasBssid = bssid !== undefined && bssid !== null && bssid.length > 0; let cmd = []; - + // Set up pending connection tracking if callback provided if (callback) { root.pendingConnection = { ssid: ssid, bssid: hasBssid ? bssid : "", callback: callback }; } - + if (password && password.length > 0) { // When password is provided, try BSSID first if available, otherwise use SSID if (hasBssid) { // Use BSSID when password is provided - ensure BSSID is uppercase const bssidUpper = bssid.toUpperCase(); - + // Check if a connection with this SSID already exists - const existingConnection = root.savedConnections.find(conn => + const existingConnection = root.savedConnections.find(conn => conn && conn.toLowerCase().trim() === ssid.toLowerCase().trim() ); - + if (existingConnection) { // Connection already exists - delete it first, then create new one with updated password root.addDebugInfo(qsTr("Connection '%1' already exists, deleting it first...").arg(existingConnection)); @@ -122,7 +122,7 @@ Singleton { root.setConnectionStatus(qsTr("Connecting to %1 (using saved password)...").arg(ssid)); root.addDebugInfo(qsTr("Using saved password for: %1").arg(ssid)); } - + // Show the exact command being executed const cmdStr = cmd.join(" "); root.addDebugInfo(qsTr("=== COMMAND TO EXECUTE ===")); @@ -130,17 +130,17 @@ Singleton { root.addDebugInfo(qsTr("Command array: [%1]").arg(cmd.map((arg, i) => `"${arg}"`).join(", "))); root.addDebugInfo(qsTr("Command array length: %1").arg(cmd.length)); root.addDebugInfo(qsTr("===========================")); - + // Set command and start process root.addDebugInfo(qsTr("Setting command property...")); connectProc.command = cmd; const setCmdStr = connectProc.command ? connectProc.command.join(" ") : "null"; root.addDebugInfo(qsTr("Command property set, value: %1").arg(setCmdStr)); root.addDebugInfo(qsTr("Command property verified: %1").arg(setCmdStr === cmdStr ? "Match" : "MISMATCH")); - + // If we're creating a connection profile, we need to activate it after creation const isConnectionAdd = cmd.length > 0 && cmd[0] === "nmcli" && cmd[1] === "connection" && cmd[2] === "add"; - + // Wait a moment before starting to ensure command is set Qt.callLater(() => { root.addDebugInfo(qsTr("=== STARTING PROCESS ===")); @@ -150,7 +150,7 @@ Singleton { connectProc.running = true; root.addDebugInfo(qsTr("Process running set to: %1").arg(connectProc.running)); root.addDebugInfo(qsTr("========================")); - + // Check if process actually started after a short delay Qt.callLater(() => { root.addDebugInfo(qsTr("Process status check (100ms later):")); @@ -162,7 +162,7 @@ Singleton { } }, 100); }); - + // Start connection check timer if we have a callback if (callback) { root.addDebugInfo(qsTr("Starting connection check timer (4 second interval)")); @@ -171,25 +171,25 @@ Singleton { root.addDebugInfo(qsTr("No callback provided - not starting connection check timer")); } } - + function createConnectionWithPassword(ssid: string, bssidUpper: string, password: string): void { // Create connection profile with all required properties for BSSID + password - const cmd = ["nmcli", "connection", "add", - "type", "wifi", + const cmd = ["nmcli", "connection", "add", + "type", "wifi", "con-name", ssid, "ifname", "*", "ssid", ssid, "802-11-wireless.bssid", bssidUpper, "802-11-wireless-security.key-mgmt", "wpa-psk", "802-11-wireless-security.psk", password]; - + root.setConnectionStatus(qsTr("Connecting to %1 (BSSID: %2)...").arg(ssid).arg(bssidUpper)); root.addDebugInfo(qsTr("Using BSSID: %1 for SSID: %2").arg(bssidUpper).arg(ssid)); root.addDebugInfo(qsTr("Creating connection profile with password and key-mgmt")); - + // Set command and start process connectProc.command = cmd; - + Qt.callLater(() => { connectProc.running = true; }); @@ -198,7 +198,7 @@ Singleton { function connectToNetworkWithPasswordCheck(ssid: string, isSecure: bool, callback: var, bssid: string): void { root.addDebugInfo(qsTr("=== connectToNetworkWithPasswordCheck ===")); root.addDebugInfo(qsTr("SSID: %1, isSecure: %2").arg(ssid).arg(isSecure)); - + // For secure networks, try connecting without password first // If connection succeeds (saved password exists), we're done // If it fails with password error, callback will be called to show password dialog @@ -228,7 +228,7 @@ Singleton { disconnectProc.exec(["nmcli", "device", "disconnect", "wifi"]); } } - + function forgetNetwork(ssid: string): void { // Delete the connection profile for this network // This will remove the saved password and connection settings @@ -240,7 +240,7 @@ Singleton { }, 500); } } - + function hasConnectionProfile(ssid: string): bool { // Check if a connection profile exists for this SSID // This is synchronous check - returns true if connection exists @@ -252,12 +252,12 @@ Singleton { // The actual check will be done asynchronously return false; } - + property list savedConnections: [] property list savedConnectionSsids: [] property var wifiConnectionQueue: [] property int currentSsidQueryIndex: 0 - + Process { id: listConnectionsProc command: ["nmcli", "-t", "-f", "NAME,TYPE", "connection", "show"] @@ -276,12 +276,12 @@ Singleton { } } } - + function parseConnectionList(output: string): void { const lines = output.trim().split("\n").filter(line => line.length > 0); const wifiConnections = []; const connections = []; - + // First pass: identify WiFi connections for (const line of lines) { const parts = line.split(":"); @@ -289,15 +289,15 @@ Singleton { const name = parts[0]; const type = parts[1]; connections.push(name); - + if (type === "802-11-wireless") { wifiConnections.push(name); } } } - + root.savedConnections = connections; - + // Second pass: get SSIDs for WiFi connections if (wifiConnections.length > 0) { root.wifiConnectionQueue = wifiConnections; @@ -310,10 +310,10 @@ Singleton { root.wifiConnectionQueue = []; } } - + Process { id: getSsidProc - + environment: ({ LANG: "C.UTF-8", LC_ALL: "C.UTF-8" @@ -332,7 +332,7 @@ Singleton { } } } - + function processSsidOutput(output: string): void { // Parse "802-11-wireless.ssid:SSID_NAME" format const lines = output.trim().split("\n"); @@ -351,11 +351,11 @@ Singleton { } } } - + // Query next connection queryNextSsid(); } - + function queryNextSsid(): void { if (root.currentSsidQueryIndex < root.wifiConnectionQueue.length) { const connectionName = root.wifiConnectionQueue[root.currentSsidQueryIndex]; @@ -368,13 +368,13 @@ Singleton { root.currentSsidQueryIndex = 0; } } - + function hasSavedProfile(ssid: string): bool { if (!ssid || ssid.length === 0) { return false; } const ssidLower = ssid.toLowerCase().trim(); - + // If currently connected to this network, it definitely has a saved profile if (root.active && root.active.ssid) { const activeSsidLower = root.active.ssid.toLowerCase().trim(); @@ -382,21 +382,21 @@ Singleton { return true; } } - + // Check if SSID is in saved connections (case-insensitive comparison) - const hasSsid = root.savedConnectionSsids.some(savedSsid => + const hasSsid = root.savedConnectionSsids.some(savedSsid => savedSsid && savedSsid.toLowerCase().trim() === ssidLower ); - + if (hasSsid) { return true; } - + // Fallback: also check if connection name matches SSID (some connections use SSID as name) - const hasConnectionName = root.savedConnections.some(connName => + const hasConnectionName = root.savedConnections.some(connName => connName && connName.toLowerCase().trim() === ssidLower ); - + return hasConnectionName; } @@ -442,7 +442,7 @@ Singleton { if (isNaN(cidrNum) || cidrNum < 0 || cidrNum > 32) { return ""; } - + const mask = (0xffffffff << (32 - cidrNum)) >>> 0; const octets = [ (mask >>> 24) & 0xff, @@ -450,7 +450,7 @@ Singleton { (mask >>> 8) & 0xff, mask & 0xff ]; - + return octets.join("."); } @@ -510,7 +510,7 @@ Singleton { root.addDebugInfo(qsTr(" Pending SSID: %1").arg(root.pendingConnection.ssid)); root.addDebugInfo(qsTr(" Active SSID: %1").arg(root.active ? root.active.ssid : "None")); root.addDebugInfo(qsTr(" Connected: %1").arg(connected)); - + if (!connected && root.pendingConnection.callback) { // Connection didn't succeed after multiple checks, show password dialog root.addDebugInfo(qsTr("Connection failed - calling password dialog callback")); @@ -543,19 +543,19 @@ Singleton { repeat: true triggeredOnStart: false property int checkCount: 0 - + onRunningChanged: { if (running) { root.addDebugInfo(qsTr("Immediate check timer started (checks every 500ms)")); } } - + onTriggered: { if (root.pendingConnection) { checkCount++; const connected = root.active && root.active.ssid === root.pendingConnection.ssid; root.addDebugInfo(qsTr("Immediate check #%1: Connected=%2").arg(checkCount).arg(connected)); - + if (connected) { // Connection succeeded, stop timers and clear pending root.addDebugInfo(qsTr("Connection succeeded on check #%1!").arg(checkCount)); @@ -586,32 +586,32 @@ Singleton { onRunningChanged: { root.addDebugInfo(qsTr("Process running changed to: %1").arg(running)); } - + onStarted: { root.addDebugInfo(qsTr("Process started successfully")); } - + onExited: { root.addDebugInfo(qsTr("=== PROCESS EXITED ===")); root.addDebugInfo(qsTr("Exit code: %1").arg(exitCode)); root.addDebugInfo(qsTr("(Exit code 0 = success, non-zero = error)")); - + // Check if this was a "connection add" command - if so, we need to activate it - const wasConnectionAdd = connectProc.command && connectProc.command.length > 0 - && connectProc.command[0] === "nmcli" - && connectProc.command[1] === "connection" + const wasConnectionAdd = connectProc.command && connectProc.command.length > 0 + && connectProc.command[0] === "nmcli" + && connectProc.command[1] === "connection" && connectProc.command[2] === "add"; - + if (wasConnectionAdd && root.pendingConnection) { const ssid = root.pendingConnection.ssid; - + // Check for duplicate connection warning in stderr text const stderrText = connectProc.stderr ? connectProc.stderr.text : ""; const hasDuplicateWarning = stderrText && ( stderrText.includes("another connection with the name") || stderrText.includes("Reference the connection by its uuid") ); - + // Even with duplicate warning (or if connection already exists), we should try to activate it // Also try if exit code is non-zero but small (might be a warning, not a real error) if (exitCode === 0 || hasDuplicateWarning || (exitCode > 0 && exitCode < 10)) { @@ -622,10 +622,10 @@ Singleton { root.addDebugInfo(qsTr("Connection profile created successfully, now activating: %1").arg(ssid)); root.setConnectionStatus(qsTr("Activating connection...")); } - + // Update saved connections list listConnectionsProc.running = true; - + // Try to activate the connection by SSID (connection name) connectProc.command = ["nmcli", "connection", "up", ssid]; Qt.callLater(() => { @@ -644,7 +644,7 @@ Singleton { password = connectProc.command[pskIndex + 1]; } } - + if (password && password.length > 0) { root.addDebugInfo(qsTr("Using device wifi connect with password as fallback")); connectProc.command = ["nmcli", "device", "wifi", "connect", ssid, "password", password]; @@ -655,10 +655,10 @@ Singleton { } } } - + // Refresh network list after connection attempt getNetworks.running = true; - + // Check if connection succeeded after a short delay (network list needs to update) if (root.pendingConnection) { if (exitCode === 0) { @@ -704,10 +704,10 @@ Singleton { root.addDebugInfo(qsTr("STDERR: %1").arg(line)); } } - + // Check for specific errors that indicate password is needed // Be careful not to match success messages - const needsPassword = (error.includes("Secrets were required") || + const needsPassword = (error.includes("Secrets were required") || error.includes("No secrets provided") || error.includes("802-11-wireless-security.psk") || (error.includes("password") && !error.includes("Connection activated")) || @@ -715,7 +715,7 @@ Singleton { (error.includes("802.11") && !error.includes("Connection activated"))) && !error.includes("Connection activated") && !error.includes("successfully"); - + if (needsPassword && root.pendingConnection && root.pendingConnection.callback) { // Connection failed because password is needed - show dialog immediately connectionCheckTimer.stop(); @@ -784,7 +784,7 @@ Singleton { Process { id: deleteConnectionProc - + // Delete connection profile - refresh network list and saved connections after deletion onExited: { // Refresh network list and saved connections after deletion @@ -924,12 +924,12 @@ Singleton { onStreamFinished: { const output = text.trim(); root.ethernetDebugInfo = "Output received in onStreamFinished! Length: " + output.length + ", First 100 chars: " + output.substring(0, 100); - + if (!output || output.length === 0) { root.ethernetDebugInfo = "No output received (empty)"; return; } - + root.processEthernetOutput(output); } } @@ -942,7 +942,7 @@ Singleton { const lines = output.split("\n"); root.ethernetDebugInfo = "Processing " + lines.length + " lines"; - + const allDevices = lines.map(d => { const dev = d.replace(rep, PLACEHOLDER).split(":"); return { @@ -952,9 +952,9 @@ Singleton { connection: dev[3]?.replace(rep2, ":") ?? "" }; }); - + root.ethernetDebugInfo = "All devices: " + allDevices.length + ", Types: " + allDevices.map(d => d.type).join(", "); - + const ethernetOnly = allDevices.filter(d => d.type === "ethernet"); root.ethernetDebugInfo = "Ethernet devices found: " + ethernetOnly.length; @@ -975,7 +975,7 @@ Singleton { speed: "" }; }); - + root.ethernetDebugInfo = "Ethernet devices processed: " + ethernetDevices.length + ", First device: " + (ethernetDevices[0]?.interface || "none"); // Update the list - replace the entire array to ensure QML detects the change @@ -984,13 +984,13 @@ Singleton { for (let i = 0; i < ethernetDevices.length; i++) { newDevices.push(ethernetDevices[i]); } - + // Replace the entire list root.ethernetDevices = newDevices; - + // Force QML to detect the change by updating a property root.ethernetDeviceCount = ethernetDevices.length; - + // Force QML to re-evaluate the list by accessing it Qt.callLater(() => { const count = root.ethernetDevices.length; @@ -1130,7 +1130,7 @@ const line = lines[i]; // Find the connected wifi interface from device status const lines = output.split("\n"); let wifiInterface = ""; - + for (let i = 0; i < lines.length; i++) { const line = lines[i]; const parts = line.split(/\s+/); diff --git a/services/VPN.qml b/services/VPN.qml index 10e5e7e..412bda4 100644 --- a/services/VPN.qml +++ b/services/VPN.qml @@ -21,7 +21,7 @@ Singleton { const name = providerName; const iface = interfaceName; const defaults = getBuiltinDefaults(name, iface); - + if (isCustomProvider) { const custom = providerInput; return { @@ -31,7 +31,7 @@ Singleton { displayName: custom.displayName || defaults.displayName }; } - + return defaults; } @@ -62,7 +62,7 @@ Singleton { displayName: "Tailscale" } }; - + return builtins[name] || { connectCmd: [name, "up"], disconnectCmd: [name, "down"], diff --git a/utils/Icons.qml b/utils/Icons.qml index e946c4f..389eca3 100644 --- a/utils/Icons.qml +++ b/utils/Icons.qml @@ -194,13 +194,13 @@ Singleton { function getSpecialWsIcon(name: string): string { name = name.toLowerCase().slice("special:".length); - + for (const iconConfig of Config.bar.workspaces.specialWorkspaceIcons) { if (iconConfig.name === name) { return iconConfig.icon; } } - + if (name === "special") return "star"; if (name === "communication") -- cgit v1.2.3-freya From 9de5e790a075d2f1d74113147bfad72b357d1215 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Fri, 14 Nov 2025 16:42:23 -0500 Subject: controlcenter: minor tidying (capitalization and filename) --- .../controlcenter/appearance/AppearancePane.qml | 2 +- modules/controlcenter/audio/AudioPane.qml | 2 +- modules/controlcenter/bluetooth/Settings.qml | 2 +- modules/controlcenter/network/NetworkSettings.qml | 106 +++++++++++++++++++++ modules/controlcenter/network/NetworkingPane.qml | 2 +- .../controlcenter/network/NetworkingSettings.qml | 106 --------------------- modules/controlcenter/taskbar/TaskbarPane.qml | 2 +- 7 files changed, 111 insertions(+), 111 deletions(-) create mode 100644 modules/controlcenter/network/NetworkSettings.qml delete mode 100644 modules/controlcenter/network/NetworkingSettings.qml (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index efd67e9..719e9b3 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -992,7 +992,7 @@ RowLayout { StyledText { Layout.alignment: Qt.AlignHCenter - text: qsTr("Appearance settings") + text: qsTr("Appearance Settings") font.pointSize: Appearance.font.size.large font.bold: true } diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 732bb89..6f5a1f4 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -256,7 +256,7 @@ RowLayout { StyledText { Layout.alignment: Qt.AlignHCenter - text: qsTr("Audio settings") + text: qsTr("Audio Settings") font.pointSize: Appearance.font.size.large font.bold: true } diff --git a/modules/controlcenter/bluetooth/Settings.qml b/modules/controlcenter/bluetooth/Settings.qml index fb493ff..fd33af9 100644 --- a/modules/controlcenter/bluetooth/Settings.qml +++ b/modules/controlcenter/bluetooth/Settings.qml @@ -26,7 +26,7 @@ ColumnLayout { StyledText { Layout.alignment: Qt.AlignHCenter - text: qsTr("Bluetooth settings") + text: qsTr("Bluetooth Settings") font.pointSize: Appearance.font.size.large font.bold: true } diff --git a/modules/controlcenter/network/NetworkSettings.qml b/modules/controlcenter/network/NetworkSettings.qml new file mode 100644 index 0000000..75a7660 --- /dev/null +++ b/modules/controlcenter/network/NetworkSettings.qml @@ -0,0 +1,106 @@ +pragma ComponentBehavior: Bound + +import ".." +import qs.components +import qs.components.controls +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +ColumnLayout { + id: root + + required property Session session + + spacing: Appearance.spacing.normal + + MaterialIcon { + Layout.alignment: Qt.AlignHCenter + text: "router" + font.pointSize: Appearance.font.size.extraLarge * 3 + font.bold: true + } + + StyledText { + Layout.alignment: Qt.AlignHCenter + text: qsTr("Network Settings") + font.pointSize: Appearance.font.size.large + font.bold: true + } + + SectionHeader { + Layout.topMargin: Appearance.spacing.large + title: qsTr("Ethernet") + description: qsTr("Ethernet device information") + } + + SectionContainer { + contentSpacing: Appearance.spacing.small / 2 + + PropertyRow { + label: qsTr("Total devices") + value: qsTr("%1").arg(Nmcli.ethernetDevices.length) + } + + PropertyRow { + showTopMargin: true + label: qsTr("Connected devices") + value: qsTr("%1").arg(Nmcli.ethernetDevices.filter(d => d.connected).length) + } + } + + SectionHeader { + Layout.topMargin: Appearance.spacing.large + title: qsTr("Wireless") + description: qsTr("WiFi network settings") + } + + SectionContainer { + ToggleRow { + label: qsTr("WiFi enabled") + checked: Nmcli.wifiEnabled + toggle.onToggled: { + Nmcli.enableWifi(checked); + } + } + } + + SectionHeader { + Layout.topMargin: Appearance.spacing.large + title: qsTr("Current connection") + description: qsTr("Active network connection information") + } + + SectionContainer { + contentSpacing: Appearance.spacing.small / 2 + + PropertyRow { + label: qsTr("Network") + value: Nmcli.active ? Nmcli.active.ssid : (Nmcli.activeEthernet ? Nmcli.activeEthernet.interface : qsTr("Not connected")) + } + + PropertyRow { + showTopMargin: true + visible: Nmcli.active !== null + label: qsTr("Signal strength") + value: Nmcli.active ? qsTr("%1%").arg(Nmcli.active.strength) : qsTr("N/A") + } + + PropertyRow { + showTopMargin: true + visible: Nmcli.active !== null + label: qsTr("Security") + value: Nmcli.active ? (Nmcli.active.isSecure ? qsTr("Secured") : qsTr("Open")) : qsTr("N/A") + } + + PropertyRow { + showTopMargin: true + visible: Nmcli.active !== null + label: qsTr("Frequency") + value: Nmcli.active ? qsTr("%1 MHz").arg(Nmcli.active.frequency) : qsTr("N/A") + } + } +} + diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index c5928de..823c19a 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -478,7 +478,7 @@ RowLayout { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height - NetworkingSettings { + NetworkSettings { id: settingsInner anchors.left: parent.left diff --git a/modules/controlcenter/network/NetworkingSettings.qml b/modules/controlcenter/network/NetworkingSettings.qml deleted file mode 100644 index 2475fed..0000000 --- a/modules/controlcenter/network/NetworkingSettings.qml +++ /dev/null @@ -1,106 +0,0 @@ -pragma ComponentBehavior: Bound - -import ".." -import qs.components -import qs.components.controls -import qs.components.effects -import qs.services -import qs.config -import QtQuick -import QtQuick.Layouts - -ColumnLayout { - id: root - - required property Session session - - spacing: Appearance.spacing.normal - - MaterialIcon { - Layout.alignment: Qt.AlignHCenter - text: "router" - font.pointSize: Appearance.font.size.extraLarge * 3 - font.bold: true - } - - StyledText { - Layout.alignment: Qt.AlignHCenter - text: qsTr("Networking settings") - font.pointSize: Appearance.font.size.large - font.bold: true - } - - SectionHeader { - Layout.topMargin: Appearance.spacing.large - title: qsTr("Ethernet") - description: qsTr("Ethernet device information") - } - - SectionContainer { - contentSpacing: Appearance.spacing.small / 2 - - PropertyRow { - label: qsTr("Total devices") - value: qsTr("%1").arg(Nmcli.ethernetDevices.length) - } - - PropertyRow { - showTopMargin: true - label: qsTr("Connected devices") - value: qsTr("%1").arg(Nmcli.ethernetDevices.filter(d => d.connected).length) - } - } - - SectionHeader { - Layout.topMargin: Appearance.spacing.large - title: qsTr("Wireless") - description: qsTr("WiFi network settings") - } - - SectionContainer { - ToggleRow { - label: qsTr("WiFi enabled") - checked: Nmcli.wifiEnabled - toggle.onToggled: { - Nmcli.enableWifi(checked); - } - } - } - - SectionHeader { - Layout.topMargin: Appearance.spacing.large - title: qsTr("Current connection") - description: qsTr("Active network connection information") - } - - SectionContainer { - contentSpacing: Appearance.spacing.small / 2 - - PropertyRow { - label: qsTr("Network") - value: Nmcli.active ? Nmcli.active.ssid : (Nmcli.activeEthernet ? Nmcli.activeEthernet.interface : qsTr("Not connected")) - } - - PropertyRow { - showTopMargin: true - visible: Nmcli.active !== null - label: qsTr("Signal strength") - value: Nmcli.active ? qsTr("%1%").arg(Nmcli.active.strength) : qsTr("N/A") - } - - PropertyRow { - showTopMargin: true - visible: Nmcli.active !== null - label: qsTr("Security") - value: Nmcli.active ? (Nmcli.active.isSecure ? qsTr("Secured") : qsTr("Open")) : qsTr("N/A") - } - - PropertyRow { - showTopMargin: true - visible: Nmcli.active !== null - label: qsTr("Frequency") - value: Nmcli.active ? qsTr("%1 MHz").arg(Nmcli.active.frequency) : qsTr("N/A") - } - } -} - diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index cf52fd3..0dcc152 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -631,7 +631,7 @@ RowLayout { StyledText { Layout.alignment: Qt.AlignHCenter - text: qsTr("Taskbar settings") + text: qsTr("Taskbar Settings") font.pointSize: Appearance.font.size.large font.bold: true } -- cgit v1.2.3-freya From 90e920bf2e002b4e6e0aa1896687c4800d770605 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 00:25:31 -0500 Subject: controlcenter: fixed anchors vs parent logs --- components/controls/CollapsibleSection.qml | 2 +- modules/controlcenter/appearance/AppearancePane.qml | 12 ++++-------- modules/controlcenter/launcher/LauncherPane.qml | 3 +-- modules/controlcenter/network/NetworkingPane.qml | 3 ++- modules/controlcenter/taskbar/TaskbarPane.qml | 8 ++++---- 5 files changed, 12 insertions(+), 16 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/components/controls/CollapsibleSection.qml b/components/controls/CollapsibleSection.qml index 5bec5f8..3fba1c3 100644 --- a/components/controls/CollapsibleSection.qml +++ b/components/controls/CollapsibleSection.qml @@ -49,7 +49,7 @@ ColumnLayout { font.pointSize: Appearance.font.size.normal Behavior on rotation { Anim { - duration: Appearance.anim.durations.short + duration: Appearance.anim.durations.small easing.bezierCurve: Appearance.anim.curves.standard } } diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 719e9b3..5ddcb06 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -295,8 +295,7 @@ RowLayout { delegate: StyledRect { required property var modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 color: Qt.alpha(Colours.tPalette.m3surfaceContainer, modelData.variant === Schemes.currentVariant ? Colours.tPalette.m3surfaceContainer.a : 0) radius: Appearance.rounding.normal @@ -386,8 +385,7 @@ RowLayout { delegate: StyledRect { required property var modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 readonly property string schemeKey: `${modelData.name} ${modelData.flavour}` readonly property bool isCurrent: schemeKey === Schemes.currentScheme @@ -427,9 +425,7 @@ RowLayout { RowLayout { id: schemeRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter + anchors.fill: parent anchors.margins: Appearance.padding.normal spacing: Appearance.spacing.normal @@ -437,7 +433,7 @@ RowLayout { StyledRect { id: preview - anchors.verticalCenter: parent.verticalCenter + Layout.alignment: Qt.AlignVCenter border.width: 1 border.color: Qt.alpha(`#${modelData.colours?.outline}`, 0.5) diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index d0bd406..0645860 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -310,8 +310,7 @@ RowLayout { delegate: StyledRect { required property var modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 readonly property bool isSelected: root.selectedApp === modelData diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index 0560581..620e6f7 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -501,7 +501,8 @@ RowLayout { } WirelessPasswordDialog { - anchors.fill: parent + Layout.fillWidth: true + Layout.fillHeight: true session: root.session z: 1000 } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 0dcc152..ee47683 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -250,10 +250,10 @@ RowLayout { RowLayout { id: clockRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large + Layout.fillWidth: true + Layout.leftMargin: Appearance.padding.large + Layout.rightMargin: Appearance.padding.large + Layout.alignment: Qt.AlignVCenter spacing: Appearance.spacing.normal -- cgit v1.2.3-freya From 20e07b2a13036335c9890fe67708d2ab2292a4b4 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 00:29:42 -0500 Subject: controlcenter: clip to all styledflickable --- modules/controlcenter/Panes.qml | 2 ++ modules/controlcenter/appearance/AppearancePane.qml | 2 ++ modules/controlcenter/audio/AudioPane.qml | 1 + modules/controlcenter/bluetooth/BtPane.qml | 3 +++ modules/controlcenter/bluetooth/Details.qml | 1 + modules/controlcenter/ethernet/EthernetDetails.qml | 1 + modules/controlcenter/ethernet/EthernetPane.qml | 4 +++- modules/controlcenter/launcher/LauncherPane.qml | 1 + modules/controlcenter/network/NetworkingPane.qml | 5 ++++- modules/controlcenter/network/WirelessDetails.qml | 1 + modules/controlcenter/network/WirelessPane.qml | 1 + modules/controlcenter/taskbar/TaskbarPane.qml | 2 ++ 12 files changed, 22 insertions(+), 2 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/Panes.qml b/modules/controlcenter/Panes.qml index 8a46088..52ad7f2 100644 --- a/modules/controlcenter/Panes.qml +++ b/modules/controlcenter/Panes.qml @@ -19,12 +19,14 @@ ClippingRectangle { required property Session session color: "transparent" + clip: true ColumnLayout { id: layout spacing: 0 y: -root.session.activeIndex * root.height + clip: true Pane { index: 0 diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 5ddcb06..fd75ff4 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -225,6 +225,7 @@ RowLayout { anchors.fill: parent flickableDirection: Flickable.VerticalFlick contentHeight: sidebarLayout.implicitHeight + Appearance.padding.large * 2 + clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: sidebarFlickable @@ -965,6 +966,7 @@ RowLayout { flickableDirection: Flickable.VerticalFlick contentHeight: contentLayout.implicitHeight + clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: parent diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 8c990a6..0a7f602 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -31,6 +31,7 @@ RowLayout { anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick contentHeight: leftContent.height + clip: true ColumnLayout { id: leftContent diff --git a/modules/controlcenter/bluetooth/BtPane.qml b/modules/controlcenter/bluetooth/BtPane.qml index 96dc002..40cf356 100644 --- a/modules/controlcenter/bluetooth/BtPane.qml +++ b/modules/controlcenter/bluetooth/BtPane.qml @@ -50,6 +50,7 @@ RowLayout { radius: rightBorder.innerRadius color: "transparent" + clip: true Loader { id: loader @@ -59,6 +60,7 @@ RowLayout { anchors.fill: parent anchors.margins: Appearance.padding.large * 2 + clip: true asynchronous: true sourceComponent: pane ? details : settings @@ -106,6 +108,7 @@ RowLayout { StyledFlickable { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height + clip: true Settings { id: settingsInner diff --git a/modules/controlcenter/bluetooth/Details.qml b/modules/controlcenter/bluetooth/Details.qml index 104f673..cbccd9b 100644 --- a/modules/controlcenter/bluetooth/Details.qml +++ b/modules/controlcenter/bluetooth/Details.qml @@ -22,6 +22,7 @@ Item { anchors.fill: parent flickableDirection: Flickable.VerticalFlick + clip: true contentHeight: layout.height ColumnLayout { diff --git a/modules/controlcenter/ethernet/EthernetDetails.qml b/modules/controlcenter/ethernet/EthernetDetails.qml index 68510da..6a01a8b 100644 --- a/modules/controlcenter/ethernet/EthernetDetails.qml +++ b/modules/controlcenter/ethernet/EthernetDetails.qml @@ -34,6 +34,7 @@ Item { anchors.fill: parent flickableDirection: Flickable.VerticalFlick + clip: true contentHeight: layout.height ColumnLayout { diff --git a/modules/controlcenter/ethernet/EthernetPane.qml b/modules/controlcenter/ethernet/EthernetPane.qml index b3ff317..05d0b1b 100644 --- a/modules/controlcenter/ethernet/EthernetPane.qml +++ b/modules/controlcenter/ethernet/EthernetPane.qml @@ -50,6 +50,7 @@ RowLayout { radius: rightBorder.innerRadius color: "transparent" + clip: true Loader { id: loader @@ -64,7 +65,7 @@ RowLayout { scale: 1 transformOrigin: Item.Center - clip: false + clip: true asynchronous: true sourceComponent: pane ? details : settings @@ -120,6 +121,7 @@ RowLayout { StyledFlickable { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height + clip: true EthernetSettings { id: settingsInner diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 0645860..01ed72e 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -421,6 +421,7 @@ RowLayout { anchors.fill: parent flickableDirection: Flickable.VerticalFlick contentHeight: debugLayout.implicitHeight + clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: parent diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index 620e6f7..2faa40a 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -36,6 +36,7 @@ RowLayout { anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick contentHeight: leftContent.height + clip: true ColumnLayout { id: leftContent @@ -399,6 +400,7 @@ RowLayout { radius: rightBorder.innerRadius color: "transparent" + clip: true // Right pane - networking details/settings Loader { @@ -416,7 +418,7 @@ RowLayout { scale: 1 transformOrigin: Item.Center - clip: false + clip: true asynchronous: true sourceComponent: pane ? (ethernetPane ? ethernetDetails : wirelessDetails) : settings @@ -472,6 +474,7 @@ RowLayout { StyledFlickable { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height + clip: true NetworkSettings { id: settingsInner diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml index 334c4b3..f41451a 100644 --- a/modules/controlcenter/network/WirelessDetails.qml +++ b/modules/controlcenter/network/WirelessDetails.qml @@ -102,6 +102,7 @@ Item { anchors.fill: parent flickableDirection: Flickable.VerticalFlick + clip: true contentHeight: layout.height ColumnLayout { diff --git a/modules/controlcenter/network/WirelessPane.qml b/modules/controlcenter/network/WirelessPane.qml index 9d48729..67a00f7 100644 --- a/modules/controlcenter/network/WirelessPane.qml +++ b/modules/controlcenter/network/WirelessPane.qml @@ -120,6 +120,7 @@ RowLayout { StyledFlickable { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height + clip: true WirelessSettings { id: settingsInner diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index ee47683..72e9a80 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -209,6 +209,7 @@ RowLayout { anchors.fill: parent flickableDirection: Flickable.VerticalFlick contentHeight: sidebarLayout.implicitHeight + Appearance.padding.large * 2 + clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: sidebarFlickable @@ -608,6 +609,7 @@ RowLayout { flickableDirection: Flickable.VerticalFlick contentHeight: contentLayout.implicitHeight + clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: parent -- cgit v1.2.3-freya From f29f0a3805239976778c1492cf846d4f614e660c Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 01:36:57 -0500 Subject: controlcenter: removed FileView and now all use singleton Config --- .../controlcenter/appearance/AppearancePane.qml | 225 +++++---------------- modules/controlcenter/launcher/LauncherPane.qml | 77 +++---- modules/controlcenter/taskbar/TaskbarPane.qml | 196 ++++++------------ 3 files changed, 138 insertions(+), 360 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index fd75ff4..6f77d25 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -12,7 +12,6 @@ import qs.config import qs.utils import Caelestia.Models import Quickshell -import Quickshell.Io import QtQuick import QtQuick.Layouts @@ -22,117 +21,32 @@ RowLayout { required property Session session // Appearance settings - property real animDurationsScale: 1 - property string fontFamilyMaterial: "Material Symbols Rounded" - property string fontFamilyMono: "CaskaydiaCove NF" - property string fontFamilySans: "Rubik" - property real fontSizeScale: 1 - property real paddingScale: 1 - property real roundingScale: 1 - property real spacingScale: 1 - property bool transparencyEnabled: false - property real transparencyBase: 0.85 - property real transparencyLayers: 0.4 - property real borderRounding: 1 - property real borderThickness: 1 + property real animDurationsScale: Config.appearance.anim.durations.scale ?? 1 + property string fontFamilyMaterial: Config.appearance.font.family.material ?? "Material Symbols Rounded" + property string fontFamilyMono: Config.appearance.font.family.mono ?? "CaskaydiaCove NF" + property string fontFamilySans: Config.appearance.font.family.sans ?? "Rubik" + property real fontSizeScale: Config.appearance.font.size.scale ?? 1 + property real paddingScale: Config.appearance.padding.scale ?? 1 + property real roundingScale: Config.appearance.rounding.scale ?? 1 + property real spacingScale: Config.appearance.spacing.scale ?? 1 + property bool transparencyEnabled: Config.appearance.transparency.enabled ?? false + property real transparencyBase: Config.appearance.transparency.base ?? 0.85 + property real transparencyLayers: Config.appearance.transparency.layers ?? 0.4 + property real borderRounding: Config.border.rounding ?? 1 + property real borderThickness: Config.border.thickness ?? 1 // Background settings - property bool desktopClockEnabled: true - property bool backgroundEnabled: true - property bool visualiserEnabled: true - property bool visualiserAutoHide: true - property real visualiserRounding: 1 - property real visualiserSpacing: 1 + property bool desktopClockEnabled: Config.background.desktopClock.enabled ?? false + property bool backgroundEnabled: Config.background.enabled ?? true + property bool visualiserEnabled: Config.background.visualiser.enabled ?? false + property bool visualiserAutoHide: Config.background.visualiser.autoHide ?? true + property real visualiserRounding: Config.background.visualiser.rounding ?? 1 + property real visualiserSpacing: Config.background.visualiser.spacing ?? 1 anchors.fill: parent spacing: 0 - FileView { - id: configFile - - path: `${Paths.config}/shell.json` - watchChanges: true - - onLoaded: { - try { - const config = JSON.parse(text()); - updateFromConfig(config); - } catch (e) { - console.error("Failed to parse config:", e); - } - } - - onSaveFailed: err => { - console.error("Failed to save config file:", err); - } - } - - function updateFromConfig(config) { - // Update appearance settings - if (config.appearance) { - if (config.appearance.anim && config.appearance.anim.durations) { - root.animDurationsScale = config.appearance.anim.durations.scale ?? 1; - } - if (config.appearance.font) { - if (config.appearance.font.family) { - root.fontFamilyMaterial = config.appearance.font.family.material ?? "Material Symbols Rounded"; - root.fontFamilyMono = config.appearance.font.family.mono ?? "CaskaydiaCove NF"; - root.fontFamilySans = config.appearance.font.family.sans ?? "Rubik"; - } - if (config.appearance.font.size) { - root.fontSizeScale = config.appearance.font.size.scale ?? 1; - } - } - if (config.appearance.padding) { - root.paddingScale = config.appearance.padding.scale ?? 1; - } - if (config.appearance.rounding) { - root.roundingScale = config.appearance.rounding.scale ?? 1; - } - if (config.appearance.spacing) { - root.spacingScale = config.appearance.spacing.scale ?? 1; - } - if (config.appearance.transparency) { - root.transparencyEnabled = config.appearance.transparency.enabled ?? false; - root.transparencyBase = config.appearance.transparency.base ?? 0.85; - root.transparencyLayers = config.appearance.transparency.layers ?? 0.4; - } - } - - // Update border settings - if (config.border) { - root.borderRounding = config.border.rounding ?? 1; - root.borderThickness = config.border.thickness ?? 1; - } - - // Update background settings - if (config.background) { - root.desktopClockEnabled = config.background.desktopClock?.enabled !== undefined ? config.background.desktopClock.enabled : false; - root.backgroundEnabled = config.background.enabled !== undefined ? config.background.enabled : true; - if (config.background.visualiser) { - root.visualiserEnabled = config.background.visualiser.enabled !== undefined ? config.background.visualiser.enabled : false; - root.visualiserAutoHide = config.background.visualiser.autoHide !== undefined ? config.background.visualiser.autoHide : true; - root.visualiserRounding = config.background.visualiser.rounding !== undefined ? config.background.visualiser.rounding : 1; - root.visualiserSpacing = config.background.visualiser.spacing !== undefined ? config.background.visualiser.spacing : 1; - } else { - // Set defaults if visualiser object doesn't exist (matching BackgroundConfig defaults) - root.visualiserEnabled = false; - root.visualiserAutoHide = true; - root.visualiserRounding = 1; - root.visualiserSpacing = 1; - } - } else { - // Set defaults if background object doesn't exist (matching BackgroundConfig defaults) - root.desktopClockEnabled = false; - root.backgroundEnabled = true; - root.visualiserEnabled = false; - root.visualiserAutoHide = true; - root.visualiserRounding = 1; - root.visualiserSpacing = 1; - } - } - function collapseAllSections(exceptSection) { if (exceptSection !== themeModeSection) themeModeSection.expanded = false; if (exceptSection !== colorVariantSection) colorVariantSection.expanded = false; @@ -146,73 +60,40 @@ RowLayout { } function saveConfig() { - if (!configFile.loaded) { - console.error("Config file not loaded yet"); - return; - } - - try { - const config = JSON.parse(configFile.text()); - - // Ensure appearance object exists - if (!config.appearance) config.appearance = {}; - - // Update animations - if (!config.appearance.anim) config.appearance.anim = {}; - if (!config.appearance.anim.durations) config.appearance.anim.durations = {}; - config.appearance.anim.durations.scale = root.animDurationsScale; - - // Update fonts - if (!config.appearance.font) config.appearance.font = {}; - if (!config.appearance.font.family) config.appearance.font.family = {}; - config.appearance.font.family.material = root.fontFamilyMaterial; - config.appearance.font.family.mono = root.fontFamilyMono; - config.appearance.font.family.sans = root.fontFamilySans; - if (!config.appearance.font.size) config.appearance.font.size = {}; - config.appearance.font.size.scale = root.fontSizeScale; - - // Update scales - if (!config.appearance.padding) config.appearance.padding = {}; - config.appearance.padding.scale = root.paddingScale; - if (!config.appearance.rounding) config.appearance.rounding = {}; - config.appearance.rounding.scale = root.roundingScale; - if (!config.appearance.spacing) config.appearance.spacing = {}; - config.appearance.spacing.scale = root.spacingScale; - - // Update transparency - if (!config.appearance.transparency) config.appearance.transparency = {}; - config.appearance.transparency.enabled = root.transparencyEnabled; - config.appearance.transparency.base = root.transparencyBase; - config.appearance.transparency.layers = root.transparencyLayers; - - // Ensure background object exists - if (!config.background) config.background = {}; - - // Update desktop clock - if (!config.background.desktopClock) config.background.desktopClock = {}; - config.background.desktopClock.enabled = root.desktopClockEnabled; - - // Update background enabled - config.background.enabled = root.backgroundEnabled; - - // Update visualiser - if (!config.background.visualiser) config.background.visualiser = {}; - config.background.visualiser.enabled = root.visualiserEnabled; - config.background.visualiser.autoHide = root.visualiserAutoHide; - config.background.visualiser.rounding = root.visualiserRounding; - config.background.visualiser.spacing = root.visualiserSpacing; - - // Update border - if (!config.border) config.border = {}; - config.border.rounding = root.borderRounding; - config.border.thickness = root.borderThickness; - - // Write back to file using setText (same simple approach that worked for taskbar) - const jsonString = JSON.stringify(config, null, 4); - configFile.setText(jsonString); - } catch (e) { - console.error("Failed to save config:", e); - } + // Update animations + Config.appearance.anim.durations.scale = root.animDurationsScale; + + // Update fonts + Config.appearance.font.family.material = root.fontFamilyMaterial; + Config.appearance.font.family.mono = root.fontFamilyMono; + Config.appearance.font.family.sans = root.fontFamilySans; + Config.appearance.font.size.scale = root.fontSizeScale; + + // Update scales + Config.appearance.padding.scale = root.paddingScale; + Config.appearance.rounding.scale = root.roundingScale; + Config.appearance.spacing.scale = root.spacingScale; + + // Update transparency + Config.appearance.transparency.enabled = root.transparencyEnabled; + Config.appearance.transparency.base = root.transparencyBase; + Config.appearance.transparency.layers = root.transparencyLayers; + + // Update desktop clock + Config.background.desktopClock.enabled = root.desktopClockEnabled; + + // Update background enabled + Config.background.enabled = root.backgroundEnabled; + + // Update visualiser + Config.background.visualiser.enabled = root.visualiserEnabled; + Config.background.visualiser.autoHide = root.visualiserAutoHide; + Config.background.visualiser.rounding = root.visualiserRounding; + Config.background.visualiser.spacing = root.visualiserSpacing; + + // Update border + Config.border.rounding = root.borderRounding; + Config.border.thickness = root.borderThickness; } Item { diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 0a1175f..d585c32 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -11,7 +11,6 @@ import qs.config import qs.utils import Caelestia import Quickshell -import Quickshell.Io import Quickshell.Widgets import QtQuick import QtQuick.Layouts @@ -29,74 +28,46 @@ RowLayout { spacing: 0 - FileView { - id: configFile - - path: `${Paths.config}/shell.json` - watchChanges: true - - onLoaded: { - try { - const config = JSON.parse(text()); - updateToggleState(); - } catch (e) { - console.error("Failed to parse config:", e); - } - } - } - function updateToggleState() { - if (!root.selectedApp || !configFile.loaded) { + if (!root.selectedApp) { root.hideFromLauncherChecked = false; return; } - try { - const config = JSON.parse(configFile.text()); - const appId = root.selectedApp.id || root.selectedApp.entry?.id; + const appId = root.selectedApp.id || root.selectedApp.entry?.id; - if (config.launcher && config.launcher.hiddenApps) { - root.hideFromLauncherChecked = config.launcher.hiddenApps.includes(appId); - } else { - root.hideFromLauncherChecked = false; - } - } catch (e) { - console.error("Failed to update toggle state:", e); + if (Config.launcher.hiddenApps && Config.launcher.hiddenApps.length > 0) { + root.hideFromLauncherChecked = Config.launcher.hiddenApps.includes(appId); + } else { + root.hideFromLauncherChecked = false; } } function saveHiddenApps(isHidden) { - if (!configFile.loaded || !root.selectedApp) { + if (!root.selectedApp) { return; } - try { - const config = JSON.parse(configFile.text()); - const appId = root.selectedApp.id || root.selectedApp.entry?.id; - - if (!config.launcher) config.launcher = {}; - if (!config.launcher.hiddenApps) config.launcher.hiddenApps = []; + const appId = root.selectedApp.id || root.selectedApp.entry?.id; - const hiddenApps = config.launcher.hiddenApps; + // Create a new array to ensure change detection + const hiddenApps = Config.launcher.hiddenApps ? [...Config.launcher.hiddenApps] : []; - if (isHidden) { - // Add to hiddenApps if not already there - if (!hiddenApps.includes(appId)) { - hiddenApps.push(appId); - } - } else { - // Remove from hiddenApps - const index = hiddenApps.indexOf(appId); - if (index !== -1) { - hiddenApps.splice(index, 1); - } + if (isHidden) { + // Add to hiddenApps if not already there + if (!hiddenApps.includes(appId)) { + hiddenApps.push(appId); + } + } else { + // Remove from hiddenApps + const index = hiddenApps.indexOf(appId); + if (index !== -1) { + hiddenApps.splice(index, 1); } - - const jsonString = JSON.stringify(config, null, 4); - configFile.setText(jsonString); - } catch (e) { - console.error("Failed to save config:", e); } + + // Update Config to trigger save + Config.launcher.hiddenApps = hiddenApps; } onSelectedAppChanged: { @@ -437,7 +408,7 @@ RowLayout { visible: root.selectedApp !== null label: qsTr("Hide from launcher") checked: root.hideFromLauncherChecked - enabled: root.selectedApp !== null && configFile.loaded + enabled: root.selectedApp !== null onToggled: checked => { root.hideFromLauncherChecked = checked; root.saveHiddenApps(checked); diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 72e9a80..5385ab7 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -9,7 +9,6 @@ import qs.services import qs.config import qs.utils import Quickshell -import Quickshell.Io import QtQuick import QtQuick.Layouts @@ -19,171 +18,98 @@ RowLayout { required property Session session // Bar Behavior - property bool persistent: true - property bool showOnHover: true - property int dragThreshold: 20 + property bool persistent: Config.bar.persistent ?? true + property bool showOnHover: Config.bar.showOnHover ?? true + property int dragThreshold: Config.bar.dragThreshold ?? 20 // Status Icons - property bool showAudio: true - property bool showMicrophone: true - property bool showKbLayout: false - property bool showNetwork: true - property bool showBluetooth: true - property bool showBattery: true - property bool showLockStatus: true + property bool showAudio: Config.bar.status.showAudio ?? true + property bool showMicrophone: Config.bar.status.showMicrophone ?? true + property bool showKbLayout: Config.bar.status.showKbLayout ?? false + property bool showNetwork: Config.bar.status.showNetwork ?? true + property bool showBluetooth: Config.bar.status.showBluetooth ?? true + property bool showBattery: Config.bar.status.showBattery ?? true + property bool showLockStatus: Config.bar.status.showLockStatus ?? true // Tray Settings - property bool trayBackground: false - property bool trayCompact: false - property bool trayRecolour: false + property bool trayBackground: Config.bar.tray.background ?? false + property bool trayCompact: Config.bar.tray.compact ?? false + property bool trayRecolour: Config.bar.tray.recolour ?? false // Workspaces - property int workspacesShown: 5 - property bool workspacesActiveIndicator: true - property bool workspacesOccupiedBg: false - property bool workspacesShowWindows: false - property bool workspacesPerMonitor: true + property int workspacesShown: Config.bar.workspaces.shown ?? 5 + property bool workspacesActiveIndicator: Config.bar.workspaces.activeIndicator ?? true + property bool workspacesOccupiedBg: Config.bar.workspaces.occupiedBg ?? false + property bool workspacesShowWindows: Config.bar.workspaces.showWindows ?? false + property bool workspacesPerMonitor: Config.bar.workspaces.perMonitorWorkspaces ?? true anchors.fill: parent spacing: 0 - FileView { - id: configFile - - path: `${Paths.config}/shell.json` - watchChanges: true - - onLoaded: { - try { - const config = JSON.parse(text()); - updateFromConfig(config); - } catch (e) { - console.error("Failed to parse config:", e); - } - } - } - - function updateFromConfig(config) { + Component.onCompleted: { // Update clock toggle - if (config.bar && config.bar.clock) { - clockShowIconSwitch.checked = config.bar.clock.showIcon !== false; - } + clockShowIconSwitch.checked = Config.bar.clock.showIcon ?? true; // Update entries - if (config.bar && config.bar.entries) { + if (Config.bar.entries) { entriesModel.clear(); - for (const entry of config.bar.entries) { + for (let i = 0; i < Config.bar.entries.length; i++) { + const entry = Config.bar.entries[i]; entriesModel.append({ id: entry.id, enabled: entry.enabled !== false }); } } + } + + function saveConfig(entryIndex, entryEnabled) { + // Update clock setting + Config.bar.clock.showIcon = clockShowIconSwitch.checked; // Update bar behavior - if (config.bar) { - root.persistent = config.bar.persistent !== false; - root.showOnHover = config.bar.showOnHover !== false; - root.dragThreshold = config.bar.dragThreshold || 20; - } + Config.bar.persistent = root.persistent; + Config.bar.showOnHover = root.showOnHover; + Config.bar.dragThreshold = root.dragThreshold; // Update status icons - if (config.bar && config.bar.status) { - root.showAudio = config.bar.status.showAudio !== false; - root.showMicrophone = config.bar.status.showMicrophone !== false; - root.showKbLayout = config.bar.status.showKbLayout === true; - root.showNetwork = config.bar.status.showNetwork !== false; - root.showBluetooth = config.bar.status.showBluetooth !== false; - root.showBattery = config.bar.status.showBattery !== false; - root.showLockStatus = config.bar.status.showLockStatus !== false; - } + Config.bar.status.showAudio = root.showAudio; + Config.bar.status.showMicrophone = root.showMicrophone; + Config.bar.status.showKbLayout = root.showKbLayout; + Config.bar.status.showNetwork = root.showNetwork; + Config.bar.status.showBluetooth = root.showBluetooth; + Config.bar.status.showBattery = root.showBattery; + Config.bar.status.showLockStatus = root.showLockStatus; // Update tray settings - if (config.bar && config.bar.tray) { - root.trayBackground = config.bar.tray.background === true; - root.trayCompact = config.bar.tray.compact === true; - root.trayRecolour = config.bar.tray.recolour === true; - } + Config.bar.tray.background = root.trayBackground; + Config.bar.tray.compact = root.trayCompact; + Config.bar.tray.recolour = root.trayRecolour; // Update workspaces - if (config.bar && config.bar.workspaces) { - root.workspacesShown = config.bar.workspaces.shown || 5; - root.workspacesActiveIndicator = config.bar.workspaces.activeIndicator !== false; - root.workspacesOccupiedBg = config.bar.workspaces.occupiedBg === true; - root.workspacesShowWindows = config.bar.workspaces.showWindows === true; - root.workspacesPerMonitor = config.bar.workspaces.perMonitorWorkspaces !== false; - } - } - - function saveConfig(entryIndex, entryEnabled) { - if (!configFile.loaded) { - return; - } - - try { - const config = JSON.parse(configFile.text()); - - // Ensure bar object exists - if (!config.bar) config.bar = {}; - - // Update clock setting - if (!config.bar.clock) config.bar.clock = {}; - config.bar.clock.showIcon = clockShowIconSwitch.checked; - - // Update bar behavior - config.bar.persistent = root.persistent; - config.bar.showOnHover = root.showOnHover; - config.bar.dragThreshold = root.dragThreshold; - - // Update status icons - if (!config.bar.status) config.bar.status = {}; - config.bar.status.showAudio = root.showAudio; - config.bar.status.showMicrophone = root.showMicrophone; - config.bar.status.showKbLayout = root.showKbLayout; - config.bar.status.showNetwork = root.showNetwork; - config.bar.status.showBluetooth = root.showBluetooth; - config.bar.status.showBattery = root.showBattery; - config.bar.status.showLockStatus = root.showLockStatus; - - // Update tray settings - if (!config.bar.tray) config.bar.tray = {}; - config.bar.tray.background = root.trayBackground; - config.bar.tray.compact = root.trayCompact; - config.bar.tray.recolour = root.trayRecolour; - - // Update workspaces - if (!config.bar.workspaces) config.bar.workspaces = {}; - config.bar.workspaces.shown = root.workspacesShown; - config.bar.workspaces.activeIndicator = root.workspacesActiveIndicator; - config.bar.workspaces.occupiedBg = root.workspacesOccupiedBg; - config.bar.workspaces.showWindows = root.workspacesShowWindows; - config.bar.workspaces.perMonitorWorkspaces = root.workspacesPerMonitor; - - // Update entries from the model (same approach as clock - use provided value if available) - if (!config.bar.entries) config.bar.entries = []; - config.bar.entries = []; - - for (let i = 0; i < entriesModel.count; i++) { - const entry = entriesModel.get(i); - // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) - // Otherwise use the value from the model - let enabled = entry.enabled; - if (entryIndex !== undefined && i === entryIndex) { - enabled = entryEnabled; - } - config.bar.entries.push({ - id: entry.id, - enabled: enabled - }); + Config.bar.workspaces.shown = root.workspacesShown; + Config.bar.workspaces.activeIndicator = root.workspacesActiveIndicator; + Config.bar.workspaces.occupiedBg = root.workspacesOccupiedBg; + Config.bar.workspaces.showWindows = root.workspacesShowWindows; + Config.bar.workspaces.perMonitorWorkspaces = root.workspacesPerMonitor; + + // Update entries from the model (same approach as clock - use provided value if available) + const entries = []; + for (let i = 0; i < entriesModel.count; i++) { + const entry = entriesModel.get(i); + // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) + // Otherwise use the value from the model + let enabled = entry.enabled; + if (entryIndex !== undefined && i === entryIndex) { + enabled = entryEnabled; } - - // Write back to file using setText (same simple approach that worked for clock) - const jsonString = JSON.stringify(config, null, 4); - configFile.setText(jsonString); - } catch (e) { - console.error("Failed to save config:", e); + entries.push({ + id: entry.id, + enabled: enabled + }); } + Config.bar.entries = entries; } ListModel { -- cgit v1.2.3-freya From f79fd9328ce01bde921775a0301a3a6969deaa34 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 10:25:45 -0500 Subject: controlcenter: fix edge to edge in panels --- .../controlcenter/appearance/AppearancePane.qml | 12 ++++++----- modules/controlcenter/audio/AudioPane.qml | 18 ++++++++++------ modules/controlcenter/bluetooth/BtPane.qml | 3 --- modules/controlcenter/launcher/LauncherPane.qml | 14 +++++++++--- modules/controlcenter/network/NetworkingPane.qml | 25 +++++++++------------- modules/controlcenter/taskbar/TaskbarPane.qml | 12 ++++++----- 6 files changed, 46 insertions(+), 38 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 1e81205..35b479a 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -114,8 +114,7 @@ RowLayout { id: sidebarFlickable anchors.fill: parent flickableDirection: Flickable.VerticalFlick - contentHeight: sidebarLayout.implicitHeight + Appearance.padding.large * 2 - clip: true + contentHeight: sidebarLayout.height StyledScrollBar.vertical: StyledScrollBar { flickable: sidebarFlickable @@ -852,11 +851,12 @@ RowLayout { StyledFlickable { anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.implicitHeight - clip: true + contentHeight: contentLayout.height StyledScrollBar.vertical: StyledScrollBar { flickable: parent @@ -868,6 +868,8 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right anchors.top: parent.top + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index b4a0bf1..1f8677e 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -31,7 +31,10 @@ RowLayout { anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick contentHeight: leftContent.height - clip: true + + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent + } ColumnLayout { id: leftContent @@ -225,17 +228,16 @@ RowLayout { Layout.fillHeight: true StyledFlickable { - id: rightFlickable - anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.implicitHeight - clip: true + contentHeight: contentLayout.height StyledScrollBar.vertical: StyledScrollBar { - flickable: rightFlickable + flickable: parent } ColumnLayout { @@ -244,6 +246,8 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right anchors.top: parent.top + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal diff --git a/modules/controlcenter/bluetooth/BtPane.qml b/modules/controlcenter/bluetooth/BtPane.qml index 40cf356..96dc002 100644 --- a/modules/controlcenter/bluetooth/BtPane.qml +++ b/modules/controlcenter/bluetooth/BtPane.qml @@ -50,7 +50,6 @@ RowLayout { radius: rightBorder.innerRadius color: "transparent" - clip: true Loader { id: loader @@ -60,7 +59,6 @@ RowLayout { anchors.fill: parent anchors.margins: Appearance.padding.large * 2 - clip: true asynchronous: true sourceComponent: pane ? details : settings @@ -108,7 +106,6 @@ RowLayout { StyledFlickable { flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height - clip: true Settings { id: settingsInner diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index d585c32..1869e18 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -153,6 +153,7 @@ RowLayout { anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + anchors.bottomMargin: 0 spacing: Appearance.spacing.small @@ -335,12 +336,16 @@ RowLayout { ColumnLayout { anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 spacing: Appearance.spacing.normal Item { Layout.alignment: Qt.AlignHCenter + Layout.leftMargin: Appearance.padding.large * 2 + Layout.rightMargin: Appearance.padding.large * 2 implicitWidth: iconLoader.implicitWidth implicitHeight: iconLoader.implicitHeight @@ -376,6 +381,8 @@ RowLayout { StyledText { Layout.alignment: Qt.AlignHCenter + Layout.leftMargin: Appearance.padding.large * 2 + Layout.rightMargin: Appearance.padding.large * 2 text: root.selectedApp ? (root.selectedApp.name || root.selectedApp.entry?.name || qsTr("Application Details")) : qsTr("Launcher Applications") font.pointSize: Appearance.font.size.large font.bold: true @@ -385,12 +392,13 @@ RowLayout { Layout.fillWidth: true Layout.fillHeight: true Layout.topMargin: Appearance.spacing.large + Layout.leftMargin: Appearance.padding.large * 2 + Layout.rightMargin: Appearance.padding.large * 2 StyledFlickable { anchors.fill: parent flickableDirection: Flickable.VerticalFlick - contentHeight: debugLayout.implicitHeight - clip: true + contentHeight: debugLayout.height StyledScrollBar.vertical: StyledScrollBar { flickable: parent diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index 74e0034..c404af0 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -38,12 +38,8 @@ Item { id: leftFlickable anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick contentHeight: leftContent.height - clip: true StyledScrollBar.vertical: StyledScrollBar { flickable: leftFlickable @@ -54,6 +50,10 @@ Item { anchors.left: parent.left anchors.right: parent.right + anchors.top: parent.top + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 spacing: Appearance.spacing.normal // Settings header above the collapsible sections @@ -404,7 +404,6 @@ Item { radius: rightBorder.innerRadius color: "transparent" - clip: true // Right pane - networking details/settings Loader { @@ -415,14 +414,17 @@ Item { property var pane: ethernetPane || wirelessPane property string paneId: ethernetPane ? (ethernetPane.interface || "") : (wirelessPane ? (wirelessPane.ssid || wirelessPane.bssid || "") : "") - anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 opacity: 1 scale: 1 transformOrigin: Item.Center - clip: true asynchronous: true sourceComponent: pane ? (ethernetPane ? ethernetDetails : wirelessDetails) : settings @@ -476,15 +478,8 @@ Item { id: settings StyledFlickable { - id: settingsFlickable - flickableDirection: Flickable.VerticalFlick contentHeight: settingsInner.height - clip: true - - StyledScrollBar.vertical: StyledScrollBar { - flickable: settingsFlickable - } NetworkSettings { id: settingsInner diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 5385ab7..9ec9e2a 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -134,8 +134,7 @@ RowLayout { id: sidebarFlickable anchors.fill: parent flickableDirection: Flickable.VerticalFlick - contentHeight: sidebarLayout.implicitHeight + Appearance.padding.large * 2 - clip: true + contentHeight: sidebarLayout.height StyledScrollBar.vertical: StyledScrollBar { flickable: sidebarFlickable @@ -531,11 +530,12 @@ RowLayout { StyledFlickable { anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.implicitHeight - clip: true + contentHeight: contentLayout.height StyledScrollBar.vertical: StyledScrollBar { flickable: parent @@ -547,6 +547,8 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right anchors.top: parent.top + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal -- cgit v1.2.3-freya From f3a0fcc715a8b2fd2a588b5fa13301033380a2ed Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 11:08:03 -0500 Subject: controlcenter: correcting margin inconsistencies between panels --- modules/controlcenter/appearance/AppearancePane.qml | 1 + modules/controlcenter/audio/AudioPane.qml | 1 + modules/controlcenter/launcher/LauncherPane.qml | 1 + modules/controlcenter/taskbar/TaskbarPane.qml | 1 + 4 files changed, 4 insertions(+) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 35b479a..c9d62a0 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -870,6 +870,7 @@ RowLayout { anchors.top: parent.top anchors.leftMargin: Appearance.padding.large * 2 anchors.rightMargin: Appearance.padding.large * 2 + anchors.topMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 1f8677e..add7078 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -248,6 +248,7 @@ RowLayout { anchors.top: parent.top anchors.leftMargin: Appearance.padding.large * 2 anchors.rightMargin: Appearance.padding.large * 2 + anchors.topMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 1869e18..8ddccb4 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -346,6 +346,7 @@ RowLayout { Layout.alignment: Qt.AlignHCenter Layout.leftMargin: Appearance.padding.large * 2 Layout.rightMargin: Appearance.padding.large * 2 + Layout.topMargin: Appearance.padding.large * 2 implicitWidth: iconLoader.implicitWidth implicitHeight: iconLoader.implicitHeight diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 9ec9e2a..107091e 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -549,6 +549,7 @@ RowLayout { anchors.top: parent.top anchors.leftMargin: Appearance.padding.large * 2 anchors.rightMargin: Appearance.padding.large * 2 + anchors.topMargin: Appearance.padding.large * 2 spacing: Appearance.spacing.normal -- cgit v1.2.3-freya From b0006f2f1146c14f4a8d719d6a268ffce1fed0de Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 16:44:11 -0500 Subject: controlcenter: corrected all panels edge-to-edge containers --- .../controlcenter/appearance/AppearancePane.qml | 295 ++++++++++++--------- modules/controlcenter/audio/AudioPane.qml | 124 ++++++--- modules/controlcenter/bluetooth/BtPane.qml | 37 ++- modules/controlcenter/launcher/LauncherPane.qml | 87 ++++-- modules/controlcenter/network/NetworkingPane.qml | 63 +++-- modules/controlcenter/taskbar/TaskbarPane.qml | 155 ++++++----- 6 files changed, 491 insertions(+), 270 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 6781cf0..ba95977 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -12,6 +12,7 @@ import qs.config import qs.utils import Caelestia.Models import Quickshell +import Quickshell.Widgets import QtQuick import QtQuick.Layouts @@ -47,26 +48,6 @@ RowLayout { spacing: 0 - function collapseAllSections(exceptSection) { - if (exceptSection !== themeModeSection) - themeModeSection.expanded = false; - if (exceptSection !== colorVariantSection) - colorVariantSection.expanded = false; - if (exceptSection !== colorSchemeSection) - colorSchemeSection.expanded = false; - if (exceptSection !== animationsSection) - animationsSection.expanded = false; - if (exceptSection !== fontsSection) - fontsSection.expanded = false; - if (exceptSection !== scalesSection) - scalesSection.expanded = false; - if (exceptSection !== transparencySection) - transparencySection.expanded = false; - if (exceptSection !== borderSection) - borderSection.expanded = false; - if (exceptSection !== backgroundSection) - backgroundSection.expanded = false; - } function saveConfig() { // Update animations @@ -110,26 +91,72 @@ RowLayout { Layout.minimumWidth: 420 Layout.fillHeight: true - StyledFlickable { - id: sidebarFlickable + ClippingRectangle { + id: leftAppearanceClippingRect anchors.fill: parent - flickableDirection: Flickable.VerticalFlick - contentHeight: sidebarLayout.height - - StyledScrollBar.vertical: StyledScrollBar { - flickable: sidebarFlickable - } + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 + radius: leftAppearanceBorder.innerRadius + color: "transparent" - ColumnLayout { - id: sidebarLayout - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top + Loader { + id: leftAppearanceLoader + anchors.fill: parent anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + asynchronous: true + sourceComponent: appearanceLeftContentComponent + property var rootPane: root + } + } + + InnerBorder { + id: leftAppearanceBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + + Component { + id: appearanceLeftContentComponent + + StyledFlickable { + id: sidebarFlickable + readonly property var rootPane: leftAppearanceLoader.rootPane + flickableDirection: Flickable.VerticalFlick + contentHeight: sidebarLayout.height + + function collapseAllSections(exceptSection) { + if (exceptSection !== themeModeSection) + themeModeSection.expanded = false; + if (exceptSection !== colorVariantSection) + colorVariantSection.expanded = false; + if (exceptSection !== colorSchemeSection) + colorSchemeSection.expanded = false; + if (exceptSection !== animationsSection) + animationsSection.expanded = false; + if (exceptSection !== fontsSection) + fontsSection.expanded = false; + if (exceptSection !== scalesSection) + scalesSection.expanded = false; + if (exceptSection !== transparencySection) + transparencySection.expanded = false; + if (exceptSection !== borderSection) + borderSection.expanded = false; + if (exceptSection !== backgroundSection) + backgroundSection.expanded = false; + } - spacing: Appearance.spacing.small + StyledScrollBar.vertical: StyledScrollBar { + flickable: sidebarFlickable + } + + ColumnLayout { + id: sidebarLayout + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.small RowLayout { spacing: Appearance.spacing.smaller @@ -150,7 +177,7 @@ RowLayout { title: qsTr("Theme mode") description: qsTr("Light or dark theme") onToggleRequested: { - root.collapseAllSections(themeModeSection); + sidebarFlickable.collapseAllSections(themeModeSection); } SwitchRow { @@ -167,7 +194,7 @@ RowLayout { title: qsTr("Color variant") description: qsTr("Material theme variant") onToggleRequested: { - root.collapseAllSections(colorVariantSection); + sidebarFlickable.collapseAllSections(colorVariantSection); } StyledListView { @@ -257,7 +284,7 @@ RowLayout { title: qsTr("Color scheme") description: qsTr("Available color schemes") onToggleRequested: { - root.collapseAllSections(colorSchemeSection); + sidebarFlickable.collapseAllSections(colorSchemeSection); } StyledListView { @@ -401,7 +428,7 @@ RowLayout { id: animationsSection title: qsTr("Animations") onToggleRequested: { - root.collapseAllSections(animationsSection); + sidebarFlickable.collapseAllSections(animationsSection); } SpinBoxRow { @@ -409,10 +436,10 @@ RowLayout { min: 0.1 max: 5 step: 0.1 - value: root.animDurationsScale + value: rootPane.animDurationsScale onValueModified: value => { - root.animDurationsScale = value; - root.saveConfig(); + rootPane.animDurationsScale = value; + rootPane.saveConfig(); } } } @@ -421,7 +448,7 @@ RowLayout { id: fontsSection title: qsTr("Fonts") onToggleRequested: { - root.collapseAllSections(fontsSection); + sidebarFlickable.collapseAllSections(fontsSection); } StyledText { @@ -449,7 +476,7 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right - readonly property bool isCurrent: modelData === root.fontFamilyMaterial + readonly property bool isCurrent: modelData === rootPane.fontFamilyMaterial color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) radius: Appearance.rounding.normal border.width: isCurrent ? 1 : 0 @@ -457,8 +484,8 @@ RowLayout { StateLayer { function onClicked(): void { - root.fontFamilyMaterial = modelData; - root.saveConfig(); + rootPane.fontFamilyMaterial = modelData; + rootPane.saveConfig(); } } @@ -522,7 +549,7 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right - readonly property bool isCurrent: modelData === root.fontFamilyMono + readonly property bool isCurrent: modelData === rootPane.fontFamilyMono color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) radius: Appearance.rounding.normal border.width: isCurrent ? 1 : 0 @@ -530,8 +557,8 @@ RowLayout { StateLayer { function onClicked(): void { - root.fontFamilyMono = modelData; - root.saveConfig(); + rootPane.fontFamilyMono = modelData; + rootPane.saveConfig(); } } @@ -595,7 +622,7 @@ RowLayout { anchors.left: parent.left anchors.right: parent.right - readonly property bool isCurrent: modelData === root.fontFamilySans + readonly property bool isCurrent: modelData === rootPane.fontFamilySans color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) radius: Appearance.rounding.normal border.width: isCurrent ? 1 : 0 @@ -603,8 +630,8 @@ RowLayout { StateLayer { function onClicked(): void { - root.fontFamilySans = modelData; - root.saveConfig(); + rootPane.fontFamilySans = modelData; + rootPane.saveConfig(); } } @@ -648,10 +675,10 @@ RowLayout { min: 0.1 max: 5 step: 0.1 - value: root.fontSizeScale + value: rootPane.fontSizeScale onValueModified: value => { - root.fontSizeScale = value; - root.saveConfig(); + rootPane.fontSizeScale = value; + rootPane.saveConfig(); } } } @@ -660,7 +687,7 @@ RowLayout { id: scalesSection title: qsTr("Scales") onToggleRequested: { - root.collapseAllSections(scalesSection); + sidebarFlickable.collapseAllSections(scalesSection); } SpinBoxRow { @@ -668,10 +695,10 @@ RowLayout { min: 0.1 max: 5 step: 0.1 - value: root.paddingScale + value: rootPane.paddingScale onValueModified: value => { - root.paddingScale = value; - root.saveConfig(); + rootPane.paddingScale = value; + rootPane.saveConfig(); } } @@ -680,10 +707,10 @@ RowLayout { min: 0.1 max: 5 step: 0.1 - value: root.roundingScale + value: rootPane.roundingScale onValueModified: value => { - root.roundingScale = value; - root.saveConfig(); + rootPane.roundingScale = value; + rootPane.saveConfig(); } } @@ -692,10 +719,10 @@ RowLayout { min: 0.1 max: 5 step: 0.1 - value: root.spacingScale + value: rootPane.spacingScale onValueModified: value => { - root.spacingScale = value; - root.saveConfig(); + rootPane.spacingScale = value; + rootPane.saveConfig(); } } } @@ -704,15 +731,15 @@ RowLayout { id: transparencySection title: qsTr("Transparency") onToggleRequested: { - root.collapseAllSections(transparencySection); + sidebarFlickable.collapseAllSections(transparencySection); } SwitchRow { label: qsTr("Transparency enabled") - checked: root.transparencyEnabled + checked: rootPane.transparencyEnabled onToggled: checked => { - root.transparencyEnabled = checked; - root.saveConfig(); + rootPane.transparencyEnabled = checked; + rootPane.saveConfig(); } } @@ -737,7 +764,7 @@ RowLayout { } StyledText { - text: qsTr("%1%").arg(Math.round(root.transparencyBase * 100)) + text: qsTr("%1%").arg(Math.round(rootPane.transparencyBase * 100)) color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal } @@ -751,10 +778,10 @@ RowLayout { from: 0 to: 100 - value: root.transparencyBase * 100 + value: rootPane.transparencyBase * 100 onMoved: { - root.transparencyBase = baseSlider.value / 100; - root.saveConfig(); + rootPane.transparencyBase = baseSlider.value / 100; + rootPane.saveConfig(); } } } @@ -781,7 +808,7 @@ RowLayout { } StyledText { - text: qsTr("%1%").arg(Math.round(root.transparencyLayers * 100)) + text: qsTr("%1%").arg(Math.round(rootPane.transparencyLayers * 100)) color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal } @@ -795,10 +822,10 @@ RowLayout { from: 0 to: 100 - value: root.transparencyLayers * 100 + value: rootPane.transparencyLayers * 100 onMoved: { - root.transparencyLayers = layersSlider.value / 100; - root.saveConfig(); + rootPane.transparencyLayers = layersSlider.value / 100; + rootPane.saveConfig(); } } } @@ -809,7 +836,7 @@ RowLayout { id: borderSection title: qsTr("Border") onToggleRequested: { - root.collapseAllSections(borderSection); + sidebarFlickable.collapseAllSections(borderSection); } SpinBoxRow { @@ -817,10 +844,10 @@ RowLayout { min: 0.1 max: 100 step: 0.1 - value: root.borderRounding + value: rootPane.borderRounding onValueModified: value => { - root.borderRounding = value; - root.saveConfig(); + rootPane.borderRounding = value; + rootPane.saveConfig(); } } @@ -829,10 +856,10 @@ RowLayout { min: 0.1 max: 100 step: 0.1 - value: root.borderThickness + value: rootPane.borderThickness onValueModified: value => { - root.borderThickness = value; - root.saveConfig(); + rootPane.borderThickness = value; + rootPane.saveConfig(); } } } @@ -841,24 +868,24 @@ RowLayout { id: backgroundSection title: qsTr("Background") onToggleRequested: { - root.collapseAllSections(backgroundSection); + sidebarFlickable.collapseAllSections(backgroundSection); } SwitchRow { label: qsTr("Desktop clock") - checked: root.desktopClockEnabled + checked: rootPane.desktopClockEnabled onToggled: checked => { - root.desktopClockEnabled = checked; - root.saveConfig(); + rootPane.desktopClockEnabled = checked; + rootPane.saveConfig(); } } SwitchRow { label: qsTr("Background enabled") - checked: root.backgroundEnabled + checked: rootPane.backgroundEnabled onToggled: checked => { - root.backgroundEnabled = checked; - root.saveConfig(); + rootPane.backgroundEnabled = checked; + rootPane.saveConfig(); } } @@ -871,19 +898,19 @@ RowLayout { SwitchRow { label: qsTr("Visualiser enabled") - checked: root.visualiserEnabled + checked: rootPane.visualiserEnabled onToggled: checked => { - root.visualiserEnabled = checked; - root.saveConfig(); + rootPane.visualiserEnabled = checked; + rootPane.saveConfig(); } } SwitchRow { label: qsTr("Visualiser auto hide") - checked: root.visualiserAutoHide + checked: rootPane.visualiserAutoHide onToggled: checked => { - root.visualiserAutoHide = checked; - root.saveConfig(); + rootPane.visualiserAutoHide = checked; + rootPane.saveConfig(); } } @@ -891,10 +918,10 @@ RowLayout { label: qsTr("Visualiser rounding") min: 0 max: 10 - value: Math.round(root.visualiserRounding) + value: Math.round(rootPane.visualiserRounding) onValueModified: value => { - root.visualiserRounding = value; - root.saveConfig(); + rootPane.visualiserRounding = value; + rootPane.saveConfig(); } } @@ -902,19 +929,15 @@ RowLayout { label: qsTr("Visualiser spacing") min: 0 max: 10 - value: Math.round(root.visualiserSpacing) + value: Math.round(rootPane.visualiserSpacing) onValueModified: value => { - root.visualiserSpacing = value; - root.saveConfig(); + rootPane.visualiserSpacing = value; + rootPane.saveConfig(); } } } } - } - - InnerBorder { - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 + } } } @@ -922,30 +945,53 @@ RowLayout { Layout.fillWidth: true Layout.fillHeight: true - StyledFlickable { + ClippingRectangle { + id: rightAppearanceClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 anchors.rightMargin: Appearance.padding.normal / 2 + radius: rightAppearanceBorder.innerRadius + color: "transparent" - flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.height - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + Loader { + id: rightAppearanceLoader + anchors.fill: parent + anchors.topMargin: Appearance.padding.large * 2 + anchors.bottomMargin: Appearance.padding.large * 2 + anchors.leftMargin: 0 + anchors.rightMargin: 0 + asynchronous: true + sourceComponent: appearanceRightContentComponent + property var rootPane: root } + } - ColumnLayout { - id: contentLayout + InnerBorder { + id: rightAppearanceBorder + leftThickness: Appearance.padding.normal / 2 + } - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - anchors.leftMargin: Appearance.padding.large * 2 - anchors.rightMargin: Appearance.padding.large * 2 - anchors.topMargin: Appearance.padding.large * 2 + Component { + id: appearanceRightContentComponent - spacing: Appearance.spacing.normal + StyledFlickable { + id: rightAppearanceFlickable + flickableDirection: Flickable.VerticalFlick + contentHeight: contentLayout.height + + StyledScrollBar.vertical: StyledScrollBar { + flickable: rightAppearanceFlickable + } + + ColumnLayout { + id: contentLayout + + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 + spacing: Appearance.spacing.normal MaterialIcon { Layout.alignment: Qt.AlignHCenter @@ -1182,10 +1228,7 @@ RowLayout { } } } - } - - InnerBorder { - leftThickness: Appearance.padding.normal / 2 + } } } } diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index add7078..005de3a 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -7,6 +7,7 @@ import qs.components.effects import qs.components.containers import qs.services import qs.config +import Quickshell.Widgets import QtQuick import QtQuick.Layouts @@ -20,28 +21,58 @@ RowLayout { spacing: 0 Item { + id: leftAudioItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true - StyledFlickable { + ClippingRectangle { + id: leftAudioClippingRect anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - flickableDirection: Flickable.VerticalFlick - contentHeight: leftContent.height - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 + + radius: leftAudioBorder.innerRadius + color: "transparent" + + Loader { + id: leftAudioLoader + + anchors.fill: parent + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + + asynchronous: true + sourceComponent: audioLeftContentComponent } + } + + InnerBorder { + id: leftAudioBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + + Component { + id: audioLeftContentComponent + + StyledFlickable { + id: leftAudioFlickable + flickableDirection: Flickable.VerticalFlick + contentHeight: leftContent.height - ColumnLayout { - id: leftContent + StyledScrollBar.vertical: StyledScrollBar { + flickable: leftAudioFlickable + } + + ColumnLayout { + id: leftContent - anchors.left: parent.left - anchors.right: parent.right - spacing: Appearance.spacing.normal + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.normal // Settings header above the collapsible sections RowLayout { @@ -215,42 +246,64 @@ RowLayout { } } } - } - - InnerBorder { - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 + } } } Item { + id: rightAudioItem Layout.fillWidth: true Layout.fillHeight: true - StyledFlickable { + ClippingRectangle { + id: rightAudioClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 anchors.rightMargin: Appearance.padding.normal / 2 - flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.height + radius: rightAudioBorder.innerRadius + color: "transparent" + + Loader { + id: rightAudioLoader + + anchors.fill: parent + anchors.topMargin: Appearance.padding.large * 2 + anchors.bottomMargin: Appearance.padding.large * 2 + anchors.leftMargin: 0 + anchors.rightMargin: 0 - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + asynchronous: true + sourceComponent: audioRightContentComponent } + } + + InnerBorder { + id: rightAudioBorder + leftThickness: Appearance.padding.normal / 2 + } - ColumnLayout { - id: contentLayout + Component { + id: audioRightContentComponent - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - anchors.leftMargin: Appearance.padding.large * 2 - anchors.rightMargin: Appearance.padding.large * 2 - anchors.topMargin: Appearance.padding.large * 2 + StyledFlickable { + id: rightAudioFlickable + flickableDirection: Flickable.VerticalFlick + contentHeight: contentLayout.height + + StyledScrollBar.vertical: StyledScrollBar { + flickable: rightAudioFlickable + } + + ColumnLayout { + id: contentLayout - spacing: Appearance.spacing.normal + anchors.left: parent.left + anchors.right: parent.right + anchors.leftMargin: Appearance.padding.large * 2 + anchors.rightMargin: Appearance.padding.large * 2 + spacing: Appearance.spacing.normal ConnectionHeader { icon: "volume_up" @@ -397,10 +450,7 @@ RowLayout { } } } - } - - InnerBorder { - leftThickness: Appearance.padding.normal / 2 + } } } } \ No newline at end of file diff --git a/modules/controlcenter/bluetooth/BtPane.qml b/modules/controlcenter/bluetooth/BtPane.qml index 96dc002..32d2c0d 100644 --- a/modules/controlcenter/bluetooth/BtPane.qml +++ b/modules/controlcenter/bluetooth/BtPane.qml @@ -19,30 +19,57 @@ RowLayout { spacing: 0 Item { + id: leftBtItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true - DeviceList { + ClippingRectangle { + id: leftBtClippingRect anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 + + radius: leftBtBorder.innerRadius + color: "transparent" + + Loader { + id: leftBtLoader + + anchors.fill: parent + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - session: root.session + asynchronous: true + sourceComponent: btDeviceListComponent + } } InnerBorder { + id: leftBtBorder leftThickness: 0 rightThickness: Appearance.padding.normal / 2 } + + Component { + id: btDeviceListComponent + + DeviceList { + anchors.fill: parent + session: root.session + } + } } Item { + id: rightBtItem Layout.fillWidth: true Layout.fillHeight: true ClippingRectangle { + id: btClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 8ddccb4..12abc1e 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -144,20 +144,50 @@ RowLayout { } Item { + id: leftLauncherItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true - ColumnLayout { + ClippingRectangle { + id: leftLauncherClippingRect anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - anchors.bottomMargin: 0 + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 + + radius: leftLauncherBorder.innerRadius + color: "transparent" + + Loader { + id: leftLauncherLoader - spacing: Appearance.spacing.small + anchors.fill: parent + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + anchors.bottomMargin: 0 - RowLayout { + asynchronous: true + sourceComponent: leftContentComponent + } + } + + InnerBorder { + id: leftLauncherBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + + Component { + id: leftContentComponent + + ColumnLayout { + anchors.fill: parent + + spacing: Appearance.spacing.small + + RowLayout { spacing: Appearance.spacing.smaller StyledText { @@ -268,6 +298,7 @@ RowLayout { } StyledListView { + id: appsListView Layout.fillWidth: true Layout.fillHeight: true @@ -323,26 +354,50 @@ RowLayout { } } } - - InnerBorder { - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 } } Item { + id: rightLauncherItem Layout.fillWidth: true Layout.fillHeight: true - ColumnLayout { + ClippingRectangle { + id: rightLauncherClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 anchors.rightMargin: Appearance.padding.normal / 2 - spacing: Appearance.spacing.normal + radius: rightLauncherBorder.innerRadius + color: "transparent" - Item { + Loader { + id: rightLauncherLoader + + anchors.fill: parent + anchors.margins: Appearance.padding.large * 2 + + asynchronous: true + sourceComponent: rightContentComponent + } + } + + InnerBorder { + id: rightLauncherBorder + + leftThickness: Appearance.padding.normal / 2 + } + + Component { + id: rightContentComponent + + ColumnLayout { + anchors.fill: parent + + spacing: Appearance.spacing.normal + + Item { Layout.alignment: Qt.AlignHCenter Layout.leftMargin: Appearance.padding.large * 2 Layout.rightMargin: Appearance.padding.large * 2 @@ -397,6 +452,7 @@ RowLayout { Layout.rightMargin: Appearance.padding.large * 2 StyledFlickable { + id: detailsFlickable anchors.fill: parent flickableDirection: Flickable.VerticalFlick contentHeight: debugLayout.height @@ -428,9 +484,6 @@ RowLayout { } } } - - InnerBorder { - leftThickness: Appearance.padding.normal / 2 } } } diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index ada29dc..c3621bb 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -29,32 +29,59 @@ Item { spacing: 0 Item { + id: leftNetworkItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true - // Left pane - networking list with collapsible sections - StyledFlickable { - id: leftFlickable - + ClippingRectangle { + id: leftNetworkClippingRect anchors.fill: parent - flickableDirection: Flickable.VerticalFlick - contentHeight: leftContent.height + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 - StyledScrollBar.vertical: StyledScrollBar { - flickable: leftFlickable - } + radius: leftNetworkBorder.innerRadius + color: "transparent" - ColumnLayout { - id: leftContent + Loader { + id: leftNetworkLoader - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top + anchors.fill: parent anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - spacing: Appearance.spacing.normal + + asynchronous: true + sourceComponent: networkListComponent + } + } + + InnerBorder { + id: leftNetworkBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + + Component { + id: networkListComponent + + StyledFlickable { + id: leftFlickable + + flickableDirection: Flickable.VerticalFlick + contentHeight: leftContent.height + + StyledScrollBar.vertical: StyledScrollBar { + flickable: leftFlickable + } + + ColumnLayout { + id: leftContent + + anchors.left: parent.left + anchors.right: parent.right + spacing: Appearance.spacing.normal // Settings header above the collapsible sections RowLayout { @@ -385,18 +412,16 @@ Item { } } } - - InnerBorder { - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 } } Item { + id: rightNetworkItem Layout.fillWidth: true Layout.fillHeight: true ClippingRectangle { + id: networkClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 107091e..85e5275 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -9,6 +9,7 @@ import qs.services import qs.config import qs.utils import Quickshell +import Quickshell.Widgets import QtQuick import QtQuick.Layouts @@ -17,6 +18,9 @@ RowLayout { required property Session session + // Clock + property bool clockShowIcon: Config.bar.clock.showIcon ?? true + // Bar Behavior property bool persistent: Config.bar.persistent ?? true property bool showOnHover: Config.bar.showOnHover ?? true @@ -48,9 +52,6 @@ RowLayout { spacing: 0 Component.onCompleted: { - // Update clock toggle - clockShowIconSwitch.checked = Config.bar.clock.showIcon ?? true; - // Update entries if (Config.bar.entries) { entriesModel.clear(); @@ -66,7 +67,7 @@ RowLayout { function saveConfig(entryIndex, entryEnabled) { // Update clock setting - Config.bar.clock.showIcon = clockShowIconSwitch.checked; + Config.bar.clock.showIcon = root.clockShowIcon; // Update bar behavior Config.bar.persistent = root.persistent; @@ -116,42 +117,62 @@ RowLayout { id: entriesModel } - - function collapseAllSections(exceptSection) { - if (exceptSection !== clockSection) clockSection.expanded = false; - if (exceptSection !== barBehaviorSection) barBehaviorSection.expanded = false; - if (exceptSection !== statusIconsSection) statusIconsSection.expanded = false; - if (exceptSection !== traySettingsSection) traySettingsSection.expanded = false; - if (exceptSection !== workspacesSection) workspacesSection.expanded = false; - } - Item { + id: leftTaskbarItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true - StyledFlickable { - id: sidebarFlickable + ClippingRectangle { + id: leftTaskbarClippingRect anchors.fill: parent - flickableDirection: Flickable.VerticalFlick - contentHeight: sidebarLayout.height + anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 - StyledScrollBar.vertical: StyledScrollBar { - flickable: sidebarFlickable - } + radius: leftTaskbarBorder.innerRadius + color: "transparent" + + Loader { + id: leftTaskbarLoader - ColumnLayout { - id: sidebarLayout - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top + anchors.fill: parent anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - spacing: Appearance.spacing.small + asynchronous: true + sourceComponent: leftTaskbarContentComponent + } + } - RowLayout { + InnerBorder { + id: leftTaskbarBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 + } + + Component { + id: leftTaskbarContentComponent + + StyledFlickable { + id: sidebarFlickable + flickableDirection: Flickable.VerticalFlick + contentHeight: sidebarLayout.height + + StyledScrollBar.vertical: StyledScrollBar { + flickable: sidebarFlickable + } + + ColumnLayout { + id: sidebarLayout + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top + + spacing: Appearance.spacing.small + + RowLayout { spacing: Appearance.spacing.smaller StyledText { @@ -169,9 +190,6 @@ RowLayout { id: clockSection title: qsTr("Clock") description: qsTr("Clock display settings") - onToggleRequested: { - root.collapseAllSections(clockSection); - } RowLayout { id: clockRow @@ -190,8 +208,9 @@ RowLayout { StyledSwitch { id: clockShowIconSwitch - checked: true + checked: root.clockShowIcon onToggled: { + root.clockShowIcon = checked; root.saveConfig(); } } @@ -201,9 +220,6 @@ RowLayout { CollapsibleSection { id: barBehaviorSection title: qsTr("Bar Behavior") - onToggleRequested: { - root.collapseAllSections(barBehaviorSection); - } SwitchRow { label: qsTr("Persistent") @@ -238,9 +254,6 @@ RowLayout { CollapsibleSection { id: statusIconsSection title: qsTr("Status Icons") - onToggleRequested: { - root.collapseAllSections(statusIconsSection); - } SwitchRow { label: qsTr("Show audio") @@ -309,9 +322,6 @@ RowLayout { CollapsibleSection { id: traySettingsSection title: qsTr("Tray Settings") - onToggleRequested: { - root.collapseAllSections(traySettingsSection); - } SwitchRow { label: qsTr("Background") @@ -344,9 +354,6 @@ RowLayout { CollapsibleSection { id: workspacesSection title: qsTr("Workspaces") - onToggleRequested: { - root.collapseAllSections(workspacesSection); - } StyledRect { Layout.fillWidth: true @@ -517,43 +524,62 @@ RowLayout { } } } - - InnerBorder { - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 } } Item { + id: rightTaskbarItem Layout.fillWidth: true Layout.fillHeight: true - StyledFlickable { + ClippingRectangle { + id: rightTaskbarClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 anchors.rightMargin: Appearance.padding.normal / 2 - flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.height + radius: rightTaskbarBorder.innerRadius + color: "transparent" + + Loader { + id: rightTaskbarLoader - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent + anchors.fill: parent + anchors.margins: Appearance.padding.large * 2 + + asynchronous: true + sourceComponent: rightTaskbarContentComponent } + } + + InnerBorder { + id: rightTaskbarBorder + + leftThickness: Appearance.padding.normal / 2 + } + + Component { + id: rightTaskbarContentComponent + + StyledFlickable { + flickableDirection: Flickable.VerticalFlick + contentHeight: contentLayout.height - ColumnLayout { - id: contentLayout + StyledScrollBar.vertical: StyledScrollBar { + flickable: parent + } + + ColumnLayout { + id: contentLayout - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - anchors.leftMargin: Appearance.padding.large * 2 - anchors.rightMargin: Appearance.padding.large * 2 - anchors.topMargin: Appearance.padding.large * 2 + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top - spacing: Appearance.spacing.normal + spacing: Appearance.spacing.normal - MaterialIcon { + MaterialIcon { Layout.alignment: Qt.AlignHCenter text: "task_alt" font.pointSize: Appearance.font.size.extraLarge * 3 @@ -577,7 +603,7 @@ RowLayout { StyledText { Layout.alignment: Qt.AlignHCenter - text: clockShowIconSwitch.checked ? qsTr("Clock icon enabled") : qsTr("Clock icon disabled") + text: root.clockShowIcon ? qsTr("Clock icon enabled") : qsTr("Clock icon disabled") color: Colours.palette.m3outline } @@ -597,9 +623,6 @@ RowLayout { } } - - InnerBorder { - leftThickness: Appearance.padding.normal / 2 } } } -- cgit v1.2.3-freya From ec8da25d194eb6c9d0898870e52b061853907583 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 19:07:30 -0500 Subject: controlcenter: revamped and added more sliders --- .../controlcenter/appearance/AppearancePane.qml | 1043 ++++++++++++++++++-- modules/controlcenter/audio/AudioPane.qml | 156 ++- modules/controlcenter/taskbar/TaskbarPane.qml | 104 +- 3 files changed, 1199 insertions(+), 104 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index baf49cf..ea81fa7 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -431,15 +431,102 @@ RowLayout { sidebarFlickable.collapseAllSections(animationsSection); } - SpinBoxRow { - label: qsTr("Animation duration scale") - min: 0.1 - max: 5 - step: 0.1 - value: rootPane.animDurationsScale - onValueModified: value => { - rootPane.animDurationsScale = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Animation duration scale") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: animDurationsInput.implicitHeight + Appearance.padding.small * 2 + color: animDurationsInputHover.containsMouse || animDurationsInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: animDurationsInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: animDurationsInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: animDurationsInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + Component.onCompleted: { + text = (rootPane.animDurationsScale).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 5.0) { + rootPane.animDurationsScale = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 5.0) { + text = (rootPane.animDurationsScale).toFixed(1); + } + } + } + } + + StyledText { + text: "×" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: animDurationsSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 5.0 + value: rootPane.animDurationsScale + onMoved: { + rootPane.animDurationsScale = animDurationsSlider.value; + if (!animDurationsInput.activeFocus) { + animDurationsInput.text = (animDurationsSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } } @@ -473,8 +560,7 @@ RowLayout { delegate: StyledRect { required property string modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 readonly property bool isCurrent: modelData === rootPane.fontFamilyMaterial color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) @@ -546,8 +632,7 @@ RowLayout { delegate: StyledRect { required property string modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 readonly property bool isCurrent: modelData === rootPane.fontFamilyMono color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) @@ -619,8 +704,7 @@ RowLayout { delegate: StyledRect { required property string modelData - anchors.left: parent.left - anchors.right: parent.right + width: parent ? parent.width : 0 readonly property bool isCurrent: modelData === rootPane.fontFamilySans color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isCurrent ? Colours.tPalette.m3surfaceContainer.a : 0) @@ -670,15 +754,102 @@ RowLayout { } } - SpinBoxRow { - label: qsTr("Font size scale") - min: 0.1 - max: 5 - step: 0.1 - value: rootPane.fontSizeScale - onValueModified: value => { - rootPane.fontSizeScale = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Font size scale") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: fontSizeInput.implicitHeight + Appearance.padding.small * 2 + color: fontSizeInputHover.containsMouse || fontSizeInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: fontSizeInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: fontSizeInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: fontSizeInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + Component.onCompleted: { + text = (rootPane.fontSizeScale).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 5.0) { + rootPane.fontSizeScale = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 5.0) { + text = (rootPane.fontSizeScale).toFixed(1); + } + } + } + } + + StyledText { + text: "×" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: fontSizeSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 5.0 + value: rootPane.fontSizeScale + onMoved: { + rootPane.fontSizeScale = fontSizeSlider.value; + if (!fontSizeInput.activeFocus) { + fontSizeInput.text = (fontSizeSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } } @@ -690,39 +861,300 @@ RowLayout { sidebarFlickable.collapseAllSections(scalesSection); } - SpinBoxRow { - label: qsTr("Padding scale") - min: 0.1 - max: 5 - step: 0.1 - value: rootPane.paddingScale - onValueModified: value => { - rootPane.paddingScale = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Padding scale") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: paddingInput.implicitHeight + Appearance.padding.small * 2 + color: paddingInputHover.containsMouse || paddingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: paddingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: paddingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: paddingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + Component.onCompleted: { + text = (rootPane.paddingScale).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 5.0) { + rootPane.paddingScale = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 5.0) { + text = (rootPane.paddingScale).toFixed(1); + } + } + } + } + + StyledText { + text: "×" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: paddingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 5.0 + value: rootPane.paddingScale + onMoved: { + rootPane.paddingScale = paddingSlider.value; + if (!paddingInput.activeFocus) { + paddingInput.text = (paddingSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } - SpinBoxRow { - label: qsTr("Rounding scale") - min: 0.1 - max: 5 - step: 0.1 - value: rootPane.roundingScale - onValueModified: value => { - rootPane.roundingScale = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Rounding scale") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: roundingInput.implicitHeight + Appearance.padding.small * 2 + color: roundingInputHover.containsMouse || roundingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: roundingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: roundingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: roundingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + Component.onCompleted: { + text = (rootPane.roundingScale).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 5.0) { + rootPane.roundingScale = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 5.0) { + text = (rootPane.roundingScale).toFixed(1); + } + } + } + } + + StyledText { + text: "×" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: roundingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 5.0 + value: rootPane.roundingScale + onMoved: { + rootPane.roundingScale = roundingSlider.value; + if (!roundingInput.activeFocus) { + roundingInput.text = (roundingSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } - SpinBoxRow { - label: qsTr("Spacing scale") - min: 0.1 - max: 5 - step: 0.1 - value: rootPane.spacingScale - onValueModified: value => { - rootPane.spacingScale = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Spacing scale") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: spacingInput.implicitHeight + Appearance.padding.small * 2 + color: spacingInputHover.containsMouse || spacingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: spacingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: spacingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: spacingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + Component.onCompleted: { + text = (rootPane.spacingScale).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 5.0) { + rootPane.spacingScale = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 5.0) { + text = (rootPane.spacingScale).toFixed(1); + } + } + } + } + + StyledText { + text: "×" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: spacingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 5.0 + value: rootPane.spacingScale + onMoved: { + rootPane.spacingScale = spacingSlider.value; + if (!spacingInput.activeFocus) { + spacingInput.text = (spacingSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } } @@ -763,8 +1195,60 @@ RowLayout { Layout.fillWidth: true } + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: transparencyBaseInput.implicitHeight + Appearance.padding.small * 2 + color: transparencyBaseInputHover.containsMouse || transparencyBaseInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: transparencyBaseInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: transparencyBaseInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: transparencyBaseInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + + Component.onCompleted: { + text = Math.round(rootPane.transparencyBase * 100).toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + rootPane.transparencyBase = val / 100; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = Math.round(rootPane.transparencyBase * 100).toString(); + } + } + } + } + StyledText { - text: qsTr("%1%").arg(Math.round(rootPane.transparencyBase * 100)) + text: "%" color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal } @@ -781,6 +1265,9 @@ RowLayout { value: rootPane.transparencyBase * 100 onMoved: { rootPane.transparencyBase = baseSlider.value / 100; + if (!transparencyBaseInput.activeFocus) { + transparencyBaseInput.text = Math.round(baseSlider.value).toString(); + } rootPane.saveConfig(); } } @@ -807,8 +1294,60 @@ RowLayout { Layout.fillWidth: true } + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: transparencyLayersInput.implicitHeight + Appearance.padding.small * 2 + color: transparencyLayersInputHover.containsMouse || transparencyLayersInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: transparencyLayersInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: transparencyLayersInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: transparencyLayersInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + + Component.onCompleted: { + text = Math.round(rootPane.transparencyLayers * 100).toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + rootPane.transparencyLayers = val / 100; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = Math.round(rootPane.transparencyLayers * 100).toString(); + } + } + } + } + StyledText { - text: qsTr("%1%").arg(Math.round(rootPane.transparencyLayers * 100)) + text: "%" color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal } @@ -825,6 +1364,9 @@ RowLayout { value: rootPane.transparencyLayers * 100 onMoved: { rootPane.transparencyLayers = layersSlider.value / 100; + if (!transparencyLayersInput.activeFocus) { + transparencyLayersInput.text = Math.round(layersSlider.value).toString(); + } rootPane.saveConfig(); } } @@ -839,27 +1381,189 @@ RowLayout { sidebarFlickable.collapseAllSections(borderSection); } - SpinBoxRow { - label: qsTr("Border rounding") - min: 0.1 - max: 100 - step: 0.1 - value: rootPane.borderRounding - onValueModified: value => { - rootPane.borderRounding = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Border rounding") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: borderRoundingInput.implicitHeight + Appearance.padding.small * 2 + color: borderRoundingInputHover.containsMouse || borderRoundingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: borderRoundingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: borderRoundingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: borderRoundingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 100 } + + Component.onCompleted: { + text = (rootPane.borderRounding).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 100) { + rootPane.borderRounding = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 100) { + text = (rootPane.borderRounding).toFixed(1); + } + } + } + } + } + + StyledSlider { + id: borderRoundingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 100 + value: rootPane.borderRounding + onMoved: { + rootPane.borderRounding = borderRoundingSlider.value; + if (!borderRoundingInput.activeFocus) { + borderRoundingInput.text = (borderRoundingSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } - SpinBoxRow { - label: qsTr("Border thickness") - min: 0.1 - max: 100 - step: 0.1 - value: rootPane.borderThickness - onValueModified: value => { - rootPane.borderThickness = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Border thickness") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: borderThicknessInput.implicitHeight + Appearance.padding.small * 2 + color: borderThicknessInputHover.containsMouse || borderThicknessInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: borderThicknessInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: borderThicknessInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: borderThicknessInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0.1; top: 100 } + + Component.onCompleted: { + text = (rootPane.borderThickness).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0.1 && val <= 100) { + rootPane.borderThickness = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0.1 || val > 100) { + text = (rootPane.borderThickness).toFixed(1); + } + } + } + } + } + + StyledSlider { + id: borderThicknessSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0.1 + to: 100 + value: rootPane.borderThickness + onMoved: { + rootPane.borderThickness = borderThicknessSlider.value; + if (!borderThicknessInput.activeFocus) { + borderThicknessInput.text = (borderThicknessSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } } @@ -914,25 +1618,190 @@ RowLayout { } } - SpinBoxRow { - label: qsTr("Visualiser rounding") - min: 0 - max: 10 - value: Math.round(rootPane.visualiserRounding) - onValueModified: value => { - rootPane.visualiserRounding = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Visualiser rounding") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: visualiserRoundingInput.implicitHeight + Appearance.padding.small * 2 + color: visualiserRoundingInputHover.containsMouse || visualiserRoundingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: visualiserRoundingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: visualiserRoundingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: visualiserRoundingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 10 } + + Component.onCompleted: { + text = Math.round(rootPane.visualiserRounding).toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 10) { + rootPane.visualiserRounding = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 10) { + text = Math.round(rootPane.visualiserRounding).toString(); + } + } + } + } + } + + StyledSlider { + id: visualiserRoundingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0 + to: 10 + stepSize: 1 + value: rootPane.visualiserRounding + onMoved: { + rootPane.visualiserRounding = Math.round(visualiserRoundingSlider.value); + if (!visualiserRoundingInput.activeFocus) { + visualiserRoundingInput.text = Math.round(visualiserRoundingSlider.value).toString(); + } + rootPane.saveConfig(); + } + } } } - SpinBoxRow { - label: qsTr("Visualiser spacing") - min: 0 - max: 10 - value: Math.round(rootPane.visualiserSpacing) - onValueModified: value => { - rootPane.visualiserSpacing = value; - rootPane.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Visualiser spacing") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: visualiserSpacingInput.implicitHeight + Appearance.padding.small * 2 + color: visualiserSpacingInputHover.containsMouse || visualiserSpacingInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: visualiserSpacingInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: visualiserSpacingInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: visualiserSpacingInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: DoubleValidator { bottom: 0; top: 2 } + + Component.onCompleted: { + text = (rootPane.visualiserSpacing).toFixed(1); + } + + onTextChanged: { + if (activeFocus) { + const val = parseFloat(text); + if (!isNaN(val) && val >= 0 && val <= 2) { + rootPane.visualiserSpacing = val; + rootPane.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseFloat(text); + if (isNaN(val) || val < 0 || val > 2) { + text = (rootPane.visualiserSpacing).toFixed(1); + } + } + } + } + } + + StyledSlider { + id: visualiserSpacingSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0 + to: 2 + value: rootPane.visualiserSpacing + onMoved: { + rootPane.visualiserSpacing = visualiserSpacingSlider.value; + if (!visualiserSpacingInput.activeFocus) { + visualiserSpacingInput.text = (visualiserSpacingSlider.value).toFixed(1); + } + rootPane.saveConfig(); + } + } } } } diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 1c0c770..3440a2f 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -336,11 +336,74 @@ RowLayout { Layout.fillWidth: true } + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: outputVolumeInput.implicitHeight + Appearance.padding.small * 2 + color: outputVolumeInputHover.containsMouse || outputVolumeInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: outputVolumeInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + enabled: !Audio.muted + opacity: enabled ? 1 : 0.5 + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: outputVolumeInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: outputVolumeInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + enabled: !Audio.muted + + Component.onCompleted: { + text = Math.round(Audio.volume * 100).toString(); + } + + Connections { + target: Audio + function onVolumeChanged() { + if (!outputVolumeInput.activeFocus) { + outputVolumeInput.text = Math.round(Audio.volume * 100).toString(); + } + } + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + Audio.setVolume(val / 100); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = Math.round(Audio.volume * 100).toString(); + } + } + } + } + StyledText { - text: Audio.muted ? qsTr("Muted") : qsTr("%1%").arg(Math.round(Audio.volume * 100)) - color: Audio.muted ? Colours.palette.m3primary : Colours.palette.m3outline + text: "%" + color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal - font.weight: 500 + opacity: Audio.muted ? 0.5 : 1 } StyledRect { @@ -362,20 +425,26 @@ RowLayout { id: muteIcon anchors.centerIn: parent - text: Audio.muted ? "volume_off" : "volume_mute" + text: Audio.muted ? "volume_off" : "volume_up" color: Audio.muted ? Colours.palette.m3onSecondary : Colours.palette.m3onSecondaryContainer } } } StyledSlider { + id: outputVolumeSlider Layout.fillWidth: true implicitHeight: Appearance.padding.normal * 3 value: Audio.volume enabled: !Audio.muted opacity: enabled ? 1 : 0.5 - onMoved: Audio.setVolume(value) + onMoved: { + Audio.setVolume(value); + if (!outputVolumeInput.activeFocus) { + outputVolumeInput.text = Math.round(value * 100).toString(); + } + } } } } @@ -406,11 +475,74 @@ RowLayout { Layout.fillWidth: true } + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: inputVolumeInput.implicitHeight + Appearance.padding.small * 2 + color: inputVolumeInputHover.containsMouse || inputVolumeInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: inputVolumeInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + enabled: !Audio.sourceMuted + opacity: enabled ? 1 : 0.5 + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: inputVolumeInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: inputVolumeInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + enabled: !Audio.sourceMuted + + Component.onCompleted: { + text = Math.round(Audio.sourceVolume * 100).toString(); + } + + Connections { + target: Audio + function onSourceVolumeChanged() { + if (!inputVolumeInput.activeFocus) { + inputVolumeInput.text = Math.round(Audio.sourceVolume * 100).toString(); + } + } + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + Audio.setSourceVolume(val / 100); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = Math.round(Audio.sourceVolume * 100).toString(); + } + } + } + } + StyledText { - text: Audio.sourceMuted ? qsTr("Muted") : qsTr("%1%").arg(Math.round(Audio.sourceVolume * 100)) - color: Audio.sourceMuted ? Colours.palette.m3primary : Colours.palette.m3outline + text: "%" + color: Colours.palette.m3outline font.pointSize: Appearance.font.size.normal - font.weight: 500 + opacity: Audio.sourceMuted ? 0.5 : 1 } StyledRect { @@ -439,13 +571,19 @@ RowLayout { } StyledSlider { + id: inputVolumeSlider Layout.fillWidth: true implicitHeight: Appearance.padding.normal * 3 value: Audio.sourceVolume enabled: !Audio.sourceMuted opacity: enabled ? 1 : 0.5 - onMoved: Audio.setSourceVolume(value) + onMoved: { + Audio.setSourceVolume(value); + if (!inputVolumeInput.activeFocus) { + inputVolumeInput.text = Math.round(value * 100).toString(); + } + } } } } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 85e5275..6d9761b 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -239,14 +239,102 @@ RowLayout { } } - SpinBoxRow { - label: qsTr("Drag threshold") - min: 0 - max: 100 - value: root.dragThreshold - onValueModified: value => { - root.dragThreshold = value; - root.saveConfig(); + SectionContainer { + contentSpacing: Appearance.spacing.normal + + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + text: qsTr("Drag threshold") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 + color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: dragThresholdInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: dragThresholdInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: dragThresholdInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + + Component.onCompleted: { + text = root.dragThreshold.toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + root.dragThreshold = val; + root.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = root.dragThreshold.toString(); + } + } + } + } + + StyledText { + text: "px" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: dragThresholdSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0 + to: 100 + value: root.dragThreshold + onMoved: { + root.dragThreshold = Math.round(dragThresholdSlider.value); + if (!dragThresholdInput.activeFocus) { + dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); + } + root.saveConfig(); + } + } } } } -- cgit v1.2.3-freya From d751b68bdfcf1113fcab8da0d99748772feaebcd Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sun, 16 Nov 2025 13:15:08 -0500 Subject: controlcenter: corrected missing config.save() on panes --- modules/controlcenter/launcher/LauncherPane.qml | 5 ++++- modules/controlcenter/taskbar/TaskbarPane.qml | 3 +++ 2 files changed, 7 insertions(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index a7e122e..0cb223b 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -66,8 +66,11 @@ RowLayout { } } - // Update Config to trigger save + // Update Config Config.launcher.hiddenApps = hiddenApps; + + // Persist changes to disk + Config.save(); } onSelectedAppChanged: { diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 6d9761b..8d0e5a0 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -111,6 +111,9 @@ RowLayout { }); } Config.bar.entries = entries; + + // Persist changes to disk + Config.save(); } ListModel { -- cgit v1.2.3-freya From 8981ab8806609496360d11cf34384fc337368ff7 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sun, 16 Nov 2025 19:36:05 -0500 Subject: controlcenter: added collapse/expand all to apperaance and taskbar --- .../controlcenter/appearance/AppearancePane.qml | 29 +++++++++++++++ modules/controlcenter/taskbar/TaskbarPane.qml | 41 ++++++++++++++++------ 2 files changed, 60 insertions(+), 10 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 5f70abb..2b3bbce 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -141,6 +141,17 @@ RowLayout { anchors.right: parent.right spacing: Appearance.spacing.small + readonly property bool allSectionsExpanded: + themeModeSection.expanded && + colorVariantSection.expanded && + colorSchemeSection.expanded && + animationsSection.expanded && + fontsSection.expanded && + scalesSection.expanded && + transparencySection.expanded && + borderSection.expanded && + backgroundSection.expanded + RowLayout { spacing: Appearance.spacing.smaller @@ -153,6 +164,24 @@ RowLayout { Item { Layout.fillWidth: true } + + IconButton { + icon: sidebarLayout.allSectionsExpanded ? "unfold_less" : "unfold_more" + type: IconButton.Text + label.animate: true + onClicked: { + const shouldExpand = !sidebarLayout.allSectionsExpanded; + themeModeSection.expanded = shouldExpand; + colorVariantSection.expanded = shouldExpand; + colorSchemeSection.expanded = shouldExpand; + animationsSection.expanded = shouldExpand; + fontsSection.expanded = shouldExpand; + scalesSection.expanded = shouldExpand; + transparencySection.expanded = shouldExpand; + borderSection.expanded = shouldExpand; + backgroundSection.expanded = shouldExpand; + } + } } CollapsibleSection { diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 8d0e5a0..c731acc 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -175,19 +175,40 @@ RowLayout { spacing: Appearance.spacing.small + readonly property bool allSectionsExpanded: + clockSection.expanded && + barBehaviorSection.expanded && + statusIconsSection.expanded && + traySettingsSection.expanded && + workspacesSection.expanded + RowLayout { - spacing: Appearance.spacing.smaller + spacing: Appearance.spacing.smaller - StyledText { - text: qsTr("Settings") - font.pointSize: Appearance.font.size.large - font.weight: 500 - } + StyledText { + text: qsTr("Settings") + font.pointSize: Appearance.font.size.large + font.weight: 500 + } - Item { - Layout.fillWidth: true - } - } + Item { + Layout.fillWidth: true + } + + IconButton { + icon: sidebarLayout.allSectionsExpanded ? "unfold_less" : "unfold_more" + type: IconButton.Text + label.animate: true + onClicked: { + const shouldExpand = !sidebarLayout.allSectionsExpanded; + clockSection.expanded = shouldExpand; + barBehaviorSection.expanded = shouldExpand; + statusIconsSection.expanded = shouldExpand; + traySettingsSection.expanded = shouldExpand; + workspacesSection.expanded = shouldExpand; + } + } + } CollapsibleSection { id: clockSection -- cgit v1.2.3-freya From f24805190444c1325e25829b7b4921c79742d6a3 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 08:41:42 -0500 Subject: controlcenter: taskbar clock settings bg correction --- modules/controlcenter/taskbar/TaskbarPane.qml | 29 ++++++--------------------- 1 file changed, 6 insertions(+), 23 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index c731acc..8a58512 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -213,30 +213,13 @@ RowLayout { CollapsibleSection { id: clockSection title: qsTr("Clock") - description: qsTr("Clock display settings") - RowLayout { - id: clockRow - - Layout.fillWidth: true - Layout.leftMargin: Appearance.padding.large - Layout.rightMargin: Appearance.padding.large - Layout.alignment: Qt.AlignVCenter - - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Show clock icon") - } - - StyledSwitch { - id: clockShowIconSwitch - checked: root.clockShowIcon - onToggled: { - root.clockShowIcon = checked; - root.saveConfig(); - } + SwitchRow { + label: qsTr("Show clock icon") + checked: root.clockShowIcon + onToggled: checked => { + root.clockShowIcon = checked; + root.saveConfig(); } } } -- cgit v1.2.3-freya From 2c91bde79573b45f65280d7b68cd28f50a780019 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 09:24:28 -0500 Subject: controlcenter: converted taskbar panel to single pane view --- modules/controlcenter/taskbar/TaskbarPane.qml | 854 +++++++++++--------------- 1 file changed, 370 insertions(+), 484 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 8a58512..1ad35b6 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -13,7 +13,7 @@ import Quickshell.Widgets import QtQuick import QtQuick.Layouts -RowLayout { +Item { id: root required property Session session @@ -49,8 +49,6 @@ RowLayout { anchors.fill: parent - spacing: 0 - Component.onCompleted: { // Update entries if (Config.bar.entries) { @@ -120,604 +118,492 @@ RowLayout { id: entriesModel } - Item { - id: leftTaskbarItem - Layout.preferredWidth: Math.floor(parent.width * 0.4) - Layout.minimumWidth: 420 - Layout.fillHeight: true - - ClippingRectangle { - id: leftTaskbarClippingRect - anchors.fill: parent - anchors.margins: Appearance.padding.normal - anchors.leftMargin: 0 - anchors.rightMargin: Appearance.padding.normal / 2 + ClippingRectangle { + id: taskbarClippingRect + anchors.fill: parent + anchors.margins: Appearance.padding.normal - radius: leftTaskbarBorder.innerRadius - color: "transparent" + radius: taskbarBorder.innerRadius + color: "transparent" - Loader { - id: leftTaskbarLoader + Loader { + id: taskbarLoader - anchors.fill: parent - anchors.margins: Appearance.padding.large + Appearance.padding.normal - anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + anchors.fill: parent + anchors.margins: Appearance.padding.large * 2 - asynchronous: true - sourceComponent: leftTaskbarContentComponent - } + asynchronous: true + sourceComponent: taskbarContentComponent } + } - InnerBorder { - id: leftTaskbarBorder - leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 - } + InnerBorder { + id: taskbarBorder + } - Component { - id: leftTaskbarContentComponent + Component { + id: taskbarContentComponent - StyledFlickable { - id: sidebarFlickable - flickableDirection: Flickable.VerticalFlick - contentHeight: sidebarLayout.height + StyledFlickable { + id: sidebarFlickable + flickableDirection: Flickable.VerticalFlick + contentHeight: sidebarLayout.height - StyledScrollBar.vertical: StyledScrollBar { - flickable: sidebarFlickable - } + StyledScrollBar.vertical: StyledScrollBar { + flickable: sidebarFlickable + } - ColumnLayout { - id: sidebarLayout - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top + ColumnLayout { + id: sidebarLayout + anchors.left: parent.left + anchors.right: parent.right + anchors.top: parent.top - spacing: Appearance.spacing.small + spacing: Appearance.spacing.small - readonly property bool allSectionsExpanded: - clockSection.expanded && - barBehaviorSection.expanded && - statusIconsSection.expanded && - traySettingsSection.expanded && - workspacesSection.expanded + readonly property bool allSectionsExpanded: + clockSection.expanded && + barBehaviorSection.expanded && + statusIconsSection.expanded && + traySettingsSection.expanded && + workspacesSection.expanded - RowLayout { - spacing: Appearance.spacing.smaller + RowLayout { + spacing: Appearance.spacing.smaller - StyledText { - text: qsTr("Settings") - font.pointSize: Appearance.font.size.large - font.weight: 500 - } + StyledText { + text: qsTr("Settings") + font.pointSize: Appearance.font.size.large + font.weight: 500 + } - Item { - Layout.fillWidth: true - } + Item { + Layout.fillWidth: true + } - IconButton { - icon: sidebarLayout.allSectionsExpanded ? "unfold_less" : "unfold_more" - type: IconButton.Text - label.animate: true - onClicked: { - const shouldExpand = !sidebarLayout.allSectionsExpanded; - clockSection.expanded = shouldExpand; - barBehaviorSection.expanded = shouldExpand; - statusIconsSection.expanded = shouldExpand; - traySettingsSection.expanded = shouldExpand; - workspacesSection.expanded = shouldExpand; - } + IconButton { + icon: sidebarLayout.allSectionsExpanded ? "unfold_less" : "unfold_more" + type: IconButton.Text + label.animate: true + onClicked: { + const shouldExpand = !sidebarLayout.allSectionsExpanded; + clockSection.expanded = shouldExpand; + barBehaviorSection.expanded = shouldExpand; + statusIconsSection.expanded = shouldExpand; + traySettingsSection.expanded = shouldExpand; + workspacesSection.expanded = shouldExpand; } } + } - CollapsibleSection { - id: clockSection - title: qsTr("Clock") + CollapsibleSection { + id: clockSection + title: qsTr("Clock") - SwitchRow { - label: qsTr("Show clock icon") - checked: root.clockShowIcon - onToggled: checked => { - root.clockShowIcon = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show clock icon") + checked: root.clockShowIcon + onToggled: checked => { + root.clockShowIcon = checked; + root.saveConfig(); + } } } - } - CollapsibleSection { - id: barBehaviorSection - title: qsTr("Bar Behavior") + CollapsibleSection { + id: barBehaviorSection + title: qsTr("Bar Behavior") - SwitchRow { - label: qsTr("Persistent") - checked: root.persistent - onToggled: checked => { - root.persistent = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Persistent") + checked: root.persistent + onToggled: checked => { + root.persistent = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show on hover") - checked: root.showOnHover - onToggled: checked => { - root.showOnHover = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show on hover") + checked: root.showOnHover + onToggled: checked => { + root.showOnHover = checked; + root.saveConfig(); + } } - } - SectionContainer { - contentSpacing: Appearance.spacing.normal + SectionContainer { + contentSpacing: Appearance.spacing.normal - ColumnLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { + ColumnLayout { Layout.fillWidth: true - spacing: Appearance.spacing.normal + spacing: Appearance.spacing.small - StyledText { - text: qsTr("Drag threshold") - font.pointSize: Appearance.font.size.normal - } - - Item { + RowLayout { Layout.fillWidth: true - } + spacing: Appearance.spacing.normal - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 - color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: dragThresholdInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: dragThresholdInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton + StyledText { + text: qsTr("Drag threshold") + font.pointSize: Appearance.font.size.normal } - StyledTextField { - id: dragThresholdInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 100 } - - Component.onCompleted: { - text = root.dragThreshold.toString(); + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 + color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: dragThresholdInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: dragThresholdInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 100) { - root.dragThreshold = val; - root.saveConfig(); + + StyledTextField { + id: dragThresholdInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + + Component.onCompleted: { + text = root.dragThreshold.toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + root.dragThreshold = val; + root.saveConfig(); + } } } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 100) { - text = root.dragThreshold.toString(); + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = root.dragThreshold.toString(); + } } } } - } - StyledText { - text: "px" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal + StyledText { + text: "px" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } } - } - StyledSlider { - id: dragThresholdSlider + StyledSlider { + id: dragThresholdSlider - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 100 - value: root.dragThreshold - onMoved: { - root.dragThreshold = Math.round(dragThresholdSlider.value); - if (!dragThresholdInput.activeFocus) { - dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0 + to: 100 + value: root.dragThreshold + onMoved: { + root.dragThreshold = Math.round(dragThresholdSlider.value); + if (!dragThresholdInput.activeFocus) { + dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); + } + root.saveConfig(); } - root.saveConfig(); } } } } - } - CollapsibleSection { - id: statusIconsSection - title: qsTr("Status Icons") + CollapsibleSection { + id: statusIconsSection + title: qsTr("Status Icons") - SwitchRow { - label: qsTr("Show audio") - checked: root.showAudio - onToggled: checked => { - root.showAudio = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show audio") + checked: root.showAudio + onToggled: checked => { + root.showAudio = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show microphone") - checked: root.showMicrophone - onToggled: checked => { - root.showMicrophone = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show microphone") + checked: root.showMicrophone + onToggled: checked => { + root.showMicrophone = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show keyboard layout") - checked: root.showKbLayout - onToggled: checked => { - root.showKbLayout = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show keyboard layout") + checked: root.showKbLayout + onToggled: checked => { + root.showKbLayout = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show network") - checked: root.showNetwork - onToggled: checked => { - root.showNetwork = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show network") + checked: root.showNetwork + onToggled: checked => { + root.showNetwork = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show bluetooth") - checked: root.showBluetooth - onToggled: checked => { - root.showBluetooth = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show bluetooth") + checked: root.showBluetooth + onToggled: checked => { + root.showBluetooth = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show battery") - checked: root.showBattery - onToggled: checked => { - root.showBattery = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show battery") + checked: root.showBattery + onToggled: checked => { + root.showBattery = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Show lock status") - checked: root.showLockStatus - onToggled: checked => { - root.showLockStatus = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Show lock status") + checked: root.showLockStatus + onToggled: checked => { + root.showLockStatus = checked; + root.saveConfig(); + } } } - } - CollapsibleSection { - id: traySettingsSection - title: qsTr("Tray Settings") + CollapsibleSection { + id: traySettingsSection + title: qsTr("Tray Settings") - SwitchRow { - label: qsTr("Background") - checked: root.trayBackground - onToggled: checked => { - root.trayBackground = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Background") + checked: root.trayBackground + onToggled: checked => { + root.trayBackground = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Compact") - checked: root.trayCompact - onToggled: checked => { - root.trayCompact = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Compact") + checked: root.trayCompact + onToggled: checked => { + root.trayCompact = checked; + root.saveConfig(); + } } - } - SwitchRow { - label: qsTr("Recolour") - checked: root.trayRecolour - onToggled: checked => { - root.trayRecolour = checked; - root.saveConfig(); + SwitchRow { + label: qsTr("Recolour") + checked: root.trayRecolour + onToggled: checked => { + root.trayRecolour = checked; + root.saveConfig(); + } } } - } - CollapsibleSection { - id: workspacesSection - title: qsTr("Workspaces") + CollapsibleSection { + id: workspacesSection + title: qsTr("Workspaces") - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesShownRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesShownRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Shown") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Shown") + } - CustomSpinBox { - min: 1 - max: 20 - value: root.workspacesShown - onValueModified: value => { - root.workspacesShown = value; - root.saveConfig(); + CustomSpinBox { + min: 1 + max: 20 + value: root.workspacesShown + onValueModified: value => { + root.workspacesShown = value; + root.saveConfig(); + } } } } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesActiveIndicatorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesActiveIndicatorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Active indicator") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Active indicator") + } - StyledSwitch { - checked: root.workspacesActiveIndicator - onToggled: { - root.workspacesActiveIndicator = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesActiveIndicator + onToggled: { + root.workspacesActiveIndicator = checked; + root.saveConfig(); + } } } } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesOccupiedBgRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesOccupiedBgRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Occupied background") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Occupied background") + } - StyledSwitch { - checked: root.workspacesOccupiedBg - onToggled: { - root.workspacesOccupiedBg = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesOccupiedBg + onToggled: { + root.workspacesOccupiedBg = checked; + root.saveConfig(); + } } } } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesShowWindowsRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesShowWindowsRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Show windows") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Show windows") + } - StyledSwitch { - checked: root.workspacesShowWindows - onToggled: { - root.workspacesShowWindows = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesShowWindows + onToggled: { + root.workspacesShowWindows = checked; + root.saveConfig(); + } } } } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesPerMonitorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesPerMonitorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Per monitor workspaces") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Per monitor workspaces") + } - StyledSwitch { - checked: root.workspacesPerMonitor - onToggled: { - root.workspacesPerMonitor = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesPerMonitor + onToggled: { + root.workspacesPerMonitor = checked; + root.saveConfig(); + } } } } } } } - } - } - } - - Item { - id: rightTaskbarItem - Layout.fillWidth: true - Layout.fillHeight: true - - ClippingRectangle { - id: rightTaskbarClippingRect - anchors.fill: parent - anchors.margins: Appearance.padding.normal - anchors.leftMargin: 0 - anchors.rightMargin: Appearance.padding.normal / 2 - - radius: rightTaskbarBorder.innerRadius - color: "transparent" - - Loader { - id: rightTaskbarLoader - - anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 - - asynchronous: true - sourceComponent: rightTaskbarContentComponent - } - } - - InnerBorder { - id: rightTaskbarBorder - - leftThickness: Appearance.padding.normal / 2 - } - - Component { - id: rightTaskbarContentComponent - - StyledFlickable { - flickableDirection: Flickable.VerticalFlick - contentHeight: contentLayout.height - - StyledScrollBar.vertical: StyledScrollBar { - flickable: parent - } - - ColumnLayout { - id: contentLayout - - anchors.left: parent.left - anchors.right: parent.right - anchors.top: parent.top - - spacing: Appearance.spacing.normal - - MaterialIcon { - Layout.alignment: Qt.AlignHCenter - text: "task_alt" - font.pointSize: Appearance.font.size.extraLarge * 3 - font.bold: true - } - - StyledText { - Layout.alignment: Qt.AlignHCenter - text: qsTr("Taskbar Settings") - font.pointSize: Appearance.font.size.large - font.bold: true - } - - StyledText { - Layout.topMargin: Appearance.spacing.large - Layout.alignment: Qt.AlignHCenter - text: qsTr("Clock") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledText { - Layout.alignment: Qt.AlignHCenter - text: root.clockShowIcon ? qsTr("Clock icon enabled") : qsTr("Clock icon disabled") - color: Colours.palette.m3outline - } - - StyledText { - Layout.topMargin: Appearance.spacing.large - Layout.alignment: Qt.AlignHCenter - text: qsTr("Taskbar Entries") - font.pointSize: Appearance.font.size.larger - font.weight: 500 - } - - StyledText { - Layout.alignment: Qt.AlignHCenter - text: qsTr("Configure which entries appear in the taskbar") - color: Colours.palette.m3outline - } - - } - } - } } } -- cgit v1.2.3-freya From 3f3f3a7d788ac555a94446731749e7b3aa9319c6 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 10:23:32 -0500 Subject: controlcenter: connected button group component --- .../controlcenter/taskbar/ConnectedButtonGroup.qml | 141 +++++++++++++++++++++ modules/controlcenter/taskbar/TaskbarPane.qml | 122 +++++++++--------- 2 files changed, 202 insertions(+), 61 deletions(-) create mode 100644 modules/controlcenter/taskbar/ConnectedButtonGroup.qml (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml new file mode 100644 index 0000000..7999b70 --- /dev/null +++ b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml @@ -0,0 +1,141 @@ +import ".." +import qs.components +import qs.components.controls +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +StyledRect { + id: root + + property var options: [] // Array of {label: string, propertyName: string, onToggled: function} + property var rootItem: null // The root item that contains the properties we want to bind to + + Layout.fillWidth: true + implicitHeight: buttonRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) + clip: true + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: buttonRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.small + + Repeater { + id: repeater + model: root.options + + delegate: TextButton { + id: button + required property int index + required property var modelData + + Layout.fillWidth: true + text: modelData.label + + property bool isChecked: false + + // Initialize from root property + Component.onCompleted: { + if (root.rootItem && modelData.propertyName) { + isChecked = root.rootItem[modelData.propertyName]; + } + } + + checked: isChecked + toggle: false + type: TextButton.Tonal + + // Listen for property changes on rootItem + Connections { + target: root.rootItem + enabled: root.rootItem !== null && modelData.propertyName !== undefined + + function onShowAudioChanged() { + if (modelData.propertyName === "showAudio") { + button.isChecked = root.rootItem.showAudio; + } + } + + function onShowMicrophoneChanged() { + if (modelData.propertyName === "showMicrophone") { + button.isChecked = root.rootItem.showMicrophone; + } + } + + function onShowKbLayoutChanged() { + if (modelData.propertyName === "showKbLayout") { + button.isChecked = root.rootItem.showKbLayout; + } + } + + function onShowNetworkChanged() { + if (modelData.propertyName === "showNetwork") { + button.isChecked = root.rootItem.showNetwork; + } + } + + function onShowBluetoothChanged() { + if (modelData.propertyName === "showBluetooth") { + button.isChecked = root.rootItem.showBluetooth; + } + } + + function onShowBatteryChanged() { + if (modelData.propertyName === "showBattery") { + button.isChecked = root.rootItem.showBattery; + } + } + + function onShowLockStatusChanged() { + if (modelData.propertyName === "showLockStatus") { + button.isChecked = root.rootItem.showLockStatus; + } + } + } + + + // Match utilities Toggles radius styling + // Each button has full rounding (not connected) since they have spacing + radius: stateLayer.pressed ? Appearance.rounding.small / 2 : internalChecked ? Appearance.rounding.small : Appearance.rounding.normal + + // Match utilities Toggles inactive color + inactiveColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) + + // Adjust width similar to utilities toggles + Layout.preferredWidth: implicitWidth + (stateLayer.pressed ? Appearance.padding.large : internalChecked ? Appearance.padding.smaller : 0) + + onClicked: { + if (modelData.onToggled) { + modelData.onToggled(!checked); + } + } + + Behavior on Layout.preferredWidth { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } + } + + Behavior on radius { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } + } + } + } + } +} + diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 1ad35b6..d7cc664 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -336,67 +336,67 @@ Item { id: statusIconsSection title: qsTr("Status Icons") - SwitchRow { - label: qsTr("Show audio") - checked: root.showAudio - onToggled: checked => { - root.showAudio = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show microphone") - checked: root.showMicrophone - onToggled: checked => { - root.showMicrophone = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show keyboard layout") - checked: root.showKbLayout - onToggled: checked => { - root.showKbLayout = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show network") - checked: root.showNetwork - onToggled: checked => { - root.showNetwork = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show bluetooth") - checked: root.showBluetooth - onToggled: checked => { - root.showBluetooth = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show battery") - checked: root.showBattery - onToggled: checked => { - root.showBattery = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Show lock status") - checked: root.showLockStatus - onToggled: checked => { - root.showLockStatus = checked; - root.saveConfig(); - } + ConnectedButtonGroup { + rootItem: root + + options: [ + { + label: qsTr("Audio"), + propertyName: "showAudio", + onToggled: function(checked) { + root.showAudio = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Mic"), + propertyName: "showMicrophone", + onToggled: function(checked) { + root.showMicrophone = checked; + root.saveConfig(); + } + }, + { + label: qsTr("KB"), + propertyName: "showKbLayout", + onToggled: function(checked) { + root.showKbLayout = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Network"), + propertyName: "showNetwork", + onToggled: function(checked) { + root.showNetwork = checked; + root.saveConfig(); + } + }, + { + label: qsTr("BT"), + propertyName: "showBluetooth", + onToggled: function(checked) { + root.showBluetooth = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Battery"), + propertyName: "showBattery", + onToggled: function(checked) { + root.showBattery = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Lock"), + propertyName: "showLockStatus", + onToggled: function(checked) { + root.showLockStatus = checked; + root.saveConfig(); + } + } + ] } } -- cgit v1.2.3-freya From 388cb0e373b1615b6d90028d74094c222fa48460 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 10:36:17 -0500 Subject: controlcenter: refined connected button groups --- .../controlcenter/taskbar/ConnectedButtonGroup.qml | 185 +++++++++++---------- modules/controlcenter/taskbar/TaskbarPane.qml | 134 +++++++-------- 2 files changed, 162 insertions(+), 157 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml index 7999b70..83ff95e 100644 --- a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml +++ b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml @@ -12,9 +12,10 @@ StyledRect { property var options: [] // Array of {label: string, propertyName: string, onToggled: function} property var rootItem: null // The root item that contains the properties we want to bind to + property string title: "" // Optional title text Layout.fillWidth: true - implicitHeight: buttonRow.implicitHeight + Appearance.padding.large * 2 + implicitHeight: layout.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal color: Colours.layer(Colours.palette.m3surfaceContainer, 2) clip: true @@ -23,115 +24,125 @@ StyledRect { Anim {} } - RowLayout { - id: buttonRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter + ColumnLayout { + id: layout + + anchors.fill: parent anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.small - - Repeater { - id: repeater - model: root.options - - delegate: TextButton { - id: button - required property int index - required property var modelData - - Layout.fillWidth: true - text: modelData.label - - property bool isChecked: false - - // Initialize from root property - Component.onCompleted: { - if (root.rootItem && modelData.propertyName) { - isChecked = root.rootItem[modelData.propertyName]; - } - } - - checked: isChecked - toggle: false - type: TextButton.Tonal - - // Listen for property changes on rootItem - Connections { - target: root.rootItem - enabled: root.rootItem !== null && modelData.propertyName !== undefined - - function onShowAudioChanged() { - if (modelData.propertyName === "showAudio") { - button.isChecked = root.rootItem.showAudio; + spacing: Appearance.spacing.normal + + StyledText { + visible: root.title !== "" + text: root.title + font.pointSize: Appearance.font.size.normal + } + + RowLayout { + id: buttonRow + Layout.alignment: Qt.AlignHCenter + spacing: Appearance.spacing.small + + Repeater { + id: repeater + model: root.options + + delegate: TextButton { + id: button + required property int index + required property var modelData + + Layout.fillWidth: true + text: modelData.label + + property bool isChecked: false + + // Initialize from root property + Component.onCompleted: { + if (root.rootItem && modelData.propertyName) { + isChecked = root.rootItem[modelData.propertyName]; } } + + checked: isChecked + toggle: false + type: TextButton.Tonal + + // Listen for property changes on rootItem + Connections { + target: root.rootItem + enabled: root.rootItem !== null && modelData.propertyName !== undefined + + function onShowAudioChanged() { + if (modelData.propertyName === "showAudio") { + button.isChecked = root.rootItem.showAudio; + } + } - function onShowMicrophoneChanged() { - if (modelData.propertyName === "showMicrophone") { - button.isChecked = root.rootItem.showMicrophone; + function onShowMicrophoneChanged() { + if (modelData.propertyName === "showMicrophone") { + button.isChecked = root.rootItem.showMicrophone; + } } - } - function onShowKbLayoutChanged() { - if (modelData.propertyName === "showKbLayout") { - button.isChecked = root.rootItem.showKbLayout; + function onShowKbLayoutChanged() { + if (modelData.propertyName === "showKbLayout") { + button.isChecked = root.rootItem.showKbLayout; + } } - } - function onShowNetworkChanged() { - if (modelData.propertyName === "showNetwork") { - button.isChecked = root.rootItem.showNetwork; + function onShowNetworkChanged() { + if (modelData.propertyName === "showNetwork") { + button.isChecked = root.rootItem.showNetwork; + } } - } - function onShowBluetoothChanged() { - if (modelData.propertyName === "showBluetooth") { - button.isChecked = root.rootItem.showBluetooth; + function onShowBluetoothChanged() { + if (modelData.propertyName === "showBluetooth") { + button.isChecked = root.rootItem.showBluetooth; + } } - } - function onShowBatteryChanged() { - if (modelData.propertyName === "showBattery") { - button.isChecked = root.rootItem.showBattery; + function onShowBatteryChanged() { + if (modelData.propertyName === "showBattery") { + button.isChecked = root.rootItem.showBattery; + } } - } - function onShowLockStatusChanged() { - if (modelData.propertyName === "showLockStatus") { - button.isChecked = root.rootItem.showLockStatus; + function onShowLockStatusChanged() { + if (modelData.propertyName === "showLockStatus") { + button.isChecked = root.rootItem.showLockStatus; + } } } - } + // Match utilities Toggles radius styling + // Each button has full rounding (not connected) since they have spacing + radius: stateLayer.pressed ? Appearance.rounding.small / 2 : internalChecked ? Appearance.rounding.small : Appearance.rounding.normal - // Match utilities Toggles radius styling - // Each button has full rounding (not connected) since they have spacing - radius: stateLayer.pressed ? Appearance.rounding.small / 2 : internalChecked ? Appearance.rounding.small : Appearance.rounding.normal + // Match utilities Toggles inactive color + inactiveColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) + + // Adjust width similar to utilities toggles + Layout.preferredWidth: implicitWidth + (stateLayer.pressed ? Appearance.padding.large : internalChecked ? Appearance.padding.smaller : 0) - // Match utilities Toggles inactive color - inactiveColour: Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) - - // Adjust width similar to utilities toggles - Layout.preferredWidth: implicitWidth + (stateLayer.pressed ? Appearance.padding.large : internalChecked ? Appearance.padding.smaller : 0) - - onClicked: { - if (modelData.onToggled) { - modelData.onToggled(!checked); + onClicked: { + if (modelData.onToggled) { + modelData.onToggled(!checked); + } } - } - Behavior on Layout.preferredWidth { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + Behavior on Layout.preferredWidth { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } } - } - Behavior on radius { - Anim { - duration: Appearance.anim.durations.expressiveFastSpatial - easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + Behavior on radius { + Anim { + duration: Appearance.anim.durations.expressiveFastSpatial + easing.bezierCurve: Appearance.anim.curves.expressiveFastSpatial + } } } } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index d7cc664..0ec27e5 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -164,7 +164,6 @@ Item { readonly property bool allSectionsExpanded: clockSection.expanded && barBehaviorSection.expanded && - statusIconsSection.expanded && traySettingsSection.expanded && workspacesSection.expanded @@ -189,13 +188,76 @@ Item { const shouldExpand = !sidebarLayout.allSectionsExpanded; clockSection.expanded = shouldExpand; barBehaviorSection.expanded = shouldExpand; - statusIconsSection.expanded = shouldExpand; traySettingsSection.expanded = shouldExpand; workspacesSection.expanded = shouldExpand; } } } + ConnectedButtonGroup { + rootItem: root + title: qsTr("Status Icons") + + options: [ + { + label: qsTr("Audio"), + propertyName: "showAudio", + onToggled: function(checked) { + root.showAudio = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Mic"), + propertyName: "showMicrophone", + onToggled: function(checked) { + root.showMicrophone = checked; + root.saveConfig(); + } + }, + { + label: qsTr("KB"), + propertyName: "showKbLayout", + onToggled: function(checked) { + root.showKbLayout = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Network"), + propertyName: "showNetwork", + onToggled: function(checked) { + root.showNetwork = checked; + root.saveConfig(); + } + }, + { + label: qsTr("BT"), + propertyName: "showBluetooth", + onToggled: function(checked) { + root.showBluetooth = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Battery"), + propertyName: "showBattery", + onToggled: function(checked) { + root.showBattery = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Lock"), + propertyName: "showLockStatus", + onToggled: function(checked) { + root.showLockStatus = checked; + root.saveConfig(); + } + } + ] + } + CollapsibleSection { id: clockSection title: qsTr("Clock") @@ -332,74 +394,6 @@ Item { } } - CollapsibleSection { - id: statusIconsSection - title: qsTr("Status Icons") - - ConnectedButtonGroup { - rootItem: root - - options: [ - { - label: qsTr("Audio"), - propertyName: "showAudio", - onToggled: function(checked) { - root.showAudio = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Mic"), - propertyName: "showMicrophone", - onToggled: function(checked) { - root.showMicrophone = checked; - root.saveConfig(); - } - }, - { - label: qsTr("KB"), - propertyName: "showKbLayout", - onToggled: function(checked) { - root.showKbLayout = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Network"), - propertyName: "showNetwork", - onToggled: function(checked) { - root.showNetwork = checked; - root.saveConfig(); - } - }, - { - label: qsTr("BT"), - propertyName: "showBluetooth", - onToggled: function(checked) { - root.showBluetooth = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Battery"), - propertyName: "showBattery", - onToggled: function(checked) { - root.showBattery = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Lock"), - propertyName: "showLockStatus", - onToggled: function(checked) { - root.showLockStatus = checked; - root.saveConfig(); - } - } - ] - } - } - CollapsibleSection { id: traySettingsSection title: qsTr("Tray Settings") -- cgit v1.2.3-freya From 1850a844eef715147fa747209fe4d5d1e7cbd7a5 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 10:43:20 -0500 Subject: controlcenter: relabled buttons in connected group --- modules/controlcenter/taskbar/TaskbarPane.qml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 0ec27e5..915e611 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -208,7 +208,7 @@ Item { } }, { - label: qsTr("Mic"), + label: qsTr("Microphone"), propertyName: "showMicrophone", onToggled: function(checked) { root.showMicrophone = checked; @@ -216,7 +216,7 @@ Item { } }, { - label: qsTr("KB"), + label: qsTr("Keyboard"), propertyName: "showKbLayout", onToggled: function(checked) { root.showKbLayout = checked; @@ -232,7 +232,7 @@ Item { } }, { - label: qsTr("BT"), + label: qsTr("Bluetooth"), propertyName: "showBluetooth", onToggled: function(checked) { root.showBluetooth = checked; @@ -248,7 +248,7 @@ Item { } }, { - label: qsTr("Lock"), + label: qsTr("Capslock"), propertyName: "showLockStatus", onToggled: function(checked) { root.showLockStatus = checked; -- cgit v1.2.3-freya From 821ee4389ab2a81c5abba910936662d22e5f0480 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 12:21:44 -0500 Subject: controlcenter: taskbar panel layout reorg --- components/SectionContainer.qml | 4 +- .../controlcenter/taskbar/ConnectedButtonGroup.qml | 18 + modules/controlcenter/taskbar/TaskbarPane.qml | 578 +++++++++++---------- 3 files changed, 328 insertions(+), 272 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/components/SectionContainer.qml b/components/SectionContainer.qml index f7dfef4..60e3d59 100644 --- a/components/SectionContainer.qml +++ b/components/SectionContainer.qml @@ -10,6 +10,7 @@ StyledRect { default property alias content: contentColumn.data property real contentSpacing: Appearance.spacing.larger + property bool alignTop: false Layout.fillWidth: true implicitHeight: contentColumn.implicitHeight + Appearance.padding.large * 2 @@ -22,7 +23,8 @@ StyledRect { anchors.left: parent.left anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter + anchors.top: root.alignTop ? parent.top : undefined + anchors.verticalCenter: root.alignTop ? undefined : parent.verticalCenter anchors.margins: Appearance.padding.large spacing: root.contentSpacing diff --git a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml index 83ff95e..e35ccfc 100644 --- a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml +++ b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml @@ -113,6 +113,24 @@ StyledRect { button.isChecked = root.rootItem.showLockStatus; } } + + function onTrayBackgroundChanged() { + if (modelData.propertyName === "trayBackground") { + button.isChecked = root.rootItem.trayBackground; + } + } + + function onTrayCompactChanged() { + if (modelData.propertyName === "trayCompact") { + button.isChecked = root.rootItem.trayCompact; + } + } + + function onTrayRecolourChanged() { + if (modelData.propertyName === "trayRecolour") { + button.isChecked = root.rootItem.trayRecolour; + } + } } // Match utilities Toggles radius styling diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 915e611..3f14dd6 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -161,11 +161,7 @@ Item { spacing: Appearance.spacing.small - readonly property bool allSectionsExpanded: - clockSection.expanded && - barBehaviorSection.expanded && - traySettingsSection.expanded && - workspacesSection.expanded + readonly property bool allSectionsExpanded: true RowLayout { spacing: Appearance.spacing.smaller @@ -185,11 +181,7 @@ Item { type: IconButton.Text label.animate: true onClicked: { - const shouldExpand = !sidebarLayout.allSectionsExpanded; - clockSection.expanded = shouldExpand; - barBehaviorSection.expanded = shouldExpand; - traySettingsSection.expanded = shouldExpand; - workspacesSection.expanded = shouldExpand; + // No collapsible sections remaining } } } @@ -258,345 +250,389 @@ Item { ] } - CollapsibleSection { - id: clockSection - title: qsTr("Clock") - - SwitchRow { - label: qsTr("Show clock icon") - checked: root.clockShowIcon - onToggled: checked => { - root.clockShowIcon = checked; - root.saveConfig(); - } - } - } - - CollapsibleSection { - id: barBehaviorSection - title: qsTr("Bar Behavior") + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small - SwitchRow { - label: qsTr("Persistent") - checked: root.persistent - onToggled: checked => { - root.persistent = checked; - root.saveConfig(); - } - } + ColumnLayout { + Layout.fillWidth: true + Layout.alignment: Qt.AlignTop + spacing: 0 - SwitchRow { - label: qsTr("Show on hover") - checked: root.showOnHover - onToggled: checked => { - root.showOnHover = checked; - root.saveConfig(); - } - } + SectionContainer { + Layout.fillWidth: true + alignTop: true - SectionContainer { - contentSpacing: Appearance.spacing.normal + StyledText { + text: qsTr("Workspaces") + font.pointSize: Appearance.font.size.normal + } - ColumnLayout { + StyledRect { Layout.fillWidth: true - spacing: Appearance.spacing.small + implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) + + Behavior on implicitHeight { + Anim {} + } RowLayout { - Layout.fillWidth: true + id: workspacesShownRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large spacing: Appearance.spacing.normal StyledText { - text: qsTr("Drag threshold") - font.pointSize: Appearance.font.size.normal - } - - Item { Layout.fillWidth: true + text: qsTr("Shown") } - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 - color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: dragThresholdInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: dragThresholdInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: dragThresholdInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 100 } - - Component.onCompleted: { - text = root.dragThreshold.toString(); - } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 100) { - root.dragThreshold = val; - root.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 100) { - text = root.dragThreshold.toString(); - } - } + CustomSpinBox { + min: 1 + max: 20 + value: root.workspacesShown + onValueModified: value => { + root.workspacesShown = value; + root.saveConfig(); } } + } + } - StyledText { - text: "px" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) + + Behavior on implicitHeight { + Anim {} } - StyledSlider { - id: dragThresholdSlider + RowLayout { + id: workspacesActiveIndicatorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 + StyledText { + Layout.fillWidth: true + text: qsTr("Active indicator") + } - from: 0 - to: 100 - value: root.dragThreshold - onMoved: { - root.dragThreshold = Math.round(dragThresholdSlider.value); - if (!dragThresholdInput.activeFocus) { - dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); + StyledSwitch { + checked: root.workspacesActiveIndicator + onToggled: { + root.workspacesActiveIndicator = checked; + root.saveConfig(); } - root.saveConfig(); } } } - } - } - CollapsibleSection { - id: traySettingsSection - title: qsTr("Tray Settings") - - SwitchRow { - label: qsTr("Background") - checked: root.trayBackground - onToggled: checked => { - root.trayBackground = checked; - root.saveConfig(); - } - } - - SwitchRow { - label: qsTr("Compact") - checked: root.trayCompact - onToggled: checked => { - root.trayCompact = checked; - root.saveConfig(); - } - } + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) - SwitchRow { - label: qsTr("Recolour") - checked: root.trayRecolour - onToggled: checked => { - root.trayRecolour = checked; - root.saveConfig(); - } - } - } + Behavior on implicitHeight { + Anim {} + } - CollapsibleSection { - id: workspacesSection - title: qsTr("Workspaces") + RowLayout { + id: workspacesOccupiedBgRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledText { + Layout.fillWidth: true + text: qsTr("Occupied background") + } - Behavior on implicitHeight { - Anim {} + StyledSwitch { + checked: root.workspacesOccupiedBg + onToggled: { + root.workspacesOccupiedBg = checked; + root.saveConfig(); + } + } + } } - RowLayout { - id: workspacesShownRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) - StyledText { - Layout.fillWidth: true - text: qsTr("Shown") + Behavior on implicitHeight { + Anim {} } - CustomSpinBox { - min: 1 - max: 20 - value: root.workspacesShown - onValueModified: value => { - root.workspacesShown = value; - root.saveConfig(); + RowLayout { + id: workspacesShowWindowsRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: qsTr("Show windows") + } + + StyledSwitch { + checked: root.workspacesShowWindows + onToggled: { + root.workspacesShowWindows = checked; + root.saveConfig(); + } } } } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + StyledRect { + Layout.fillWidth: true + implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) - Behavior on implicitHeight { - Anim {} - } + Behavior on implicitHeight { + Anim {} + } - RowLayout { - id: workspacesActiveIndicatorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + RowLayout { + id: workspacesPerMonitorRow + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal - StyledText { - Layout.fillWidth: true - text: qsTr("Active indicator") - } + StyledText { + Layout.fillWidth: true + text: qsTr("Per monitor workspaces") + } - StyledSwitch { - checked: root.workspacesActiveIndicator - onToggled: { - root.workspacesActiveIndicator = checked; - root.saveConfig(); + StyledSwitch { + checked: root.workspacesPerMonitor + onToggled: { + root.workspacesPerMonitor = checked; + root.saveConfig(); + } } } } + } } - StyledRect { + ColumnLayout { Layout.fillWidth: true - implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } + Layout.alignment: Qt.AlignTop + spacing: Appearance.spacing.small - RowLayout { - id: workspacesOccupiedBgRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + SectionContainer { + Layout.fillWidth: true + alignTop: true StyledText { - Layout.fillWidth: true - text: qsTr("Occupied background") + text: qsTr("Clock") + font.pointSize: Appearance.font.size.normal } - StyledSwitch { - checked: root.workspacesOccupiedBg - onToggled: { - root.workspacesOccupiedBg = checked; + SwitchRow { + label: qsTr("Show clock icon") + checked: root.clockShowIcon + onToggled: checked => { + root.clockShowIcon = checked; root.saveConfig(); } } } + + SectionContainer { + Layout.fillWidth: true + alignTop: true + + ConnectedButtonGroup { + rootItem: root + title: qsTr("Tray Settings") + + options: [ + { + label: qsTr("Background"), + propertyName: "trayBackground", + onToggled: function(checked) { + root.trayBackground = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Compact"), + propertyName: "trayCompact", + onToggled: function(checked) { + root.trayCompact = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Recolour"), + propertyName: "trayRecolour", + onToggled: function(checked) { + root.trayRecolour = checked; + root.saveConfig(); + } + } + ] + } + } } - StyledRect { + ColumnLayout { Layout.fillWidth: true - implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } + Layout.alignment: Qt.AlignTop + spacing: 0 - RowLayout { - id: workspacesShowWindowsRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + SectionContainer { + Layout.fillWidth: true + alignTop: true StyledText { - Layout.fillWidth: true - text: qsTr("Show windows") + text: qsTr("Bar Behavior") + font.pointSize: Appearance.font.size.normal } - StyledSwitch { - checked: root.workspacesShowWindows - onToggled: { - root.workspacesShowWindows = checked; + SwitchRow { + label: qsTr("Persistent") + checked: root.persistent + onToggled: checked => { + root.persistent = checked; root.saveConfig(); } } - } - } - StyledRect { - Layout.fillWidth: true - implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + SwitchRow { + label: qsTr("Show on hover") + checked: root.showOnHover + onToggled: checked => { + root.showOnHover = checked; + root.saveConfig(); + } + } - Behavior on implicitHeight { - Anim {} - } + SectionContainer { + contentSpacing: Appearance.spacing.normal - RowLayout { - id: workspacesPerMonitorRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal + ColumnLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.small - StyledText { - Layout.fillWidth: true - text: qsTr("Per monitor workspaces") - } + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal - StyledSwitch { - checked: root.workspacesPerMonitor - onToggled: { - root.workspacesPerMonitor = checked; - root.saveConfig(); + StyledText { + text: qsTr("Drag threshold") + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 + color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: dragThresholdInput.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: dragThresholdInputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: dragThresholdInput + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: IntValidator { bottom: 0; top: 100 } + + Component.onCompleted: { + text = root.dragThreshold.toString(); + } + + onTextChanged: { + if (activeFocus) { + const val = parseInt(text); + if (!isNaN(val) && val >= 0 && val <= 100) { + root.dragThreshold = val; + root.saveConfig(); + } + } + } + onEditingFinished: { + const val = parseInt(text); + if (isNaN(val) || val < 0 || val > 100) { + text = root.dragThreshold.toString(); + } + } + } + } + + StyledText { + text: "px" + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: dragThresholdSlider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: 0 + to: 100 + value: root.dragThreshold + onMoved: { + root.dragThreshold = Math.round(dragThresholdSlider.value); + if (!dragThresholdInput.activeFocus) { + dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); + } + root.saveConfig(); + } + } } } } } } + } } } -- cgit v1.2.3-freya From 7a0a9d66812416cc29501b6adea5b3c53d534d17 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 13:16:38 -0500 Subject: controlcenter: correcting padding/margins on containers --- modules/controlcenter/taskbar/TaskbarPane.qml | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 3f14dd6..5112b4a 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -122,6 +122,8 @@ Item { id: taskbarClippingRect anchors.fill: parent anchors.margins: Appearance.padding.normal + anchors.leftMargin: 0 + anchors.rightMargin: Appearance.padding.normal / 2 radius: taskbarBorder.innerRadius color: "transparent" @@ -130,7 +132,9 @@ Item { id: taskbarLoader anchors.fill: parent - anchors.margins: Appearance.padding.large * 2 + anchors.margins: Appearance.padding.large + Appearance.padding.normal + anchors.leftMargin: Appearance.padding.large + anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 asynchronous: true sourceComponent: taskbarContentComponent -- cgit v1.2.3-freya From b1cc6418499c6a1af9906043c0b60610bb7b2174 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 13:34:29 -0500 Subject: controlcenter: correcting padding/margins on containers --- modules/controlcenter/appearance/AppearancePane.qml | 1 + modules/controlcenter/launcher/LauncherPane.qml | 2 +- modules/controlcenter/taskbar/TaskbarPane.qml | 2 ++ 3 files changed, 4 insertions(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index b4e93ae..71b4061 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -80,6 +80,7 @@ RowLayout { } Item { + id: leftAppearanceItem Layout.preferredWidth: Math.floor(parent.width * 0.4) Layout.minimumWidth: 420 Layout.fillHeight: true diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 71d1d6f..bf4e85f 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -169,7 +169,6 @@ RowLayout { anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 - anchors.bottomMargin: 0 asynchronous: true sourceComponent: leftContentComponent @@ -186,6 +185,7 @@ RowLayout { id: leftContentComponent ColumnLayout { + id: leftLauncherLayout anchors.fill: parent spacing: Appearance.spacing.small diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 5112b4a..c944154 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -143,6 +143,8 @@ Item { InnerBorder { id: taskbarBorder + leftThickness: 0 + rightThickness: Appearance.padding.normal / 2 } Component { -- cgit v1.2.3-freya From 80b3255e2e22374e91f63a3bce0b38bb4ec80159 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 13:37:47 -0500 Subject: controlcenter: corrected tray settings heading --- modules/controlcenter/taskbar/TaskbarPane.qml | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index c944154..627caeb 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -471,9 +471,13 @@ Item { Layout.fillWidth: true alignTop: true + StyledText { + text: qsTr("Tray Settings") + font.pointSize: Appearance.font.size.normal + } + ConnectedButtonGroup { rootItem: root - title: qsTr("Tray Settings") options: [ { -- cgit v1.2.3-freya From e3f01909497bd3f056cd1f1a870e00a4e6a6898f Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 13:40:27 -0500 Subject: controlcenter: removed expand/collapse all on taskbar panel --- modules/controlcenter/taskbar/TaskbarPane.qml | 15 --------------- 1 file changed, 15 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 627caeb..b9749ff 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -167,8 +167,6 @@ Item { spacing: Appearance.spacing.small - readonly property bool allSectionsExpanded: true - RowLayout { spacing: Appearance.spacing.smaller @@ -177,19 +175,6 @@ Item { font.pointSize: Appearance.font.size.large font.weight: 500 } - - Item { - Layout.fillWidth: true - } - - IconButton { - icon: sidebarLayout.allSectionsExpanded ? "unfold_less" : "unfold_more" - type: IconButton.Text - label.animate: true - onClicked: { - // No collapsible sections remaining - } - } } ConnectedButtonGroup { -- cgit v1.2.3-freya From d92911b7e4715adba518cf560f50c81ee520fcca Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 14:24:32 -0500 Subject: controlcenter: changed button groups to match other elements --- modules/controlcenter/taskbar/TaskbarPane.qml | 131 ++++++++++++++------------ 1 file changed, 70 insertions(+), 61 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index b9749ff..3798adb 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -177,68 +177,77 @@ Item { } } - ConnectedButtonGroup { - rootItem: root - title: qsTr("Status Icons") - - options: [ - { - label: qsTr("Audio"), - propertyName: "showAudio", - onToggled: function(checked) { - root.showAudio = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Microphone"), - propertyName: "showMicrophone", - onToggled: function(checked) { - root.showMicrophone = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Keyboard"), - propertyName: "showKbLayout", - onToggled: function(checked) { - root.showKbLayout = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Network"), - propertyName: "showNetwork", - onToggled: function(checked) { - root.showNetwork = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Bluetooth"), - propertyName: "showBluetooth", - onToggled: function(checked) { - root.showBluetooth = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Battery"), - propertyName: "showBattery", - onToggled: function(checked) { - root.showBattery = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Capslock"), - propertyName: "showLockStatus", - onToggled: function(checked) { - root.showLockStatus = checked; - root.saveConfig(); + SectionContainer { + Layout.fillWidth: true + alignTop: true + + StyledText { + text: qsTr("Status Icons") + font.pointSize: Appearance.font.size.normal + } + + ConnectedButtonGroup { + rootItem: root + + options: [ + { + label: qsTr("Audio"), + propertyName: "showAudio", + onToggled: function(checked) { + root.showAudio = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Microphone"), + propertyName: "showMicrophone", + onToggled: function(checked) { + root.showMicrophone = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Keyboard"), + propertyName: "showKbLayout", + onToggled: function(checked) { + root.showKbLayout = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Network"), + propertyName: "showNetwork", + onToggled: function(checked) { + root.showNetwork = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Bluetooth"), + propertyName: "showBluetooth", + onToggled: function(checked) { + root.showBluetooth = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Battery"), + propertyName: "showBattery", + onToggled: function(checked) { + root.showBattery = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Capslock"), + propertyName: "showLockStatus", + onToggled: function(checked) { + root.showLockStatus = checked; + root.saveConfig(); + } } - } - ] + ] + } } RowLayout { -- cgit v1.2.3-freya From 58e657d891986598d1d4d5ea064e4130532c98ac Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 14:27:16 -0500 Subject: controlcenter: changed button label for audio to speakers --- modules/controlcenter/taskbar/TaskbarPane.qml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 3798adb..b798da8 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -191,7 +191,7 @@ Item { options: [ { - label: qsTr("Audio"), + label: qsTr("Speakers"), propertyName: "showAudio", onToggled: function(checked) { root.showAudio = checked; -- cgit v1.2.3-freya From 23e5d7d13ce0432e17a7e2077b12b44278f919b6 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 15:46:40 -0500 Subject: controlcenter: renamed panel titles from settings to panel name --- modules/controlcenter/appearance/AppearancePane.qml | 2 +- modules/controlcenter/audio/AudioPane.qml | 4 ++-- modules/controlcenter/bluetooth/DeviceList.qml | 2 +- modules/controlcenter/launcher/LauncherPane.qml | 2 +- modules/controlcenter/network/NetworkingPane.qml | 4 ++-- modules/controlcenter/taskbar/TaskbarPane.qml | 2 +- 6 files changed, 8 insertions(+), 8 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 177e7b9..891f64b 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -147,7 +147,7 @@ RowLayout { spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Appearance") font.pointSize: Appearance.font.size.large font.weight: 500 } diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 3440a2f..c2d60d8 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -74,13 +74,13 @@ RowLayout { anchors.right: parent.right spacing: Appearance.spacing.normal - // Settings header above the collapsible sections + // Audio header above the collapsible sections RowLayout { Layout.fillWidth: true spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Audio") font.pointSize: Appearance.font.size.large font.weight: 500 } diff --git a/modules/controlcenter/bluetooth/DeviceList.qml b/modules/controlcenter/bluetooth/DeviceList.qml index 8e79e72..06700e8 100644 --- a/modules/controlcenter/bluetooth/DeviceList.qml +++ b/modules/controlcenter/bluetooth/DeviceList.qml @@ -25,7 +25,7 @@ ColumnLayout { spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Bluetooth") font.pointSize: Appearance.font.size.large font.weight: 500 } diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index bf4e85f..300117a 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -194,7 +194,7 @@ RowLayout { spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Launcher") font.pointSize: Appearance.font.size.large font.weight: 500 } diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index a632c2b..52499d8 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -82,13 +82,13 @@ Item { anchors.right: parent.right spacing: Appearance.spacing.normal - // Settings header above the collapsible sections + // Network header above the collapsible sections RowLayout { Layout.fillWidth: true spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Network") font.pointSize: Appearance.font.size.large font.weight: 500 } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index b798da8..507a239 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -171,7 +171,7 @@ Item { spacing: Appearance.spacing.smaller StyledText { - text: qsTr("Settings") + text: qsTr("Taskbar") font.pointSize: Appearance.font.size.large font.weight: 500 } -- cgit v1.2.3-freya From 3f4d07bfc7d942e82b5fe7b0650c2e5a269554f0 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Mon, 17 Nov 2025 20:10:02 -0500 Subject: controlcenter: padding/margins on taskbar panel --- modules/controlcenter/taskbar/TaskbarPane.qml | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 507a239..18d5304 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -165,7 +165,7 @@ Item { anchors.right: parent.right anchors.top: parent.top - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal RowLayout { spacing: Appearance.spacing.smaller @@ -252,12 +252,12 @@ Item { RowLayout { Layout.fillWidth: true - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal ColumnLayout { Layout.fillWidth: true Layout.alignment: Qt.AlignTop - spacing: 0 + spacing: Appearance.spacing.small SectionContainer { Layout.fillWidth: true @@ -440,7 +440,7 @@ Item { ColumnLayout { Layout.fillWidth: true Layout.alignment: Qt.AlignTop - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal SectionContainer { Layout.fillWidth: true @@ -506,7 +506,7 @@ Item { ColumnLayout { Layout.fillWidth: true Layout.alignment: Qt.AlignTop - spacing: 0 + spacing: Appearance.spacing.small SectionContainer { Layout.fillWidth: true -- cgit v1.2.3-freya From 7ac403d93304f122b051ad3c9ef794941648d1f5 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Tue, 18 Nov 2025 12:10:41 -0500 Subject: controlcenter: added more missing options to taskbar panel --- .../controlcenter/taskbar/ConnectedButtonGroup.qml | 18 ++++ modules/controlcenter/taskbar/TaskbarPane.qml | 112 +++++++++++++++++++-- 2 files changed, 123 insertions(+), 7 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml index e35ccfc..af386c3 100644 --- a/modules/controlcenter/taskbar/ConnectedButtonGroup.qml +++ b/modules/controlcenter/taskbar/ConnectedButtonGroup.qml @@ -131,6 +131,24 @@ StyledRect { button.isChecked = root.rootItem.trayRecolour; } } + + function onScrollWorkspacesChanged() { + if (modelData.propertyName === "scrollWorkspaces") { + button.isChecked = root.rootItem.scrollWorkspaces; + } + } + + function onScrollVolumeChanged() { + if (modelData.propertyName === "scrollVolume") { + button.isChecked = root.rootItem.scrollVolume; + } + } + + function onScrollBrightnessChanged() { + if (modelData.propertyName === "scrollBrightness") { + button.isChecked = root.rootItem.scrollBrightness; + } + } } // Match utilities Toggles radius styling diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 18d5304..e84e5fe 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -47,6 +47,16 @@ Item { property bool workspacesShowWindows: Config.bar.workspaces.showWindows ?? false property bool workspacesPerMonitor: Config.bar.workspaces.perMonitorWorkspaces ?? true + // Scroll Actions + property bool scrollWorkspaces: Config.bar.scrollActions.workspaces ?? true + property bool scrollVolume: Config.bar.scrollActions.volume ?? true + property bool scrollBrightness: Config.bar.scrollActions.brightness ?? true + + // Popouts + property bool popoutActiveWindow: Config.bar.popouts.activeWindow ?? true + property bool popoutTray: Config.bar.popouts.tray ?? true + property bool popoutStatusIcons: Config.bar.popouts.statusIcons ?? true + anchors.fill: parent Component.onCompleted: { @@ -93,6 +103,16 @@ Item { Config.bar.workspaces.showWindows = root.workspacesShowWindows; Config.bar.workspaces.perMonitorWorkspaces = root.workspacesPerMonitor; + // Update scroll actions + Config.bar.scrollActions.workspaces = root.scrollWorkspaces; + Config.bar.scrollActions.volume = root.scrollVolume; + Config.bar.scrollActions.brightness = root.scrollBrightness; + + // Update popouts + Config.bar.popouts.activeWindow = root.popoutActiveWindow; + Config.bar.popouts.tray = root.popoutTray; + Config.bar.popouts.statusIcons = root.popoutStatusIcons; + // Update entries from the model (same approach as clock - use provided value if available) const entries = []; for (let i = 0; i < entriesModel.count; i++) { @@ -257,7 +277,7 @@ Item { ColumnLayout { Layout.fillWidth: true Layout.alignment: Qt.AlignTop - spacing: Appearance.spacing.small + spacing: Appearance.spacing.normal SectionContainer { Layout.fillWidth: true @@ -435,6 +455,47 @@ Item { } } } + + SectionContainer { + Layout.fillWidth: true + alignTop: true + + StyledText { + text: qsTr("Scroll Actions") + font.pointSize: Appearance.font.size.normal + } + + ConnectedButtonGroup { + rootItem: root + + options: [ + { + label: qsTr("Workspaces"), + propertyName: "scrollWorkspaces", + onToggled: function(checked) { + root.scrollWorkspaces = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Volume"), + propertyName: "scrollVolume", + onToggled: function(checked) { + root.scrollVolume = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Brightness"), + propertyName: "scrollBrightness", + onToggled: function(checked) { + root.scrollBrightness = checked; + root.saveConfig(); + } + } + ] + } + } } ColumnLayout { @@ -501,12 +562,6 @@ Item { ] } } - } - - ColumnLayout { - Layout.fillWidth: true - Layout.alignment: Qt.AlignTop - spacing: Appearance.spacing.small SectionContainer { Layout.fillWidth: true @@ -635,6 +690,49 @@ Item { } } } + + ColumnLayout { + Layout.fillWidth: true + Layout.alignment: Qt.AlignTop + spacing: Appearance.spacing.normal + + SectionContainer { + Layout.fillWidth: true + alignTop: true + + StyledText { + text: qsTr("Popouts") + font.pointSize: Appearance.font.size.normal + } + + SwitchRow { + label: qsTr("Active window") + checked: root.popoutActiveWindow + onToggled: checked => { + root.popoutActiveWindow = checked; + root.saveConfig(); + } + } + + SwitchRow { + label: qsTr("Tray") + checked: root.popoutTray + onToggled: checked => { + root.popoutTray = checked; + root.saveConfig(); + } + } + + SwitchRow { + label: qsTr("Status icons") + checked: root.popoutStatusIcons + onToggled: checked => { + root.popoutStatusIcons = checked; + root.saveConfig(); + } + } + } + } } } -- cgit v1.2.3-freya From dedff0bfe5cc6cc4f4081782daed8eb7963f1657 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Tue, 18 Nov 2025 12:21:31 -0500 Subject: controlcenter: minor moving around elements in taskbar panel --- modules/controlcenter/taskbar/TaskbarPane.qml | 82 +++++++++++++-------------- 1 file changed, 41 insertions(+), 41 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index e84e5fe..1c3adbc 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -522,47 +522,6 @@ Item { } } - SectionContainer { - Layout.fillWidth: true - alignTop: true - - StyledText { - text: qsTr("Tray Settings") - font.pointSize: Appearance.font.size.normal - } - - ConnectedButtonGroup { - rootItem: root - - options: [ - { - label: qsTr("Background"), - propertyName: "trayBackground", - onToggled: function(checked) { - root.trayBackground = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Compact"), - propertyName: "trayCompact", - onToggled: function(checked) { - root.trayCompact = checked; - root.saveConfig(); - } - }, - { - label: qsTr("Recolour"), - propertyName: "trayRecolour", - onToggled: function(checked) { - root.trayRecolour = checked; - root.saveConfig(); - } - } - ] - } - } - SectionContainer { Layout.fillWidth: true alignTop: true @@ -732,6 +691,47 @@ Item { } } } + + SectionContainer { + Layout.fillWidth: true + alignTop: true + + StyledText { + text: qsTr("Tray Settings") + font.pointSize: Appearance.font.size.normal + } + + ConnectedButtonGroup { + rootItem: root + + options: [ + { + label: qsTr("Background"), + propertyName: "trayBackground", + onToggled: function(checked) { + root.trayBackground = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Compact"), + propertyName: "trayCompact", + onToggled: function(checked) { + root.trayCompact = checked; + root.saveConfig(); + } + }, + { + label: qsTr("Recolour"), + propertyName: "trayRecolour", + onToggled: function(checked) { + root.trayRecolour = checked; + root.saveConfig(); + } + } + ] + } + } } } -- cgit v1.2.3-freya From 147410e39bf4e0474deca3980dcaa724464cf5c3 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Wed, 19 Nov 2025 21:15:40 -0500 Subject: cleanup: removed unnecessary comments --- modules/controlcenter/ControlCenter.qml | 1 - modules/controlcenter/Panes.qml | 18 ------------ modules/controlcenter/Session.qml | 1 - .../controlcenter/appearance/AppearancePane.qml | 28 ++----------------- modules/controlcenter/audio/AudioPane.qml | 1 - modules/controlcenter/bluetooth/Details.qml | 1 - modules/controlcenter/bluetooth/Settings.qml | 4 +-- modules/controlcenter/components/DeviceDetails.qml | 7 ----- modules/controlcenter/components/DeviceList.qml | 10 ++----- .../controlcenter/components/PaneTransition.qml | 12 -------- .../controlcenter/components/SplitPaneLayout.qml | 8 ------ .../components/SplitPaneWithDetails.qml | 2 -- modules/controlcenter/launcher/LauncherPane.qml | 27 ++---------------- modules/controlcenter/network/NetworkingPane.qml | 2 -- modules/controlcenter/network/WirelessDetails.qml | 9 ------ modules/controlcenter/network/WirelessList.qml | 3 -- .../network/WirelessPasswordDialog.qml | 27 ++---------------- modules/controlcenter/state/BluetoothState.qml | 5 ---- modules/controlcenter/state/EthernetState.qml | 1 - modules/controlcenter/state/LauncherState.qml | 1 - modules/controlcenter/state/NetworkState.qml | 3 -- modules/controlcenter/taskbar/TaskbarPane.qml | 32 ---------------------- 22 files changed, 9 insertions(+), 194 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/ControlCenter.qml b/modules/controlcenter/ControlCenter.qml index 3642a33..fdb824e 100644 --- a/modules/controlcenter/ControlCenter.qml +++ b/modules/controlcenter/ControlCenter.qml @@ -97,6 +97,5 @@ Item { } } - // Expose initialOpeningComplete for NavRail to prevent tab switching during opening animation readonly property bool initialOpeningComplete: panes.initialOpeningComplete } diff --git a/modules/controlcenter/Panes.qml b/modules/controlcenter/Panes.qml index b9256a9..833a411 100644 --- a/modules/controlcenter/Panes.qml +++ b/modules/controlcenter/Panes.qml @@ -19,7 +19,6 @@ ClippingRectangle { required property Session session - // Expose initialOpeningComplete so parent can check if opening animation is done readonly property bool initialOpeningComplete: layout.initialOpeningComplete color: "transparent" @@ -27,7 +26,6 @@ ClippingRectangle { focus: false activeFocusOnTab: false - // Clear focus when clicking anywhere in the panes area MouseArea { anchors.fill: parent z: -1 @@ -37,7 +35,6 @@ ClippingRectangle { } } - // Clear focus when switching panes Connections { target: root.session @@ -54,8 +51,6 @@ ClippingRectangle { clip: true property bool animationComplete: true - // Track if initial opening animation has completed - // During initial opening, only the active pane loads to avoid hiccups property bool initialOpeningComplete: false Timer { @@ -66,8 +61,6 @@ ClippingRectangle { } } - // Timer to detect when initial opening animation completes - // Uses large duration to cover both normal and detached opening cases Timer { id: initialOpeningTimer interval: Appearance.anim.durations.large @@ -94,7 +87,6 @@ ClippingRectangle { Connections { target: root.session function onActiveIndexChanged(): void { - // Mark animation as incomplete and start delay timer layout.animationComplete = false; animationDelayTimer.restart(); } @@ -110,28 +102,21 @@ ClippingRectangle { implicitWidth: root.width implicitHeight: root.height - // Track if this pane has ever been loaded to enable caching property bool hasBeenLoaded: false - // Function to compute if this pane should be active function updateActive(): void { const diff = Math.abs(root.session.activeIndex - pane.paneIndex); const isActivePane = diff === 0; let shouldBeActive = false; - // During initial opening animation, only load the active pane - // This prevents hiccups from multiple panes loading simultaneously if (!layout.initialOpeningComplete) { shouldBeActive = isActivePane; } else { - // After initial opening, allow current and adjacent panes for smooth transitions if (diff <= 1) { shouldBeActive = true; } else if (pane.hasBeenLoaded) { - // For distant panes that have been loaded before, keep them active to preserve cached data shouldBeActive = true; } else { - // For new distant panes, wait until animation completes to avoid heavy loading during transition shouldBeActive = layout.animationComplete; } } @@ -152,12 +137,10 @@ ClippingRectangle { } onActiveChanged: { - // Mark pane as loaded when it becomes active if (active && !pane.hasBeenLoaded) { pane.hasBeenLoaded = true; } - // Load the component with initial properties when activated if (active && !item) { loader.setSource(pane.componentPath, { "session": root.session @@ -166,7 +149,6 @@ ClippingRectangle { } onItemChanged: { - // Mark pane as loaded when item is created if (item) { pane.hasBeenLoaded = true; } diff --git a/modules/controlcenter/Session.qml b/modules/controlcenter/Session.qml index 9c6a754..0408a1a 100644 --- a/modules/controlcenter/Session.qml +++ b/modules/controlcenter/Session.qml @@ -11,7 +11,6 @@ QtObject { property int activeIndex: 0 property bool navExpanded: false - // Pane-specific state objects readonly property BluetoothState bt: BluetoothState {} readonly property NetworkState network: NetworkState {} readonly property EthernetState ethernet: EthernetState {} diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 3ba0549..5b7e859 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -22,7 +22,6 @@ Item { required property Session session - // Appearance settings property real animDurationsScale: Config.appearance.anim.durations.scale ?? 1 property string fontFamilyMaterial: Config.appearance.font.family.material ?? "Material Symbols Rounded" property string fontFamilyMono: Config.appearance.font.family.mono ?? "CaskaydiaCove NF" @@ -37,7 +36,6 @@ Item { property real borderRounding: Config.border.rounding ?? 1 property real borderThickness: Config.border.thickness ?? 1 - // Background settings property bool desktopClockEnabled: Config.background.desktopClock.enabled ?? false property bool backgroundEnabled: Config.background.enabled ?? true property bool visualiserEnabled: Config.background.visualiser.enabled ?? false @@ -127,13 +125,8 @@ Item { anchors.fill: parent asynchronous: true active: { - // Lazy load: only activate when: - // 1. Right pane is loaded AND - // 2. Appearance pane is active (index 3) or adjacent (for smooth transitions) - // This prevents loading all wallpapers when control center opens but appearance pane isn't visible const isActive = root.session.activeIndex === 3; const isAdjacent = Math.abs(root.session.activeIndex - 3) === 1; - // Access loader through SplitPaneLayout's rightLoader const splitLayout = root.children[0]; const loader = splitLayout && splitLayout.rightLoader ? splitLayout.rightLoader : null; const shouldActivate = loader && loader.item !== null && (isActive || isAdjacent); @@ -150,7 +143,6 @@ Item { onActiveChanged: { if (!active && wallpaperLoader.item) { const container = wallpaperLoader.item; - // Access timer through wallpaperGrid if (container && container.wallpaperGrid) { const grid = container.wallpaperGrid; if (grid.imageUpdateTimer) { @@ -186,20 +178,17 @@ Item { } } - // Lazy loading model: loads one image at a time, only when touching bottom - // This prevents GridView from creating all delegates at once QtObject { id: lazyModel property var sourceList: null - property int loadedCount: 0 // Total items available to load - property int visibleCount: 0 // Items actually exposed to GridView (only visible + buffer) + property int loadedCount: 0 + property int visibleCount: 0 property int totalCount: 0 function initialize(list) { sourceList = list; totalCount = list ? list.length : 0; - // Start with enough items to fill the initial viewport (~3 rows) const initialRows = 3; const cols = wallpaperGrid.columnsCount > 0 ? wallpaperGrid.columnsCount : 3; const initialCount = Math.min(initialRows * cols, totalCount); @@ -216,7 +205,6 @@ Item { } function updateVisibleCount(neededCount) { - // Always round up to complete rows to avoid incomplete rows in the grid const cols = wallpaperGrid.columnsCount > 0 ? wallpaperGrid.columnsCount : 1; const maxVisible = Math.min(neededCount, loadedCount); const rows = Math.ceil(maxVisible / cols); @@ -237,7 +225,6 @@ Item { readonly property int minCellWidth: 200 + Appearance.spacing.normal readonly property int columnsCount: Math.max(1, Math.floor(parent.width / minCellWidth)) - // Height based on visible items only - prevents GridView from creating all delegates readonly property int layoutPreferredHeight: { if (!lazyModel || lazyModel.visibleCount === 0 || columnsCount === 0) { return 0; @@ -255,7 +242,6 @@ Item { topMargin: 0 bottomMargin: 0 - // Use ListModel for incremental updates to prevent flashing when new items are added ListModel { id: wallpaperListModel } @@ -270,7 +256,6 @@ Item { const newCount = lazyModel.visibleCount; const currentCount = wallpaperListModel.count; - // Only append new items - never remove or replace existing ones if (newCount > currentCount) { const flickable = wallpaperGridContainer.parentFlickable; const oldScrollY = flickable ? flickable.contentY : 0; @@ -279,7 +264,6 @@ Item { wallpaperListModel.append({modelData: lazyModel.sourceList[i]}); } - // Preserve scroll position after model update if (flickable) { Qt.callLater(function() { if (Math.abs(flickable.contentY - oldScrollY) < 1) { @@ -382,7 +366,6 @@ Item { const neededCount = Math.min((neededBottomRow + 1) * wallpaperGrid.columnsCount, lazyModel.loadedCount); lazyModel.updateVisibleCount(neededCount); - // Load more when we're within 1 row of running out of loaded items const loadedRows = Math.ceil(lazyModel.loadedCount / wallpaperGrid.columnsCount); const rowsRemaining = loadedRows - (bottomRow + 1); @@ -434,7 +417,6 @@ Item { const neededCount = Math.min((neededBottomRow + 1) * wallpaperGrid.columnsCount, lazyModel.loadedCount); lazyModel.updateVisibleCount(neededCount); - // Load more when we're within 1 row of running out of loaded items const loadedRows = Math.ceil(lazyModel.loadedCount / wallpaperGrid.columnsCount); const rowsRemaining = loadedRows - (bottomRow + 1); @@ -450,8 +432,6 @@ Item { } } - - // Parent Flickable handles scrolling interactive: false @@ -786,11 +766,9 @@ Item { function onClicked(): void { const variant = modelData.variant; - // Optimistic update - set immediately for responsive UI Schemes.currentVariant = variant; Quickshell.execDetached(["caelestia", "scheme", "set", "-v", variant]); - // Reload after a delay to confirm changes Qt.callLater(() => { reloadTimer.restart(); }); @@ -873,11 +851,9 @@ Item { const flavour = modelData.flavour; const schemeKey = `${name} ${flavour}`; - // Optimistic update - set immediately for responsive UI Schemes.currentScheme = schemeKey; Quickshell.execDetached(["caelestia", "scheme", "set", "-n", name, "-f", flavour]); - // Reload after a delay to confirm changes Qt.callLater(() => { reloadTimer.restart(); }); diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 9b0c7d2..694e178 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -40,7 +40,6 @@ Item { anchors.right: parent.right spacing: Appearance.spacing.normal - // Audio header above the collapsible sections RowLayout { Layout.fillWidth: true spacing: Appearance.spacing.smaller diff --git a/modules/controlcenter/bluetooth/Details.qml b/modules/controlcenter/bluetooth/Details.qml index b260458..5299045 100644 --- a/modules/controlcenter/bluetooth/Details.qml +++ b/modules/controlcenter/bluetooth/Details.qml @@ -440,7 +440,6 @@ StyledFlickable { } } - // FAB Menu (positioned absolutely relative to flickable) ColumnLayout { anchors.right: fabRoot.right anchors.bottom: fabRoot.top diff --git a/modules/controlcenter/bluetooth/Settings.qml b/modules/controlcenter/bluetooth/Settings.qml index b3245ab..c547240 100644 --- a/modules/controlcenter/bluetooth/Settings.qml +++ b/modules/controlcenter/bluetooth/Settings.qml @@ -328,7 +328,7 @@ ColumnLayout { anchors.left: parent.left - text: qsTr("Rename adapter (currently does not work)") // FIXME: remove disclaimer when fixed + text: qsTr("Rename adapter (currently does not work)") color: Colours.palette.m3outline font.pointSize: Appearance.font.size.small } @@ -345,8 +345,6 @@ ColumnLayout { readOnly: !root.session.bt.editingAdapterName onAccepted: { root.session.bt.editingAdapterName = false; - // Doesn't work for now, will be added to QS later - // root.session.bt.currentAdapter.name = text; } leftPadding: Appearance.padding.normal diff --git a/modules/controlcenter/components/DeviceDetails.qml b/modules/controlcenter/components/DeviceDetails.qml index 768e77a..d2e8835 100644 --- a/modules/controlcenter/components/DeviceDetails.qml +++ b/modules/controlcenter/components/DeviceDetails.qml @@ -18,10 +18,7 @@ Item { property Component headerComponent: null property list sections: [] - // Optional: Custom content to insert after header but before sections property Component topContent: null - - // Optional: Custom content to insert after all sections property Component bottomContent: null implicitWidth: layout.implicitWidth @@ -35,7 +32,6 @@ Item { anchors.top: parent.top spacing: Appearance.spacing.normal - // Header component (e.g., ConnectionHeader or SettingsHeader) Loader { id: headerLoader @@ -44,7 +40,6 @@ Item { visible: root.headerComponent !== null } - // Top content (optional) Loader { id: topContentLoader @@ -53,7 +48,6 @@ Item { visible: root.topContent !== null } - // Sections Repeater { model: root.sections @@ -65,7 +59,6 @@ Item { } } - // Bottom content (optional) Loader { id: bottomContentLoader diff --git a/modules/controlcenter/components/DeviceList.qml b/modules/controlcenter/components/DeviceList.qml index a6821d8..75dd913 100644 --- a/modules/controlcenter/components/DeviceList.qml +++ b/modules/controlcenter/components/DeviceList.qml @@ -28,7 +28,6 @@ ColumnLayout { spacing: Appearance.spacing.small - // Header with action buttons (optional) Loader { id: headerLoader @@ -37,7 +36,6 @@ ColumnLayout { visible: root.headerComponent !== null && root.showHeader } - // Title and description row RowLayout { Layout.fillWidth: true Layout.topMargin: root.headerComponent ? 0 : 0 @@ -61,10 +59,8 @@ ColumnLayout { } } - // Expose view for access from parent components property alias view: view - // Description text StyledText { visible: root.description !== "" Layout.fillWidth: true @@ -72,20 +68,18 @@ ColumnLayout { color: Colours.palette.m3outline } - // List view StyledListView { id: view Layout.fillWidth: true - // Use contentHeight to show all items without estimation implicitHeight: contentHeight model: root.model delegate: root.delegate spacing: Appearance.spacing.small / 2 - interactive: false // Disable individual scrolling - parent pane handles it - clip: false // Don't clip - let parent handle scrolling + interactive: false + clip: false } } diff --git a/modules/controlcenter/components/PaneTransition.qml b/modules/controlcenter/components/PaneTransition.qml index 1da4afb..d1814b5 100644 --- a/modules/controlcenter/components/PaneTransition.qml +++ b/modules/controlcenter/components/PaneTransition.qml @@ -3,26 +3,17 @@ pragma ComponentBehavior: Bound import qs.config import QtQuick -// Reusable pane transition animation component -// Provides standard fade-out/scale-down → update → fade-in/scale-up animation -// Used when switching between detail/settings views in panes SequentialAnimation { id: root - // The Loader element to animate required property Item target - - // Optional list of PropertyActions to execute during the transition - // These typically update the component being displayed property list propertyActions - // Animation parameters (with sensible defaults) property real scaleFrom: 1.0 property real scaleTo: 0.8 property real opacityFrom: 1.0 property real opacityTo: 0.0 - // Fade out and scale down ParallelAnimation { NumberAnimation { target: root.target @@ -45,8 +36,6 @@ SequentialAnimation { } } - // Execute property actions (component switching, state updates, etc.) - // This is where the component change happens while invisible ScriptAction { script: { for (let i = 0; i < root.propertyActions.length; i++) { @@ -58,7 +47,6 @@ SequentialAnimation { } } - // Fade in and scale up ParallelAnimation { NumberAnimation { target: root.target diff --git a/modules/controlcenter/components/SplitPaneLayout.qml b/modules/controlcenter/components/SplitPaneLayout.qml index 7bd7db0..8b4f0d9 100644 --- a/modules/controlcenter/components/SplitPaneLayout.qml +++ b/modules/controlcenter/components/SplitPaneLayout.qml @@ -15,19 +15,14 @@ RowLayout { property Component leftContent: null property Component rightContent: null - // Left pane configuration property real leftWidthRatio: 0.4 property int leftMinimumWidth: 420 property var leftLoaderProperties: ({}) - - // Right pane configuration property var rightLoaderProperties: ({}) - // Expose loaders for customization (access via splitLayout.leftLoader or splitLayout.rightLoader) property alias leftLoader: leftLoader property alias rightLoader: rightLoader - // Left pane Item { id: leftPane @@ -57,7 +52,6 @@ RowLayout { asynchronous: true sourceComponent: root.leftContent - // Apply any additional properties from leftLoaderProperties Component.onCompleted: { for (const key in root.leftLoaderProperties) { leftLoader[key] = root.leftLoaderProperties[key]; @@ -74,7 +68,6 @@ RowLayout { } } - // Right pane Item { id: rightPane @@ -101,7 +94,6 @@ RowLayout { asynchronous: true sourceComponent: root.rightContent - // Apply any additional properties from rightLoaderProperties Component.onCompleted: { for (const key in root.rightLoaderProperties) { rightLoader[key] = root.rightLoaderProperties[key]; diff --git a/modules/controlcenter/components/SplitPaneWithDetails.qml b/modules/controlcenter/components/SplitPaneWithDetails.qml index 6af8c1a..e873923 100644 --- a/modules/controlcenter/components/SplitPaneWithDetails.qml +++ b/modules/controlcenter/components/SplitPaneWithDetails.qml @@ -19,7 +19,6 @@ Item { property var activeItem: null property var paneIdGenerator: function(item) { return item ? String(item) : ""; } - // Optional: Additional component to overlay on top (e.g., password dialogs) property Component overlayComponent: null SplitPaneLayout { @@ -82,7 +81,6 @@ Item { } } - // Overlay component (e.g., password dialogs) Loader { id: overlayLoader diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 803d7e0..47f87cc 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -62,26 +62,20 @@ Item { const appId = root.selectedApp.id || root.selectedApp.entry?.id; - // Create a new array to ensure change detection const hiddenApps = Config.launcher.hiddenApps ? [...Config.launcher.hiddenApps] : []; if (isHidden) { - // Add to hiddenApps if not already there if (!hiddenApps.includes(appId)) { hiddenApps.push(appId); } } else { - // Remove from hiddenApps const index = hiddenApps.indexOf(appId); if (index !== -1) { hiddenApps.splice(index, 1); } } - // Update Config Config.launcher.hiddenApps = hiddenApps; - - // Persist changes to disk Config.save(); } @@ -90,15 +84,13 @@ Item { id: allAppsDb path: `${Paths.state}/apps.sqlite` - entries: DesktopEntries.applications.values // No filter - show all apps + entries: DesktopEntries.applications.values } property string searchText: "" function filterApps(search: string): list { - // If search is empty, return all apps directly if (!search || search.trim() === "") { - // Convert QQmlListProperty to array const apps = []; for (let i = 0; i < allAppsDb.apps.length; i++) { apps.push(allAppsDb.apps[i]); @@ -110,7 +102,6 @@ Item { return []; } - // Prepare apps for fuzzy search const preparedApps = []; for (let i = 0; i < allAppsDb.apps.length; i++) { const app = allAppsDb.apps[i]; @@ -121,14 +112,12 @@ Item { }); } - // Perform fuzzy search const results = Fuzzy.go(search, preparedApps, { all: true, keys: ["name"], scoreFn: r => r[0].score }); - // Return sorted by score (highest first) return results .sort((a, b) => b._score - a._score) .map(r => r.obj._item); @@ -192,7 +181,6 @@ Item { if (root.session.launcher.active) { root.session.launcher.active = null; } else { - // Toggle to show settings - if there are apps, select the first one, otherwise show settings if (root.filteredApps.length > 0) { root.session.launcher.active = root.filteredApps[0]; } @@ -302,13 +290,7 @@ Item { Layout.fillWidth: true Layout.fillHeight: true asynchronous: true - active: { - // Lazy load: activate when left pane is loaded - // The ListView will load asynchronously, and search will work because filteredApps - // is updated regardless of whether the ListView is loaded - // Access loader through parent - this will be set when component loads - return true; - } + active: true sourceComponent: StyledListView { id: appsListView @@ -418,11 +400,9 @@ Item { sourceComponent: rightLauncherPane.targetComponent active: true - // Expose displayedApp to loaded components property var displayedApp: rightLauncherPane.displayedApp onItemChanged: { - // Ensure displayedApp is set when item is created (for async loading) if (item && rightLauncherPane.pane && rightLauncherPane.displayedApp !== rightLauncherPane.pane) { rightLauncherPane.displayedApp = rightLauncherPane.pane; } @@ -508,12 +488,10 @@ Item { id: appDetailsLayout anchors.fill: parent - // Get displayedApp from parent Loader (the Loader has displayedApp property we set) readonly property var displayedApp: parent && parent.displayedApp !== undefined ? parent.displayedApp : null spacing: Appearance.spacing.normal - // Show SettingsHeader when no app is selected, or show app icon + title when app is selected SettingsHeader { Layout.leftMargin: Appearance.padding.large * 2 Layout.rightMargin: Appearance.padding.large * 2 @@ -523,7 +501,6 @@ Item { title: qsTr("Launcher Applications") } - // App icon and title display (shown when app is selected) Item { Layout.alignment: Qt.AlignHCenter Layout.leftMargin: Appearance.padding.large * 2 diff --git a/modules/controlcenter/network/NetworkingPane.qml b/modules/controlcenter/network/NetworkingPane.qml index e28d35c..4446428 100644 --- a/modules/controlcenter/network/NetworkingPane.qml +++ b/modules/controlcenter/network/NetworkingPane.qml @@ -45,7 +45,6 @@ Item { anchors.right: parent.right spacing: Appearance.spacing.normal - // Network header above the collapsible sections RowLayout { Layout.fillWidth: true spacing: Appearance.spacing.smaller @@ -102,7 +101,6 @@ Item { root.session.ethernet.active = null; root.session.network.active = null; } else { - // Toggle to show settings - prefer ethernet if available, otherwise wireless if (Nmcli.ethernetDevices.length > 0) { root.session.ethernet.active = Nmcli.ethernetDevices[0]; } else if (Nmcli.networks.length > 0) { diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml index 7f6a4aa..cf16400 100644 --- a/modules/controlcenter/network/WirelessDetails.qml +++ b/modules/controlcenter/network/WirelessDetails.qml @@ -27,7 +27,6 @@ DeviceDetails { } onNetworkChanged: { - // Restart timer when network changes connectionUpdateTimer.stop(); if (network && network.ssid) { connectionUpdateTimer.start(); @@ -48,11 +47,9 @@ DeviceDetails { updateDeviceDetails(); } function onWirelessDeviceDetailsChanged() { - // When details are updated, check if we should stop the timer if (network && network.ssid) { const isActive = network.active || (Nmcli.active && Nmcli.active.ssid === network.ssid); if (isActive && Nmcli.wirelessDeviceDetails && Nmcli.wirelessDeviceDetails !== null) { - // We have details for the active network, stop the timer connectionUpdateTimer.stop(); } } @@ -65,22 +62,16 @@ DeviceDetails { repeat: true running: network && network.ssid onTriggered: { - // Periodically check if network becomes active and update details if (network) { const isActive = network.active || (Nmcli.active && Nmcli.active.ssid === network.ssid); if (isActive) { - // Network is active - check if we have details if (!Nmcli.wirelessDeviceDetails || Nmcli.wirelessDeviceDetails === null) { - // Network is active but we don't have details yet, fetch them Nmcli.getWirelessDeviceDetails("", () => { - // After fetching, check if we got details - if not, timer will try again }); } else { - // We have details, can stop the timer connectionUpdateTimer.stop(); } } else { - // Network is not active, clear details if (Nmcli.wirelessDeviceDetails !== null) { Nmcli.wirelessDeviceDetails = null; } diff --git a/modules/controlcenter/network/WirelessList.qml b/modules/controlcenter/network/WirelessList.qml index 4726712..9dabe9d 100644 --- a/modules/controlcenter/network/WirelessList.qml +++ b/modules/controlcenter/network/WirelessList.qml @@ -33,10 +33,8 @@ DeviceList { model: ScriptModel { values: [...Nmcli.networks].sort((a, b) => { - // Put active/connected network first if (a.active !== b.active) return b.active - a.active; - // Then sort by signal strength return b.strength - a.strength; }) } @@ -114,7 +112,6 @@ DeviceList { StateLayer { function onClicked(): void { root.session.network.active = modelData; - // Check if we need to refresh saved connections when selecting a network if (modelData && modelData.ssid) { root.checkSavedProfileForNetwork(modelData.ssid); } diff --git a/modules/controlcenter/network/WirelessPasswordDialog.qml b/modules/controlcenter/network/WirelessPasswordDialog.qml index 0f1a5cd..7c046af 100644 --- a/modules/controlcenter/network/WirelessPasswordDialog.qml +++ b/modules/controlcenter/network/WirelessPasswordDialog.qml @@ -19,7 +19,6 @@ Item { required property Session session readonly property var network: { - // Prefer pendingNetwork, then active network if (session.network.pendingNetwork) { return session.network.pendingNetwork; } @@ -157,12 +156,10 @@ Item { focus: true Keys.onPressed: event => { - // Ensure we have focus when receiving keyboard input if (!activeFocus) { forceActiveFocus(); } - // Clear error when user starts typing if (connectButton.hasError && event.text && event.text.length > 0) { connectButton.hasError = false; } @@ -191,7 +188,6 @@ Item { target: root.session.network function onShowPasswordDialogChanged(): void { if (root.session.network.showPasswordDialog) { - // Use callLater to ensure focus happens after dialog is fully rendered Qt.callLater(() => { passwordContainer.forceActiveFocus(); passwordContainer.passwordBuffer = ""; @@ -205,7 +201,6 @@ Item { target: root function onVisibleChanged(): void { if (root.visible) { - // Use callLater to ensure focus happens after dialog is fully rendered Qt.callLater(() => { passwordContainer.forceActiveFocus(); }); @@ -383,46 +378,36 @@ Item { return; } - // Clear any previous error hasError = false; - - // Set connecting state connecting = true; enabled = false; text = qsTr("Connecting..."); - // Connect to network NetworkConnection.connectWithPassword(root.network, password, result => { - if (result && result.success) - // Connection successful, monitor will handle the rest - {} else if (result && result.needsPassword) { - // Shouldn't happen since we provided password + if (result && result.success) { + } else if (result && result.needsPassword) { connectionMonitor.stop(); connecting = false; hasError = true; enabled = true; text = qsTr("Connect"); passwordContainer.passwordBuffer = ""; - // Delete the failed connection if (root.network && root.network.ssid) { Nmcli.forgetNetwork(root.network.ssid); } } else { - // Connection failed immediately - show error connectionMonitor.stop(); connecting = false; hasError = true; enabled = true; text = qsTr("Connect"); passwordContainer.passwordBuffer = ""; - // Delete the failed connection if (root.network && root.network.ssid) { Nmcli.forgetNetwork(root.network.ssid); } } }); - // Start monitoring connection connectionMonitor.start(); } } @@ -435,19 +420,14 @@ Item { return; } - // Check if we're connected to the target network (case-insensitive SSID comparison) const isConnected = root.network && Nmcli.active && Nmcli.active.ssid && Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim(); if (isConnected) { - // Successfully connected - give it a moment for network list to update - // Use Timer for actual delay connectionSuccessTimer.start(); return; } - // Check for connection failures - if pending connection was cleared but we're not connected if (Nmcli.pendingConnection === null && connectButton.connecting) { - // Wait a bit more before giving up (allow time for connection to establish) if (connectionMonitor.repeatCount > 10) { connectionMonitor.stop(); connectButton.connecting = false; @@ -455,7 +435,6 @@ Item { connectButton.enabled = true; connectButton.text = qsTr("Connect"); passwordContainer.passwordBuffer = ""; - // Delete the failed connection if (root.network && root.network.ssid) { Nmcli.forgetNetwork(root.network.ssid); } @@ -486,7 +465,6 @@ Item { id: connectionSuccessTimer interval: 500 onTriggered: { - // Double-check connection is still active if (root.visible && Nmcli.active && Nmcli.active.ssid) { const stillConnected = Nmcli.active.ssid.toLowerCase().trim() === root.network.ssid.toLowerCase().trim(); if (stillConnected) { @@ -514,7 +492,6 @@ Item { connectButton.enabled = true; connectButton.text = qsTr("Connect"); passwordContainer.passwordBuffer = ""; - // Delete the failed connection Nmcli.forgetNetwork(ssid); } } diff --git a/modules/controlcenter/state/BluetoothState.qml b/modules/controlcenter/state/BluetoothState.qml index db8c7e1..00497ce 100644 --- a/modules/controlcenter/state/BluetoothState.qml +++ b/modules/controlcenter/state/BluetoothState.qml @@ -4,13 +4,8 @@ import QtQuick QtObject { id: root - // Active selected device property BluetoothDevice active: null - - // Current adapter being used property BluetoothAdapter currentAdapter: Bluetooth.defaultAdapter - - // UI state flags property bool editingAdapterName: false property bool fabMenuOpen: false property bool editingDeviceName: false diff --git a/modules/controlcenter/state/EthernetState.qml b/modules/controlcenter/state/EthernetState.qml index 25b243a..c5da7aa 100644 --- a/modules/controlcenter/state/EthernetState.qml +++ b/modules/controlcenter/state/EthernetState.qml @@ -3,7 +3,6 @@ import QtQuick QtObject { id: root - // Active selected ethernet interface property var active: null } diff --git a/modules/controlcenter/state/LauncherState.qml b/modules/controlcenter/state/LauncherState.qml index cd9eeb6..c5da7aa 100644 --- a/modules/controlcenter/state/LauncherState.qml +++ b/modules/controlcenter/state/LauncherState.qml @@ -3,7 +3,6 @@ import QtQuick QtObject { id: root - // Active selected application property var active: null } diff --git a/modules/controlcenter/state/NetworkState.qml b/modules/controlcenter/state/NetworkState.qml index 651a35c..da13e65 100644 --- a/modules/controlcenter/state/NetworkState.qml +++ b/modules/controlcenter/state/NetworkState.qml @@ -3,10 +3,7 @@ import QtQuick QtObject { id: root - // Active selected wireless network property var active: null - - // Password dialog state property bool showPasswordDialog: false property var pendingNetwork: null } diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 1c3adbc..f452b07 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -18,15 +18,10 @@ Item { required property Session session - // Clock property bool clockShowIcon: Config.bar.clock.showIcon ?? true - - // Bar Behavior property bool persistent: Config.bar.persistent ?? true property bool showOnHover: Config.bar.showOnHover ?? true property int dragThreshold: Config.bar.dragThreshold ?? 20 - - // Status Icons property bool showAudio: Config.bar.status.showAudio ?? true property bool showMicrophone: Config.bar.status.showMicrophone ?? true property bool showKbLayout: Config.bar.status.showKbLayout ?? false @@ -34,25 +29,17 @@ Item { property bool showBluetooth: Config.bar.status.showBluetooth ?? true property bool showBattery: Config.bar.status.showBattery ?? true property bool showLockStatus: Config.bar.status.showLockStatus ?? true - - // Tray Settings property bool trayBackground: Config.bar.tray.background ?? false property bool trayCompact: Config.bar.tray.compact ?? false property bool trayRecolour: Config.bar.tray.recolour ?? false - - // Workspaces property int workspacesShown: Config.bar.workspaces.shown ?? 5 property bool workspacesActiveIndicator: Config.bar.workspaces.activeIndicator ?? true property bool workspacesOccupiedBg: Config.bar.workspaces.occupiedBg ?? false property bool workspacesShowWindows: Config.bar.workspaces.showWindows ?? false property bool workspacesPerMonitor: Config.bar.workspaces.perMonitorWorkspaces ?? true - - // Scroll Actions property bool scrollWorkspaces: Config.bar.scrollActions.workspaces ?? true property bool scrollVolume: Config.bar.scrollActions.volume ?? true property bool scrollBrightness: Config.bar.scrollActions.brightness ?? true - - // Popouts property bool popoutActiveWindow: Config.bar.popouts.activeWindow ?? true property bool popoutTray: Config.bar.popouts.tray ?? true property bool popoutStatusIcons: Config.bar.popouts.statusIcons ?? true @@ -60,7 +47,6 @@ Item { anchors.fill: parent Component.onCompleted: { - // Update entries if (Config.bar.entries) { entriesModel.clear(); for (let i = 0; i < Config.bar.entries.length; i++) { @@ -74,15 +60,10 @@ Item { } function saveConfig(entryIndex, entryEnabled) { - // Update clock setting Config.bar.clock.showIcon = root.clockShowIcon; - - // Update bar behavior Config.bar.persistent = root.persistent; Config.bar.showOnHover = root.showOnHover; Config.bar.dragThreshold = root.dragThreshold; - - // Update status icons Config.bar.status.showAudio = root.showAudio; Config.bar.status.showMicrophone = root.showMicrophone; Config.bar.status.showKbLayout = root.showKbLayout; @@ -90,35 +71,24 @@ Item { Config.bar.status.showBluetooth = root.showBluetooth; Config.bar.status.showBattery = root.showBattery; Config.bar.status.showLockStatus = root.showLockStatus; - - // Update tray settings Config.bar.tray.background = root.trayBackground; Config.bar.tray.compact = root.trayCompact; Config.bar.tray.recolour = root.trayRecolour; - - // Update workspaces Config.bar.workspaces.shown = root.workspacesShown; Config.bar.workspaces.activeIndicator = root.workspacesActiveIndicator; Config.bar.workspaces.occupiedBg = root.workspacesOccupiedBg; Config.bar.workspaces.showWindows = root.workspacesShowWindows; Config.bar.workspaces.perMonitorWorkspaces = root.workspacesPerMonitor; - - // Update scroll actions Config.bar.scrollActions.workspaces = root.scrollWorkspaces; Config.bar.scrollActions.volume = root.scrollVolume; Config.bar.scrollActions.brightness = root.scrollBrightness; - - // Update popouts Config.bar.popouts.activeWindow = root.popoutActiveWindow; Config.bar.popouts.tray = root.popoutTray; Config.bar.popouts.statusIcons = root.popoutStatusIcons; - // Update entries from the model (same approach as clock - use provided value if available) const entries = []; for (let i = 0; i < entriesModel.count; i++) { const entry = entriesModel.get(i); - // If this is the entry being updated, use the provided value (same as clock toggle reads from switch) - // Otherwise use the value from the model let enabled = entry.enabled; if (entryIndex !== undefined && i === entryIndex) { enabled = entryEnabled; @@ -129,8 +99,6 @@ Item { }); } Config.bar.entries = entries; - - // Persist changes to disk Config.save(); } -- cgit v1.2.3-freya From a243b6148b03d3effb7b86993f8ce89911e49b80 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Wed, 19 Nov 2025 21:57:55 -0500 Subject: refactor: replaced input fields with SliderInput components --- .../controlcenter/appearance/AppearancePane.qml | 1122 +++----------------- modules/controlcenter/components/DeviceDetails.qml | 2 +- modules/controlcenter/components/SliderInput.qml | 207 ++++ .../components/controls/SliderInput.qml | 179 ++++ modules/controlcenter/network/EthernetDetails.qml | 4 +- modules/controlcenter/network/WirelessDetails.qml | 4 +- modules/controlcenter/taskbar/TaskbarPane.qml | 106 +- 7 files changed, 550 insertions(+), 1074 deletions(-) create mode 100644 modules/controlcenter/components/SliderInput.qml create mode 100644 modules/controlcenter/components/controls/SliderInput.qml (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index 5b7e859..dec260d 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -962,98 +962,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Animation duration scale") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: animDurationsInput.implicitHeight + Appearance.padding.small * 2 - color: animDurationsInputHover.containsMouse || animDurationsInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: animDurationsInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: animDurationsInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: animDurationsInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.1; top: 5.0 } - - Component.onCompleted: { - text = (rootPane.animDurationsScale).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.1 && val <= 5.0) { - rootPane.animDurationsScale = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.1 || val > 5.0) { - text = (rootPane.animDurationsScale).toFixed(1); - } - } - } - } - - StyledText { - text: "×" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: animDurationsSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.1 - to: 5.0 - value: rootPane.animDurationsScale - onMoved: { - rootPane.animDurationsScale = animDurationsSlider.value; - if (!animDurationsInput.activeFocus) { - animDurationsInput.text = (animDurationsSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Animation duration scale") + value: rootPane.animDurationsScale + from: 0.1 + to: 5.0 + decimals: 1 + suffix: "×" + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + onValueModified: (newValue) => { + rootPane.animDurationsScale = newValue; + rootPane.saveConfig(); } } } @@ -1312,98 +1234,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Font size scale") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: fontSizeInput.implicitHeight + Appearance.padding.small * 2 - color: fontSizeInputHover.containsMouse || fontSizeInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: fontSizeInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: fontSizeInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: fontSizeInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.7; top: 1.5 } - - Component.onCompleted: { - text = (rootPane.fontSizeScale).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.7 && val <= 1.5) { - rootPane.fontSizeScale = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.7 || val > 1.5) { - text = (rootPane.fontSizeScale).toFixed(1); - } - } - } - } - - StyledText { - text: "×" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: fontSizeSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.7 - to: 1.5 - value: rootPane.fontSizeScale - onMoved: { - rootPane.fontSizeScale = fontSizeSlider.value; - if (!fontSizeInput.activeFocus) { - fontSizeInput.text = (fontSizeSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Font size scale") + value: rootPane.fontSizeScale + from: 0.7 + to: 1.5 + decimals: 2 + suffix: "×" + validator: DoubleValidator { bottom: 0.7; top: 1.5 } + + onValueModified: (newValue) => { + rootPane.fontSizeScale = newValue; + rootPane.saveConfig(); } } } @@ -1417,98 +1261,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Padding scale") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: paddingInput.implicitHeight + Appearance.padding.small * 2 - color: paddingInputHover.containsMouse || paddingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: paddingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: paddingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: paddingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.5; top: 2.0 } - - Component.onCompleted: { - text = (rootPane.paddingScale).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.5 && val <= 2.0) { - rootPane.paddingScale = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.5 || val > 2.0) { - text = (rootPane.paddingScale).toFixed(1); - } - } - } - } - - StyledText { - text: "×" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: paddingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.5 - to: 2.0 - value: rootPane.paddingScale - onMoved: { - rootPane.paddingScale = paddingSlider.value; - if (!paddingInput.activeFocus) { - paddingInput.text = (paddingSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Padding scale") + value: rootPane.paddingScale + from: 0.5 + to: 2.0 + decimals: 1 + suffix: "×" + validator: DoubleValidator { bottom: 0.5; top: 2.0 } + + onValueModified: (newValue) => { + rootPane.paddingScale = newValue; + rootPane.saveConfig(); } } } @@ -1516,98 +1282,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Rounding scale") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: roundingInput.implicitHeight + Appearance.padding.small * 2 - color: roundingInputHover.containsMouse || roundingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: roundingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: roundingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: roundingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.1; top: 5.0 } - - Component.onCompleted: { - text = (rootPane.roundingScale).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.1 && val <= 5.0) { - rootPane.roundingScale = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.1 || val > 5.0) { - text = (rootPane.roundingScale).toFixed(1); - } - } - } - } - - StyledText { - text: "×" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: roundingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.1 - to: 5.0 - value: rootPane.roundingScale - onMoved: { - rootPane.roundingScale = roundingSlider.value; - if (!roundingInput.activeFocus) { - roundingInput.text = (roundingSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Rounding scale") + value: rootPane.roundingScale + from: 0.1 + to: 5.0 + decimals: 1 + suffix: "×" + validator: DoubleValidator { bottom: 0.1; top: 5.0 } + + onValueModified: (newValue) => { + rootPane.roundingScale = newValue; + rootPane.saveConfig(); } } } @@ -1615,98 +1303,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Spacing scale") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: spacingInput.implicitHeight + Appearance.padding.small * 2 - color: spacingInputHover.containsMouse || spacingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: spacingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: spacingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: spacingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.1; top: 2.0 } - - Component.onCompleted: { - text = (rootPane.spacingScale).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.1 && val <= 2.0) { - rootPane.spacingScale = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.1 || val > 2.0) { - text = (rootPane.spacingScale).toFixed(1); - } - } - } - } - - StyledText { - text: "×" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: spacingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.1 - to: 2.0 - value: rootPane.spacingScale - onMoved: { - rootPane.spacingScale = spacingSlider.value; - if (!spacingInput.activeFocus) { - spacingInput.text = (spacingSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Spacing scale") + value: rootPane.spacingScale + from: 0.1 + to: 2.0 + decimals: 1 + suffix: "×" + validator: DoubleValidator { bottom: 0.1; top: 2.0 } + + onValueModified: (newValue) => { + rootPane.spacingScale = newValue; + rootPane.saveConfig(); } } } @@ -1729,98 +1339,21 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Transparency base") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: transparencyBaseInput.implicitHeight + Appearance.padding.small * 2 - color: transparencyBaseInputHover.containsMouse || transparencyBaseInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: transparencyBaseInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: transparencyBaseInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: transparencyBaseInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 100 } - - Component.onCompleted: { - text = Math.round(rootPane.transparencyBase * 100).toString(); - } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 100) { - rootPane.transparencyBase = val / 100; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 100) { - text = Math.round(rootPane.transparencyBase * 100).toString(); - } - } - } - } - - StyledText { - text: "%" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: baseSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 100 - value: rootPane.transparencyBase * 100 - onMoved: { - rootPane.transparencyBase = baseSlider.value / 100; - if (!transparencyBaseInput.activeFocus) { - transparencyBaseInput.text = Math.round(baseSlider.value).toString(); - } - rootPane.saveConfig(); - } + + label: qsTr("Transparency base") + value: rootPane.transparencyBase * 100 + from: 0 + to: 100 + suffix: "%" + validator: IntValidator { bottom: 0; top: 100 } + formatValueFunction: (val) => Math.round(val).toString() + parseValueFunction: (text) => parseInt(text) + + onValueModified: (newValue) => { + rootPane.transparencyBase = newValue / 100; + rootPane.saveConfig(); } } } @@ -1828,98 +1361,21 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Transparency layers") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: transparencyLayersInput.implicitHeight + Appearance.padding.small * 2 - color: transparencyLayersInputHover.containsMouse || transparencyLayersInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: transparencyLayersInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: transparencyLayersInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: transparencyLayersInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 100 } - - Component.onCompleted: { - text = Math.round(rootPane.transparencyLayers * 100).toString(); - } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 100) { - rootPane.transparencyLayers = val / 100; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 100) { - text = Math.round(rootPane.transparencyLayers * 100).toString(); - } - } - } - } - - StyledText { - text: "%" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: layersSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 100 - value: rootPane.transparencyLayers * 100 - onMoved: { - rootPane.transparencyLayers = layersSlider.value / 100; - if (!transparencyLayersInput.activeFocus) { - transparencyLayersInput.text = Math.round(layersSlider.value).toString(); - } - rootPane.saveConfig(); - } + + label: qsTr("Transparency layers") + value: rootPane.transparencyLayers * 100 + from: 0 + to: 100 + suffix: "%" + validator: IntValidator { bottom: 0; top: 100 } + formatValueFunction: (val) => Math.round(val).toString() + parseValueFunction: (text) => parseInt(text) + + onValueModified: (newValue) => { + rootPane.transparencyLayers = newValue / 100; + rootPane.saveConfig(); } } } @@ -1933,92 +1389,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Border rounding") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: borderRoundingInput.implicitHeight + Appearance.padding.small * 2 - color: borderRoundingInputHover.containsMouse || borderRoundingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: borderRoundingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: borderRoundingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: borderRoundingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.1; top: 100 } - - Component.onCompleted: { - text = (rootPane.borderRounding).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.1 && val <= 100) { - rootPane.borderRounding = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.1 || val > 100) { - text = (rootPane.borderRounding).toFixed(1); - } - } - } - } - } - - StyledSlider { - id: borderRoundingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.1 - to: 100 - value: rootPane.borderRounding - onMoved: { - rootPane.borderRounding = borderRoundingSlider.value; - if (!borderRoundingInput.activeFocus) { - borderRoundingInput.text = (borderRoundingSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Border rounding") + value: rootPane.borderRounding + from: 0.1 + to: 100 + decimals: 1 + suffix: "px" + validator: DoubleValidator { bottom: 0.1; top: 100 } + + onValueModified: (newValue) => { + rootPane.borderRounding = newValue; + rootPane.saveConfig(); } } } @@ -2026,92 +1410,20 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Border thickness") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: borderThicknessInput.implicitHeight + Appearance.padding.small * 2 - color: borderThicknessInputHover.containsMouse || borderThicknessInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: borderThicknessInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: borderThicknessInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: borderThicknessInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0.1; top: 100 } - - Component.onCompleted: { - text = (rootPane.borderThickness).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0.1 && val <= 100) { - rootPane.borderThickness = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0.1 || val > 100) { - text = (rootPane.borderThickness).toFixed(1); - } - } - } - } - } - - StyledSlider { - id: borderThicknessSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0.1 - to: 100 - value: rootPane.borderThickness - onMoved: { - rootPane.borderThickness = borderThicknessSlider.value; - if (!borderThicknessInput.activeFocus) { - borderThicknessInput.text = (borderThicknessSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Border thickness") + value: rootPane.borderThickness + from: 0.1 + to: 100 + decimals: 1 + suffix: "px" + validator: DoubleValidator { bottom: 0.1; top: 100 } + + onValueModified: (newValue) => { + rootPane.borderThickness = newValue; + rootPane.saveConfig(); } } } @@ -2168,186 +1480,40 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Visualiser rounding") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: visualiserRoundingInput.implicitHeight + Appearance.padding.small * 2 - color: visualiserRoundingInputHover.containsMouse || visualiserRoundingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: visualiserRoundingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: visualiserRoundingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: visualiserRoundingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 10 } - - Component.onCompleted: { - text = Math.round(rootPane.visualiserRounding).toString(); - } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 10) { - rootPane.visualiserRounding = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 10) { - text = Math.round(rootPane.visualiserRounding).toString(); - } - } - } - } + + label: qsTr("Visualiser rounding") + value: rootPane.visualiserRounding + from: 0 + to: 10 + stepSize: 1 + validator: IntValidator { bottom: 0; top: 10 } + formatValueFunction: (val) => Math.round(val).toString() + parseValueFunction: (text) => parseInt(text) + + onValueModified: (newValue) => { + rootPane.visualiserRounding = Math.round(newValue); + rootPane.saveConfig(); } - - StyledSlider { - id: visualiserRoundingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 10 - stepSize: 1 - value: rootPane.visualiserRounding - onMoved: { - rootPane.visualiserRounding = Math.round(visualiserRoundingSlider.value); - if (!visualiserRoundingInput.activeFocus) { - visualiserRoundingInput.text = Math.round(visualiserRoundingSlider.value).toString(); - } - rootPane.saveConfig(); } } - } - } SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Visualiser spacing") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: visualiserSpacingInput.implicitHeight + Appearance.padding.small * 2 - color: visualiserSpacingInputHover.containsMouse || visualiserSpacingInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: visualiserSpacingInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: visualiserSpacingInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: visualiserSpacingInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: DoubleValidator { bottom: 0; top: 2 } - - Component.onCompleted: { - text = (rootPane.visualiserSpacing).toFixed(1); - } - - onTextChanged: { - if (activeFocus) { - const val = parseFloat(text); - if (!isNaN(val) && val >= 0 && val <= 2) { - rootPane.visualiserSpacing = val; - rootPane.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseFloat(text); - if (isNaN(val) || val < 0 || val > 2) { - text = (rootPane.visualiserSpacing).toFixed(1); - } - } - } - } - } - - StyledSlider { - id: visualiserSpacingSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 2 - value: rootPane.visualiserSpacing - onMoved: { - rootPane.visualiserSpacing = visualiserSpacingSlider.value; - if (!visualiserSpacingInput.activeFocus) { - visualiserSpacingInput.text = (visualiserSpacingSlider.value).toFixed(1); - } - rootPane.saveConfig(); - } + + label: qsTr("Visualiser spacing") + value: rootPane.visualiserSpacing + from: 0 + to: 2 + validator: DoubleValidator { bottom: 0; top: 2 } + + onValueModified: (newValue) => { + rootPane.visualiserSpacing = newValue; + rootPane.saveConfig(); } } } diff --git a/modules/controlcenter/components/DeviceDetails.qml b/modules/controlcenter/components/DeviceDetails.qml index d2e8835..8cc9177 100644 --- a/modules/controlcenter/components/DeviceDetails.qml +++ b/modules/controlcenter/components/DeviceDetails.qml @@ -12,7 +12,7 @@ import QtQuick.Layouts Item { id: root - required property Session session + property Session session property var device: null property Component headerComponent: null diff --git a/modules/controlcenter/components/SliderInput.qml b/modules/controlcenter/components/SliderInput.qml new file mode 100644 index 0000000..3d7cd4d --- /dev/null +++ b/modules/controlcenter/components/SliderInput.qml @@ -0,0 +1,207 @@ +pragma ComponentBehavior: Bound + +import qs.components +import qs.components.controls +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +ColumnLayout { + id: root + + property string label: "" + property real value: 0 + property real from: 0 + property real to: 100 + property real stepSize: 0 + property var validator: null + property string suffix: "" // Optional suffix text (e.g., "×", "px") + property int decimals: 1 // Number of decimal places to show (default: 1) + property var formatValueFunction: null // Optional custom format function + property var parseValueFunction: null // Optional custom parse function + + function formatValue(val: real): string { + if (formatValueFunction) { + return formatValueFunction(val); + } + // Default format function + // Check if it's an IntValidator (IntValidator doesn't have a 'decimals' property) + if (validator && validator.bottom !== undefined && validator.decimals === undefined) { + return Math.round(val).toString(); + } + // For DoubleValidator or no validator, use the decimals property + return val.toFixed(root.decimals); + } + + function parseValue(text: string): real { + if (parseValueFunction) { + return parseValueFunction(text); + } + // Default parse function + if (validator && validator.bottom !== undefined) { + // Check if it's an integer validator + if (validator.top !== undefined && validator.top === Math.floor(validator.top)) { + return parseInt(text); + } + } + return parseFloat(text); + } + + signal valueModified(real newValue) + + property bool _initialized: false + + spacing: Appearance.spacing.small + + Component.onCompleted: { + // Set initialized flag after a brief delay to allow component to fully load + Qt.callLater(() => { + _initialized = true; + }); + } + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + visible: root.label !== "" + text: root.label + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: inputField.implicitHeight + Appearance.padding.small * 2 + color: inputHover.containsMouse || inputField.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: inputField.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: inputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: inputField + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: root.validator + + Component.onCompleted: { + // Initialize text without triggering valueModified signal + text = root.formatValue(root.value); + } + + onTextChanged: { + if (activeFocus) { + const val = root.parseValue(text); + if (!isNaN(val)) { + // Validate against validator bounds if available + let isValid = true; + if (root.validator) { + if (root.validator.bottom !== undefined && val < root.validator.bottom) { + isValid = false; + } + if (root.validator.top !== undefined && val > root.validator.top) { + isValid = false; + } + } + + if (isValid) { + root.valueModified(val); + } + } + } + } + + onEditingFinished: { + const val = root.parseValue(text); + let isValid = true; + if (root.validator) { + if (root.validator.bottom !== undefined && val < root.validator.bottom) { + isValid = false; + } + if (root.validator.top !== undefined && val > root.validator.top) { + isValid = false; + } + } + + if (isNaN(val) || !isValid) { + text = root.formatValue(root.value); + } + } + } + } + + StyledText { + visible: root.suffix !== "" + text: root.suffix + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: slider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: root.from + to: root.to + stepSize: root.stepSize + + // Use Binding to allow slider to move freely during dragging + Binding { + target: slider + property: "value" + value: root.value + when: !slider.pressed + } + + onValueChanged: { + // Update input field text in real-time as slider moves during dragging + // Always update when slider value changes (during dragging or external updates) + if (!inputField.activeFocus) { + const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value; + inputField.text = root.formatValue(newValue); + } + } + + onMoved: { + const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value; + root.valueModified(newValue); + if (!inputField.activeFocus) { + inputField.text = root.formatValue(newValue); + } + } + } + + // Update input field when value changes externally (slider is already bound) + onValueChanged: { + // Only update if component is initialized to avoid issues during creation + if (root._initialized && !inputField.activeFocus) { + inputField.text = root.formatValue(root.value); + } + } +} + diff --git a/modules/controlcenter/components/controls/SliderInput.qml b/modules/controlcenter/components/controls/SliderInput.qml new file mode 100644 index 0000000..a114f7f --- /dev/null +++ b/modules/controlcenter/components/controls/SliderInput.qml @@ -0,0 +1,179 @@ +pragma ComponentBehavior: Bound + +import ".." +import qs.components +import qs.components.controls +import qs.components.effects +import QtQuick +import QtQuick.Layouts + +ColumnLayout { + id: root + + property string label: "" + property real value: 0 + property real from: 0 + property real to: 100 + property real stepSize: 0 + property var validator: null + property string suffix: "" // Optional suffix text (e.g., "×", "px") + property var formatValueFunction: null // Optional custom format function + property var parseValueFunction: null // Optional custom parse function + + function formatValue(val: real): string { + if (formatValueFunction) { + return formatValueFunction(val); + } + // Default format function + if (validator && validator.bottom !== undefined) { + // Check if it's an integer validator + if (validator.top !== undefined && validator.top === Math.floor(validator.top)) { + return Math.round(val).toString(); + } + } + return val.toFixed(1); + } + + function parseValue(text: string): real { + if (parseValueFunction) { + return parseValueFunction(text); + } + // Default parse function + if (validator && validator.bottom !== undefined) { + // Check if it's an integer validator + if (validator.top !== undefined && validator.top === Math.floor(validator.top)) { + return parseInt(text); + } + } + return parseFloat(text); + } + + signal valueChanged(real newValue) + + spacing: Appearance.spacing.small + + RowLayout { + Layout.fillWidth: true + spacing: Appearance.spacing.normal + + StyledText { + visible: root.label !== "" + text: root.label + font.pointSize: Appearance.font.size.normal + } + + Item { + Layout.fillWidth: true + } + + StyledRect { + Layout.preferredWidth: 70 + implicitHeight: inputField.implicitHeight + Appearance.padding.small * 2 + color: inputHover.containsMouse || inputField.activeFocus + ? Colours.layer(Colours.palette.m3surfaceContainer, 3) + : Colours.layer(Colours.palette.m3surfaceContainer, 2) + radius: Appearance.rounding.small + border.width: 1 + border.color: inputField.activeFocus + ? Colours.palette.m3primary + : Qt.alpha(Colours.palette.m3outline, 0.3) + + Behavior on color { CAnim {} } + Behavior on border.color { CAnim {} } + + MouseArea { + id: inputHover + anchors.fill: parent + hoverEnabled: true + cursorShape: Qt.IBeamCursor + acceptedButtons: Qt.NoButton + } + + StyledTextField { + id: inputField + anchors.centerIn: parent + width: parent.width - Appearance.padding.normal + horizontalAlignment: TextInput.AlignHCenter + validator: root.validator + + Component.onCompleted: { + text = root.formatValue(root.value); + } + + onTextChanged: { + if (activeFocus) { + const val = root.parseValue(text); + if (!isNaN(val)) { + // Validate against validator bounds if available + let isValid = true; + if (root.validator) { + if (root.validator.bottom !== undefined && val < root.validator.bottom) { + isValid = false; + } + if (root.validator.top !== undefined && val > root.validator.top) { + isValid = false; + } + } + + if (isValid) { + root.valueChanged(val); + } + } + } + } + + onEditingFinished: { + const val = root.parseValue(text); + let isValid = true; + if (root.validator) { + if (root.validator.bottom !== undefined && val < root.validator.bottom) { + isValid = false; + } + if (root.validator.top !== undefined && val > root.validator.top) { + isValid = false; + } + } + + if (isNaN(val) || !isValid) { + text = root.formatValue(root.value); + } + } + } + } + + StyledText { + visible: root.suffix !== "" + text: root.suffix + color: Colours.palette.m3outline + font.pointSize: Appearance.font.size.normal + } + } + + StyledSlider { + id: slider + + Layout.fillWidth: true + implicitHeight: Appearance.padding.normal * 3 + + from: root.from + to: root.to + stepSize: root.stepSize + value: root.value + + onMoved: { + const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value; + root.valueChanged(newValue); + if (!inputField.activeFocus) { + inputField.text = root.formatValue(newValue); + } + } + } + + // Update input field when value changes externally (slider is already bound) + onValueChanged: { + if (!inputField.activeFocus) { + inputField.text = root.formatValue(root.value); + } + } +} + diff --git a/modules/controlcenter/network/EthernetDetails.qml b/modules/controlcenter/network/EthernetDetails.qml index ad078ec..1cd6c0a 100644 --- a/modules/controlcenter/network/EthernetDetails.qml +++ b/modules/controlcenter/network/EthernetDetails.qml @@ -15,8 +15,8 @@ DeviceDetails { id: root required property Session session - readonly property var ethernetDevice: session.ethernet.active - + readonly property var ethernetDevice: root.session.ethernet.active + device: ethernetDevice Component.onCompleted: { diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml index cf16400..47d42c2 100644 --- a/modules/controlcenter/network/WirelessDetails.qml +++ b/modules/controlcenter/network/WirelessDetails.qml @@ -17,8 +17,8 @@ DeviceDetails { id: root required property Session session - readonly property var network: session.network.active - + readonly property var network: root.session.network.active + device: network Component.onCompleted: { diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index f452b07..38c1179 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -1,6 +1,7 @@ pragma ComponentBehavior: Bound import ".." +import "../components" import qs.components import qs.components.controls import qs.components.effects @@ -520,98 +521,21 @@ Item { SectionContainer { contentSpacing: Appearance.spacing.normal - ColumnLayout { + SliderInput { Layout.fillWidth: true - spacing: Appearance.spacing.small - - RowLayout { - Layout.fillWidth: true - spacing: Appearance.spacing.normal - - StyledText { - text: qsTr("Drag threshold") - font.pointSize: Appearance.font.size.normal - } - - Item { - Layout.fillWidth: true - } - - StyledRect { - Layout.preferredWidth: 70 - implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2 - color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus - ? Colours.layer(Colours.palette.m3surfaceContainer, 3) - : Colours.layer(Colours.palette.m3surfaceContainer, 2) - radius: Appearance.rounding.small - border.width: 1 - border.color: dragThresholdInput.activeFocus - ? Colours.palette.m3primary - : Qt.alpha(Colours.palette.m3outline, 0.3) - - Behavior on color { CAnim {} } - Behavior on border.color { CAnim {} } - - MouseArea { - id: dragThresholdInputHover - anchors.fill: parent - hoverEnabled: true - cursorShape: Qt.IBeamCursor - acceptedButtons: Qt.NoButton - } - - StyledTextField { - id: dragThresholdInput - anchors.centerIn: parent - width: parent.width - Appearance.padding.normal - horizontalAlignment: TextInput.AlignHCenter - validator: IntValidator { bottom: 0; top: 100 } - - Component.onCompleted: { - text = root.dragThreshold.toString(); - } - - onTextChanged: { - if (activeFocus) { - const val = parseInt(text); - if (!isNaN(val) && val >= 0 && val <= 100) { - root.dragThreshold = val; - root.saveConfig(); - } - } - } - onEditingFinished: { - const val = parseInt(text); - if (isNaN(val) || val < 0 || val > 100) { - text = root.dragThreshold.toString(); - } - } - } - } - - StyledText { - text: "px" - color: Colours.palette.m3outline - font.pointSize: Appearance.font.size.normal - } - } - - StyledSlider { - id: dragThresholdSlider - - Layout.fillWidth: true - implicitHeight: Appearance.padding.normal * 3 - - from: 0 - to: 100 - value: root.dragThreshold - onMoved: { - root.dragThreshold = Math.round(dragThresholdSlider.value); - if (!dragThresholdInput.activeFocus) { - dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString(); - } - root.saveConfig(); - } + + label: qsTr("Drag threshold") + value: root.dragThreshold + from: 0 + to: 100 + suffix: "px" + validator: IntValidator { bottom: 0; top: 100 } + formatValueFunction: (val) => Math.round(val).toString() + parseValueFunction: (text) => parseInt(text) + + onValueModified: (newValue) => { + root.dragThreshold = Math.round(newValue); + root.saveConfig(); } } } -- cgit v1.2.3-freya From 284e7b42971928465f11a83c4ccb8e95817183e2 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Thu, 20 Nov 2025 20:19:49 -0500 Subject: controlcenter: corrected taskbar panel container margins/padding --- modules/controlcenter/taskbar/TaskbarPane.qml | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) (limited to 'modules/controlcenter/taskbar/TaskbarPane.qml') diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml index 38c1179..5d51c8c 100644 --- a/modules/controlcenter/taskbar/TaskbarPane.qml +++ b/modules/controlcenter/taskbar/TaskbarPane.qml @@ -112,7 +112,7 @@ Item { anchors.fill: parent anchors.margins: Appearance.padding.normal anchors.leftMargin: 0 - anchors.rightMargin: Appearance.padding.normal / 2 + anchors.rightMargin: Appearance.padding.normal radius: taskbarBorder.innerRadius color: "transparent" @@ -123,7 +123,7 @@ Item { anchors.fill: parent anchors.margins: Appearance.padding.large + Appearance.padding.normal anchors.leftMargin: Appearance.padding.large - anchors.rightMargin: Appearance.padding.large + Appearance.padding.normal / 2 + anchors.rightMargin: Appearance.padding.large asynchronous: true sourceComponent: taskbarContentComponent @@ -133,7 +133,7 @@ Item { InnerBorder { id: taskbarBorder leftThickness: 0 - rightThickness: Appearance.padding.normal / 2 + rightThickness: Appearance.padding.normal } Component { @@ -240,10 +240,12 @@ Item { } RowLayout { + id: mainRowLayout Layout.fillWidth: true spacing: Appearance.spacing.normal ColumnLayout { + id: leftColumnLayout Layout.fillWidth: true Layout.alignment: Qt.AlignTop spacing: Appearance.spacing.normal @@ -468,6 +470,7 @@ Item { } ColumnLayout { + id: middleColumnLayout Layout.fillWidth: true Layout.alignment: Qt.AlignTop spacing: Appearance.spacing.normal @@ -543,6 +546,7 @@ Item { } ColumnLayout { + id: rightColumnLayout Layout.fillWidth: true Layout.alignment: Qt.AlignTop spacing: Appearance.spacing.normal -- cgit v1.2.3-freya