Differinate between regular text and revealed spoiler text
When you reveal a spoiler, it removes the background from the spoiler block - effectively making it seem like regular text. There's also a minor issue that we use the color scheme's textColor as the "spoiler block" color, and it will usually end up white. Most chat programs have typically used a dark background for spoiler blocks, even on dark themes. I killed two UX issues with one stone, first by making the spoiler block color fixed (but mixed with the textColor, to ensure it's readable regardless of Breeze Light/Dark.) And second by only changing the text's visibility, not the background.
This commit is contained in:
@@ -49,6 +49,11 @@ TextEdit {
|
|||||||
*/
|
*/
|
||||||
property bool spoilerRevealed: !hasSpoiler.test(display)
|
property bool spoilerRevealed: !hasSpoiler.test(display)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @brief The color of spoiler blocks, to be theme-agnostic.
|
||||||
|
*/
|
||||||
|
property color spoilerBlockColor: Kirigami.ColorUtils.tintWithAlpha("#232629", Kirigami.Theme.textColor, 0.15)
|
||||||
|
|
||||||
Layout.fillWidth: true
|
Layout.fillWidth: true
|
||||||
Layout.fillHeight: true
|
Layout.fillHeight: true
|
||||||
Layout.maximumWidth: Message.maxContentWidth
|
Layout.maximumWidth: Message.maxContentWidth
|
||||||
@@ -91,16 +96,27 @@ a{
|
|||||||
color: " + Kirigami.Theme.linkColor + ";
|
color: " + Kirigami.Theme.linkColor + ";
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
[data-mx-spoiler] a {
|
||||||
|
background: " + root.spoilerBlockColor + ";
|
||||||
|
}
|
||||||
|
[data-mx-spoiler] {
|
||||||
|
background: " + root.spoilerBlockColor + ";
|
||||||
|
}
|
||||||
" + (!spoilerRevealed ? "
|
" + (!spoilerRevealed ? "
|
||||||
[data-mx-spoiler] a {
|
[data-mx-spoiler] a {
|
||||||
color: transparent;
|
color: transparent;
|
||||||
background: " + Kirigami.Theme.textColor + ";
|
|
||||||
}
|
}
|
||||||
[data-mx-spoiler] {
|
[data-mx-spoiler] {
|
||||||
color: transparent;
|
color: transparent;
|
||||||
background: " + Kirigami.Theme.textColor + ";
|
|
||||||
}
|
}
|
||||||
" : "") + "
|
" : "
|
||||||
|
[data-mx-spoiler] a {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
[data-mx-spoiler] {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
") + "
|
||||||
</style>" + display
|
</style>" + display
|
||||||
|
|
||||||
color: Kirigami.Theme.textColor
|
color: Kirigami.Theme.textColor
|
||||||
|
|||||||
Reference in New Issue
Block a user