Skip to content

Commit d13b1bd

Browse files
authored
NTP: Adjust omnibar background colour on dark gradient/color backgrounds (#1957)
* Change omnibar background when using a dark gradient or color background * Update color values and colorScheme assignments * Set gradient04 and gradient05 colorScheme to light * Update solid color test to expect rgb(17, 17, 17) for color01 * Restore changes not related to omnibar, for now
1 parent 6519f45 commit d13b1bd

File tree

1 file changed

+16
-10
lines changed

1 file changed

+16
-10
lines changed

special-pages/pages/new-tab/app/omnibar/components/Omnibar.module.css

Lines changed: 16 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,6 @@
44
flex-direction: column;
55
gap: 10px;
66
padding-bottom: var(--sp-15);
7-
8-
[data-theme="light"] & {
9-
--omnibar-translucent-background-color: rgba(255, 255, 255, 0.54);
10-
}
11-
12-
[data-theme="dark"] & {
13-
--omnibar-translucent-background-color: rgba(0, 0, 0, 0.3);
14-
}
157
}
168

179
.logo {
@@ -54,9 +46,23 @@
5446
margin: 3px;
5547
outline: 1px solid var(--ntp-controls-raised-backdrop);
5648

57-
body:not([data-background-kind="default"]) & {
49+
[data-background-kind="color"] [data-theme="light"] &,
50+
[data-background-kind="gradient"] [data-theme="light"] &,
51+
[data-background-kind="userImage"] [data-theme="light"] & {
52+
backdrop-filter: blur(48px);
53+
background: rgba(255, 255, 255, 0.54);
54+
}
55+
56+
[data-background-kind="color"] [data-theme="dark"] &,
57+
[data-background-kind="gradient"] [data-theme="dark"] & {
58+
backdrop-filter: blur(48px);
59+
background: rgba(255, 255, 255, 0.12);
60+
outline: 1px solid rgba(0, 0, 0, 0.12);
61+
}
62+
63+
[data-background-kind="userImage"] [data-theme="dark"] & {
5864
backdrop-filter: blur(48px);
59-
background: var(--omnibar-translucent-background-color);
65+
background: rgba(0, 0, 0, 0.3);
6066
}
6167
}
6268

0 commit comments

Comments
 (0)