Refactored component folder structure to be a little clearer

2020-04-23 10:09:12 +10:00
parent 65c3620732
commit f2a92f2ccd
19 changed files with 42 additions and 42 deletions
--- a/src/components/token/TokenStatus.js
+++ b/src/components/token/TokenStatus.js
@@ -0,0 +1,47 @@
+import React from "react";
+import { Box } from "theme-ui";
+
+import colors from "../../helpers/colors";
+
+function TokenStatus({ statuses }) {
+  return (
+    <Box
+      sx={{
+        position: "absolute",
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
+      }}
+    >
+      {statuses.map((status, index) => (
+        <Box
+          key={status}
+          sx={{
+            width: "100%",
+            height: "100%",
+            position: "absolute",
+            opacity: 0.8,
+            transform: `scale(${1 - index / 10})`,
+          }}
+        >
+          <svg
+            style={{ position: "absolute" }}
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 100 100"
+          >
+            <circle
+              r={47}
+              cx={50}
+              cy={50}
+              fill="none"
+              stroke={colors[status]}
+              strokeWidth={4}
+            />
+          </svg>
+        </Box>
+      ))}
+    </Box>
+  );
+}
+
+export default TokenStatus;