Update button hover and focus effects

This commit is contained in:
Dominik Korsa 2019-03-04 19:28:03 +01:00
parent 95b80b81ea
commit fe2abe7dc5

View file

@ -157,6 +157,18 @@ export default {
0px 4px 5px 0px rgba(0, 0, 0, 0.14),
0px 1px 10px 0px rgba(0, 0, 0, 0.12);
border-radius: 8px;
transition: box-shadow 150ms;
}
&:focus {
outline: none;
}
&:hover img, &:focus img {
box-shadow:
0px 11px 15px -7px rgba(0, 0, 0, 0.2),
0px 24px 38px 3px rgba(0, 0, 0, 0.14),
0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
}
@ -179,6 +191,18 @@ export default {
0px 2px 4px -1px rgba(0, 0, 0, 0.2),
0px 4px 5px 0px rgba(0, 0, 0, 0.14),
0px 1px 10px 0px rgba(0, 0, 0, 0.12);
transition: box-shadow 150ms;
&:focus {
outline: none;
}
&:focus, &:hover {
box-shadow:
0px 11px 15px -7px rgba(0, 0, 0, 0.2),
0px 24px 38px 3px rgba(0, 0, 0, 0.14),
0px 9px 46px 8px rgba(0, 0, 0, 0.12);
}
@media screen and (max-width: 550px) {
margin-left: 0;