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

feat(StatusQ): implement overflow pattern to StatusCommunityCard

This commit is contained in:
Patryk Osmaczko 2022-10-17 09:54:29 +02:00 committed by osmaczko
parent 6893a83c95
commit 534a0d0f45
3 changed files with 32 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
ui/StatusQ/src/StatusQ/Components/StatusCommunityCard.qml
View File

@ -347,33 +347,40 @@ Rectangle {
}
}
}
// TODO: Replace by `StatusListItemTagRow` - To be done!
Row {
visible: root.categories.count > 0
StatusRollArea {
Layout.alignment: Qt.AlignVCenter
Layout.fillWidth: true
spacing: 8
clip: true
Repeater {
model: root.categories
delegate: StatusListItemTag {
border.color: Theme.palette.baseColor2
color: "transparent"
height: 24
radius: 20
closeButtonVisible: false
asset.emoji: model.emoji
asset.width: 24
asset.height: 24
asset.color: "transparent"
asset.isLetterIdenticon: true
title: model.name
titleText.font.pixelSize: 13
titleText.color: d.fontColor
visible: root.categories.count > 0
arrowsGradientColor: d.cardColor
// TODO: Replace by `StatusListItemTagRow` - To be done!
content: Row {
spacing: 8
clip: true
Repeater {
model: root.categories
delegate: StatusListItemTag {
border.color: Theme.palette.baseColor2
color: "transparent"
height: 24
radius: 20
closeButtonVisible: false
asset.emoji: model.emoji
asset.width: 24
asset.height: 24
asset.color: "transparent"
asset.isLetterIdenticon: true
title: model.name
titleText.font.pixelSize: 13
titleText.color: d.fontColor
}
}
}
}
}
} // End of content card

38
ui/app/AppLayouts/CommunitiesPortal/controls/CommunityTagsRow.qml
View File

@ -5,12 +5,9 @@ import utils 1.0
import shared.panels 1.0
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Components 0.1
import StatusQ.Popups 0.1
import StatusQ.Controls 0.1
Item {
StatusRollArea {
id: root
property string tags
@ -30,35 +27,8 @@ Item {
property ListModel tagsModel: ListModel {}
}
implicitHeight: tagsFlow.height
clip: true
StatusScrollView {
id: scroll
anchors.fill: parent
padding: 0
contentWidth: tagsFlow.width
StatusScrollBar.horizontal.policy: StatusScrollBar.AlwaysOff
StatusCommunityTags {
id: tagsFlow
model: d.tagsModel
}
}
CommunityTagsRowButton {
anchors.left: parent.left
height: parent.height
visible: scroll.contentX > 0
onClicked: scroll.flick(scroll.width, 0)
}
CommunityTagsRowButton {
anchors.right: parent.right
height: parent.height
visible: scroll.contentX + scroll.width < scroll.contentWidth
mirrored: true
onClicked: scroll.flick(-scroll.width, 0)
content: StatusCommunityTags {
id: tagsFlow
model: d.tagsModel
}
}

37
ui/app/AppLayouts/CommunitiesPortal/controls/CommunityTagsRowButton.qml
View File

@ -1,37 +0,0 @@
import QtQuick 2.14
import utils 1.0
import shared.panels 1.0
import StatusQ.Core.Theme 0.1
Rectangle {
id: root
property bool mirrored: false
signal clicked()
width: height * 3
gradient: Gradient {
orientation: Gradient.Horizontal
GradientStop { position: mirrored ? 0.0 : 1.0; color: "transparent" }
GradientStop { position: 0.5; color: Theme.palette.statusAppLayout.backgroundColor }
}
SVGImage {
source: mirrored ? Style.svg("arrow-next") : Style.svg("arrow-previous")
anchors.right: mirrored ? parent.right : undefined
anchors.left: mirrored ? undefined : parent.left
width: parent.height
height: width
}
MouseArea {
anchors.fill: parent
preventStealing: true
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: root.clicked()
}
}