fix(StatusAppChatView): Updated layout based on new designs (#765)

As part of https://github.com/status-im/status-desktop/issues/6352
This commit is contained in:
Alexandra Betouni 2022-07-13 11:58:59 +03:00 committed by Michał Cieślak
parent d9feeff1a9
commit 27491d7fee
1 changed files with 50 additions and 24 deletions

View File

@ -16,53 +16,78 @@ StatusAppThreePanelLayout {
leftPanel: Item { leftPanel: Item {
anchors.fill: parent anchors.fill: parent
anchors.margins: 16
StatusNavigationPanelHeadline {
id: headline
anchors.top: parent.top
anchors.topMargin: 16
anchors.horizontalCenter: parent.horizontalCenter
text: "Chat"
}
RowLayout { RowLayout {
id: searchInputWrapper id: searchInputWrapper
width: 288 width: parent.width
height: searchInput.height
anchors.top: headline.bottom
anchors.topMargin: 16
anchors.horizontalCenter: parent.horizontalCenter
StatusBaseInput { StatusNavigationPanelHeadline {
id: searchInput id: headline
Layout.fillWidth: true
Layout.alignment: Qt.AlignVCenter Layout.alignment: Qt.AlignVCenter
implicitHeight: 36 text: "Chat"
topPadding: 8
bottomPadding: 8
placeholderText: "Search"
icon.name: "search"
} }
StatusIconTabButton { Item {
Layout.fillWidth: true
}
StatusRoundButton {
Layout.alignment: Qt.AlignVCenter
icon.name: "public-chat" icon.name: "public-chat"
icon.color: Theme.palette.directColor1
icon.height: editBtn.icon.height
icon.width: editBtn.icon.width
implicitWidth: editBtn.implicitWidth
implicitHeight: editBtn.implicitHeight
type: StatusRoundButton.Type.Tertiary
StatusToolTip {
text: qsTr("Join public chats")
visible: parent.hovered
orientation: StatusToolTip.Orientation.Bottom
y: parent.height + 12
}
} }
StatusIconTabButton { StatusIconTabButton {
id: editBtn
icon.name: "edit" icon.name: "edit"
icon.color: Theme.palette.directColor1
checked: root.createChat
highlighted: checked
onClicked: { onClicked: {
root.createChat = !root.createChat; root.createChat = !root.createChat;
} }
StatusToolTip {
text: qsTr("Start chat")
visible: parent.hovered
orientation: StatusToolTip.Orientation.Bottom
y: parent.height + 12
}
} }
} }
Column { StatusBaseInput {
id: searchInput
anchors.top: searchInputWrapper.bottom anchors.top: searchInputWrapper.bottom
anchors.topMargin: 16 anchors.topMargin: 16
width: parent.width
implicitHeight: 36
topPadding: 8
bottomPadding: 8
placeholderText: "Search"
icon.name: "search"
}
Column {
width: parent.width
anchors.top: searchInput.bottom
anchors.topMargin: 16
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
spacing: 8 spacing: 8
StatusContactRequestsIndicatorListItem { StatusContactRequestsIndicatorListItem {
width: parent.width
anchors.horizontalCenter: parent.horizontalCenter anchors.horizontalCenter: parent.horizontalCenter
title: "Contact requests" title: "Contact requests"
requestsCount: 3 requestsCount: 3
@ -70,6 +95,7 @@ StatusAppThreePanelLayout {
} }
StatusChatList { StatusChatList {
width: parent.width
model: Models.demoChatListItems model: Models.demoChatListItems
highlightItem: !root.createChat highlightItem: !root.createChat
onChatItemUnmuted: { onChatItemUnmuted: {