chat

Author: avcodewizard

chat/assets/css/loader-v1.0.0.1.css

@@ -0,0 +1,49 @@
+.user-list-loader .user-item {
+    display: flex;
+    align-items: center;
+    padding: 10px;
+}
+
+.avatar-loader {
+    width: 50px;
+    height: 50px;
+    aspect-ratio: 1 / 1;
+    background-color: #e0e0e0;
+    animation: shimmer 1.5s infinite;
+}
+
+.name-loader,
+.desc-loader {
+    height: 14px;
+    background-color: #e0e0e0;
+    animation: shimmer 1.5s infinite;
+}
+
+.name-loader {
+    width: 150px;
+    margin-bottom: 6px;
+}
+
+.desc-loader {
+    width: 100px;
+}
+
+@keyframes shimmer {
+    0% {
+        background-position: -468px 0;
+    }
+    100% {
+        background-position: 468px 0;
+    }
+}
+
+.user-list-loader .avatar-loader,
+.user-list-loader .name-loader,
+.user-list-loader .desc-loader {
+    background: #f6f7f8;
+    background-image: linear-gradient(to right, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
+    background-repeat: no-repeat;
+    background-size: 800px 104px;
+    display: inline-block;
+    position: relative;
+}