Merge pull request #132 from /issues/129

member詳細画面のPercentageViewの作成
SystemEngineeringTeam · Sep 3, 2024 · babbb60 · babbb60
2 parents 4ddb87f + ed5b77c
commit babbb60
Showing 1 changed file with 17 additions and 0 deletions.
diff --git a/src/components/member/PercentageView.tsx b/src/components/member/PercentageView.tsx
@@ -0,0 +1,17 @@
+import { Box, Flex, Text } from "@radix-ui/themes";
+import { ReactElement } from "react";
+
+export function PercentageView({ percent }: { percent: number }): ReactElement {
+  return (
+    <Box width="100%">
+      <Flex direction="column" gap="1">
+        <Text size="5" align="center">
+          実績解除率
+        </Text>
+        <Text size="9" align="center">
+          {percent}%
+        </Text>
+      </Flex>
+    </Box>
+  );
+}