Skip to content
Snippets Groups Projects
Commit a6b7ef76 authored by Capucine Berthet's avatar Capucine Berthet Committed by Sébastien Blin
Browse files

DeleteAccountDialog: new design 

GitLab: #1417
Change-Id: I4f701c130722f4c25ea4d13525ab111368139f98
parent 17d6d56a
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
resources/icons/notification_important_24dp.svg 0 → 100644
+ 3
− 0
View file @ a6b7ef76
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="21.5" viewBox="0 0 18 21.5">
<path id="notification_important_black_24dp" d="M10.01,21.01a1.99,1.99,0,0,0,3.98,0ZM12,6a5,5,0,0,1,5,5v7H7V11A5,5,0,0,1,12,6Zm0-4.5A1.5,1.5,0,0,0,10.5,3V4.17A6.993,6.993,0,0,0,5,11v6L3,19v1H21V19l-2-2V11a6.993,6.993,0,0,0-5.5-6.83V3A1.5,1.5,0,0,0,12,1.5ZM11,8h2v4H11Zm0,6h2v2H11Z" transform="translate(-3 -1.5)" fill="#c02"/>
</svg>
src/app/commoncomponents/DeleteAccountDialog.qml
+ 185
− 35
View file @ a6b7ef76
...@@ -26,8 +26,6 @@ BaseModalDialog { ...@@ -26,8 +26,6 @@ BaseModalDialog {
id: root id: root
property bool isSIP: false property bool isSIP: false
property string bestName: ""
property string accountId: ""
signal accepted signal accepted
...@@ -35,6 +33,7 @@ BaseModalDialog { ...@@ -35,6 +33,7 @@ BaseModalDialog {
closeButtonVisible: false closeButtonVisible: false
button1.text: JamiStrings.optionDelete button1.text: JamiStrings.optionDelete
button1Role: DialogButtonBox.DestructiveRole button1Role: DialogButtonBox.DestructiveRole
button1.onClicked: { button1.onClicked: {
button1.enabled = false; button1.enabled = false;
...@@ -43,9 +42,12 @@ BaseModalDialog { ...@@ -43,9 +42,12 @@ BaseModalDialog {
close(); close();
accepted(); accepted();
} }
button2.text: JamiStrings.optionCancel button2.text: JamiStrings.optionCancel
button2Role: DialogButtonBox.RejectRole button2Role: DialogButtonBox.RejectRole
button2.onClicked: close(); button2.onClicked: close();
button1.contentColorProvider: JamiTheme.deleteRedButton
BusyIndicator { BusyIndicator {
id: busyInd id: busyInd
...@@ -61,12 +63,14 @@ BaseModalDialog { ...@@ -61,12 +63,14 @@ BaseModalDialog {
popupContent: ColumnLayout { popupContent: ColumnLayout {
id: deleteAccountContentColumnLayout id: deleteAccountContentColumnLayout
anchors.centerIn: parent anchors.centerIn: parent
spacing: 10
Label { Label {
id: labelDeletion id: labelDeletion
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignLeft
Layout.maximumWidth: root.width - 4*JamiTheme.preferredMarginSize Layout.maximumWidth: root.width - 4*JamiTheme.preferredMarginSize
Layout.bottomMargin: 5
color: JamiTheme.textColor color: JamiTheme.textColor
text: JamiStrings.confirmDeleteQuestion text: JamiStrings.confirmDeleteQuestion
...@@ -77,43 +81,187 @@ BaseModalDialog { ...@@ -77,43 +81,187 @@ BaseModalDialog {
wrapMode: Text.Wrap wrapMode: Text.Wrap
} }
Label { Rectangle {
id: labelBestId id: accountRectangle
color: JamiTheme.backgroundRectangleColor
Layout.preferredWidth: parent.width
Layout.preferredHeight: userProfileDialogLayout.height
Layout.maximumWidth: root.width - 80
radius: 5
ColumnLayout {
id: userProfileDialogLayout
anchors.centerIn: parent
width: parent.width
RowLayout {
Layout.margins: 10
Layout.fillWidth: true
spacing: 10
Avatar {
id: currentAccountImage
Layout.preferredWidth: 56
Layout.preferredHeight: 56
imageId: CurrentAccount.id
showPresenceIndicator: false
mode: Avatar.Mode.Account
}
ColumnLayout {
spacing: 10
Layout.alignment: Qt.AlignLeft
Layout.alignment: Qt.AlignHCenter // Visible when user alias is not empty and not equal to id.
TextEdit {
id: accountAlias
Layout.alignment: Qt.AlignLeft
font.pointSize: JamiTheme.settingsFontSize
font.kerning: true
color: JamiTheme.textColor color: JamiTheme.textColor
text: bestName visible: accountDisplayName.text ? (CurrentAccount.alias === CurrentAccount.bestId ? false : true) : false
selectByMouse: true
readOnly: true
wrapMode: Text.NoWrap
text: textMetricsAccountAliasText.elidedText
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
TextMetrics {
id: textMetricsAccountAliasText
font: accountAlias.font
text: CurrentAccount.alias
elideWidth: root.width - 200
elide: Qt.ElideMiddle
}
}
// Visible when user name is not empty or equals to id.
TextEdit {
id: accountDisplayName
Layout.alignment: Qt.AlignLeft
font.pointSize: JamiTheme.textFontSize font.pointSize: JamiTheme.textFontSize
font.kerning: true font.kerning: true
font.bold: true color: JamiTheme.faddedFontColor
wrapMode: Text.Wrap
visible: text.length && text !== CurrentAccount.alias
readOnly: true
selectByMouse: true
wrapMode: Text.NoWrap
text: textMetricsAccountDisplayNameText.elidedText
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
TextMetrics {
id: textMetricsAccountDisplayNameText
font: accountDisplayName.font
text: CurrentAccount.bestId
elideWidth: root.width - 200
elide: Qt.ElideMiddle
} }
}
}
}
Rectangle {
Layout.fillWidth: true
Label { radius: 5
id: labelAccountHash color: root.backgroundColor
Layout.alignment: Qt.AlignHCenter Layout.preferredHeight: accountId.height + 10
Layout.preferredWidth: root.width - 4*JamiTheme.preferredMarginSize Layout.margins: 10
Layout.topMargin: 0
RowLayout {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
color: JamiTheme.textColor spacing: 20
text: accountId
Text {
id: identifierText
font.pointSize: JamiTheme.textFontSize
text: JamiStrings.identifier
color: JamiTheme.faddedFontColor
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
Layout.leftMargin: JamiTheme.preferredMarginSize
}
Label {
id: accountId
Layout.alignment: Qt.AlignLeft
Layout.preferredWidth: root.width - 250
Layout.rightMargin: JamiTheme.preferredMarginSize
font.pointSize: JamiTheme.textFontSize font.pointSize: JamiTheme.textFontSize
font.kerning: true font.kerning: true
color: JamiTheme.textColor
horizontalAlignment: Text.AlignHCenter elide: Text.ElideRight
wrapMode: Text.Wrap text: CurrentAccount.uri
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
}
}
}
}
}
Rectangle {
id: warningRectangle
color: JamiTheme.warningRedRectangle
Layout.preferredWidth: parent.width
Layout.preferredHeight: labelWarning.height + 20
Layout.maximumWidth: root.width - 80
radius: 5
RowLayout{
id: warningLayout
anchors.centerIn: parent
anchors.margins: 15
width: accountRectangle.width
Image{
id: warningIcon
Layout.fillWidth: true
Layout.leftMargin: 15
source: JamiResources.notification_important_24dp_svg
fillMode: Image.PreserveAspectFit
} }
Label { Label {
id: labelWarning id: labelWarning
Layout.fillWidth: true
Layout.margins: 15
visible: !isSIP visible: !isSIP
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: root.width - 4*JamiTheme.preferredMarginSize
text: JamiStrings.deleteAccountInfos text: JamiStrings.deleteAccountInfos
...@@ -128,3 +276,5 @@ BaseModalDialog { ...@@ -128,3 +276,5 @@ BaseModalDialog {
} }
} }
} }
}
}
src/app/constant/JamiTheme.qml
+ 5
− 0
View file @ a6b7ef76
...@@ -88,6 +88,8 @@ Item { ...@@ -88,6 +88,8 @@ Item {
property color popupOverlayColor: darkTheme ? Qt.rgba(255, 255, 255, 0.22) : Qt.rgba(0, 0, 0, 0.33) property color popupOverlayColor: darkTheme ? Qt.rgba(255, 255, 255, 0.22) : Qt.rgba(0, 0, 0, 0.33)
property real formsRadius: 30 property real formsRadius: 30
property color warningRedRectangle: darkTheme ? "#3c131a" : "#fae5e8"
// Side panel // Side panel
property color presenceGreen: "#4cd964" property color presenceGreen: "#4cd964"
property color notificationRed: "#ff3b30" property color notificationRed: "#ff3b30"
...@@ -140,6 +142,9 @@ Item { ...@@ -140,6 +142,9 @@ Item {
property color redButtonColor: darkTheme ? "#FA2E30" : "#CC0022" property color redButtonColor: darkTheme ? "#FA2E30" : "#CC0022"
property color backgroundRectangleColor: darkTheme ? "#333333" : "#F0EFEF"
property color deleteRedButton: "#CC0022"
// Jami switch // Jami switch
property color switchBackgroundCheckedColor: "#8dbaea" property color switchBackgroundCheckedColor: "#8dbaea"
property color switchBackgroundColor: darkTheme ? "#626262" : "#E5EEF5" property color switchBackgroundColor: darkTheme ? "#626262" : "#E5EEF5"
......
src/app/settingsview/components/ManageAccountPage.qml
+ 0
− 2
View file @ a6b7ef76
...@@ -467,8 +467,6 @@ SettingsPageBase { ...@@ -467,8 +467,6 @@ SettingsPageBase {
onClicked: { onClicked: {
var dlg = viewCoordinator.presentDialog(appWindow, "commoncomponents/DeleteAccountDialog.qml", { var dlg = viewCoordinator.presentDialog(appWindow, "commoncomponents/DeleteAccountDialog.qml", {
"isSIP": CurrentAccount.type === Profile.Type.SIP, "isSIP": CurrentAccount.type === Profile.Type.SIP,
"bestName": CurrentAccount.bestName,
"accountId": CurrentAccount.uri
}); });
dlg.accepted.connect(navigateToMainView); dlg.accepted.connect(navigateToMainView);
} }
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment