mirror of
https://git.jami.net/savoirfairelinux/jami-client-qt.git
synced 2025-07-13 20:15:23 +02:00
button: add hover colors
Change-Id: I1e26a1672ac6fe23969fc7960be4aa8ccbd28fe4 Gitlab: #22
This commit is contained in:
parent
74d6207417
commit
c2220f86c3
11 changed files with 83 additions and 4 deletions
|
@ -27,6 +27,8 @@ Button {
|
|||
property alias source: root.icon.source
|
||||
property string toolTipText: ""
|
||||
property var color: "transparent"
|
||||
property var hoveredColor: undefined
|
||||
property var pressedColor: undefined
|
||||
property var outlined: false
|
||||
|
||||
Layout.alignment: Qt.AlignCenter
|
||||
|
@ -38,6 +40,7 @@ Button {
|
|||
icon.source: ""
|
||||
icon.height: 18
|
||||
icon.width: 18
|
||||
hoverEnabled: hoverColor !== undefined
|
||||
|
||||
contentItem: Item {
|
||||
Rectangle {
|
||||
|
@ -54,13 +57,29 @@ Button {
|
|||
enabled: true
|
||||
effect: ColorOverlay {
|
||||
id: overlay
|
||||
color: outlined ? root.color : "white"
|
||||
color:{
|
||||
if (!outlined)
|
||||
return "white"
|
||||
if (hovered && root.hoveredColor)
|
||||
return root.hoveredColor
|
||||
if (checked && root.pressedColor)
|
||||
return root.pressedColor
|
||||
return root.color
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Text {
|
||||
text: root.text
|
||||
color: outlined? root.color : "white"
|
||||
color: {
|
||||
if (!outlined)
|
||||
return "white"
|
||||
if (hovered && root.hoveredColor)
|
||||
return root.hoveredColor
|
||||
if (checked && root.pressedColor)
|
||||
return root.pressedColor
|
||||
return root.color
|
||||
}
|
||||
font: root.font
|
||||
anchors.centerIn: parent
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
|
@ -75,8 +94,24 @@ Button {
|
|||
background: Rectangle {
|
||||
id: backgroundRect
|
||||
anchors.fill: parent
|
||||
color: !outlined ? root.color : "transparent"
|
||||
border.color: outlined ? root.color : "transparent"
|
||||
color: {
|
||||
if (outlined)
|
||||
return "transparent"
|
||||
if (hovered && root.hoveredColor)
|
||||
return root.hoveredColor
|
||||
if (checked && root.pressedColor)
|
||||
return root.pressedColor
|
||||
return root.color
|
||||
}
|
||||
border.color: {
|
||||
if (!outlined)
|
||||
return "transparent"
|
||||
if (hovered && root.hoveredColor)
|
||||
return root.hoveredColor
|
||||
if (checked && root.pressedColor)
|
||||
return root.pressedColor
|
||||
return root.color
|
||||
}
|
||||
radius: 4
|
||||
}
|
||||
}
|
|
@ -54,7 +54,11 @@ Item {
|
|||
|
||||
property string hangUpButtonTintedRed: "#ff0000"
|
||||
property string buttonTintedBlue: "#00aaff"
|
||||
property string buttonTintedBlueHovered: "#0e81c5"
|
||||
property string buttonTintedBluePressed: "#273261"
|
||||
property string buttonTintedGrey: "#999"
|
||||
property string buttonTintedGreyHovered: "#777"
|
||||
property string buttonTintedGreyPressed: "#777"
|
||||
property string buttonTintedGreyInactive: "#bbb"
|
||||
|
||||
property string selectionBlue: "#109ede"
|
||||
|
|
|
@ -245,6 +245,8 @@ Dialog {
|
|||
id: changeLogButton
|
||||
text: qsTr("Changelog")
|
||||
color: projectCreditsScrollView.visible? JamiTheme.buttonTintedGreyInactive : JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
Layout.preferredWidth: 100
|
||||
|
||||
onClicked: {
|
||||
|
@ -258,6 +260,8 @@ Dialog {
|
|||
id: creditsButton
|
||||
text: qsTr("Credit")
|
||||
color: projectCreditsScrollView.visible? JamiTheme.buttonTintedGrey : JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
Layout.preferredWidth: 100
|
||||
|
||||
onClicked: {
|
||||
|
|
|
@ -136,6 +136,8 @@ Rectangle {
|
|||
id: backupBtn
|
||||
text: qsTr("BACKUP ACCOUNT")
|
||||
color: JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
|
||||
onClicked: {
|
||||
exportBtn_Dialog.open()
|
||||
|
@ -146,6 +148,8 @@ Rectangle {
|
|||
MaterialButton {
|
||||
text: qsTr("SKIP")
|
||||
color: JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
outlined: true
|
||||
|
||||
onClicked: {
|
||||
|
|
|
@ -139,6 +139,8 @@ Rectangle {
|
|||
&& usernameManagerEdit.text.length !== 0
|
||||
&& passwordManagerEdit.text.length !== 0
|
||||
color: enabled? JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
errorText = ""
|
||||
|
|
|
@ -163,6 +163,8 @@ Rectangle {
|
|||
color: nameRegistrationUIState === WizardView.FREE?
|
||||
JamiTheme.buttonTintedGrey
|
||||
: JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
|
||||
onClicked: {
|
||||
if (nameRegistrationUIState === WizardView.FREE)
|
||||
|
@ -173,6 +175,8 @@ Rectangle {
|
|||
MaterialButton {
|
||||
text: qsTr("SKIP CHOOSING USERNAME")
|
||||
color: JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
outlined: true
|
||||
|
||||
onClicked: {
|
||||
|
@ -281,6 +285,8 @@ Rectangle {
|
|||
color: !passwordSwitch.checked ||
|
||||
(passwordEdit.text === passwordConfirmEdit.text && passwordEdit.text.length !== 0)?
|
||||
JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
createAccount()
|
||||
|
|
|
@ -142,6 +142,8 @@ Rectangle {
|
|||
id: createAccountButton
|
||||
text: qsTr("CREATE SIP ACCOUNT")
|
||||
color: JamiTheme.wizardBlueButtons
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
createAccount()
|
||||
|
|
|
@ -89,6 +89,8 @@ Rectangle {
|
|||
toolTipText: qsTr("Import your account's archive")
|
||||
source: "qrc:/images/icons/round-folder-24px.svg"
|
||||
color: JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
|
||||
onClicked: {
|
||||
importFromFile_Dialog.open()
|
||||
|
@ -123,6 +125,8 @@ Rectangle {
|
|||
text: qsTr("CONNECT FROM BACKUP")
|
||||
color: filePath.length === 0?
|
||||
JamiTheme.buttonTintedGreyInactive : JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
|
||||
onClicked: {
|
||||
errorText = ""
|
||||
|
|
|
@ -103,6 +103,8 @@ Rectangle {
|
|||
text: qsTr("CONNECT FROM ANOTHER DEVICE")
|
||||
color: pinFromDevice.text.length === 0?
|
||||
JamiTheme.buttonTintedGreyInactive : JamiTheme.buttonTintedGrey
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
|
||||
onClicked: {
|
||||
errorText = ""
|
||||
|
|
|
@ -114,6 +114,8 @@ Rectangle {
|
|||
enabled: readyToSaveDetails
|
||||
text: enabled? qsTr("Save Profile") : qsTr("Generating account…")
|
||||
color: enabled? JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
saveProfile()
|
||||
|
@ -124,6 +126,8 @@ Rectangle {
|
|||
text: qsTr("SKIP")
|
||||
enabled: saveProfileBtn.enabled
|
||||
color: enabled? JamiTheme.buttonTintedGrey : JamiTheme.buttonTintedGreyInactive
|
||||
hoveredColor: JamiTheme.buttonTintedGreyHovered
|
||||
pressedColor: JamiTheme.buttonTintedGreyPressed
|
||||
outlined: true
|
||||
|
||||
onClicked: {
|
||||
|
|
|
@ -85,6 +85,8 @@ ColumnLayout {
|
|||
toolTipText: qsTr("Create new Jami account")
|
||||
source: "qrc:/images/default_avatar_overlay.svg"
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
welcomePageRedirectPage(1)
|
||||
|
@ -104,6 +106,8 @@ ColumnLayout {
|
|||
toolTipText: qsTr("Import account from other device")
|
||||
source: "qrc:/images/icons/devices-24px.svg"
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
welcomePageRedirectPage(5)
|
||||
|
@ -123,6 +127,8 @@ ColumnLayout {
|
|||
toolTipText: qsTr("Import account from backup file")
|
||||
source: "qrc:/images/icons/backup-24px.svg"
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
welcomePageRedirectPage(3)
|
||||
|
@ -141,6 +147,8 @@ ColumnLayout {
|
|||
text: qsTr("SHOW ADVANCED")
|
||||
toolTipText: qsTr("Show advanced options")
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
outlined: true
|
||||
|
||||
hoverEnabled: true
|
||||
|
@ -169,6 +177,8 @@ ColumnLayout {
|
|||
toolTipText: qsTr("Login to account manager")
|
||||
source: "qrc:/images/icons/router-24px.svg"
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
welcomePageRedirectPage(6)
|
||||
|
@ -188,6 +198,8 @@ ColumnLayout {
|
|||
toolTipText: qsTr("Create new SIP account")
|
||||
source: "qrc:/images/default_avatar_overlay.svg"
|
||||
color: JamiTheme.buttonTintedBlue
|
||||
hoveredColor: JamiTheme.buttonTintedBlueHovered
|
||||
pressedColor: JamiTheme.buttonTintedBluePressed
|
||||
|
||||
onClicked: {
|
||||
welcomePageRedirectPage(2)
|
||||
|
|
Loading…
Add table
Reference in a new issue