diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index d51c621..2ac13f9 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -221,13 +221,49 @@ const { site, title, tagline } = Astro.props; font-size: var(--desktop-body-sm); line-height: var(--lh-desktop-body); } + + .logo { transition:all .12s ease-out;} + + .logo:hover{ + -webkit-animation-name: buzz; + animation-name: buzz; + -webkit-animation-duration: 0.32s; + animation-duration: 0.32s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: 2; + animation-iteration-count 2:; + transform: scale(1.2); + } + @-webkit-keyframes buzz { + 50% { + -ms-transform: translateX(3px) rotate(2deg); + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -ms-transform: translateX(-3px) rotate(-2deg); + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + } + @keyframes buzz { + 50% { + -ms-transform: translateX(3px) rotate(2deg); + -webkit-transform: translateX(3px) rotate(2deg); + transform: translateX(3px) rotate(2deg); + } + 100% { + -ms-transform: translateX(-3px) rotate(-2deg); + -webkit-transform: translateX(-3px) rotate(-2deg); + transform: translateX(-3px) rotate(-2deg); + } + } @media (max-width: 480px) { main {margin: auto var(--spacing-06);} .floating-nav { padding: var(--spacing-06) var(--spacing-06);} .container { margin: var(--spacing-06);} } - -