Improve red button focus colour

- All of our red buttons were ImButton with the colours overridden at the
  use site.  Instead make an ImButtonRed which defines these colours in
  one place.
- Previously the red buttons had focus indicated by the text colour
  changing from white to blue.  This was quite hard to see, instead
  change the button colour to blue (as is done for the white buttons).
  A darker shade of blue is used so that there is still good contrast
  with the white text.
- Update the reds (buttons and main screen background) with the
  branding-approved red: the official colour palette says Pi Red is
  #cd2355
This commit is contained in:
David Turner 2023-10-18 16:38:06 +01:00 committed by David Turner
parent 98f8d63e3e
commit 8a3331f613
7 changed files with 27 additions and 30 deletions

View file

@ -98,7 +98,7 @@ Popup {
spacing: 20
id: buttons
ImButton {
ImButtonRed {
text: qsTr("EDIT SETTINGS")
onClicked: {
// Don't close this dialog when "edit settings" is
@ -108,42 +108,34 @@ Popup {
// customisation or not.
msgpopup.editSettings()
}
Material.foreground: activeFocus ? "#d1dcfb" : "#ffffff"
Material.background: "#c51a4a"
}
ImButton {
ImButtonRed {
id: noAndClearButton
text: qsTr("NO, CLEAR SETTINGS")
onClicked: {
msgpopup.close()
msgpopup.noClearSettings()
}
Material.foreground: activeFocus ? "#d1dcfb" : "#ffffff"
Material.background: "#c51a4a"
enabled: hasSavedSettings
}
ImButton {
ImButtonRed {
id: yesButton
text: qsTr("YES")
onClicked: {
msgpopup.close()
msgpopup.yes()
}
Material.foreground: activeFocus ? "#d1dcfb" : "#ffffff"
Material.background: "#c51a4a"
enabled: hasSavedSettings
}
ImButton {
ImButtonRed {
text: qsTr("NO")
onClicked: {
msgpopup.close()
msgpopup.no()
}
Material.foreground: activeFocus ? "#d1dcfb" : "#ffffff"
Material.background: "#c51a4a"
}
Text { text: " " }