add claim button (fake)

blockscout · Oct 10, 2024 · 0d9eef5 · 0d9eef5
1 parent e61c9b1
commit 0d9eef5
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/ui/games/Puzzle15.tsx b/ui/games/Puzzle15.tsx
@@ -1,4 +1,4 @@
-import { Grid, Box } from '@chakra-ui/react';
+import { Grid, Box, Flex, Button } from '@chakra-ui/react';
 import { motion } from 'framer-motion';
 import React, { useState, useEffect, useCallback, useRef } from 'react';
 
@@ -134,7 +134,7 @@ const Puzzle15 = () => {
   }, [ isWon, moveTile ]);
 
   return (
-    <>
+    <Flex flexDirection="column" alignItems="center" justifyContent="center">
       <Grid templateColumns="repeat(4, 1fr)" w="400px" h="400px">
         { tiles.map((tile, index) => (
           <motion.div
@@ -175,8 +175,8 @@ const Puzzle15 = () => {
           </motion.div>
         )) }
       </Grid>
-      { isWon && <p>Congratulations! You solved the puzzle!</p> }
-    </>
+      { isWon && <Button mt={ 10 }>Claim NFT</Button> }
+    </Flex>
   );
 };