css: Explicitly set text-message color.

This commit darkens the text-message color in the light theme
to the HSL equivalent of a dark gray (#262626).

This is the first time in the Zulip codebase where one CSS
custom property is set to another: the dark theme preserves
its use of `--color-text-default` in this way, but can be
adjusted independently of the reset of the theme in the future
by setting a different color value on
`--color-text-message-default`. Related reading on this
technique:
https://css-tricks.com/a-complete-guide-to-custom-properties/#aa-properties-as-properties

Fixes a part of #22022.
This commit is contained in:
Karl Stolley 2023-06-08 09:25:14 -05:00 committed by Tim Abbott
parent e0883d0341
commit 37192e8af3
1 changed files with 5 additions and 1 deletions

View File

@ -147,7 +147,7 @@ body {
/* Text colors */
--color-text-default: hsl(0deg 0% 20%);
--color-default-text: hsl(0deg 0% 15%);
--color-text-message-default: hsl(0deg 0% 15%);
--color-text-message-view-header: hsl(0deg 0% 20% / 100%);
--color-text-message-header: hsl(0deg 0% 15%);
--color-text-dropdown-input: hsl(0deg 0% 13.33%);
@ -186,6 +186,9 @@ body {
/* Text colors */
--color-text-default: hsl(0deg 0% 100% / 75%);
/* Unlike the light theme, the dark theme renders message
text in the default color. */
--color-text-message-default: var(--color-text-default);
--color-text-message-view-header: hsl(0deg 0% 100% / 80%);
--color-text-message-header: hsl(0deg 0% 100% / 80%);
--color-text-sender-name: hsl(0deg 0% 100% / 85%);
@ -1768,6 +1771,7 @@ div.focused_table {
}
.message_content {
color: var(--color-text-message-default);
line-height: 1.214;
min-height: 17px;
display: block;