status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

(StatusSectionLayout): removed big space between header and content 

Closes 7312
This commit is contained in:
Alexandra Betouni 2022-09-13 19:17:54 +03:00 committed by Alexandra Betouni
parent 654519f5dd
commit fc3daa1451
21 changed files with 140 additions and 183 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ui/StatusQ/src/StatusQ/Components/StatusToolBar.qml
View File

@ -18,19 +18,20 @@ ToolBar {
signal notificationButtonClicked()
implicitWidth: visible ? 518 : 0
implicitHeight: visible ? 60 : 0
padding: 8
implicitHeight: visible ? 56 : 0
padding: 4
background: null
RowLayout {
anchors.fill: parent
anchors.rightMargin: 4
spacing: 0
StatusFlatButton {
icon.name: "arrow-left"
icon.width: 20
icon.height: 20
Layout.alignment: Qt.AlignLeft | Qt.AlignVCenter
Layout.leftMargin: 12
Layout.leftMargin: 18
visible: !!root.backButtonName
text: root.backButtonName
size: StatusBaseButton.Size.Large
@ -41,6 +42,7 @@ ToolBar {
id: headerContentItem
Layout.fillWidth: !!headerContent
Layout.fillHeight: !!headerContent
Layout.leftMargin: 8
background: null
contentItem: (!!headerContent) ? headerContent : null
}

30
ui/app/AppLayouts/Chat/layouts/SettingsPageLayout.qml
View File

@ -17,7 +17,6 @@ Item {
property Component content
// optional
property string previousPage
property bool dirty: false
property bool editable: false
@ -26,7 +25,6 @@ Item {
Qt.size(settingsDirtyToastMessage.implicitWidth,
settingsDirtyToastMessage.implicitHeight + settingsDirtyToastMessage.anchors.bottomMargin)
signal previousPageClicked
signal saveChangesClicked
signal resetChangesClicked
@ -48,25 +46,17 @@ Item {
anchors.fill: parent
spacing: 16
StatusIconTextButton {
implicitHeight: 32
visible: root.previousPage
spacing: 8
statusIcon: "arrow"
icon.width: 24
icon.height: 24
text: root.previousPage
font.pixelSize: 15
onClicked: root.previousPageClicked()
}
StatusBaseText {
Item {
width: parent.width
Layout.preferredHeight: 56
Layout.leftMargin: 36
text: root.title
color: Theme.palette.directColor1
font.pixelSize: 26
font.bold: true
StatusBaseText {
anchors.verticalCenter: parent.verticalCenter
text: root.title
color: Theme.palette.directColor1
font.pixelSize: 26
font.bold: true
}
}
Loader {

17
ui/app/AppLayouts/Chat/panels/communities/CommunityOverviewSettingsPanel.qml
View File

@ -34,6 +34,14 @@ StackLayout {
property bool editable: false
property bool owned: false
function updateState() {
if (editCommunityPage.dirty) {
editCommunityPage.notifyDirty();
} else {
root.currentIndex = 0;
}
}
signal edited(Item item) // item containing edited fields (name, description, logoImagePath, color, options, etc..)
signal inviteNewPeopleClicked
@ -160,7 +168,6 @@ StackLayout {
SettingsPageLayout {
id: editCommunityPage
previousPage: qsTr("Overview")
title: qsTr("Edit Community")
editable: true
@ -205,14 +212,6 @@ StackLayout {
}
}
onPreviousPageClicked: {
if (dirty) {
notifyDirty()
} else {
root.currentIndex = 0
}
}
onSaveChangesClicked: {
root.currentIndex = 0
root.edited(contentItem)

17
ui/app/AppLayouts/Chat/panels/communities/CommunityPermissionsSettingsPanel.qml
View File

@ -6,6 +6,13 @@ import "../../views/communities"
SettingsPageLayout {
id: root
property string previousPageName
function updateState() {
if (root.state === d.newPermissionViewState) {
root.state = d.welcomeViewState;
}
}
QtObject {
id: d
@ -18,23 +25,17 @@ SettingsPageLayout {
State {
name: d.welcomeViewState
PropertyChanges {target: root; title: qsTr("Permissions")}
PropertyChanges {target: root; previousPage: ""}
PropertyChanges {target: root; previousPageName: ""}
PropertyChanges {target: root; content: welcomeView}
},
State {
name: d.newPermissionViewState
PropertyChanges {target: root; title: qsTr("New permission")}
PropertyChanges {target: root; previousPage: qsTr("Permissions")}
PropertyChanges {target: root; previousPageName: qsTr("Permissions")}
PropertyChanges {target: root; content: newPermissionView}
}
]
onPreviousPageClicked: {
if(root.state === d.newPermissionViewState) {
root.state = d.welcomeViewState
}
}
// Community Permissions possible view contents:
Component {
id: welcomeView

7
ui/app/AppLayouts/Chat/views/ChatHeaderContentView.qml
View File

@ -37,12 +37,8 @@ RowLayout {
Loader {
id: loader
Layout.fillWidth: true
Layout.fillWidth: d.selectingMembers
Layout.fillHeight: true
Layout.alignment: Qt.AlignLeft
Layout.leftMargin: padding
Layout.rightMargin: Style.current.padding
sourceComponent: {
if (d.selectingMembers) return membersSelector
return statusChatInfoButton
@ -52,7 +48,6 @@ RowLayout {
RowLayout {
id: actionButtons
Layout.alignment: Qt.AlignRight
Layout.rightMargin: padding
spacing: 8
visible: !d.selectingMembers

18
ui/app/AppLayouts/Chat/views/CommunitySettingsView.qml
View File

@ -57,14 +57,17 @@ StatusSectionLayout {
signal backToCommunityClicked
signal openLegacyPopupClicked // TODO: remove me when migration to new settings is done
leftPanel: Item {
onBackButtonClicked: {
centerPanelContentLoader.item.children[d.currentIndex].updateState();
}
leftPanel: ColumnLayout {
anchors.fill: parent
ColumnLayout {
anchors {
top: parent.top
bottom: footer.top
topMargin: 16
bottomMargin: 16
horizontalCenter: parent.horizontalCenter
}
@ -138,6 +141,7 @@ StatusSectionLayout {
}
centerPanel: Loader {
id: centerPanelContentLoader
anchors.fill: parent
//anchors.margins: 32
anchors {
@ -163,7 +167,9 @@ StatusSectionLayout {
archiveSupportEnabled: root.community.historyArchiveSupportEnabled
requestToJoinEnabled: root.community.access === Constants.communityChatOnRequestAccess
pinMessagesEnabled: root.community.pinMessageAllMembersEnabled
onCurrentIndexChanged: {
root.backButtonName = (currentIndex === 1) ? qsTr("Overview") : "";
}
archiveSupportOptionVisible: root.rootStore.isCommunityHistoryArchiveSupportEnabled
editable: root.community.amISectionAdmin
@ -218,7 +224,11 @@ StatusSectionLayout {
onDeclineRequestToJoin: root.rootStore.declineRequestToJoinCommunity(id)
}
CommunityPermissionsSettingsPanel {}
CommunityPermissionsSettingsPanel {
onStateChanged: {
root.backButtonName = previousPageName;
}
}
}
}

9
ui/app/AppLayouts/CommunitiesPortal/CommunitiesPortalLayout.qml
View File

@ -47,6 +47,8 @@ StatusSectionLayout {
centerPanel: Item {
implicitWidth: parent.width
implicitHeight: parent.height
anchors.left: parent.left
anchors.leftMargin: d.layoutHMargin
clip: true
StatusScrollView {
@ -60,7 +62,6 @@ StatusSectionLayout {
spacing: 18
StatusBaseText {
Layout.leftMargin: d.layoutHMargin
text: qsTr("Find community")
font.weight: Font.Bold
font.pixelSize: d.titlePixelSize
@ -75,7 +76,6 @@ StatusSectionLayout {
StatusInput {
id: searcher
implicitWidth: 327
Layout.leftMargin: d.layoutHMargin
Layout.alignment: Qt.AlignVCenter
enabled: false // Out of scope
placeholderText: qsTr("Search")
@ -123,12 +123,10 @@ StatusSectionLayout {
CommunityTagsRow {
tags: root.communitiesStore.communityTags
Layout.leftMargin: d.layoutHMargin
Layout.fillWidth: true
}
StatusBaseText {
Layout.leftMargin: d.layoutHMargin
Layout.topMargin: 20
text: qsTr("Featured")
font.weight: Font.Bold
@ -138,7 +136,6 @@ StatusSectionLayout {
GridLayout {
id: featuredGrid
Layout.leftMargin: d.layoutHMargin
columns: 3
columnSpacing: Style.current.padding
rowSpacing: Style.current.padding
@ -163,7 +160,6 @@ StatusSectionLayout {
}
StatusBaseText {
Layout.leftMargin: d.layoutHMargin
Layout.topMargin: 20
text: qsTr("Popular")
font.weight: Font.Bold
@ -172,7 +168,6 @@ StatusSectionLayout {
}
GridLayout {
Layout.leftMargin: d.layoutHMargin
columns: 3
columnSpacing: Style.current.padding
rowSpacing: Style.current.padding

29
ui/app/AppLayouts/Profile/ProfileLayout.qml
View File

@ -21,8 +21,20 @@ StatusSectionLayout {
property var systemPalette
property var emojiPopup
backButtonName: root.store.backButtonName
notificationCount: root.store.unreadNotificationsCount
onNotificationButtonClicked: Global.openActivityCenterPopup()
onBackButtonClicked: {
switch (profileContainer.currentIndex) {
case 1:
Global.changeAppSectionBySectionType(Constants.appSection.profile, Constants.settingsSubsection.messaging)
break;
case 4:
walletView.resetStack();
break;
}
}
Component.onCompleted: {
Global.privacyModuleInst = store.privacyStore.privacyModule
}
@ -32,8 +44,8 @@ StatusSectionLayout {
readonly property int topMargin: 0
readonly property int bottomMargin: 56
readonly property int leftMargin: 48
readonly property int rightMargin: 48
readonly property int leftMargin: 64
readonly property int rightMargin: 64
readonly property int contentWidth: 560
}
@ -73,6 +85,11 @@ StatusSectionLayout {
if(visibleChildren[0] === ensContainer){
ensContainer.goToStart();
}
if (currentIndex === 1) {
root.store.backButtonName = root.store.getNameForSubsection(Constants.settingsSubsection.messaging);
} else {
root.store.backButtonName = "";
}
}
MyProfileView {
@ -92,11 +109,6 @@ StatusSectionLayout {
contactsStore: root.store.contactsStore
sectionTitle: qsTr("Contacts")
contentWidth: d.contentWidth
backButtonName: root.store.getNameForSubsection(Constants.settingsSubsection.messaging)
onBackButtonClicked: {
Global.changeAppSectionBySectionType(Constants.appSection.profile, Constants.settingsSubsection.messaging)
}
}
EnsView {
@ -125,9 +137,10 @@ StatusSectionLayout {
}
WalletView {
id: walletView
implicitWidth: parent.width
implicitHeight: parent.height
rootStore: root.store
walletStore: root.store.walletStore
emojiPopup: root.emojiPopup
sectionTitle: root.store.getNameForSubsection(Constants.settingsSubsection.wallet)

1
ui/app/AppLayouts/Profile/stores/ProfileSectionStore.qml
View File

@ -5,6 +5,7 @@ import AppLayouts.Chat.stores 1.0
QtObject {
id: root
property string backButtonName
property int unreadNotificationsCount: activityCenterList.unreadCount
property var aboutModuleInst: aboutModule

1
ui/app/AppLayouts/Profile/views/ContactsView.qml
View File

@ -66,7 +66,6 @@ SettingsContentBase {
SearchBox {
id: searchBox
anchors.left: parent.left
anchors.leftMargin: Style.current.padding
anchors.right: parent.right
placeholderText: qsTr("Search by a display name or chat key")
}

1
ui/app/AppLayouts/Profile/views/EnsWelcomeView.qml
View File

@ -20,7 +20,6 @@ Item {
id: sview
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
anchors.top: parent.top
anchors.topMargin: 24
anchors.bottom: startBtn.top
anchors.bottomMargin: Style.current.padding
anchors.left: parent.left

35
ui/app/AppLayouts/Profile/views/SettingsContentBase.qml
View File

@ -16,8 +16,6 @@ Item {
property int contentWidth
readonly property int contentHeight: (root.height - d.topHeaderHeight - d.titleRowHeight)
property string backButtonName: ""
property alias titleRowComponentLoader: loader
property list<Item> headerComponents
default property Item content
@ -25,7 +23,6 @@ Item {
property bool dirty: false
property bool saveChangesButtonEnabled: false
signal backButtonClicked()
signal baseAreaClicked()
signal saveChangesClicked()
signal resetChangesClicked()
@ -56,35 +53,10 @@ Item {
}
}
Item {
id: topHeader
anchors.left: parent.left
anchors.top: parent.top
anchors.leftMargin: -Style.current.padding
width: root.contentWidth + Style.current.padding
height: d.topHeaderHeight
StatusFlatButton {
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: Style.current.halfPadding
visible: root.backButtonName != ""
icon.name: "arrow-left"
icon.width: 20
icon.height: 20
text: root.backButtonName
size: StatusBaseButton.Size.Large
onClicked: root.backButtonClicked()
}
}
RowLayout {
id: titleRow
anchors.left: parent.left
anchors.top: topHeader.bottom
anchors.leftMargin: Style.current.padding
width: root.contentWidth - Style.current.padding
height: d.titleRowHeight
width: visible ? root.contentWidth : 0
height: visible ? d.titleRowHeight : 0
visible: root.sectionTitle !== ""
StatusBaseText {
@ -103,9 +75,8 @@ Item {
StatusScrollView {
id: scrollView
objectName: "settingsContentBaseScrollView"
anchors.top: titleRow.visible ? titleRow.bottom : topHeader.bottom
anchors.top: titleRow.visible ? titleRow.bottom : parent.top
anchors.bottom: parent.bottom
anchors.left: parent.left
anchors.topMargin: Style.current.bigPadding
padding: 0
width: root.contentWidth

16
ui/app/AppLayouts/Profile/views/WalletView.qml
View File

@ -11,7 +11,6 @@ import shared.panels 1.0
import shared.popups 1.0
import shared.status 1.0
import "../stores"
import "../controls"
import "../popups"
import "../panels"
@ -21,15 +20,16 @@ SettingsContentBase {
id: root
property var emojiPopup
property WalletStore walletStore
property var rootStore
property var walletStore
readonly property int mainViewIndex: 0;
readonly property int networksViewIndex: 1;
readonly property int accountViewIndex: 2;
readonly property int dappPermissionViewIndex: 3;
onBackButtonClicked: {
stackContainer.currentIndex = mainViewIndex
function resetStack() {
stackContainer.currentIndex = mainViewIndex;
}
StackLayout {
@ -39,22 +39,22 @@ SettingsContentBase {
currentIndex: mainViewIndex
onCurrentIndexChanged: {
root.backButtonName = ""
root.rootStore.backButtonName = ""
root.sectionTitle = qsTr("Wallet")
root.titleRowComponentLoader.sourceComponent = undefined
if(currentIndex == root.networksViewIndex) {
root.backButtonName = qsTr("Wallet")
root.rootStore.backButtonName = qsTr("Wallet")
root.sectionTitle = qsTr("Networks")
root.titleRowComponentLoader.sourceComponent = testnetModeSwitchComponent
}
else if(currentIndex == root.accountViewIndex) {
root.backButtonName = qsTr("Wallet")
root.rootStore.backButtonName = qsTr("Wallet")
root.sectionTitle = ""
}
else if(currentIndex == root.dappPermissionViewIndex) {
root.backButtonName = qsTr("Wallet")
root.rootStore.backButtonName = qsTr("Wallet")
root.sectionTitle = qsTr("DApp Permissions")
}
}

10
ui/app/AppLayouts/Wallet/WalletLayout.qml
View File

@ -64,9 +64,13 @@ Item {
anchors.top: seedPhraseWarning.bottom
height: root.height - seedPhraseWarning.height
width: root.width
backButtonName: RootStore.backButtonName
notificationCount: RootStore.unreadNotificationsCount
onNotificationButtonClicked: Global.openActivityCenterPopup()
onBackButtonClicked: {
rightPanelStackView.currentItem.resetStack();
}
Component.onCompleted: {
// Read in RootStore
// if(RootStore.firstTimeLogin){
@ -105,8 +109,8 @@ Item {
centerPanel: StackView {
id: rightPanelStackView
anchors.fill: parent
anchors.leftMargin: 49
anchors.rightMargin: 49
anchors.leftMargin: 64
anchors.rightMargin: 64
initialItem: walletContainer
replaceEnter: Transition {
NumberAnimation { property: "opacity"; from: 0; to: 1; duration: 400; easing.type: Easing.OutCubic }

14
ui/app/AppLayouts/Wallet/controls/CollectibleDetailsHeader.qml
View File

@ -11,8 +11,6 @@ import StatusQ.Controls 0.1
ColumnLayout {
id: root
signal goBack()
property alias primaryText: collectibleName.text
property alias secondaryText: collectibleId.text
property StatusAssetSettings asset: StatusAssetSettings {
@ -21,18 +19,6 @@ ColumnLayout {
isImage: true
}
StatusFlatButton {
Layout.topMargin: -Style.current.xlPadding
Layout.leftMargin: -Style.current.xlPadding
visible: root.backButtonName != ""
icon.name: "arrow-left"
icon.width: 20
icon.height: 20
text: qsTr("Assets")
size: StatusBaseButton.Size.Large
onClicked: root.goBack()
}
RowLayout {
spacing: 8
StatusSmartIdenticon {

68
ui/app/AppLayouts/Wallet/controls/NetworkFilter.qml
View File

@ -13,46 +13,50 @@ import "../popups"
Item {
id: root
implicitWidth: selectRectangle.width
implicitWidth: 130
implicitHeight: childrenRect.height
property var store
// FIXME this should be a (styled) ComboBox
StatusListItem {
id: selectRectangle
implicitWidth: 130
implicitHeight: 40
border.width: 1
border.color: Theme.palette.directColor7
color: "transparent"
objectName: "networkSelectorButton"
leftPadding: 12
rightPadding: 12
statusListItemTitle.font.pixelSize: 13
statusListItemTitle.font.weight: Font.Medium
statusListItemTitle.color: Theme.palette.baseColor1
title: store.enabledNetworks.count === store.allNetworks.count ? qsTr("All networks") : qsTr("%n network(s)", "", store.enabledNetworks.count)
components:[
StatusIcon {
width: 16
height: 16
icon: "chevron-down"
color: Theme.palette.baseColor1
}
]
onClicked: {
if (selectPopup.opened) {
selectPopup.close();
} else {
selectPopup.open();
Item {
id: selectRectangleItem
width: parent.width
height: 56
// FIXME this should be a (styled) ComboBox
StatusListItem {
implicitWidth: parent.width
implicitHeight: 40
anchors.verticalCenter: parent.verticalCenter
border.width: 1
border.color: Theme.palette.directColor7
color: "transparent"
objectName: "networkSelectorButton"
leftPadding: 12
rightPadding: 12
statusListItemTitle.font.pixelSize: 13
statusListItemTitle.font.weight: Font.Medium
statusListItemTitle.color: Theme.palette.baseColor1
title: store.enabledNetworks.count === store.allNetworks.count ? qsTr("All networks") : qsTr("%n network(s)", "", store.enabledNetworks.count)
components:[
StatusIcon {
width: 16
height: 16
icon: "chevron-down"
color: Theme.palette.baseColor1
}
]
onClicked: {
if (selectPopup.opened) {
selectPopup.close();
} else {
selectPopup.open();
}
}
}
}
Row {
anchors.top: selectRectangle.bottom
anchors.topMargin: Style.current.halfPadding
anchors.bottom: parent.bottom
anchors.right: parent.right
spacing: Style.current.smallPadding
visible: chainRepeater.count > 0
@ -71,7 +75,7 @@ Item {
NetworkSelectPopup {
id: selectPopup
x: (parent.width - width + 5)
y: (selectRectangle.height + 5)
y: (selectRectangleItem.height + 5)
layer1Networks: store.layer1Networks
layer2Networks: store.layer2Networks
testNetworks: store.testNetworks

9
ui/app/AppLayouts/Wallet/panels/WalletHeader.qml
View File

@ -24,23 +24,25 @@ Item {
property var store
property var walletStore
implicitHeight: childrenRect.height
implicitHeight: 88
GridLayout {
width: parent.width
rowSpacing: Style.current.halfPadding
columns: 2
// account + balance
Row {
RowLayout {
Layout.preferredHeight: 56
spacing: Style.current.halfPadding
StatusBaseText {
objectName: "accountName"
Layout.alignment: Qt.AlignVCenter
font.pixelSize: 28
font.bold: true
text: currentAccount.name
}
StatusBaseText {
Layout.alignment: Qt.AlignVCenter
font.pixelSize: 28
font.bold: true
color: Theme.palette.baseColor1
@ -52,7 +54,6 @@ Item {
NetworkFilter {
id: networkFilter
Layout.alignment: Qt.AlignTrailing
Layout.fillHeight: true
Layout.rowSpan: 2
store: root.walletStore
}

1
ui/app/AppLayouts/Wallet/stores/RootStore.qml
View File

@ -8,6 +8,7 @@ import shared.stores 1.0 as SharedStore
QtObject {
id: root
property string backButtonName: ""
property int unreadNotificationsCount: activityCenterList.unreadCount
property var currentAccount: Constants.isCppApp ? walletSectionAccounts.currentAccount: walletSectionCurrent
property var accounts: walletSectionAccounts.model

14
ui/app/AppLayouts/Wallet/views/RightTabView.qml
View File

@ -20,6 +20,10 @@ Item {
property var contactsStore
property var sendModal
function resetStack() {
stack.currentIndex = 0;
}
ColumnLayout {
anchors.fill: parent
@ -27,13 +31,14 @@ Item {
id: stack
Layout.fillWidth: true
Layout.preferredHeight: parent.height - footer.height
onCurrentIndexChanged: {
RootStore.backButtonName = ((currentIndex === 1) || (currentIndex === 2)) ? qsTr("Assets") : "";
}
ColumnLayout {
anchors.fill: parent
WalletHeader {
Layout.fillWidth: true
Layout.leftMargin: Style.current.padding
Layout.rightMargin: Style.current.padding
locale: RootStore.locale
currency: RootStore.currentCurrency
currentAccount: RootStore.currentAccount
@ -65,7 +70,8 @@ Item {
StackLayout {
Layout.fillWidth: true
Layout.fillHeight: true
Layout.margins: Style.current.padding
Layout.topMargin: Style.current.padding
Layout.bottomMargin: Style.current.padding
currentIndex: walletTabBar.currentIndex
AssetsView {
@ -93,13 +99,11 @@ Item {
CollectibleDetailView {
Layout.fillWidth: true
Layout.fillHeight: true
onGoBack: stack.currentIndex = 0
}
AssetsDetailView {
id: assetDetailView
Layout.fillWidth: true
Layout.fillHeight: true
onGoBack: stack.currentIndex = 0
visible: (stack.currentIndex === 2)
}
TransactionDetailView {

3
ui/app/AppLayouts/Wallet/views/collectibles/CollectibleDetailView.qml
View File

@ -15,8 +15,6 @@ import "../../controls"
Item {
id: root
signal goBack()
CollectibleDetailsHeader {
id: collectibleHeader
anchors.top: parent.top
@ -26,7 +24,6 @@ Item {
asset.isImage: true
primaryText: RootStore.collectiblesStore.name
secondaryText: RootStore.collectiblesStore.collectibleId
onGoBack: root.goBack()
}
ColumnLayout {

15
ui/imports/shared/views/AssetsDetailView.qml
View File

@ -90,21 +90,6 @@ Item {
}
}
signal goBack()
StatusFlatButton {
id: backButton
anchors.top: parent.top
anchors.left: parent.left
anchors.topMargin: -Style.current.xlPadding
anchors.leftMargin: -Style.current.xlPadding
icon.name: "arrow-left"
icon.width: 20
icon.height: 20
text: qsTr("Assets")
size: StatusBaseButton.Size.Large
onClicked: root.goBack()
}
AssetsDetailsHeader {
id: tokenDetailsHeader
anchors.top: parent.top