Skip to content

Commit

Permalink
Update banners background (#6075)
Browse files Browse the repository at this point in the history
# Motivation

Update the banner backgrounds to align with the design.

# Changes

- Replace the background variable for the identified banners, using
background-color instead of background for improved clarity.

# Tests

- Tested locally:

| 🌝 | 🌚 |
|--------|--------|
| <img width="1235" alt="image"
src="https://github.com/user-attachments/assets/33bb3c0e-f058-4325-89c7-6277cfefcf4e"
/> | <img width="1231" alt="image"
src="https://github.com/user-attachments/assets/877ff493-e037-4b7f-9a30-a33614879f80"
/> |
| <img width="789" alt="image"
src="https://github.com/user-attachments/assets/fd2ba1a3-8898-4d45-bc73-f88492bdb641"
/> | <img width="803" alt="image"
src="https://github.com/user-attachments/assets/cdd7a5d2-1696-4c8e-ba08-acdc1caa6ca4"
/> |
| <img width="793" alt="image"
src="https://github.com/user-attachments/assets/cf007cf3-2a1a-44f5-a492-bdc6becb08d7"
/> | <img width="801" alt="image"
src="https://github.com/user-attachments/assets/1a786e5c-cb93-4ce8-9dbf-0899e8a2050a"
/> |

# Todos

- [ ] Add entry to changelog (if necessary).
Not necessary.
  • Loading branch information
mstrasinskis authored Dec 23, 2024
1 parent c74b514 commit 341bade
Show file tree
Hide file tree
Showing 3 changed files with 4 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,7 @@
.banner {
display: flex;
align-items: center;
background: var(--input-background);
background-color: var(--banner-background);
border-radius: var(--border-radius);
padding: var(--padding) var(--padding-1_5x);
gap: var(--padding-1_5x);
Expand Down
4 changes: 2 additions & 2 deletions frontend/src/lib/components/ui/Banner.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -75,11 +75,11 @@
padding: var(--padding-2x);
border-radius: var(--border-radius);
background: var(--input-background);
background-color: var(--banner-background);
}
.banner.isCritical {
background: var(--tooltip-background);
background-color: var(--tooltip-background);
.title {
color: var(--tooltip-text-color);
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/lib/components/ui/UsdValueBanner.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@
align-items: center;
gap: var(--padding-2x);
background-color: var(--card-background-tint);
background-color: var(--banner-background);
padding: var(--padding-2x);
border-radius: var(--padding);
border: 1.5px solid var(--card-border);
Expand Down

0 comments on commit 341bade

Please sign in to comment.