From d5fa4d1c5e9024983836546cd8b75996fdbc8e54 Mon Sep 17 00:00:00 2001
From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com>
Date: Wed, 6 Nov 2024 20:10:13 +0530
Subject: [PATCH] update timestamps

---
 src/components/Footer/Footer.jsx              |  4 +--
 .../LatestTransactions/LatestTransactions.jsx | 22 +++++++++++++++-
 src/pages/MainNet.jsx                         | 22 +++++++++++++++-
 src/pages/MainNetIdOverview.jsx               | 22 +++++++++++++++-
 src/pages/SubnetIdOverview.jsx                | 22 +++++++++++++++-
 src/pages/Transaction/TransactionDetails.jsx  | 26 +++++++++++++++++--
 6 files changed, 110 insertions(+), 8 deletions(-)

diff --git a/src/components/Footer/Footer.jsx b/src/components/Footer/Footer.jsx
index 3941073..05b3eba 100644
--- a/src/components/Footer/Footer.jsx
+++ b/src/components/Footer/Footer.jsx
@@ -4,9 +4,9 @@ import React from 'react'
 const Footer = () => {
   const { colorMode } = useColorMode();
   return (
-    <Box textAlign={"center"} bg={colorMode === "light" ? "#230A79" : "#232127"} p={4}>
+    <Box textAlign={"center"} bg={colorMode === "light" ? "#230A79" : "#232127"} p={1}>
       <Container maxW="6xl">
-        <Text fontWeight={500} fontSize={"15px"} color={colorMode === "light" ? "#fff" : "#B09AFF"}>All timestamps are shown in UTC+00:00</Text>
+        <Text fontSize={"12px"} color={"#f3f3f5"}>All timestamps are shown in UTC+00:00</Text>
       </Container>
     </Box>
   )
diff --git a/src/components/LatestTransactions/LatestTransactions.jsx b/src/components/LatestTransactions/LatestTransactions.jsx
index 1e5b804..05d0203 100644
--- a/src/components/LatestTransactions/LatestTransactions.jsx
+++ b/src/components/LatestTransactions/LatestTransactions.jsx
@@ -527,7 +527,27 @@ const LatestTransactions = () => {
                     </Box>
                   )}
 
-                  <Box>
+                  <Box position={"relative"}>
+                    <Tooltip 
+                      p={2}
+                      fontWeight={400}
+                      lineHeight={"18px"}
+                      boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                      color={colorMode === "light" ? "#230A79" : "#230A79"}
+                      fontStyle={"12px"}
+                      rounded={"5px"}
+                      bg={colorMode === "light" ? "#fff" : "#fff"}
+                      label={"All timestamps are shown in UTC+00:00"}
+                      placement='top-start'>
+                      <Text p={0} display={{ base: "none", md: "block" }} position={"absolute"} top={"2px"} left={"-24px"}>
+                        <Icon
+                          cursor={"pointer"}
+                          as={MdOutlineErrorOutline}
+                          fontSize={"18px"}
+                          color="#7B7B7B"
+                        />
+                      </Text>
+                    </Tooltip>
                     <Text
                       mb={2}
                       color={colorMode === "light" ? "#7B7B7B" : "#E8E8E8"}
diff --git a/src/pages/MainNet.jsx b/src/pages/MainNet.jsx
index 62e6fb4..f561c2f 100644
--- a/src/pages/MainNet.jsx
+++ b/src/pages/MainNet.jsx
@@ -526,7 +526,27 @@ const MainNet = () => {
                     </Box>
                   )}
 
-                  <Box>
+                  <Box position={"relative"}>
+                  <Tooltip 
+                      p={2}
+                      fontWeight={400}
+                      lineHeight={"18px"}
+                      boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                      color={colorMode === "light" ? "#230A79" : "#230A79"}
+                      fontStyle={"12px"}
+                      rounded={"5px"}
+                      bg={colorMode === "light" ? "#fff" : "#fff"}
+                      label={"All timestamps are shown in UTC+00:00"}
+                      placement='top-start'>
+                      <Text p={0} display={{ base: "none", md: "block" }} position={"absolute"} top={"2px"} left={"-24px"}>
+                        <Icon
+                          cursor={"pointer"}
+                          as={MdOutlineErrorOutline}
+                          fontSize={"18px"}
+                          color="#7B7B7B"
+                        />
+                      </Text>
+                    </Tooltip>
                     <Text
                       mb={2}
                       color={colorMode === "light" ? "#7B7B7B" : "#E8E8E8"}
diff --git a/src/pages/MainNetIdOverview.jsx b/src/pages/MainNetIdOverview.jsx
index 12d1c52..bd287d2 100644
--- a/src/pages/MainNetIdOverview.jsx
+++ b/src/pages/MainNetIdOverview.jsx
@@ -234,7 +234,27 @@ const MainNetOveriew = () => {
                         <Link to="/smart-contract">{transaction.contract}</Link>
                       </Text>
                     </Box>
-                    <Box>
+                    <Box position={"relative"}>
+                    <Tooltip 
+                      p={2}
+                      fontWeight={400}
+                      lineHeight={"18px"}
+                      boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                      color={colorMode === "light" ? "#230A79" : "#230A79"}
+                      fontStyle={"12px"}
+                      rounded={"5px"}
+                      bg={colorMode === "light" ? "#fff" : "#fff"}
+                      label={"All timestamps are shown in UTC+00:00"}
+                      placement='top-start'>
+                      <Text p={0} display={{ base: "none", md: "block" }} position={"absolute"} top={"2px"} left={"-24px"}>
+                        <Icon
+                          cursor={"pointer"}
+                          as={MdOutlineErrorOutline}
+                          fontSize={"18px"}
+                          color="#7B7B7B"
+                        />
+                      </Text>
+                    </Tooltip>
                       <Text
                         mb={2}
                         color={colorMode === "light" ? "#7B7B7B" : "#E8E8E8"}
diff --git a/src/pages/SubnetIdOverview.jsx b/src/pages/SubnetIdOverview.jsx
index 8a478fc..afaf798 100644
--- a/src/pages/SubnetIdOverview.jsx
+++ b/src/pages/SubnetIdOverview.jsx
@@ -540,7 +540,27 @@ const SubnetInner = () => {
                     </Box>
                   )}
 
-                  <Box>
+                  <Box position={"relative"}>
+                  <Tooltip 
+                      p={2}
+                      fontWeight={400}
+                      lineHeight={"18px"}
+                      boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                      color={colorMode === "light" ? "#230A79" : "#230A79"}
+                      fontStyle={"12px"}
+                      rounded={"5px"}
+                      bg={colorMode === "light" ? "#fff" : "#fff"}
+                      label={"All timestamps are shown in UTC+00:00"}
+                      placement='top-start'>
+                      <Text p={0} display={{ base: "none", md: "block" }} position={"absolute"} top={"2px"} left={"-24px"}>
+                        <Icon
+                          cursor={"pointer"}
+                          as={MdOutlineErrorOutline}
+                          fontSize={"18px"}
+                          color="#7B7B7B"
+                        />
+                      </Text>
+                    </Tooltip>
                     <Text
                       mb={2}
                       color={colorMode === "light" ? "#7B7B7B" : "#E8E8E8"}
diff --git a/src/pages/Transaction/TransactionDetails.jsx b/src/pages/Transaction/TransactionDetails.jsx
index bdec86c..e635501 100644
--- a/src/pages/Transaction/TransactionDetails.jsx
+++ b/src/pages/Transaction/TransactionDetails.jsx
@@ -5,14 +5,16 @@ import {
   Divider,
   Heading,
   HStack,
+  Icon,
   Image,
   Text,
+  Tooltip,
   useColorMode,
   useToast,
   VStack,
 } from "@chakra-ui/react";
 import React, { useContext, useEffect, useState } from "react";
-import { MdContentCopy } from "react-icons/md";
+import { MdContentCopy, MdOutlineErrorOutline } from "react-icons/md";
 import { Link, useNavigate, useParams } from "react-router-dom";
 import RelatedTransactions from "../../components/RelatedTransactions/RelatedTransactions";
 import bannerImage from "../../assets/images/bannerImg.png";
@@ -671,7 +673,27 @@ const TransactionDetails = () => {
                 </Box>
               )}
               {data?.data?.timestamp && (
-                <Box>
+                <Box position={"relative"}>
+                  <Tooltip 
+                      p={2}
+                      fontWeight={400}
+                      lineHeight={"18px"}
+                      boxShadow={"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"}
+                      color={colorMode === "light" ? "#230A79" : "#230A79"}
+                      fontStyle={"12px"}
+                      rounded={"5px"}
+                      bg={colorMode === "light" ? "#fff" : "#fff"}
+                      label={"All timestamps are shown in UTC+00:00"}
+                      placement='top-start'>
+                      <Text p={0} display={{ base: "none", md: "block" }} position={"absolute"} top={"2px"} left={"-24px"}>
+                        <Icon
+                          cursor={"pointer"}
+                          as={MdOutlineErrorOutline}
+                          fontSize={"18px"}
+                          color="#7B7B7B"
+                        />
+                      </Text>
+                    </Tooltip>
                   <Text>Timestamp</Text>
                   <Text color={"#555"}>
                     {formatUTCToDDMMYYHHMMSS(data?.data?.timestamp)}