Message / Reactions: Use pattern background in light theme

This commit is contained in:
Alexander Zinchuk 2023-08-16 15:27:54 +02:00
parent 9a07fd1b73
commit d34c610493

View File

@ -34,6 +34,8 @@
overflow: visible; overflow: visible;
line-height: 1.75rem; line-height: 1.75rem;
transition: background-color 150ms, color 150ms, backdrop-filter 150ms, filter 150ms;
.ReactionStaticEmoji { .ReactionStaticEmoji {
width: 1.25rem; width: 1.25rem;
} }
@ -79,6 +81,12 @@
&:hover { &:hover {
--reaction-background: var(--reaction-background-hover) !important; --reaction-background: var(--reaction-background-hover) !important;
backdrop-filter: var(--reaction-background-hover-filter);
@supports not (backdrop-filter: var(--reaction-background-hover-filter)) {
filter: var(--reaction-background-hover-filter);
}
} }
&:first-of-type { &:first-of-type {
@ -111,8 +119,9 @@
} }
.theme-light &.is-outside .Button { .theme-light &.is-outside .Button {
--reaction-background: rgb(0, 0, 0, 0.15); --reaction-background: var(--pattern-color);
--reaction-background-hover: rgba(0, 0, 0, 0.2); --reaction-background-hover: var(--pattern-color);
--reaction-background-hover-filter: brightness(115%);
--reaction-text-color: white; --reaction-text-color: white;
&.chosen { &.chosen {