Merge pull request #3 from MichaelZhao21/WIGGLE

WIGGLE
hackutd · Mar 1, 2023 · f6bc443 · f6bc443
2 parents 4aa2dc0 + 727cec1
commit f6bc443
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/client/src/Home.tsx b/client/src/Home.tsx
@@ -4,7 +4,11 @@ import Container from './components/Container';
 const App = () => {
     return (
         <Container>
-            <h1 className="text-7xl font-bold text-center mb-4">Jury</h1>
+            <h1 className="text-7xl font-bold text-center mb-4 hover:animate-wiggle cursor-pointer">
+                <a href="https://github.com/acmutd/jury" target="_blank" rel="noopener noreferrer">
+                    Jury
+                </a>
+            </h1>
             <h2 className="text-primary text-3xl text-center font-bold mb-24">
                 {process.env.REACT_APP_JURY_NAME}
             </h2>

diff --git a/client/tailwind.config.js b/client/tailwind.config.js
@@ -10,13 +10,27 @@ module.exports = {
             lightest: '#C7CFD3',
             background: '#F5F5F5',
             backgroundDark: '#D4DBDF',
-            error: '#EA609C'
+            error: '#EA609C',
         },
         fontFamily: {
             text: ['Rubik', 'Franklin Gothic Medium', 'Arial Narrow', 'Arial', 'sans-serif'],
             mono: ['Roboto Mono', 'Courier New', 'Courier', 'monospace'],
         },
-        extend: {},
+        extend: {
+            keyframes: {
+                wiggle: {
+                    '0%, 100%': {
+                        transform: 'skew(2deg, 5deg)',
+                    },
+                    '50%': {
+                        transform: 'skew(-5deg, -2deg)',
+                    },
+                },
+            },
+            animation: {
+                wiggle: 'wiggle 0.3s cubic-bezier(.23,.7,.3,.85) infinite',
+            },
+        },
     },
     plugins: [],
 };