From b17977a5c79d3320ddb8c925de9e0e20d1fdb31c Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Tue, 31 Oct 2023 15:43:56 +0800
Subject: [PATCH] First production-stage scroll-driven animation

---
 src/components/account-info.css | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/components/account-info.css b/src/components/account-info.css
index 9b89821..1c48b62 100644
--- a/src/components/account-info.css
+++ b/src/components/account-info.css
@@ -424,6 +424,16 @@
   display: none;
 }
 
+@keyframes bye-banner {
+  20% {
+    transform: translateY(0);
+    filter: blur(0) opacity(1);
+  }
+  100% {
+    transform: translateY(8px);
+    filter: blur(16px) opacity(0.75);
+  }
+}
 .sheet .account-container {
   border-radius: 16px 16px 0 0;
   overflow-x: hidden;
@@ -455,6 +465,11 @@
     margin-top: calc(-1 * var(--banner-overlap));
   }
 
+  .header-banner:not(.header-is-avatar):not(:hover):not(:active) {
+    animation: bye-banner 1s linear both;
+    animation-timeline: scroll();
+  }
+
   main {
     margin-top: -8px;
     padding-top: 1px;