diff --git a/Components/CustomSplitButtonRow.qml b/Components/CustomSplitButtonRow.qml index 763ca8a..5b4fe79 100644 --- a/Components/CustomSplitButtonRow.qml +++ b/Components/CustomSplitButtonRow.qml @@ -4,7 +4,7 @@ import QtQuick import QtQuick.Layouts import qs.Config -CustomRect { +Item { id: root property alias active: splitButton.active @@ -18,23 +18,23 @@ CustomRect { signal selected(item: MenuItem) Layout.fillWidth: true + Layout.preferredHeight: row.implicitHeight + Appearance.padding.smaller * 2 clip: false - color: DynamicColors.layer(DynamicColors.palette.m3surfaceContainer, 2) - implicitHeight: row.implicitHeight + Appearance.padding.large * 2 - opacity: enabled ? 1.0 : 0.5 - radius: Appearance.rounding.normal z: splitButton.menu.implicitHeight > 0 ? expandedZ : 1 RowLayout { id: row - anchors.fill: parent - anchors.margins: Appearance.padding.large + anchors.left: parent.left + anchors.margins: Appearance.padding.small + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter spacing: Appearance.spacing.normal CustomText { Layout.fillWidth: true color: root.enabled ? DynamicColors.palette.m3onSurface : DynamicColors.palette.m3onSurfaceVariant + font.pointSize: Appearance.font.size.larger text: root.label } diff --git a/Modules/Settings/Categories.qml b/Modules/Settings/Categories.qml index 08bcacc..7768d11 100644 --- a/Modules/Settings/Categories.qml +++ b/Modules/Settings/Categories.qml @@ -148,7 +148,7 @@ Item { Layout.fillHeight: true Layout.preferredWidth: icon.contentWidth color: categoryItem.index === clayout.currentIndex ? DynamicColors.palette.m3onPrimary : DynamicColors.palette.m3onSurface - font.pointSize: 22 + font.pointSize: Appearance.font.size.small * 2 text: categoryItem.icon verticalAlignment: Text.AlignVCenter } diff --git a/Modules/Settings/Categories/Appearance.qml b/Modules/Settings/Categories/Appearance.qml index 78c18a0..613ba81 100644 --- a/Modules/Settings/Categories/Appearance.qml +++ b/Modules/Settings/Categories/Appearance.qml @@ -19,7 +19,7 @@ CustomRect { CustomRect { Layout.fillWidth: true - Layout.preferredHeight: colorLayout.implicitHeight + Layout.preferredHeight: colorLayout.implicitHeight + Appearance.padding.normal * 2 color: DynamicColors.tPalette.m3surfaceContainer ColumnLayout { @@ -28,15 +28,46 @@ CustomRect { anchors.left: parent.left anchors.margins: Appearance.padding.large anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter Settings { - name: "smth" + name: "Color" } SettingSwitch { - name: "wallust" + name: "Automatic color scheme" object: Config.general.color - setting: "wallust" + setting: "schemeGeneration" + } + + Separator { + } + + SettingSwitch { + name: "Smart color scheme" + object: Config.general.color + setting: "smart" + } + + Separator { + } + + SettingInput { + name: "Schedule dark mode start" + object: Config.general.color + setting: "scheduleDarkStart" + } + + Separator { + } + + SettingInput { + name: "Schedule dark mode end" + object: Config.general.color + setting: "scheduleDarkEnd" + } + + Separator { } CustomSplitButtonRow { @@ -71,6 +102,25 @@ CustomRect { } } } + + CustomRect { + Layout.fillWidth: true + Layout.preferredHeight: idleLayout.implicitHeight + Appearance.padding.normal * 2 + color: DynamicColors.tPalette.m3surfaceContainer + + ColumnLayout { + id: idleLayout + + anchors.left: parent.left + anchors.margins: Appearance.padding.large + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + + Settings { + name: "Idle" + } + } + } } component Settings: CustomRect { @@ -78,7 +128,7 @@ CustomRect { required property string name - Layout.preferredHeight: 42 + Layout.preferredHeight: 60 Layout.preferredWidth: 200 radius: 4 @@ -86,10 +136,10 @@ CustomRect { id: text anchors.left: parent.left - anchors.margins: Appearance.padding.smaller anchors.right: parent.right + anchors.top: parent.top font.bold: true - font.pointSize: 32 + font.pointSize: Appearance.font.size.large * 2 text: settingsItem.name verticalAlignment: Text.AlignVCenter } diff --git a/Modules/Settings/Content.qml b/Modules/Settings/Content.qml index 1037a21..e6543a1 100644 --- a/Modules/Settings/Content.qml +++ b/Modules/Settings/Content.qml @@ -13,7 +13,7 @@ Item { property string currentCategory: "general" readonly property real nonAnimHeight: view.implicitHeight + viewWrapper.anchors.margins * 2 - readonly property real nonAnimWidth: view.implicitWidth + 500 + viewWrapper.anchors.margins * 2 + readonly property real nonAnimWidth: view.implicitWidth + 700 + viewWrapper.anchors.margins * 2 required property PersistentProperties visibilities implicitHeight: nonAnimHeight diff --git a/Modules/Settings/Controls/Separator.qml b/Modules/Settings/Controls/Separator.qml new file mode 100644 index 0000000..86fcab4 --- /dev/null +++ b/Modules/Settings/Controls/Separator.qml @@ -0,0 +1,12 @@ +import QtQuick +import QtQuick.Layouts +import qs.Components +import qs.Config + +CustomRect { + id: root + + Layout.fillWidth: true + Layout.preferredHeight: 1 + color: DynamicColors.tPalette.m3outlineVariant +} diff --git a/Modules/Settings/Controls/SettingInput.qml b/Modules/Settings/Controls/SettingInput.qml new file mode 100644 index 0000000..58ffe24 --- /dev/null +++ b/Modules/Settings/Controls/SettingInput.qml @@ -0,0 +1,65 @@ +import QtQuick +import QtQuick.Layouts +import qs.Components +import qs.Config + +Item { + id: root + + required property string name + required property var object + required property string setting + + function formattedValue(): string { + const value = root.object[root.setting]; + + console.log(value); + if (value === null || value === undefined) + return ""; + + return String(value); + } + + Layout.fillWidth: true + Layout.preferredHeight: row.implicitHeight + Appearance.padding.smaller * 2 + + RowLayout { + id: row + + anchors.left: parent.left + anchors.margins: Appearance.padding.small + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + + CustomText { + id: text + + Layout.alignment: Qt.AlignLeft + Layout.fillWidth: true + font.pointSize: Appearance.font.size.larger + text: root.name + } + + CustomRect { + id: rect + + Layout.preferredHeight: 33 + Layout.preferredWidth: Math.max(Math.min(textField.contentWidth + Appearance.padding.normal * 3, 200), 50) + color: DynamicColors.tPalette.m3surface + radius: Appearance.rounding.small + + CustomTextField { + id: textField + + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + text: root.formattedValue() + + onEditingFinished: { + root.object[root.setting] = textField.text; + Config.save(); + } + } + } + } +} diff --git a/Modules/Settings/Controls/SettingList.qml b/Modules/Settings/Controls/SettingList.qml new file mode 100644 index 0000000..daec7b0 --- /dev/null +++ b/Modules/Settings/Controls/SettingList.qml @@ -0,0 +1,155 @@ +import QtQuick +import QtQuick.Layouts +import qs.Components +import qs.Config + +Item { + id: root + + required property list modelData + required property string name + + Layout.fillWidth: true + Layout.preferredHeight: row.implicitHeight + Appearance.padding.smaller * 2 + + RowLayout { + id: row + + anchors.left: parent.left + anchors.margins: Appearance.padding.small + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + + CustomText { + id: text + + Layout.alignment: Qt.AlignLeft + Layout.fillWidth: true + font.pointSize: Appearance.font.size.larger + text: root.name + } + + VSeparator { + } + + ColumnLayout { + id: cLayout + + RowLayout { + id: timeLayout + + Layout.fillWidth: true + + CustomText { + id: timeText + + Layout.fillWidth: true + text: root.modelData.name + } + + CustomRect { + id: timeRect + + Layout.preferredHeight: 33 + Layout.preferredWidth: Math.max(Math.min(timeField.contentWidth + Appearance.padding.normal * 3, 200), 50) + color: DynamicColors.tPalette.m3surface + radius: Appearance.rounding.small + + CustomTextField { + id: timeField + + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + text: root.modelData.timeout + + onEditingFinished: { + root.modelData.timeout = timeField.text; + Config.save(); + } + } + } + } + + Separator { + } + + RowLayout { + id: idleLayout + + Layout.fillWidth: true + + CustomText { + id: idleText + + Layout.fillWidth: true + text: root.modelData.name + } + + CustomRect { + id: idleRect + + Layout.preferredHeight: 33 + Layout.preferredWidth: Math.max(Math.min(idleField.contentWidth + Appearance.padding.normal * 3, 200), 50) + color: DynamicColors.tPalette.m3surface + radius: Appearance.rounding.small + + CustomTextField { + id: idleField + + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + text: root.modelData.idleAction + + onEditingFinished: { + root.modelData.idleAction = idleField.text; + Config.save(); + } + } + } + } + + Separator { + } + + Loader { + id: loader + + Layout.fillWidth: true + active: root.modelData.activeAction ?? false + + RowLayout { + id: actionLayout + + CustomText { + id: actionText + + Layout.fillWidth: true + text: root.modelData.name + } + + CustomRect { + id: actionRect + + Layout.preferredHeight: 33 + Layout.preferredWidth: Math.max(Math.min(actionField.contentWidth + Appearance.padding.normal * 3, 200), 50) + color: DynamicColors.tPalette.m3surface + radius: Appearance.rounding.small + + CustomTextField { + id: actionField + + anchors.centerIn: parent + horizontalAlignment: Text.AlignHCenter + text: root.modelData.activeAction + + onEditingFinished: { + root.modelData.activeAction = actionField.text; + Config.save(); + } + } + } + } + } + } + } +} diff --git a/Modules/Settings/Controls/SettingSwitch.qml b/Modules/Settings/Controls/SettingSwitch.qml index 524e740..09cff93 100644 --- a/Modules/Settings/Controls/SettingSwitch.qml +++ b/Modules/Settings/Controls/SettingSwitch.qml @@ -3,7 +3,7 @@ import QtQuick.Layouts import qs.Components import qs.Config -RowLayout { +Item { id: root required property string name @@ -11,26 +11,35 @@ RowLayout { required property string setting Layout.fillWidth: true - Layout.preferredHeight: 42 + Layout.preferredHeight: row.implicitHeight + Appearance.padding.smaller * 2 - CustomText { - id: text + RowLayout { + id: row - Layout.alignment: Qt.AlignLeft - Layout.fillWidth: true - font.pointSize: 16 - text: root.name - } + anchors.left: parent.left + anchors.margins: Appearance.padding.small + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter - CustomSwitch { - id: cswitch + CustomText { + id: text - Layout.alignment: Qt.AlignRight - checked: root.object[root.setting] + Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter + Layout.fillWidth: true + font.pointSize: Appearance.font.size.larger + text: root.name + } - onToggled: { - root.object[root.setting] = checked; - Config.save(); + CustomSwitch { + id: cswitch + + Layout.alignment: Qt.AlignRight | Qt.AlignVCenter + checked: root.object[root.setting] + + onToggled: { + root.object[root.setting] = checked; + Config.save(); + } } } } diff --git a/Modules/Settings/Controls/VSeparator.qml b/Modules/Settings/Controls/VSeparator.qml new file mode 100644 index 0000000..c7d507e --- /dev/null +++ b/Modules/Settings/Controls/VSeparator.qml @@ -0,0 +1,12 @@ +import QtQuick +import QtQuick.Layouts +import qs.Components +import qs.Config + +CustomRect { + id: root + + Layout.fillHeight: true + Layout.preferredWidth: 1 + color: DynamicColors.tPalette.m3outlineVariant +}