dark_theme: Clean up success-style main-view banner.

This commit is contained in:
Karl Stolley
2025-04-07 15:40:31 -05:00
committed by Tim Abbott
parent 59d5d29ed8
commit c2b1c2ca5a
3 changed files with 55 additions and 40 deletions

View File

@@ -2577,6 +2577,44 @@
hsl(0deg 52% 18%) hsl(0deg 52% 18%)
); );
/* .main-view-banner colors */
--color-success-main-view-banner: light-dark(
hsl(147deg 57% 25%),
hsl(147deg 51% 80%)
);
--color-background-success-main-view-banner: light-dark(
hsl(147deg 43% 92%),
hsl(147deg 100% 8%)
);
--color-border-success-main-view-banner: light-dark(
hsl(147deg 57% 25% / 40%),
hsl(149deg 48% 52% / 40%)
);
--color-success-main-view-banner-close-button: light-dark(
hsl(147deg 57% 25% / 50%),
hsl(147deg 51% 55% / 50%)
);
--color-success-main-view-banner-close-button-hover: light-dark(
hsl(147deg 57% 25%),
hsl(147deg 51% 55%)
);
--color-success-main-view-banner-close-button-active: light-dark(
hsl(147deg 57% 25% / 75%),
hsl(147deg 51% 55% / 75%)
);
--color-background-success-main-view-banner-action-button: light-dark(
hsl(147deg 57% 25% / 10%),
hsl(147deg 51% 55% / 10%)
);
--color-background-success-main-view-banner-action-button-hover: light-dark(
hsl(147deg 57% 25% / 12%),
hsl(147deg 51% 55% / 15%)
);
--color-background-success-main-view-banner-action-button-active: light-dark(
hsl(147deg 57% 25% / 15%),
hsl(147deg 51% 55% / 20%)
);
/* Info density update UI */ /* Info density update UI */
--color-info-density-control-border: light-dark( --color-info-density-control-border: light-dark(
hsl(0deg 0% 0% / 20%), hsl(0deg 0% 0% / 20%),

View File

@@ -834,32 +834,40 @@
} }
&.success { &.success {
background-color: hsl(147deg 43% 92%); background-color: var(--color-background-success-main-view-banner);
border: 1px solid hsl(147deg 57% 25% / 40%); border: 1px solid var(--color-border-success-main-view-banner);
color: hsl(147deg 57% 25%); color: var(--color-success-main-view-banner);
.main-view-banner-close-button { .main-view-banner-close-button {
color: hsl(147deg 57% 25% / 50%); color: var(--color-success-main-view-banner-close-button);
&:hover { &:hover {
color: hsl(147deg 57% 25%); color: var(--color-success-main-view-banner-close-button-hover);
} }
&:active { &:active {
color: hsl(147deg 57% 25% / 75%); color: var(
--color-success-main-view-banner-close-button-active
);
} }
} }
.main-view-banner-action-button { .main-view-banner-action-button {
background-color: hsl(147deg 57% 25% / 10%); background-color: var(
--color-background-success-main-view-banner-action-button
);
color: inherit; color: inherit;
&:hover { &:hover {
background-color: hsl(147deg 57% 25% / 12%); background-color: var(
--color-background-success-main-view-banner-action-button-hover
);
} }
&:active { &:active {
background-color: hsl(147deg 57% 25% / 15%); background-color: var(
--color-background-success-main-view-banner-action-button-active
);
} }
} }
} }

View File

@@ -86,37 +86,6 @@
color: hsl(200deg 100% 50%); color: hsl(200deg 100% 50%);
} }
&.success {
background-color: hsl(147deg 100% 8%);
border-color: hsl(149deg 48% 52% / 40%);
color: hsl(147deg 51% 80%);
.main-view-banner-close-button {
color: hsl(147deg 51% 55% / 50%);
&:hover {
color: hsl(147deg 51% 55%);
}
&:active {
color: hsl(147deg 51% 55% / 75%);
}
}
.main-view-banner-action-button {
background-color: hsl(147deg 51% 55% / 10%);
color: inherit;
&:hover {
background-color: hsl(147deg 51% 55% / 15%);
}
&:active {
background-color: hsl(147deg 51% 55% / 20%);
}
}
}
&.warning, &.warning,
&.warning-style { &.warning-style {
background-color: hsl(53deg 100% 11%); background-color: hsl(53deg 100% 11%);