Skip to content

Commit 8850b30

Browse files
mcleinmanmcleinman
authored
VPN-7540 add optional button to info card (#11173)
1 parent 3935a79 commit 8850b30

6 files changed

Lines changed: 49 additions & 30 deletions

File tree

‎nebula/ui/components/MZInformationCard.qml‎

Lines changed: 26 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@ import "qrc:/nebula/utils/MZAssetLookup.js" as MZAssetLookup
1313

1414
Rectangle {
1515
property alias _infoContent: infoContent.data
16+
property alias _buttonText: button.text
17+
property var _buttonAction: function() {}
1618
id: card
1719

1820
enum CardType {
@@ -25,6 +27,7 @@ Rectangle {
2527
color: MZTheme.colors.bgColorStronger
2628
radius: 8
2729
property int cardType: MZInformationCard.CardType.Error
30+
implicitHeight: infoContentHolder.height + MZTheme.theme.windowMargin * 2
2831

2932
MZDropShadow {
3033
anchors.fill: dropShadowSource
@@ -106,10 +109,9 @@ Rectangle {
106109
return console.error("Unable to create view for info card of type: " + cardType)
107110
}
108111
}
109-
110-
RowLayout {
111-
id: info
112+
ColumnLayout {
112113
spacing: MZTheme.theme.windowMargin * 0.75
114+
id: infoContentHolder
113115

114116
anchors {
115117
left: parent.left
@@ -119,17 +121,29 @@ Rectangle {
119121
verticalCenter: parent.verticalCenter
120122
}
121123

122-
MZIcon {
123-
source: getIconImage()
124-
Layout.leftMargin: 4 // to account for the color stripe
125-
Layout.alignment: Qt.AlignVCenter
124+
RowLayout {
125+
id: info
126+
spacing: MZTheme.theme.windowMargin * 0.75
127+
128+
MZIcon {
129+
source: getIconImage()
130+
Layout.leftMargin: 4 // to account for the color stripe
131+
Layout.alignment: Qt.AlignVCenter
132+
}
133+
134+
ColumnLayout {
135+
id: infoContent
136+
Layout.fillWidth: true
137+
spacing: 0
138+
}
126139
}
127140

128-
ColumnLayout {
129-
id: infoContent
130-
Layout.fillWidth: true
131-
spacing: 0
132-
}
141+
MZButton {
142+
id: button
143+
text: ""
144+
visible: text !== ""
145+
onClicked: card._buttonAction()
146+
}
133147
}
134148
}
135149

‎src/ui/screens/getHelp/developerMenu/ViewColorObjects.qml‎

Lines changed: 23 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,6 @@ MZViewBase {
3232
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
3333
cardType: MZInformationCard.CardType.Info
3434
anchors.horizontalCenter: parent.horizontalCenter
35-
implicitHeight: textBlock.height + MZTheme.theme.windowMargin * 2
3635

3736
_infoContent: MZTextBlock {
3837
id: textBlock
@@ -47,10 +46,8 @@ MZViewBase {
4746
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
4847
cardType: MZInformationCard.CardType.Success
4948
anchors.horizontalCenter: parent.horizontalCenter
50-
implicitHeight: textBlock.height + MZTheme.theme.windowMargin * 2
5149

5250
_infoContent: MZTextBlock {
53-
// id: textBlock
5451
Layout.fillWidth: true
5552

5653
text: "Info card with success colors"
@@ -62,10 +59,8 @@ MZViewBase {
6259
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
6360
cardType: MZInformationCard.CardType.Warning
6461
anchors.horizontalCenter: parent.horizontalCenter
65-
implicitHeight: textBlock.height + MZTheme.theme.windowMargin * 2
6662

6763
_infoContent: MZTextBlock {
68-
// id: textBlock
6964
Layout.fillWidth: true
7065

7166
text: "Info card with warning colors"
@@ -77,10 +72,8 @@ MZViewBase {
7772
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
7873
cardType: MZInformationCard.CardType.Error
7974
anchors.horizontalCenter: parent.horizontalCenter
80-
implicitHeight: textBlock.height + MZTheme.theme.windowMargin * 2
8175

8276
_infoContent: MZTextBlock {
83-
// id: textBlock
8477
Layout.fillWidth: true
8578

8679
text: "Info card with error colors"
@@ -95,6 +88,29 @@ MZViewBase {
9588
color: MZTheme.colors.divider
9689
}
9790

91+
MZInformationCard {
92+
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
93+
cardType: MZInformationCard.CardType.Error
94+
anchors.horizontalCenter: parent.horizontalCenter
95+
96+
_infoContent: MZTextBlock {
97+
Layout.fillWidth: true
98+
99+
text: "Info card with button"
100+
verticalAlignment: Text.AlignVCenter
101+
}
102+
103+
_buttonText: "Tap for alert"
104+
_buttonAction: function() { MZErrorHandler.requestAlert(MZErrorHandler.GeoIpRestrictionAlert) }
105+
}
106+
107+
Rectangle {
108+
Layout.fillWidth: true
109+
Layout.preferredHeight: 10
110+
111+
color: MZTheme.colors.divider
112+
}
113+
98114
MZTextBlock {
99115
text: "Alerts use the `[type]Accent` colors, among many others"
100116
Layout.fillWidth: true
@@ -167,13 +183,6 @@ MZViewBase {
167183
color: MZTheme.colors.divider
168184
}
169185

170-
Rectangle {
171-
Layout.fillWidth: true
172-
Layout.preferredHeight: 10
173-
174-
color: MZTheme.colors.divider
175-
}
176-
177186
MZButton {
178187
anchors.left: parent.left
179188
anchors.right: parent.right

‎src/ui/screens/getHelp/developerMenu/ViewTelemetryDebugging.qml‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ MZViewBase {
2020

2121
MZInformationCard {
2222
cardType: MZInformationCard.CardType.Info
23-
height: textBlocks.height + MZTheme.theme.windowMargin * 2
2423
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
2524
Layout.leftMargin: MZTheme.theme.windowMargin
2625
Layout.rightMargin: MZTheme.theme.windowMargin

‎src/ui/screens/settings/ViewDNSSettings.qml‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,6 @@ MZViewBase {
115115
sourceComponent: MZInformationCard {
116116
objectName: "DNSSettingsViewInformationCard"
117117
cardType: MZInformationCard.CardType.Info
118-
height: textBlocks.height + MZTheme.theme.windowMargin * 2
119118
width: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
120119
_infoContent: ColumnLayout {
121120
id: textBlocks

‎src/ui/screens/settings/appPermissions/AppPermissionsList.qml‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,6 @@ ColumnLayout {
6969
sourceComponent: MZInformationCard {
7070
width: parent.width
7171
cardType: MZInformationCard.CardType.Info
72-
implicitHeight: textBlock.height + MZTheme.theme.windowMargin * 2
7372
anchors.top: parent.top
7473
anchors.topMargin: MZTheme.theme.viewBaseTopMargin
7574

‎src/ui/screens/settings/privacy/ViewPrivacy.qml‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ MZViewBase {
4949
objectName: "privacySettingsViewInformationCard"
5050
cardType: MZInformationCard.CardType.Warning
5151
Layout.preferredWidth: Math.min(window.width - MZTheme.theme.windowMargin * 2, MZTheme.theme.navBarMaxWidth)
52-
Layout.minimumHeight: textBlocks.height + MZTheme.theme.windowMargin * 2
5352
Layout.alignment: Qt.AlignHCenter
5453

5554
_infoContent: ColumnLayout {

0 commit comments

Comments
 (0)