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%)
);
/* .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 */
--color-info-density-control-border: light-dark(
hsl(0deg 0% 0% / 20%),

View File

@@ -834,32 +834,40 @@
}
&.success {
background-color: hsl(147deg 43% 92%);
border: 1px solid hsl(147deg 57% 25% / 40%);
color: hsl(147deg 57% 25%);
background-color: var(--color-background-success-main-view-banner);
border: 1px solid var(--color-border-success-main-view-banner);
color: var(--color-success-main-view-banner);
.main-view-banner-close-button {
color: hsl(147deg 57% 25% / 50%);
color: var(--color-success-main-view-banner-close-button);
&:hover {
color: hsl(147deg 57% 25%);
color: var(--color-success-main-view-banner-close-button-hover);
}
&:active {
color: hsl(147deg 57% 25% / 75%);
color: var(
--color-success-main-view-banner-close-button-active
);
}
}
.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;
&:hover {
background-color: hsl(147deg 57% 25% / 12%);
background-color: var(
--color-background-success-main-view-banner-action-button-hover
);
}
&: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%);
}
&.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-style {
background-color: hsl(53deg 100% 11%);