app_variables: Rename “color” variables that are actually gradients.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit is contained in:
Anders Kaseorg
2025-02-19 10:00:36 -08:00
committed by Anders Kaseorg
parent 320c7a04ba
commit 3ead4c06f0
3 changed files with 14 additions and 14 deletions

View File

@@ -594,7 +594,7 @@
--size-color-swatch: 1em;
--grid-gap-color-swatch: 1em;
--padding-color-swatch-list: 0.6666em;
--color-background-custom-swatch-gradient: conic-gradient(
--gradient-custom-swatch: conic-gradient(
from 0deg at 50% 50% in oklch longer hue,
oklch(70% 0.3 0deg) 0%,
oklch(70% 0.3 0deg) 100%
@@ -1176,36 +1176,36 @@
hsl(0deg 0% 67%)
);
--color-compose-scroll-icon: hsl(0deg 0% 50%);
--color-compose-background-scroll-backward: linear-gradient(
--gradient-compose-scroll-backward: linear-gradient(
90deg,
light-dark(hsl(234deg 100% 95%), hsl(234deg 21% 24%)) 35%,
light-dark(hsl(234deg 100% 95%), hsl(234deg 21% 24% / 76.9%)) 50%,
transparent 100%
);
--color-compose-background-scroll-backward-hover: linear-gradient(
--gradient-compose-scroll-backward-hover: linear-gradient(
90deg,
light-dark(hsl(234deg 100% 93%), hsl(234deg 30% 28%)) 35%,
light-dark(hsl(234deg 100% 93%), hsl(234deg 30% 28% / 76.9%)) 50%,
transparent 100%
);
--color-compose-background-scroll-backward-active: linear-gradient(
--gradient-compose-scroll-backward-active: linear-gradient(
90deg,
light-dark(hsl(234deg 100% 90%), hsl(234deg 35% 30%)) 45%,
transparent 100%
);
--color-compose-background-scroll-forward: linear-gradient(
--gradient-compose-scroll-forward: linear-gradient(
90deg,
transparent 0%,
light-dark(hsl(234deg 100% 95%), hsl(234deg 21% 24% / 76.9%)) 50%,
light-dark(hsl(234deg 100% 95%), hsl(234deg 21% 24%)) 65%
);
--color-compose-background-scroll-forward-hover: linear-gradient(
--gradient-compose-scroll-forward-hover: linear-gradient(
90deg,
transparent 0%,
light-dark(hsl(234deg 100% 93%), hsl(234deg 30% 28% / 76.9%)) 50%,
light-dark(hsl(234deg 100% 93%), hsl(234deg 30% 28%)) 65%
);
--color-compose-background-scroll-forward-active: linear-gradient(
--gradient-compose-scroll-forward-active: linear-gradient(
90deg,
transparent 0%,
light-dark(hsl(234deg 100% 90%), hsl(234deg 35% 30%)) 55%

View File

@@ -42,7 +42,7 @@
.custom-color-swatch-icon {
border-radius: 50%;
background: var(--color-background-custom-swatch-gradient);
background: var(--gradient-custom-swatch);
}
.color-picker-popover .message-header-contents {

View File

@@ -534,14 +534,14 @@
grid-area: scroller-backward;
justify-content: flex-start;
border-radius: 0 0 0 3px;
background: var(--color-compose-background-scroll-backward);
background: var(--gradient-compose-scroll-backward);
&:hover {
background: var(--color-compose-background-scroll-backward-hover);
background: var(--gradient-compose-scroll-backward-hover);
}
&:active {
background: var(--color-compose-background-scroll-backward-active);
background: var(--gradient-compose-scroll-backward-active);
.scroller-backward-icon {
/* Subtly shift arrow in scroll direction. */
@@ -554,14 +554,14 @@
grid-area: scroller-forward;
justify-content: flex-end;
border-radius: 0 0 3px;
background: var(--color-compose-background-scroll-forward);
background: var(--gradient-compose-scroll-forward);
&:hover {
background: var(--color-compose-background-scroll-forward-hover);
background: var(--gradient-compose-scroll-forward-hover);
}
&:active {
background: var(--color-compose-background-scroll-forward-active);
background: var(--gradient-compose-scroll-forward-active);
.scroller-forward-icon {
/* Subtly shift arrow in scroll direction. */