lilith/jami-client-qt
1
0
Fork 0
mirror of https://git.jami.net/savoirfairelinux/jami-client-qt.git synced 2025-07-14 12:35:23 +02:00
Code Activity

DeleteAccountDialog: new design

Browse source 
GitLab: #1417
Change-Id: I4f701c130722f4c25ea4d13525ab111368139f98
This commit is contained in:
cberthet 2023-11-07 14:55:34 -05:00 • committed by Sébastien Blin
parent 17d6d56af4
commit a6b7ef76f8
4 changed files with 193 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
resources/icons/notification_important_24dp.svg Normal file
View file

@ -0,0 +1,3 @@
<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>
Side by side

After

Width:  |  Height:  |  Size: 424 B

220
src/app/commoncomponents/DeleteAccountDialog.qml
View file

@ -26,8 +26,6 @@ BaseModalDialog {
id: root
property bool isSIP: false
property string bestName: ""
property string accountId: ""
signal accepted
@ -35,6 +33,7 @@ BaseModalDialog {
closeButtonVisible: false
button1.text: JamiStrings.optionDelete
button1Role: DialogButtonBox.DestructiveRole
button1.onClicked: {
button1.enabled = false;
@ -43,9 +42,12 @@ BaseModalDialog {
close();
accepted();
}
button2.text: JamiStrings.optionCancel
button2Role: DialogButtonBox.RejectRole
button2.onClicked: close();
button1.contentColorProvider: JamiTheme.deleteRedButton
BusyIndicator {
id: busyInd
@ -61,12 +63,14 @@ BaseModalDialog {
popupContent: ColumnLayout {
id: deleteAccountContentColumnLayout
anchors.centerIn: parent
spacing: 10
Label {
id: labelDeletion
Layout.alignment: Qt.AlignHCenter
Layout.alignment: Qt.AlignLeft
Layout.maximumWidth: root.width - 4*JamiTheme.preferredMarginSize
Layout.bottomMargin: 5
color: JamiTheme.textColor
text: JamiStrings.confirmDeleteQuestion
@ -77,54 +81,200 @@ BaseModalDialog {
wrapMode: Text.Wrap
}
Label {
id: labelBestId
Rectangle {
id: accountRectangle
Layout.alignment: Qt.AlignHCenter
color: JamiTheme.backgroundRectangleColor
color: JamiTheme.textColor
text: bestName
Layout.preferredWidth: parent.width
Layout.preferredHeight: userProfileDialogLayout.height
Layout.maximumWidth: root.width - 80
font.pointSize: JamiTheme.textFontSize
font.kerning: true
font.bold: true
wrapMode: Text.Wrap
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
// 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
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.kerning: true
color: JamiTheme.faddedFontColor
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
radius: 5
color: root.backgroundColor
Layout.preferredHeight: accountId.height + 10
Layout.margins: 10
Layout.topMargin: 0
RowLayout {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
spacing: 20
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.kerning: true
color: JamiTheme.textColor
elide: Text.ElideRight
text: CurrentAccount.uri
horizontalAlignment: Text.AlignLeft
verticalAlignment: Text.AlignVCenter
}
}
}
}
}
Rectangle {
id: warningRectangle
Label {
id: labelAccountHash
color: JamiTheme.warningRedRectangle
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: root.width - 4*JamiTheme.preferredMarginSize
Layout.preferredWidth: parent.width
Layout.preferredHeight: labelWarning.height + 20
Layout.maximumWidth: root.width - 80
color: JamiTheme.textColor
text: accountId
radius: 5
font.pointSize: JamiTheme.textFontSize
font.kerning: true
RowLayout{
id: warningLayout
horizontalAlignment: Text.AlignHCenter
wrapMode: Text.Wrap
}
anchors.centerIn: parent
anchors.margins: 15
width: accountRectangle.width
Label {
id: labelWarning
Image{
id: warningIcon
visible: !isSIP
Layout.fillWidth: true
Layout.leftMargin: 15
Layout.alignment: Qt.AlignHCenter
Layout.preferredWidth: root.width - 4*JamiTheme.preferredMarginSize
source: JamiResources.notification_important_24dp_svg
fillMode: Image.PreserveAspectFit
}
text: JamiStrings.deleteAccountInfos
Label {
id: labelWarning
font.pointSize: JamiTheme.textFontSize
font.kerning: true
Layout.fillWidth: true
Layout.margins: 15
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
visible: !isSIP
color: JamiTheme.redColor
text: JamiStrings.deleteAccountInfos
font.pointSize: JamiTheme.textFontSize
font.kerning: true
horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter
wrapMode: Text.Wrap
color: JamiTheme.redColor
}
}
}
}
}

5
src/app/constant/JamiTheme.qml
View file

@ -88,6 +88,8 @@ Item {
property color popupOverlayColor: darkTheme ? Qt.rgba(255, 255, 255, 0.22) : Qt.rgba(0, 0, 0, 0.33)
property real formsRadius: 30
property color warningRedRectangle: darkTheme ? "#3c131a" : "#fae5e8"
// Side panel
property color presenceGreen: "#4cd964"
property color notificationRed: "#ff3b30"
@ -140,6 +142,9 @@ Item {
property color redButtonColor: darkTheme ? "#FA2E30" : "#CC0022"
property color backgroundRectangleColor: darkTheme ? "#333333" : "#F0EFEF"
property color deleteRedButton: "#CC0022"
// Jami switch
property color switchBackgroundCheckedColor: "#8dbaea"
property color switchBackgroundColor: darkTheme ? "#626262" : "#E5EEF5"

2
src/app/settingsview/components/ManageAccountPage.qml
View file

@ -467,8 +467,6 @@ SettingsPageBase {
onClicked: {
var dlg = viewCoordinator.presentDialog(appWindow, "commoncomponents/DeleteAccountDialog.qml", {
"isSIP": CurrentAccount.type === Profile.Type.SIP,
"bestName": CurrentAccount.bestName,
"accountId": CurrentAccount.uri
});
dlg.accepted.connect(navigateToMainView);
}