UX: Make user tips more visible (#22012)
Inverts the background of the user tip to make it more visible.
This commit is contained in:
parent
7c768a2ff9
commit
774698491d
|
@ -15,14 +15,8 @@ $d-popover-border: var(--primary-low);
|
|||
top: -10px;
|
||||
}
|
||||
|
||||
.tippy-rounded-arrow {
|
||||
fill: $d-popover-background;
|
||||
.svg-arrow {
|
||||
fill: $d-popover-border;
|
||||
}
|
||||
.svg-content {
|
||||
fill: $d-popover-background;
|
||||
}
|
||||
.tippy-svg-arrow > svg {
|
||||
color: $d-popover-background;
|
||||
}
|
||||
|
||||
[data-tooltip] > *,
|
||||
|
|
|
@ -1,3 +1,30 @@
|
|||
.tippy-box[data-theme="user-tips"] {
|
||||
background-color: var(--tertiary);
|
||||
color: var(--secondary);
|
||||
border-color: var(--tertiary);
|
||||
|
||||
.btn-flat {
|
||||
color: var(--secondary);
|
||||
|
||||
&:hover {
|
||||
color: var(--d-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--secondary);
|
||||
color: var(--tertiary);
|
||||
|
||||
&:hover {
|
||||
color: var(--tertiary-hover);
|
||||
}
|
||||
}
|
||||
|
||||
> .tippy-svg-arrow > svg {
|
||||
color: var(--tertiary);
|
||||
}
|
||||
}
|
||||
|
||||
.user-tip {
|
||||
z-index: z("composer", "content") - 1;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue