From 95286345e164c2937b0bcf6f9e98d3d10432f75a Mon Sep 17 00:00:00 2001
From: Ardis Lu <ardisglu@gmail.com>
Date: Mon, 6 Feb 2023 19:51:36 -0800
Subject: [PATCH] =?utf8?q?Add=20behavior=20on=20=F0=9F=A5=B1=20click?=
MIME-Version: 1.0
Content-Type: text/plain; charset=utf8
Content-Transfer-Encoding: 8bit

---
 index.html |  2 +-
 script.js  |  4 ++++
 style.css  | 14 ++++++++++++++
 3 files changed, 19 insertions(+), 1 deletion(-)

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
-- 
2.47.3