Add focus styles for template card

[MAILPOET-4676]
This commit is contained in:
Jan Jakes
2023-11-08 15:15:28 +01:00
committed by Aschepikov
parent 4e9f8b6553
commit c5bed279b7

View File

@@ -37,16 +37,21 @@
grid-template-rows: auto 1fr;
}
&:hover {
background: #fff;
&:hover,
&:focus {
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.15);
color: inherit;
}
&:focus {
border-color: #2271b1;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
color: inherit;
// add focus ring in :after pseudo-element to cover badge edge
&:focus:after {
border-radius: inherit;
content: '';
inset: 0;
outline: var(--wp-admin-border-width-focus) solid
var(--wp-admin-theme-color);
pointer-events: none;
position: absolute;
}
}