mirror of
https://github.com/status-im/status-desktop.git
synced 2025-01-10 22:36:24 +00:00
7b54bf31b4
- Added functionality as experimental advanced view button feat(CommunitySettings / Permissions): Added welcome page - Enabled new permissions tab. - Created welcome page layout. - Added permissions welcome image. - Fixed top margin content in `SettingsPanelLayout` to fit designs. Closes #6036 feat(CommunitySettings/Permissions): Created `new permission` page - Added `new permission` page. - Created first card layout. - Added navigation between `welcome` and `newPermission` views. - Improvements in base community settings layout pages. Closes #6037 feat(CommunitySettings/Permissions): `Who holds` tokens dropdown component creation and integration - Tokens dropdown component creation: main view, operators view and extended view. - Logic to add new token and change operator. Part of #6038
140 lines
5.5 KiB
QML
140 lines
5.5 KiB
QML
import QtQuick 2.14
|
|
import QtQuick.Layouts 1.14
|
|
|
|
import StatusQ.Core 0.1
|
|
import StatusQ.Core.Theme 0.1
|
|
import StatusQ.Controls 0.1
|
|
|
|
import utils 1.0
|
|
|
|
Flickable {
|
|
id: root
|
|
|
|
signal addPermission()
|
|
|
|
contentWidth: mainLayout.width
|
|
contentHeight: mainLayout.height + mainLayout.anchors.topMargin
|
|
clip: true
|
|
flickableDirection: Flickable.AutoFlickIfNeeded
|
|
|
|
ColumnLayout {
|
|
id: mainLayout
|
|
width: 560 // by design
|
|
spacing: 24
|
|
|
|
Rectangle {
|
|
Layout.fillWidth: true
|
|
Layout.preferredHeight: contentColumn.implicitHeight + contentColumn.anchors.topMargin + contentColumn.anchors.bottomMargin
|
|
color: "transparent"
|
|
radius: 16
|
|
border.color: Theme.palette.baseColor5
|
|
clip: true
|
|
|
|
ColumnLayout {
|
|
id: contentColumn
|
|
anchors.fill: parent
|
|
anchors.margins: 16
|
|
anchors.bottomMargin: 32
|
|
spacing: 8
|
|
clip: true
|
|
Image {
|
|
Layout.preferredWidth: 257
|
|
Layout.preferredHeight: Layout.preferredWidth
|
|
Layout.alignment: Qt.AlignHCenter
|
|
source: Style.png("community/permissions21_3_1")
|
|
mipmap: true
|
|
}
|
|
StatusBaseText {
|
|
Layout.fillWidth: true
|
|
horizontalAlignment: Text.AlignHCenter
|
|
text: qsTr("Permissions")
|
|
font.pixelSize: 17
|
|
font.weight: Font.Bold
|
|
color: Theme.palette.directColor1
|
|
}
|
|
StatusBaseText {
|
|
Layout.fillWidth: true
|
|
horizontalAlignment: Text.AlignHCenter
|
|
text: qsTr("You can manage your community by creating and issuing membership and access permissions")
|
|
lineHeight: 1.2
|
|
font.pixelSize: 15
|
|
color: Theme.palette.baseColor1
|
|
wrapMode: Text.WordWrap
|
|
}
|
|
ColumnLayout {
|
|
id: checkersColumn
|
|
property int rowChildSpacing: 10
|
|
property color rowIconColor: Theme.palette.primaryColor1
|
|
property string rowIconName: "checkmark-circle"
|
|
property int rowFontSize: 15
|
|
property color rowTextColor: Theme.palette.directColor1
|
|
property double rowTextLineHeight: 1.2
|
|
|
|
Layout.fillWidth: true
|
|
Layout.alignment: Qt.AlignLeft
|
|
spacing: 10
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
spacing: checkersColumn.rowChildSpacing
|
|
StatusIcon {
|
|
icon: checkersColumn.rowIconName
|
|
color: checkersColumn.rowIconColor
|
|
}
|
|
StatusBaseText {
|
|
Layout.fillWidth: true
|
|
Layout.alignment: Qt.AlignVCenter
|
|
text: qsTr("Give individual members access to private channels")
|
|
lineHeight: checkersColumn.rowTextLineHeight
|
|
font.pixelSize: checkersColumn.rowFontSize
|
|
color: checkersColumn.rowTextColor
|
|
wrapMode: Text.WordWrap
|
|
}
|
|
}
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
spacing: checkersColumn.rowChildSpacing
|
|
StatusIcon {
|
|
icon: checkersColumn.rowIconName
|
|
color: checkersColumn.rowIconColor
|
|
}
|
|
StatusBaseText {
|
|
Layout.fillWidth: true
|
|
Layout.alignment: Qt.AlignVCenter
|
|
text: qsTr("Monetise your community with subscriptions and fees")
|
|
lineHeight: checkersColumn.rowTextLineHeight
|
|
font.pixelSize: checkersColumn.rowFontSize
|
|
color: Theme.palette.directColor1
|
|
wrapMode: Text.WordWrap
|
|
}
|
|
}
|
|
RowLayout {
|
|
Layout.fillWidth: true
|
|
spacing: checkersColumn.rowChildSpacing
|
|
StatusIcon {
|
|
icon: checkersColumn.rowIconName
|
|
color: checkersColumn.rowIconColor
|
|
}
|
|
StatusBaseText {
|
|
Layout.fillWidth: true
|
|
Layout.alignment: Qt.AlignVCenter
|
|
text: qsTr("Require holding a token or NFT to obtain exclusive membership rights")
|
|
lineHeight: checkersColumn.rowTextLineHeight
|
|
font.pixelSize: checkersColumn.rowFontSize
|
|
color: checkersColumn.rowTextColor
|
|
wrapMode: Text.WordWrap
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
StatusButton {
|
|
text: qsTr("Add permission")
|
|
height: 44
|
|
Layout.alignment: Qt.AlignHCenter
|
|
Layout.fillWidth: true
|
|
onClicked: root.addPermission()
|
|
}
|
|
}
|
|
}
|