Skeleton

1 files changed, 18 insertions, 0 deletions

diff --git a/src/components/elements/Skeleton.js b/src/components/elements/Skeleton.js
new file mode 100644
index 00000000..843b200f
--- /dev/null
+++ b/src/components/elements/Skeleton.js
@@ -0,0 +1,18 @@
+const SkeletonList = ({ number }) => (
+  <div role="status" className="space-y-5 animate-pulse">
+    { Array.from(Array(number), (e, i) => (
+      <div className="flex items-center justify-between" key={i}>
+        <div>
+            <div className="h-2.5 bg-gray-300 rounded-full w-24 mb-2.5"></div>
+            <div className="w-32 h-2 bg-gray-200 rounded-full"></div>
+        </div>
+        <div className="h-2.5 bg-gray-300 rounded-full w-12"></div>
+    </div>
+    )) }
+    <span className="sr-only">Loading...</span>
+  </div>
+);
+
+export {
+  SkeletonList
+};
\ No newline at end of file