From 6aa535b7bbdcea4e6ac9b4932d1ea70cbb5142e8 Mon Sep 17 00:00:00 2001
From: abefernan <44572727+abefernan@users.noreply.github.com>
Date: Mon, 17 Apr 2023 16:48:54 +0200
Subject: [PATCH] Add spinner component

---
 components/Spinner.tsx | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 components/Spinner.tsx

diff --git a/components/Spinner.tsx b/components/Spinner.tsx
new file mode 100644
index 0000000..18f7586
--- /dev/null
+++ b/components/Spinner.tsx
@@ -0,0 +1,30 @@
+interface SpinnerProps {
+  readonly size?: number;
+}
+
+const Spinner = ({ size }: SpinnerProps) => (
+  <>
+    <div className="spinner"></div>
+    <style jsx>{`
+      .spinner {
+        border: ${size || 2}px solid #f3f3f3;
+        border-top: ${size || 2}px solid #561253;
+        border-radius: 50%;
+        width: ${size || 16}px;
+        height: ${size || 16}px;
+        animation: spin 1s linear infinite;
+      }
+
+      @keyframes spin {
+        0% {
+          transform: rotate(0deg);
+        }
+        100% {
+          transform: rotate(360deg);
+        }
+      }
+    `}</style>
+  </>
+);
+
+export default Spinner;