login link css animation find

lgh06 · Apr 9, 2022 · 0d0a1a1 · 0d0a1a1
1 parent c89c4bc
commit 0d0a1a1
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/packages/web/src/pages/index.tsx b/packages/web/src/pages/index.tsx
@@ -39,7 +39,7 @@ const Home: NextPage = () => {
             <Link href="/login"><a>{t('Go to User Center')}</a></Link>
           </>):(<>
             <span {...innerHTML(t('Welcome to Web Page Monitor'))}></span> <span style={{zoom: .45}}>alpha</span> <br/>
-            {t('Please')} <Link href="/login"><a>{t('Login')}</a></Link>
+            {t('Please')} <span className='look-here'><Link href="/login"><a >{t('Login')}</a></Link></span>
             </>)}
         </h1>
 

diff --git a/packages/web/src/styles/globals.scss b/packages/web/src/styles/globals.scss
@@ -45,3 +45,16 @@ td, th{
   max-width: 30%;
   word-break: break-word;
 }
+
+
+span.look-here{
+  display: inline-block;
+  animation: lookHereAnim linear .95s infinite;
+}
+@keyframes lookHereAnim {
+  0% {transform: rotate(0deg) scale(1);}
+  25% {transform: rotate(2deg) scale(1.1);}
+  50% {transform: rotate(0deg) scale(1);}
+  75% {transform: rotate(-2deg) scale(0.9);}
+  100% {transform: rotate(0deg) scale(1);}
+}