Skip to content

Commit

Permalink
Merge pull request #93 from 0xHashstack/development
Browse files Browse the repository at this point in the history 
Development Updates
  • Loading branch information
@VenkatTeja
VenkatTeja committed Nov 27, 2023
2 parents bbe2687 + 56fa6fb commit 5040900
Show file tree
Hide file tree
Showing 8 changed files with 15,153 additions and 115 deletions.
8,588 changes: 8,588 additions & 0 deletions public/dancing_man-01.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6,255 changes: 6,255 additions & 0 deletions public/party_icon-01.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
150 changes: 102 additions & 48 deletions src/components/Content.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Box, Text, useMediaQuery, Image } from '@chakra-ui/react'
import React from 'react'
import { Box, Text, useMediaQuery, Image, Fade } from '@chakra-ui/react'
import React, { useEffect, useState } from 'react'
import MaxBorrow from '../assets/Icons/maxBorrow'

import BorrowTrade from '../assets/Images/Frame.png'
Expand All @@ -17,55 +17,109 @@ const Content = () => {
const [isHeightLargerThan1000] = useMediaQuery('(min-height: 1000px)')
// const flexDirection=isLessThan1250 ?"column":"row";
// console.log(isLessThan1250,"less")
const [showText1, setShowText1] = useState(true);

// Array of texts and links
const texts = [
{
text: 'Airdrop for mainnet v1 ',
link: 'https://app.hashstack.finance/',
},
{
text: 'Referral Campaign is live ',
link: 'https://your-other-link.com/',
},
];

// Function to toggle texts
const toggleTexts = () => {
setShowText1((prev: any) => !prev);
};

// Toggle texts every 4 seconds
useEffect(() => {
const interval = setInterval(toggleTexts, 5000);

return () => clearInterval(interval);
}, []);
return (
<Box>
<Box display="flex" flexDirection="row" background="transparent" >
<Box display="flex" flexDirection="column" mt={isLessThan1250 ?"6rem":"7rem"} >
<Box mb="4rem" background="linear-gradient(90deg, rgba(255, 255, 255,0.11) 0%, rgba(2, 1, 15, 0.00) 90%)" height="39px" display="flex" alignItems="center">
<Box fontSize="20px" fontWeight="500" lineHeight="20px" letterSpacing="-0.15px" ml="2rem" display="flex" alignItems="center">
<Text color="#00D395" mr="0.6rem">
Update:
</Text>
<Text _hover={{color:"#8C8C9B"}}>
<Box display="flex" flexDirection="row" background="transparent" >
<Box display="flex" flexDirection="column" mt={isLessThan1250 ? "6rem" : "7rem"} >
<Box mb="4rem" height="44px" display="flex" alignItems="center">
<Box fontSize="20px" fontWeight="500" lineHeight="20px" letterSpacing="-0.10px" ml="2rem" display="flex" alignItems="center">
<Text color="#00D395" mr="0.6rem" background="rgba(217, 217, 217, 0.10)" padding="9px 16px" borderRadius="10px">
Launched
</Text>
<Text
_hover={{ color: '#8C8C9B' }}
mr="0.6rem" background="rgba(217, 217, 217, 0.10)" padding="9px 16px" borderRadius="10px"
whiteSpace="nowrap"
>
<Link href={texts[0].link} target="_blank">
{texts[0].text}
<Image
src="/party_icon-01.svg"
alt="GHAF Logo"
// mt="0.2rem"
maxWidth="100%"
height="20px"
// maxHeight="100px"
/>
</Link>
</Text>
{/* <Text
_hover={{ color: '#8C8C9B' }}
mr="0.6rem" background="rgba(217, 217, 217, 0.10)" padding="9px 16px" borderRadius="10px"
cursor="pointer"
whiteSpace="nowrap"
>
<Link href={texts[1].link} target="_blank">
{texts[1].text}
<Image
src="/dancing_man-01.svg"
alt="GHAF Logo"
maxWidth="100%"
height="20px"
// maxHeight="100px"
/>
</Link>
</Text> */}

<Link href="https://app.hashstack.finance//" target='_blank'>
V1 mainnet is live
</Link>
</Text>
</Box>
</Box>
{isLessThan1250 ? <Image
src="/maxBorrowIpadView.svg"
alt="hero title text"
maxWidth="100%"
height="208px"
width="295px"
p="0 2rem"
/>: <Image
src="/maxBorrow.svg"
alt="hero title text"
maxWidth="100%"
p="0 2rem"
height={ isHeightLargerThan1000 && isLargerThan1800? "110": isLargerThan1800 ?"100":isLargerThan1600 ?"90": ""}
/>}
{isLessThan1250 ? <Text color="#858786" fontFamily="inter" p="0 2rem"
fontSize={isLessThan1250?"28px": isHeightLargerThan1000 && isLargerThan1800 ?"46px": isLargerThan1800 ? "40px":"30px"}
fontStyle="normal" fontWeight="300" lineHeight="normal" letterSpacing="0.64px" mt="0.7rem">
of your collateral for liquidity mining &
trading needs.</Text>: <Text color="#858786" fontFamily="inter" p="0 2rem"
fontSize={isLessThan1250?"28px": isHeightLargerThan1000 && isLargerThan1800 ?"46px": isLargerThan1800 ? "40px":isLargerThan1600?"36px": "30px"}
fontStyle="normal" fontWeight="300" lineHeight="normal" letterSpacing="0.64px" mt="0.7rem" whiteSpace="nowrap">
of your collateral for liquidity mining &
<br />
trading needs.</Text>}
</Box>
</Box>
{isLessThan1250 ? <Image
src="/maxBorrowIpadView.svg"
alt="GHAF Logo"
maxWidth="100%"
height="208px"
width="295px"
p="0 2rem"
/> : <Image
src="/maxBorrow.svg"
alt="GHAF Logo"
maxWidth="100%"
p="0 2rem"
height={isHeightLargerThan1000 && isLargerThan1800 ? "110" : isLargerThan1800 ? "100" : isLargerThan1600 ? "90" : ""}
/>}
{isLessThan1250 ? <Text color="#858786" fontFamily="inter" p="0 2rem"
fontSize={isLessThan1250 ? "28px" : isHeightLargerThan1000 && isLargerThan1800 ? "46px" : isLargerThan1800 ? "40px" : "30px"}
fontStyle="normal" fontWeight="300" lineHeight="normal" letterSpacing="0.64px" mt="0.7rem">
of your collateral for liquidity mining &
trading needs.</Text> : <Text color="#858786" fontFamily="inter" p="0 2rem"
fontSize={isLessThan1250 ? "28px" : isHeightLargerThan1000 && isLargerThan1800 ? "46px" : isLargerThan1800 ? "40px" : isLargerThan1600 ? "36px" : "30px"}
fontStyle="normal" fontWeight="300" lineHeight="normal" letterSpacing="0.64px" mt="0.7rem" whiteSpace="nowrap">
of your collateral for liquidity mining &
<br />
trading needs.</Text>}

</Box>
<Box mt={isHeightLargerThan1000 && isLargerThan1800? "5rem":"4rem"} mr="1rem" ml={isLargerThan1800 ?"8rem":isLargerThan1700?"10rem": isLargerThan1600?"7rem":"5rem"}
</Box>
<Box mt={isHeightLargerThan1000 && isLargerThan1800 ? "5rem" : "4rem"} mr="1rem" ml={isLargerThan1800 ? "8rem" : isLargerThan1700 ? "10rem" : isLargerThan1600 ? "7rem" : "5rem"}
// display="flex"
// justifyContent={isLessThan1250 ?"center":""}
>
{/* <AnimatedFrame/> */}
{/* <Image
>
{/* <AnimatedFrame/> */}
{/* <Image
src="/frame.svg"
alt="Animation Logo"
maxWidth="100%"
Expand All @@ -79,13 +133,13 @@ const Content = () => {
height={ isHeightLargerThan1000 && isLargerThan1800? "460": isLargerThan1800 ?"430": isHeightLargerThan1000 && isLargerThan1600 ?"435": isLargerThan1600?"430":""}
// maxHeight="100px"

/>
{/* <video autoPlay loop height={isLessThan1350 ? 300:""}>
/>
{/* <video autoPlay loop height={isLessThan1350 ? 300:""}>
<source src="/landingPage_illustration.mp4" type="video/mp4" />
</video> */}
</Box>
</Box>
</Box>
</Box>

)
}
Expand Down
28 changes: 26 additions & 2 deletions src/components/Footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,19 @@ const Footer = () => {
cursor="pointer"
_hover={{color:"#00D395"}}
>
Tokenomics
HASH token
</Text>
<Text
color="#8C8C9B"
fontSize="14px"
fontStyle="normal"
fontWeight="500"
lineHeight="20px"
cursor="pointer"
_hover={{color:"#00D395"}}

>
Referral Leaderboard
</Text>
<Link href="https://hashstack.finance/c2e" target="_blank">
<Text
Expand Down Expand Up @@ -328,7 +340,19 @@ const Footer = () => {
_hover={{color:"#00D395"}}

>
Tokenomics
HASH token
</Text>
<Text
color="#8C8C9B"
fontSize="14px"
fontStyle="normal"
fontWeight="500"
lineHeight="20px"
cursor="pointer"
_hover={{color:"#00D395"}}

>
Referral Leaderboard
</Text>
<Link href="https://hashstack.finance/c2e" target="_blank">
<Text
Expand Down
88 changes: 74 additions & 14 deletions src/components/IpadView.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Box, useMediaQuery, Image, Text, Skeleton } from '@chakra-ui/react'
import { Box, useMediaQuery, Image, Text, Skeleton, Fade } from '@chakra-ui/react'
import React, { useEffect, useState } from 'react'
import Banner from './Banner'
import Navbar from './Navbar'
Expand Down Expand Up @@ -30,6 +30,31 @@ const IpadView = () => {
const { isDrawerOpen, toggleDrawer } = useDrawContext();
const [dashboardHover, setDashboardHover] = useState(0);
const [tvl, seTtvl] = useState<any>()
const [showText1, setShowText1] = useState(true);

// Array of texts and links
const texts = [
{
text: 'Airdrop for mainnet v1 ',
link: 'https://app.hashstack.finance//',
},
{
text: 'Referral Campaign is live ',
link: 'https://your-other-link.com//',
},
];

// Function to toggle texts
const toggleTexts = () => {
setShowText1((prev: any) => !prev);
};

// Toggle texts every 4 seconds
useEffect(() => {
const interval = setInterval(toggleTexts, 5000);

return () => clearInterval(interval);
}, []);
useEffect(() => {
const fetchData = async () => {
try {
Expand All @@ -46,6 +71,7 @@ const IpadView = () => {
}
fetchData();
}, [])

return (
<Box >
<Navbar />
Expand All @@ -67,16 +93,50 @@ const IpadView = () => {
<source src="/landingPage_illustration.mp4" type="video/mp4" />
</video> */}
</Box>
<Box mb="2rem" mt="2rem" background="linear-gradient(90deg, rgba(255, 255, 255, 0.25) 19%, rgba(2, 1, 15, 0.00) 100%)" height="35px" display="flex" alignItems="center" justifyContent="center">
<Box fontSize="24px" fontWeight="500" lineHeight="20px" letterSpacing="-0.15px" ml="1.5rem" whiteSpace="nowrap" display="flex" alignItems="center">
<Text color="#00D395" mr="0.6rem">
Update:
<Box mt="2rem" mb="2rem" height="35px" display="flex" alignItems="center" justifyContent="center">
<Box fontSize="20px" fontWeight="500" lineHeight="20px" letterSpacing="-0.15px" ml="1.5rem" whiteSpace="nowrap" display="flex" alignItems="center">
<Text color="#00D395" mr="0.6rem" background="rgba(217, 217, 217, 0.10)" padding="9px 16px" borderRadius="10px">
Launched
</Text>
<Text
_hover={{ color: '#8C8C9B' }}
mr="0.6rem" background="rgba(217, 217, 217, 0.10)" padding="9px 16px" borderRadius="10px" display="flex" flexDirection="row"
>
<Link href={texts[0].link} target="_blank" >
{texts[0].text}
<Image
src="/party_icon-01.svg"
alt="GHAF Logo"
// mt="0.2rem"
maxWidth="100%"
height="20px"
// maxHeight="100px"
/>
</Link>
</Text>
<Link href="https://app.hashstack.finance//" target='_blank'>
V1 mainnet is live
</Link>
</Box>

</Box>
{/* <Box mb="2rem" mt="1rem" height="35px" display="flex" alignItems="center" >
<Text
_hover={{ color: '#8C8C9B' }}
background="rgba(217, 217, 217, 0.10)" padding="9px 23px" borderRadius="10px"
fontSize="20px" fontWeight="500" lineHeight="20px" letterSpacing="-0.15px" whiteSpace="nowrap"
>
<Link href={texts[1].link} target="_blank">
{texts[1].text}
<Image
src="/dancing_man-01.svg"
alt="GHAF Logo"
// mt="0.2rem"
maxWidth="100%"
height="20px"
// maxHeight="100px"
/>
</Link>
</Text>
</Box> */}

<Box display="flex" flexDirection="column" justifyContent="center">
<Image
src="/maxBorrow.svg"
Expand All @@ -93,7 +153,7 @@ const IpadView = () => {
mining & trading needs.</Text>
</Box>
<Box display="flex" flexDirection="row" justifyContent="center" gap="3rem" mt="2rem">
<Box>
{/* <Box>
<Text color="#8C8C9B" fontSize="20px" fontWeight="500" fontStyle="normal" fontFamily="inter" mb="0" whiteSpace="nowrap">
Utilization Rate
</Text>
Expand All @@ -111,13 +171,13 @@ const IpadView = () => {
/>
</Box>
}
</Box>
<Box>
<Text color="#8C8C9B" fontSize="20px" fontWeight="500" fontStyle="normal" fontFamily="inter" mb="0" whiteSpace="nowrap">
Total Value Locked
</Box> */}
<Box display="flex" flexDirection="row" justifyContent="center">
<Text color="#8C8C9B" fontSize="20px" fontWeight="500" fontStyle="normal" fontFamily="inter" mb="0" whiteSpace="nowrap" mr="1rem">
Liquidation Locked
</Text>
{tvl ?
<Text color="#00D395" textAlign="center" fontFamily="inter" fontSize="28px" fontStyle="normal" fontWeight="600" lineHeight="40px" mt="0.4rem" whiteSpace="nowrap">
<Text color="#00D395" textAlign="center" fontFamily="inter" fontSize="28px" fontStyle="normal" fontWeight="600" lineHeight="40px" mt="0.6rem" whiteSpace="nowrap">
{tvl ? `$${numberFormatter(tvl)}+` : ""}
</Text> :
<Box color="#00D395" textAlign="center" fontFamily="inter" fontSize="28px" fontStyle="normal" fontWeight="600" lineHeight="40px" mt="0.4rem" whiteSpace="nowrap">
Expand Down
Loading

0 comments on commit 5040900

Please sign in to comment.