mirror
/
nheko
mirror of https://github.com/Nheko-Reborn/nheko
2
0
Fork 1
Code Issues Releases Wiki Activity

Merge pull request #1160 from foresto/reaction-colors

Browse Source 
Reactions: avoid highlight color misuse, subdue bright border color
pull/1162/head
DeepBlueV7.X 2 years ago committed by GitHub
parent 732b82c04d f66ed4bea5
commit 3b0b8605a8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 9 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 17
      resources/qml/Reactions.qml

17
resources/qml/Reactions.qml
Unescape View File

@ -12,10 +12,9 @@ import im.nheko 1.0
Flow { Flow {
id: reactionFlow id: reactionFlow
// highlight colors for selfReactedEvent background // lower-contrast colors to avoid distracting from text & to enhance hover effect
property real highlightHue: Nheko.colors.highlight.hslHue property color gentleHighlight: Qt.hsla(Nheko.colors.highlight.hslHue, Nheko.colors.highlight.hslSaturation, Nheko.colors.highlight.hslLightness, 0.8)
property real highlightSat: Nheko.colors.highlight.hslSaturation property color gentleText: Qt.hsla(Nheko.colors.text.hslHue, Nheko.colors.text.hslSaturation, Nheko.colors.text.hslLightness, 0.6)
property real highlightLight: Nheko.colors.highlight.hslLightness
property string eventId property string eventId
property alias reactions: repeater.model property alias reactions: repeater.model
@ -74,7 +73,7 @@ Flow {
return textMetrics.elidedText; return textMetrics.elidedText;
} }
font.family: Settings.emojiFont font.family: Settings.emojiFont
color: reaction.hovered ? Nheko.colors.highlight : Nheko.colors.text color: (reaction.hovered || modelData.selfReactedEvent !== '') ? Nheko.colors.highlightedText: Nheko.colors.text
maximumLineCount: 1 maximumLineCount: 1
} }
@ -83,7 +82,7 @@ Flow {
height: Math.floor(reactionCounter.implicitHeight * 1.4) height: Math.floor(reactionCounter.implicitHeight * 1.4)
width: 1 width: 1
color: (reaction.hovered || modelData.selfReactedEvent !== '') ? Nheko.colors.highlight : Nheko.colors.text color: reaction.hovered ? Nheko.colors.text: gentleText
} }
Text { Text {
@ -92,7 +91,7 @@ Flow {
anchors.verticalCenter: divider.verticalCenter anchors.verticalCenter: divider.verticalCenter
text: modelData.count text: modelData.count
font: reaction.font font: reaction.font
color: reaction.hovered ? Nheko.colors.highlight : Nheko.colors.text color: (reaction.hovered || modelData.selfReactedEvent !== '') ? Nheko.colors.highlightedText: Nheko.colors.windowText
} }
} }
@ -101,8 +100,8 @@ Flow {
anchors.centerIn: parent anchors.centerIn: parent
implicitWidth: reaction.implicitWidth implicitWidth: reaction.implicitWidth
implicitHeight: reaction.implicitHeight implicitHeight: reaction.implicitHeight
border.color: (reaction.hovered || modelData.selfReactedEvent !== '') ? Nheko.colors.highlight : Nheko.colors.text border.color: reaction.hovered ? Nheko.colors.text: gentleText
color: modelData.selfReactedEvent !== '' ? Qt.hsla(highlightHue, highlightSat, highlightLight, 0.2) : Nheko.colors.window color: reaction.hovered ? Nheko.colors.highlight : (modelData.selfReactedEvent !== '' ? gentleHighlight : Nheko.colors.window)
border.width: 1 border.width: 1
radius: reaction.height / 2 radius: reaction.height / 2
} }

Write Preview
Loading…
Cancel
Save