From fc8210fa1c8b5e2b223232ede54cd86cc5e7b384 Mon Sep 17 00:00:00 2001
From: dappsar <dapps.ar@gmail.com>
Date: Wed, 25 Sep 2024 17:17:16 -0300
Subject: [PATCH] [feat] :sparkles: add nft id to ui (#61)

---
 src/sections/nfts/nft-item.tsx | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/sections/nfts/nft-item.tsx b/src/sections/nfts/nft-item.tsx
index caeec38..3434578 100644
--- a/src/sections/nfts/nft-item.tsx
+++ b/src/sections/nfts/nft-item.tsx
@@ -50,6 +50,24 @@ export default function NftItem({ nft }: Props) {
     window.open(linkShare, '_blank')
   }
 
+  const renderNftId = (
+    <Box
+      sx={{
+        position: 'absolute',
+        top: 30,
+        left: 25,
+        backgroundColor: 'rgba(0, 0, 0, 0.6)',
+        padding: '2px 6px',
+        borderRadius: '4px',
+        color: 'white',
+        fontSize: '10px',
+        zIndex: 1
+      }}
+    >
+      {`#${nftId}`}
+    </Box>
+  )
+
   return (
     <>
       <Card>
@@ -68,6 +86,7 @@ export default function NftItem({ nft }: Props) {
               alignItems: 'center'
             }}
           >
+            {renderNftId}
             <Link
               href={linkMarketplace}
               target='_blank'