[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:
Marco Liberati 2021-04-19 15:30:28 +02:00 committed by GitHub
parent 4540a943d7
commit 1b02152e18
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -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 {