shift-shell/kcms/mobileshell/ui/AppearanceForm.qml

/*
 * SPDX-FileCopyrightText: 2026 Marco Allegretti
 * SPDX-License-Identifier: EUPL-1.2
 */

import QtQuick
import QtQuick.Layouts
import QtQuick.Controls as QQC2
import QtQuick.Dialogs as Dialogs

import org.kde.kirigami as Kirigami
import org.kde.kirigamiaddons.formcard 1 as FormCard
import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings

FormCard.FormCardPage {
    id: root

    title: i18n("Appearance")

    readonly property bool usingSchemeAccent: ShellSettings.Settings.accentColor.a === 0
    readonly property color previewAccentColor: usingSchemeAccent ? Kirigami.Theme.highlightColor : ShellSettings.Settings.accentColor
    readonly property bool wallpaperThemeActive: ShellSettings.Settings.wallpaperThemeEnabled && ShellSettings.Settings.colorScheme.indexOf("ShiftWallpaper") === 0

    Dialogs.ColorDialog {
        id: accentColorDialog

        title: i18n("Accent Color")
        selectedColor: root.previewAccentColor
        onAccepted: ShellSettings.Settings.accentColor = selectedColor
        onVisibleChanged: {
            if (visible) {
                selectedColor = root.previewAccentColor;
            }
        }
    }

    FormCard.FormHeader {
        title: i18n("Theme")
    }

    FormCard.FormCard {
        Layout.topMargin: Kirigami.Units.gridUnit

        FormCard.FormSwitchDelegate {
            id: darkThemeSwitch

            text: i18n("Dark Theme")
            description: ShellSettings.Settings.wallpaperThemeEnabled
                ? i18n("Disabled while Theme from Wallpaper is controlling light and dark mode.")
                : i18n("Use the dark Shift theme manually.")
            enabled: !ShellSettings.Settings.wallpaperThemeEnabled
            checked: ShellSettings.Settings.darkThemeEnabled
            onCheckedChanged: {
                if (checked != ShellSettings.Settings.darkThemeEnabled) {
                    ShellSettings.Settings.darkThemeEnabled = checked;
                }
            }
        }

        FormCard.FormDelegateSeparator { above: darkThemeSwitch; below: wallpaperThemeSwitch }

        FormCard.FormSwitchDelegate {
            id: wallpaperThemeSwitch

            text: i18n("Theme from Wallpaper")
            description: i18n("Automatically switch between light and dark Shift themes and generate a matching wallpaper-derived color scheme.")
            checked: ShellSettings.Settings.wallpaperThemeEnabled
            onCheckedChanged: {
                if (checked != ShellSettings.Settings.wallpaperThemeEnabled) {
                    ShellSettings.Settings.wallpaperThemeEnabled = checked;
                }
            }
        }

        FormCard.FormDelegateSeparator { above: wallpaperThemeSwitch; below: wallpaperAccentSwitch }

        FormCard.FormSwitchDelegate {
            id: wallpaperAccentSwitch

            text: i18n("Accent from Wallpaper")
            description: i18n("Use the wallpaper's extracted accent color instead of a manually selected accent.")
            checked: ShellSettings.Settings.wallpaperAccentEnabled
            onCheckedChanged: {
                if (checked != ShellSettings.Settings.wallpaperAccentEnabled) {
                    ShellSettings.Settings.wallpaperAccentEnabled = checked;
                }
            }
        }

        FormCard.FormDelegateSeparator { above: wallpaperAccentSwitch; below: accentColorDelegate }

        FormCard.AbstractFormDelegate {
            id: accentColorDelegate

            enabled: !ShellSettings.Settings.wallpaperAccentEnabled

            contentItem: RowLayout {
                spacing: Kirigami.Units.smallSpacing

                QQC2.Label {
                    Layout.fillWidth: true
                    text: i18n("Accent Color")
                    color: accentColorDelegate.enabled ? Kirigami.Theme.textColor : Kirigami.Theme.disabledTextColor
                    elide: Text.ElideRight
                }

                Rectangle {
                    Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium
                    Layout.preferredHeight: Kirigami.Units.iconSizes.smallMedium
                    radius: Math.min(width, height) / 2
                    color: root.previewAccentColor
                    border.width: 1
                    border.color: Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.28)
                }

                QQC2.ToolButton {
                    text: i18nc("@action:button", "Choose accent color")
                    icon.name: "color-picker"
                    display: QQC2.AbstractButton.IconOnly
                    enabled: accentColorDelegate.enabled
                    onClicked: accentColorDialog.open()

                    QQC2.ToolTip.visible: hovered
                    QQC2.ToolTip.text: text
                    QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
                }

                QQC2.ToolButton {
                    text: i18nc("@action:button", "Use scheme accent")
                    icon.name: "edit-clear"
                    display: QQC2.AbstractButton.IconOnly
                    enabled: accentColorDelegate.enabled && !root.usingSchemeAccent
                    onClicked: ShellSettings.Settings.resetAccentColor()

                    QQC2.ToolTip.visible: hovered
                    QQC2.ToolTip.text: text
                    QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
                }
            }
        }
    }

    FormCard.FormSectionText {
        visible: ShellSettings.Settings.wallpaperThemeEnabled
        text: root.wallpaperThemeActive
            ? i18n("Wallpaper theming is active. SHIFT is currently using %1.", ShellSettings.Settings.colorScheme)
            : i18n("Wallpaper theming is enabled, but SHIFT is still waiting for a usable wallpaper color.")
    }

    FormCard.FormCard {
        visible: ShellSettings.Settings.wallpaperThemeEnabled

        FormCard.AbstractFormDelegate {
            contentItem: RowLayout {
                spacing: Kirigami.Units.smallSpacing

                ColumnLayout {
                    Layout.fillWidth: true
                    spacing: 0

                    QQC2.Label {
                        Layout.fillWidth: true
                        text: i18n("Active Color Scheme")
                        elide: Text.ElideRight
                    }

                    QQC2.Label {
                        Layout.fillWidth: true
                        text: ShellSettings.Settings.colorScheme
                        color: Kirigami.Theme.disabledTextColor
                        elide: Text.ElideRight
                    }
                }
            }
        }

        FormCard.FormDelegateSeparator {}

        FormCard.AbstractFormDelegate {
            contentItem: RowLayout {
                spacing: Kirigami.Units.smallSpacing

                ColumnLayout {
                    Layout.fillWidth: true
                    spacing: 0

                    QQC2.Label {
                        Layout.fillWidth: true
                        text: i18n("Wallpaper Source Color")
                        elide: Text.ElideRight
                    }

                    QQC2.Label {
                        Layout.fillWidth: true
                        text: ShellSettings.Settings.wallpaperThemeColor.a === 0
                            ? i18n("Not available yet")
                            : ShellSettings.Settings.wallpaperThemeColor.toString()
                        color: Kirigami.Theme.disabledTextColor
                        elide: Text.ElideRight
                    }
                }

                Rectangle {
                    Layout.alignment: Qt.AlignVCenter
                    Layout.preferredWidth: Kirigami.Units.iconSizes.medium
                    Layout.preferredHeight: Kirigami.Units.iconSizes.medium
                    radius: Kirigami.Units.smallSpacing
                    color: ShellSettings.Settings.wallpaperThemeColor.a === 0
                        ? "transparent"
                        : ShellSettings.Settings.wallpaperThemeColor
                    border.width: 1
                    border.color: Qt.rgba(Kirigami.Theme.textColor.r, Kirigami.Theme.textColor.g, Kirigami.Theme.textColor.b, 0.28)
                }
            }
        }
    }
}