Skip to content
This repository was archived by the owner on Apr 28, 2025. It is now read-only.

Commit 36bec4d

Browse files
authored
feat(tooltip): updated colors (#2560)
1 parent 6f51583 commit 36bec4d

File tree

3 files changed

+13
-8
lines changed

3 files changed

+13
-8
lines changed

.changeset/giant-snails-jump.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@ebay/skin": minor
3+
---
4+
5+
feat(tooltip): updated colors

dist/tooltip/tooltip.css

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,9 +31,9 @@ span.tooltip {
3131
.tooltip__mask {
3232
background-color: var(
3333
--tooltip-background-color,
34-
var(--color-background-elevated)
34+
var(--color-background-inverse)
3535
);
36-
color: var(--tooltip-foreground-color, var(--color-foreground-primary));
36+
color: var(--tooltip-foreground-color, var(--color-foreground-on-inverse));
3737
position: relative;
3838
}
3939

@@ -48,7 +48,7 @@ span.tooltip__mask {
4848
word-break: normal;
4949
}
5050
.tooltip__cell a {
51-
color: var(--tooltip-foreground-color, var(--color-foreground-primary));
51+
color: var(--tooltip-foreground-color, var(--color-foreground-on-inverse));
5252
}
5353
.tooltip__cell a:focus {
5454
outline: 1px dashed currentColor;
@@ -80,7 +80,7 @@ button.tooltip__close {
8080
.tooltip__pointer {
8181
background-color: var(
8282
--tooltip-background-color,
83-
var(--color-background-elevated)
83+
var(--color-background-inverse)
8484
);
8585
height: 8px;
8686
position: absolute;

src/sass/tooltip/tooltip.scss

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,9 +18,9 @@ span.tooltip {
1818
@include bubble-mask();
1919
@include background-color-token(
2020
tooltip-background-color,
21-
color-background-elevated
21+
color-background-inverse
2222
);
23-
@include color-token(tooltip-foreground-color, color-foreground-primary);
23+
@include color-token(tooltip-foreground-color, color-foreground-on-inverse);
2424
}
2525

2626
span.tooltip__mask {
@@ -33,7 +33,7 @@ span.tooltip__mask {
3333
a {
3434
@include color-token(
3535
tooltip-foreground-color,
36-
color-foreground-primary
36+
color-foreground-on-inverse
3737
);
3838

3939
&:focus {
@@ -54,7 +54,7 @@ button.tooltip__close {
5454
@include pointer-base();
5555
@include background-color-token(
5656
tooltip-background-color,
57-
color-background-elevated
57+
color-background-inverse
5858
);
5959
}
6060

0 commit comments

Comments
 (0)