Блик на кнопке css
@keyframes sheen {
0% {
left: -30px;
margin-left: 0px;
}
30% {
left: 110%;
margin-left: 80px;
}
100% {
left: 110%;
margin-left: 80px;
}
}
.button-sheen::after {
animation: sheen 3s ease-in-out 0.05s infinite;
}
.button-sheen::after {
content: " ";
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.4),rgba(255,255,255,0));
transform: skewX(-45deg);
width: 45px;
height: 100%;
}
.button-sheen {
overflow:hidden;
}
Блик при наведении
..ush_btn_1::before {
content: "";
position: absolute;
top: 0;
left: -100%;
width: 90%;
height: 100%;
background: linear-gradient(120deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
transform: skewX(-20deg);
transition: 0.3s;
}
.ush_btn_1:hover::before {
left: 110%;
transition: all 0.5s ease-in-out;
}