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/(Status[Base]Button): add a new Primary variant 

we were missing this variant, needed for status-im/status-desktop#6081
This commit is contained in:
Lukáš Tinkl 2022-08-08 14:22:29 +02:00 committed by Michał Cieślak
parent 66a1b24274
commit 6dd90ae3a2
4 changed files with 36 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
ui/StatusQ/sandbox/controls/Buttons.qml
View File

@ -17,6 +17,24 @@ Column {
horizontalItemAlignment: Grid.AlignHCenter horizontalItemAlignment: Grid.AlignHCenter
// Primary
StatusButton {
text: "Button"
type: StatusBaseButton.Type.Primary
}
StatusButton {
text: "Button"
enabled: false
type: StatusBaseButton.Type.Primary
}
StatusButton {
text: "Button"
loading: true
type: StatusBaseButton.Type.Primary
}
// Large // Large
StatusButton { StatusButton {
text: "Button" text: "Button"

6
ui/StatusQ/src/StatusQ/Controls/StatusBaseButton.qml
View File

@ -15,7 +15,8 @@ Rectangle {
enum Type { enum Type {
Normal, Normal,
Danger Danger,
Primary
} }
property StatusIconSettings icon: StatusIconSettings { property StatusIconSettings icon: StatusIconSettings {
@ -145,7 +146,7 @@ Rectangle {
color: d.textColor color: d.textColor
} // Text } // Text
} // Ro } // Row
onPressed: { onPressed: {
@ -172,5 +173,4 @@ Rectangle {
} }
} }
} // Sensor } // Sensor
} }

11
ui/StatusQ/src/StatusQ/Controls/StatusButton.qml
View File

@ -5,13 +5,18 @@ import StatusQ.Core.Theme 0.1
StatusBaseButton { StatusBaseButton {
id: statusButton id: statusButton
normalColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor3 normalColor: type === StatusBaseButton.Type.Primary ? Theme.palette.primaryColor1 :
type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor3
: Theme.palette.dangerColor3 : Theme.palette.dangerColor3
hoverColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor2 hoverColor: type === StatusBaseButton.Type.Primary ? Theme.palette.hoverColor(normalColor) :
type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor2
: Theme.palette.dangerColor2 : Theme.palette.dangerColor2
disaledColor: Theme.palette.baseColor2 disaledColor: Theme.palette.baseColor2
textColor: type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor1 textColor: type === StatusBaseButton.Type.Primary ? Theme.palette.white :
type === StatusBaseButton.Type.Normal ? Theme.palette.primaryColor1
: Theme.palette.dangerColor1 : Theme.palette.dangerColor1
disabledTextColor: Theme.palette.baseColor1 disabledTextColor: Theme.palette.baseColor1
font.weight: type === StatusBaseButton.Type.Primary ? Font.Medium : Font.Normal
} }

4
ui/StatusQ/src/StatusQ/Core/Theme/ThemePalette.qml
View File

@ -100,6 +100,10 @@ QtObject {
property color dropShadow: getColor('black', 0.12) property color dropShadow: getColor('black', 0.12)
property color backdropColor: getColor('black', 0.4) property color backdropColor: getColor('black', 0.4)
function hoverColor(normalColor) {
return theme.name === "light" ? Qt.darker(normalColor, 1.1) : Qt.lighter(normalColor, 1.1)
}
property color baseColor1 property color baseColor1
property color baseColor2 property color baseColor2
property color baseColor3 property color baseColor3