nosignal/nosignal-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

controlcenter: refactoring into components

Browse source
This commit is contained in:
ATMDA 2025-11-12 15:58:42 -05:00
parent c1510b5476
commit e92187293e
8 changed files with 1145 additions and 2425 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

85
components/controls/CollapsibleSection.qml Normal file
View file

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

51
components/controls/SpinBoxRow.qml Normal file
View file

@ -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);
}
}
}
}

47
components/controls/SwitchRow.qml Normal file
View file

@ -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);
}
}
}
}

82
components/controls/ToggleButton.qml Normal file
View file

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

960
modules/controlcenter/appearance/AppearancePane.qml
View file

File diff suppressed because it is too large Load diff

77
modules/controlcenter/ethernet/EthernetList.qml
View file

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

81
modules/controlcenter/network/NetworkList.qml
View file

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

697
modules/controlcenter/taskbar/TaskbarPane.qml
View file

@ -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;
title: qsTr("Clock")
description: qsTr("Clock display settings")
onToggleRequested: {
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 {
@ -333,152 +272,33 @@ 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;
title: qsTr("Bar Behavior")
onToggleRequested: {
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 {
SwitchRow {
label: qsTr("Persistent")
checked: root.persistent
onToggled: {
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 {
SwitchRow {
label: qsTr("Show on hover")
checked: root.showOnHover
onToggled: {
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 {
SpinBoxRow {
label: qsTr("Drag threshold")
min: 0
max: 100
value: root.dragThreshold
@ -488,513 +308,123 @@ RowLayout {
}
}
}
}
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;
title: qsTr("Status Icons")
onToggleRequested: {
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 {
SwitchRow {
label: qsTr("Show audio")
checked: root.showAudio
onToggled: {
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")
}
StyledSwitch {
SwitchRow {
label: qsTr("Show microphone")
checked: root.showMicrophone
onToggled: {
onToggled: checked => {
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 {
SwitchRow {
label: qsTr("Show keyboard layout")
checked: root.showKbLayout
onToggled: {
onToggled: checked => {
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 {
SwitchRow {
label: qsTr("Show network")
checked: root.showNetwork
onToggled: {
onToggled: checked => {
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 {
SwitchRow {
label: qsTr("Show bluetooth")
checked: root.showBluetooth
onToggled: {
onToggled: checked => {
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 {
SwitchRow {
label: qsTr("Show battery")
checked: root.showBattery
onToggled: {
onToggled: checked => {
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 {
SwitchRow {
label: qsTr("Show lock status")
checked: root.showLockStatus
onToggled: {
onToggled: checked => {
root.showLockStatus = checked;
root.saveConfig();
}
}
}
}
Item {
CollapsibleSection {
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;
title: qsTr("Tray Settings")
onToggleRequested: {
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 {
SwitchRow {
label: qsTr("Background")
checked: root.trayBackground
onToggled: {
onToggled: checked => {
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 {}
}
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")
}
StyledSwitch {
SwitchRow {
label: qsTr("Compact")
checked: root.trayCompact
onToggled: {
onToggled: checked => {
root.trayCompact = checked;
root.saveConfig();
}
}
}
}
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 {
SwitchRow {
label: qsTr("Recolour")
checked: root.trayRecolour
onToggled: {
onToggled: checked => {
root.trayRecolour = checked;
root.saveConfig();
}
}
}
}
Item {
CollapsibleSection {
id: workspacesSection
Layout.fillWidth: true
Layout.preferredHeight: workspacesSectionHeader.implicitHeight
property bool expanded: false
ColumnLayout {
id: workspacesSectionHeader
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("Workspaces")
font.pointSize: Appearance.font.size.larger
font.weight: 500
}
Item {
Layout.fillWidth: true
}
MaterialIcon {
text: "expand_more"
rotation: workspacesSection.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 = workspacesSection.expanded;
title: qsTr("Workspaces")
onToggleRequested: {
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
implicitHeight: workspacesShownRow.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.tPalette.m3surfaceContainer
@ -1028,10 +458,8 @@ RowLayout {
}
StyledRect {
visible: workspacesSection.expanded
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.small / 2
implicitHeight: workspacesSection.expanded ? workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2 : 0
implicitHeight: workspacesActiveIndicatorRow.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.tPalette.m3surfaceContainer
@ -1063,10 +491,8 @@ RowLayout {
}
StyledRect {
visible: workspacesSection.expanded
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.small / 2
implicitHeight: workspacesSection.expanded ? workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2 : 0
implicitHeight: workspacesOccupiedBgRow.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.tPalette.m3surfaceContainer
@ -1098,10 +524,8 @@ RowLayout {
}
StyledRect {
visible: workspacesSection.expanded
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.small / 2
implicitHeight: workspacesSection.expanded ? workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2 : 0
implicitHeight: workspacesShowWindowsRow.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.tPalette.m3surfaceContainer
@ -1133,10 +557,8 @@ RowLayout {
}
StyledRect {
visible: workspacesSection.expanded
Layout.fillWidth: true
Layout.topMargin: Appearance.spacing.small / 2
implicitHeight: workspacesSection.expanded ? workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2 : 0
implicitHeight: workspacesPerMonitorRow.implicitHeight + Appearance.padding.large * 2
radius: Appearance.rounding.normal
color: Colours.tPalette.m3surfaceContainer
@ -1168,6 +590,7 @@ RowLayout {
}
}
}
}
InnerBorder {
leftThickness: 0