From: Ardis Lu <ardisglu@gmail.com>
Date: Tue, 7 Feb 2023 03:51:36 +0000 (-0800)
Subject: Add behavior on 🥱 click
X-Git-Url: https://git.ardis.lu/?a=commitdiff_plain;h=95286345e164c2937b0bcf6f9e98d3d10432f75a;p=sleepy-operators

Add behavior on 🥱 click
---

diff --git a/index.html b/index.html
index b1d84b1..dc4bbe6 100644
--- a/index.html
+++ b/index.html
@@ -71,7 +71,7 @@
     </table>
   </main>
 
-  <div class="yawn">🥱</div>
+  <div tabindex="0" class="yawn">🥱</div>
 
   <script type="module" src="/script.js"></script>
 </body>
diff --git a/script.js b/script.js
index bfb33d2..f1181be 100644
--- a/script.js
+++ b/script.js
@@ -32,3 +32,7 @@ globalThis.functions = function functions() {
     'sleepy.sum(number[])': 'Sleepily sum together an array of numbers.'
   });
 }
+
+document.querySelector('div.yawn').addEventListener('click', e => {
+  console.log('👏 You found an easter egg!');
+});
diff --git a/style.css b/style.css
index e17985a..ce360dc 100644
--- a/style.css
+++ b/style.css
@@ -119,4 +119,18 @@ abbr:has(kbd) {
 .yawn:focus-within {
   opacity: 65%;
   transition: opacity 200ms;
+}
+
+@keyframes throb {
+  50% {
+    transform: scale(1.3);
+  }
+}
+
+.yawn:focus {
+  animation: throb 1s;
+}
+
+.yawn:active {
+  animation: none;
 }
\ No newline at end of file