[Graph] Fix style for disabled fields when focused (#96780)
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
4540a943d7
commit
1b02152e18
|
@ -1,11 +1,21 @@
|
|||
.gphFieldEditor__badge {
|
||||
@include gphFieldBadgeSize;
|
||||
}
|
||||
|
||||
.gphFieldEditor__badge--disabled,
|
||||
.gphFieldEditor__badge--disabled:focus {
|
||||
opacity: .7;
|
||||
text-decoration: line-through;
|
||||
&.gphFieldEditor__badge--disabled,
|
||||
&.gphFieldEditor__badge--disabled:hover,
|
||||
&.gphFieldEditor__badge--disabled:focus,
|
||||
&.gphFieldEditor__badge--disabled:not(:disabled):hover
|
||||
&.gphFieldEditor__badge--disabled:not(:disabled):focus {
|
||||
opacity: .7;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
// Chrome fix for focus: duplicate or Safari will ignore completely the disabled rule
|
||||
&.gphFieldEditor__badge--disabled:focus:not(:focus-visible),
|
||||
&.gphFieldEditor__badge--disabled:hover:not(:focus-visible) {
|
||||
opacity: .7;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.gphFieldEditor__badgeIcon {
|
||||
|
|
Loading…
Reference in a new issue