From 7f9742b50a8dff23de1db4a1c705ee8afe7407e5 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Wed, 25 Jan 2023 00:26:47 +0800
Subject: [PATCH] Animate skeleton

---
 src/components/status.css | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/src/components/status.css b/src/components/status.css
index 3cf11e34..a988219a 100644
--- a/src/components/status.css
+++ b/src/components/status.css
@@ -79,12 +79,26 @@
 .status.large.visibility-direct {
   background-image: var(--fade-in-out-bg), var(--yellow-stripes);
 }
+
+@keyframes skeleton-breathe {
+  0% {
+    opacity: 1;
+  }
+  40% {
+    opacity: 0.4;
+  }
+  100% {
+    opacity: 1;
+  }
+}
 .status.skeleton {
   color: var(--outline-color);
+  animation: skeleton-breathe 6s linear infinite;
   user-select: none;
   pointer-events: none;
+  contain: layout;
+  text-rendering: optimizeSpeed;
 }
-
 .status.skeleton > .avatar {
   background-color: var(--outline-color);
 }