Add signet pages

2023-07-13 19:55:43 +09:00
parent 53396776df
commit 2edb2cde77
16 changed files with 655 additions and 4 deletions
@@ -0,0 +1,43 @@
+import { Box, Flex, Image } from 'theme-ui'
+
+interface SquareImageProps {
+  src: string
+  originalSize: number
+  size?: number
+  alt?: string
+}
+
+const SquareImage = ({ src, originalSize, size, alt }: SquareImageProps) => {
+  if (size == null) {
+    size = originalSize
+  }
+
+  const ratio = size / originalSize
+  return (
+    <Box sx={{ width: size, height: size, position: 'relative' }}>
+      <Box
+        sx={{
+          position: 'absolute',
+          left: (size - originalSize) / 2,
+          top: (size - originalSize) / 2
+        }}
+      >
+        <Flex
+          sx={{
+            position: 'absolute',
+            width: originalSize,
+            height: originalSize,
+            alignItems: 'center',
+            justifyContent: 'center',
+            zIndex: 1,
+            transform: `scale(${ratio})`
+          }}
+        >
+          <Image src={src} alt={alt} />
+        </Flex>
+      </Box>
+    </Box>
+  )
+}
+
+export default SquareImage