Wiggle animation for a Button

wiggle

import styled, {keyframes} from "styled-components"

const wiggle = keyframes`
    0%,100%{
        transform: scale(1.1) rotateZ(0deg) ;
    }
    16%,48%{
        transform: scale(1.1) rotateZ(-3deg);
    }
    32%,64%{
        transform: scale(1.1) rotateZ(3deg);
    }    
`


export const Button = styled.button`
    outline: none;
    border: 1px solid #333; 
    padding: 0.4rem 1rem;
    background: #f2f2f2;
    cursor: pointer;
    :hover{
        animation: ${wiggle} 1s infinite;
    }
`;