feat(GODT-2767): unified colorScheme management. [skip-ci]

This commit is contained in:
Xavier Michelon
2023-08-11 09:52:29 +02:00
parent bb5a91ee6d
commit 7355c7dfd6
11 changed files with 75 additions and 87 deletions

View File

@ -47,11 +47,11 @@ ApplicationWindow {
}
function showSetup(user, address) {
contentLayout.currentIndex = 1;
setupWizard.startClientConfig(user, address)
setupWizard.showClientConfig(user, address)
}
function showSignIn(username) {
contentLayout.currentIndex = 1;
setupWizard.startLogin(username)
setupWizard.showLogin(username)
}
function showWebViewOverlay(url) {
@ -69,12 +69,12 @@ ApplicationWindow {
if (!u) {
console.trace();
console.log("empty user");
setupWizard.start();
setupWizard.showOnboarding();
return;
}
if ((userCount === 1) && (u.state === EUserState.SignedOut)) {
setupWizard.startLogin(u.primaryEmailOrUsername());
setupWizard.showLogin(u.primaryEmailOrUsername());
}
}

View File

@ -128,7 +128,7 @@ T.Button {
return control.colorScheme.text_norm;
}
}
colorScheme: root.colorScheme
colorScheme: control.colorScheme
elide: Text.ElideRight
horizontalAlignment: Qt.AlignHCenter
opacity: control.enabled || control.loading ? 1.0 : 0.5

View File

@ -20,7 +20,6 @@ import Proton
Item {
id: root
property ColorScheme colorScheme: wizard.colorScheme
readonly property bool onMacOS: (Backend.goos === "darwin")
readonly property bool onWindows: (Backend.goos === "windows")
property var wizard
@ -34,7 +33,7 @@ Item {
Label {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Pick your version of Outlook")
type: Label.LabelType.Heading
}
@ -43,7 +42,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-microsoft-outlook.svg"
text: "Outlook from Microsoft 365"
@ -54,7 +53,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-microsoft-outlook.svg"
text: "Outlook 2019"
@ -65,7 +64,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-microsoft-outlook.svg"
text: "Outlook 2016"
@ -79,7 +78,7 @@ Item {
}
Button {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
secondary: true
text: qsTr("Cancel")

View File

@ -21,7 +21,6 @@ import ".."
Rectangle {
id: root
property var wizard
property ColorScheme colorScheme: wizard.colorScheme
color: colorScheme.background_weak
readonly property bool genericClient: SetupWizard.Client.Generic === wizard.client
@ -42,7 +41,7 @@ Rectangle {
Label {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: qsTr("Configure %1").arg(wizard.clientName())
type: Label.LabelType.Heading
@ -54,7 +53,7 @@ Rectangle {
Layout.fillWidth: true
Layout.topMargin: 8
color: colorScheme.text_weak
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: genericClient ? qsTr("Here are the IMAP and SMTP configuration parameters for your email client") :
qsTr("Here are your email configuration parameters for %1. \nWe have prepared an easy to follow configuration guide to help you setup your account in %1.").arg(wizard.clientName())
@ -70,7 +69,7 @@ Rectangle {
spacing: 64
Configuration {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
hostname: Backend.hostname
password: wizard.user ? wizard.user.password : ""
port: Backend.imapPort.toString()
@ -80,7 +79,7 @@ Rectangle {
}
Configuration {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
hostname: Backend.hostname
password: wizard.user ? wizard.user.password : ""
port: Backend.smtpPort.toString()
@ -94,7 +93,7 @@ Rectangle {
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: 444
Layout.topMargin: 32
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Open configuration guide")
visible: !genericClient
}
@ -103,7 +102,7 @@ Rectangle {
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: 444
Layout.topMargin: 32
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Done")
onClicked: wizard.closeWizard()
}
@ -114,7 +113,7 @@ Rectangle {
anchors.bottom: parent.bottom
anchors.bottomMargin: 48
anchors.right: parent.right
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignRight
text: link("#", qsTr("Report problem"))

View File

@ -20,7 +20,6 @@ import Proton
Item {
id: root
property ColorScheme colorScheme: wizard.colorScheme
readonly property bool onMacOS: (Backend.goos === "darwin")
readonly property bool onWindows: (Backend.goos === "windows")
property var wizard
@ -34,7 +33,7 @@ Item {
Label {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Select your email application")
type: Label.LabelType.Heading
}
@ -43,7 +42,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-apple-mail.svg"
text: "Apple Mail"
visible: root.onMacOS
@ -54,7 +53,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-microsoft-outlook.svg"
text: "Microsoft Outlook"
visible: root.onMacOS || root.onWindows
@ -66,7 +65,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-mozilla-thunderbird.svg"
text: "Mozilla Thunderbird"
@ -77,7 +76,7 @@ Item {
}
ClientListItem {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
iconSource: "/qml/icons/ic-other-mail-clients.svg"
text: "Other"
@ -91,7 +90,7 @@ Item {
}
Button {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
secondary: true
text: qsTr("Cancel")

View File

@ -39,7 +39,6 @@ import Proton
Item {
id: root
property ColorScheme colorScheme: wizard.colorScheme
property var wizard
ColumnLayout {
@ -50,7 +49,7 @@ Item {
Label {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: qsTr("A word of warning")
type: Label.LabelType.Heading
@ -63,7 +62,7 @@ Item {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
horizontalAlignment: Text.AlignHCenter
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Do not enter your Proton account password in you email application.")
type: Label.LabelType.Body
wrapMode: Text.WordWrap
@ -74,7 +73,7 @@ Item {
Label {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: qsTr("We have generated a new password for you. It will work only on this computer, and can safely be entered in your email client.")
type: Label.LabelType.Body
@ -85,7 +84,7 @@ Item {
}
Button {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("I understand")
onClicked: {
@ -97,7 +96,7 @@ Item {
}
Button {
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
secondary: true
text: qsTr("Cancel")

View File

@ -21,7 +21,6 @@ import ".."
Item {
id: root
property var wizard
property ColorScheme colorScheme
function showClientSelector() {
titleLabel.text = qsTr("Configure your email client");
@ -71,7 +70,7 @@ Item {
}
function showLoginMailboxPassword() {
root.description = qsTr("You have secured your account with a separate mailbox password.");
descriptionLabel.text = qsTr("You have secured your account with a separate mailbox password.");
linkLabel1.clear();
linkLabel2.clear();
showLoginCommon();
@ -127,7 +126,7 @@ Item {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
Layout.topMargin: 16
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: ""
type: Label.LabelType.Heading
@ -138,7 +137,7 @@ Item {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
Layout.topMargin: 96
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: ""
type: Label.LabelType.Body
@ -148,14 +147,14 @@ Item {
id: linkLabel1
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: 96
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
visible: (text !== "")
}
LinkLabel {
id: linkLabel2
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: 16
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
visible: (text !== "")
}
}

View File

@ -20,7 +20,7 @@ import Proton
FocusScope {
id: root
property ColorScheme colorScheme
property var wizard
property alias currentIndex: stackLayout.currentIndex
property alias username: usernameTextField.text
@ -141,7 +141,7 @@ FocusScope {
Label {
Layout.alignment: Qt.AlignHCenter
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Sign in")
type: Label.LabelType.Heading
}
@ -149,8 +149,8 @@ FocusScope {
id: subTitle
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: 8
color: root.colorScheme.text_weak
colorScheme: root.colorScheme
color: wizard.colorScheme.text_weak
colorScheme: wizard.colorScheme
text: qsTr("Enter your Proton Account details.")
type: Label.LabelType.Lead
}
@ -161,7 +161,7 @@ FocusScope {
visible: errorLabel.text.length > 0
ColorImage {
color: root.colorScheme.signal_danger
color: wizard.colorScheme.signal_danger
height: errorLabel.lineHeight
source: "/qml/icons/ic-exclamation-circle-filled.svg"
sourceSize.height: errorLabel.lineHeight
@ -170,8 +170,8 @@ FocusScope {
id: errorLabel
Layout.fillWidth: true
Layout.leftMargin: 4
color: root.colorScheme.signal_danger
colorScheme: root.colorScheme
color: wizard.colorScheme.signal_danger
colorScheme: wizard.colorScheme
type: root.error ? Label.LabelType.Caption_semibold : Label.LabelType.Caption
wrapMode: Text.WordWrap
}
@ -180,7 +180,7 @@ FocusScope {
id: usernameTextField
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
focus: true
label: qsTr("Email or username")
validateOnEditingFinished: false
@ -204,7 +204,7 @@ FocusScope {
id: passwordTextField
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
echoMode: TextInput.Password
label: qsTr("Password")
validateOnEditingFinished: false
@ -240,7 +240,7 @@ FocusScope {
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !loading
text: loading ? qsTr("Signing in") : qsTr("Sign in")
@ -251,7 +251,7 @@ FocusScope {
Button {
Layout.fillWidth: true
Layout.topMargin: 32
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !signInButton.loading
secondary: true
text: qsTr("Cancel")
@ -275,7 +275,7 @@ FocusScope {
Label {
Layout.alignment: Qt.AlignCenter
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Two-factor authentication")
type: Label.LabelType.Heading
}
@ -283,8 +283,8 @@ FocusScope {
id: twoFactorUsernameLabel
Layout.alignment: Qt.AlignCenter
Layout.topMargin: 8
color: root.colorScheme.text_weak
colorScheme: root.colorScheme
color: wizard.colorScheme.text_weak
colorScheme: wizard.colorScheme
type: Label.LabelType.Lead
}
TextField {
@ -292,7 +292,7 @@ FocusScope {
Layout.fillWidth: true
Layout.topMargin: 32
assistiveText: qsTr("Enter the 6-digit code")
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
label: qsTr("Two-factor code")
validateOnEditingFinished: false
validator: function (str) {
@ -314,7 +314,7 @@ FocusScope {
id: twoFAButton
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !loading
text: loading ? qsTr("Authenticating") : qsTr("Authenticate")
@ -331,7 +331,7 @@ FocusScope {
Button {
Layout.fillWidth: true
Layout.topMargin: 32
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !twoFAButton.loading
secondary: true
text: qsTr("Cancel")
@ -355,22 +355,22 @@ FocusScope {
Label {
Layout.alignment: Qt.AlignCenter
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Unlock your mailbox")
type: Label.LabelType.Heading
}
Label {
Layout.alignment: Qt.AlignCenter
Layout.topMargin: 8
color: root.colorScheme.text_weak
colorScheme: root.colorScheme
color: wizard.colorScheme.text_weak
colorScheme: wizard.colorScheme
type: Label.LabelType.Lead
}
TextField {
id: secondPasswordTextField
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
echoMode: TextInput.Password
label: qsTr("Mailbox password")
validateOnEditingFinished: false
@ -388,7 +388,7 @@ FocusScope {
id: secondPasswordButton
Layout.fillWidth: true
Layout.topMargin: 48
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !loading
text: loading ? qsTr("Unlocking") : qsTr("Unlock")
@ -405,7 +405,7 @@ FocusScope {
Button {
Layout.fillWidth: true
Layout.topMargin: 32
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
enabled: !secondPasswordButton.loading
secondary: true
text: qsTr("Cancel")

View File

@ -19,10 +19,7 @@ import "." as Proton
Item {
id: root
property ColorScheme colorScheme
signal onboardingAccepted
property var wizard
ColumnLayout {
anchors.left: parent.left
@ -33,20 +30,20 @@ Item {
Label {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
horizontalAlignment: Text.AlignHCenter
text: qsTr("Two-step process")
type: Label.LabelType.Heading
}
StepDescriptionBox {
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
description: qsTr("Connect Bridge to your Proton account")
icon: "/qml/icons/ic-bridge.svg"
iconSize: 48
title: qsTr("Step 1")
}
StepDescriptionBox {
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
description: qsTr("Connect your email client to Bridge")
icon: "/qml/icons/img-mail-clients.svg"
iconSize: 64
@ -55,10 +52,10 @@ Item {
Button {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
colorScheme: root.colorScheme
colorScheme: wizard.colorScheme
text: qsTr("Let's start")
onClicked: root.onboardingAccepted();
onClicked: wizard.showLogin();
}
}
}

View File

@ -91,13 +91,13 @@ Item {
rightContent.currentIndex = SetupWizard.ContentStack.ClientConfigOutlookSelector;
}
function start() {
function showOnboarding() {
rootStackLayout.currentIndex = SetupWizard.RootStack.TwoPanesView;
leftContent.showOnboarding();
rightContent.currentIndex = SetupWizard.ContentStack.Onboarding;
}
function startClientConfig(user, address) {
function showClientConfig(user, address) {
root.user = user
root.address = address
rootStackLayout.currentIndex = SetupWizard.RootStack.TwoPanesView;
@ -105,7 +105,7 @@ Item {
rightContent.currentIndex = SetupWizard.ContentStack.ClientConfigSelector;
}
function startLogin(username = "") {
function showLogin(username = "") {
rootStackLayout.currentIndex = SetupWizard.RootStack.TwoPanesView;
root.address = "";
leftContent.showLogin();
@ -133,7 +133,7 @@ Item {
}
let user = Backend.users.get(userIndex)
let address = user ? user.addresses[0] : ""
startClientConfig(user, address);
showClientConfig(user, address);
}
target: Backend
@ -143,7 +143,7 @@ Item {
id: rootStackLayout
anchors.fill: parent
// rootStackLayout index 0 SetupWizard.RootStack.TwoPanesView
// rootStackLayout index 0
RowLayout {
Layout.fillHeight: true
Layout.fillWidth: true
@ -164,7 +164,6 @@ Item {
anchors.top: parent.top
anchors.topMargin: 96
clip: true
colorScheme: root.colorScheme
width: 444
wizard: root
}
@ -196,42 +195,40 @@ Item {
currentIndex: 0
width: 444
// stack index 0
// rightContent stack index 0
Onboarding {
Layout.fillHeight: true
Layout.fillWidth: true
colorScheme: root.colorScheme
onOnboardingAccepted: root.startLogin()
wizard: root
}
// stack index 1
// rightContent tack index 1
Login {
id: login
Layout.fillHeight: true
Layout.fillWidth: true
colorScheme: root.colorScheme
wizard: root
onLoginAbort: {
root.closeWizard();
}
}
// stack index 2
// rightContent stack index 2
ClientConfigSelector {
id: clientConfigSelector
Layout.fillHeight: true
Layout.fillWidth: true
wizard: root
}
// stack index 3
// rightContent stack index 3
ClientConfigOutlookSelector {
id: clientConfigOutlookSelector
Layout.fillHeight: true
Layout.fillWidth: true
wizard: root
}
// stack index 4
// rightContent stack index 4
ClientConfigWarning {
id: clientConfigWarning
Layout.fillHeight: true
@ -257,7 +254,7 @@ Item {
}
}
// rootStackLayout index 1 SetupWizard.RootStack.ClientConfigParameters
// rootStackLayout index 1
ClientConfigParameters {
id: clientConfigParameters
Layout.fillHeight: true

View File

@ -37,7 +37,6 @@ Item {
Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
Layout.preferredHeight: iconSize
Layout.preferredWidth: iconSize
antialiasing: true
mipmap: true
source: root.icon
}