Add icon animation
This commit is contained in:
parent
8f3d798001
commit
e1e08eef49
|
@ -44,7 +44,7 @@ const menu: MenuItem[] = [
|
||||||
|
|
||||||
<div class="p-nav__bar">
|
<div class="p-nav__bar">
|
||||||
<a href="/" class="p-nav__logo">
|
<a href="/" class="p-nav__logo">
|
||||||
<img height="48px" width="51px" src="/static/svg/aya.svg" alt="">
|
<img class="p-nav__logo-icon" height="48px" width="51px" src="/static/svg/aya.svg" alt="">
|
||||||
<div class="p-nav__logo-text">
|
<div class="p-nav__logo-text">
|
||||||
<div class="p-nav__logo-main">Kamoshi.org</div>
|
<div class="p-nav__logo-main">Kamoshi.org</div>
|
||||||
<div class="p-nav__logo-sub" id="p-nav-splash">
|
<div class="p-nav__logo-sub" id="p-nav-splash">
|
||||||
|
|
|
@ -59,6 +59,14 @@
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-family: Arial, Helvetica, sans-serif;
|
font-family: Arial, Helvetica, sans-serif;
|
||||||
|
|
||||||
|
&-icon {
|
||||||
|
transition: transform 0.5s ease-in-out;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transform: scale(1) rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&-text {
|
&-text {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
Loading…
Reference in a new issue