diff --git a/components/Header.jsx b/components/Header.jsx index 5693d78..1c7de08 100644 --- a/components/Header.jsx +++ b/components/Header.jsx @@ -9,6 +9,7 @@ import { Plus, LockClosed, Rocket, + Chart } from "@web3uikit/icons"; import Box from "@mui/material/Box"; import { useAccount, useNetwork } from "wagmi"; @@ -21,7 +22,10 @@ export default function Header() { return ( <div> - {chain && chain.id != 1 && isConnected && ( + {chain && + // chain.id != 1 && + isConnected && + ( <div className="mb-6"> <BannerStrip buttonDisplayed @@ -39,11 +43,11 @@ export default function Header() { /> </div> )} - <div className="p-4 mb-2 border-b-2 flex flex-col md:flex-row justify-between items-center"> - <div className="hidden lg:flex flex-col items-center justify-content lg:pr-8"> + <div className="py-4 mb-2 border-b-2 flex flex-col md:flex-row justify-between items-center"> + <div className="hidden lg:flex flex-col items-center justify-content lg:pl-2"> <Link href="/"> <a target="_blank" rel="noopener noreferrer"> - <div className="px-4 mt-2 flex flex-row items-center"> + <div className="px-1 mt-2 flex flex-row items-center"> <div className="flex flex-col items-center"> <Box sx={{ @@ -74,15 +78,15 @@ export default function Header() { <div className="text-red-700">[ BETA ]</div> ) : ( <div className="text-red-700">[ ALPHA ]</div> - )} + )} */} </Box> </div> </a> </Link> </div> <div className="flex flex-col items-center my-2"> - <div className="flex flex-col md:flex-row md:items-center"> - <div className="flex flex-col m-2"> + <div className="flex flex-col md:flex-row md:items-center flex-wrap justify-center"> + <div className="flex flex-col m-1"> <Link href="/app"> <Button primary @@ -110,7 +114,7 @@ export default function Header() { /> </Link> </div> - <div className="flex flex-col m-2"> + <div className="flex flex-col m-1"> <Link href="/genesis"> <Button primary @@ -138,7 +142,7 @@ export default function Header() { /> </Link> </div> - <div className="flex flex-col m-2"> + <div className="flex flex-col m-1"> <Link href="/loanSearch"> <Button primary @@ -166,7 +170,7 @@ export default function Header() { /> </Link> </div> - <div className="flex flex-col m-2"> + <div className="flex flex-col m-1"> <Link href="/reserves"> <Button primary @@ -194,7 +198,7 @@ export default function Header() { /> </Link> </div> - <div className="flex flex-col m-2"> + <div className="flex flex-col m-1"> <Link href="/stake"> <Button primary @@ -222,13 +226,41 @@ export default function Header() { /> </Link> </div> + <div className="flex flex-col m-1"> + <Link href="/stats"> + <Button + primary + size="medium" + color="#eae5ea" + label={ + <div className="flex md:hidden lg:flex"> + <Box + sx={{ + fontFamily: "Monospace", + fontSize: "subtitle2.fontSize", + fontWeight: "bold", + letterSpacing: 4, + }} + > + Stats + </Box> + </div> + } + icon={ + <div className="pl-[10px]"> + <Chart fontSize="20px" color="#000000" /> + </div> + } + /> + </Link> + </div> </div> </div> - <div className="flex flex-col items-center px-8"> + <div className="flex flex-col items-center w-[190px]"> <ConnectButton showBalance={false} chainStatus="icon" - accountStatus="address" + accountStatus="address" /> </div> </div> diff --git a/pages/app.js b/pages/app.js index 2f440e2..8d096c4 100644 --- a/pages/app.js +++ b/pages/app.js @@ -261,6 +261,7 @@ export default function App() { height="200" width="200" className="rounded-3xl" + alt = "tokenURI" /> ) : ( <Box diff --git a/pages/index.js b/pages/index.js index 1a5e339..6f410b4 100644 --- a/pages/index.js +++ b/pages/index.js @@ -13,6 +13,7 @@ export default function Home() { <img src="symbol-no-bg.png" className={styles.headerLogoImg} + alt = "symbol" ></img> </a> </div> diff --git a/pages/loanSearch.js b/pages/loanSearch.js index 43f80db..3463753 100644 --- a/pages/loanSearch.js +++ b/pages/loanSearch.js @@ -1,10 +1,11 @@ import styles from "../styles/Home.module.css"; import { getAssetPrice } from "../helpers/getAssetPrice.js"; -import { ethers } from "ethers"; import { getNFTImage } from "../helpers/getNFTImage.js"; import { getAddressNFTs } from "../helpers/getAddressNFTs.js"; import { getSupportedNFTs } from "../helpers/getSupportedNFTs.js"; import contractAddresses from "../contractAddresses.json"; +//ethers +import { ethers } from "ethers"; import { BigNumber } from "@ethersproject/bignumber"; import { getAddress } from "@ethersproject/address"; import Autocomplete from "@mui/material/Autocomplete"; @@ -12,7 +13,6 @@ import TextField from "@mui/material/TextField"; import loanCenterContract from "../contracts/LoanCenter.json"; import nftOracleContract from "../contracts/NFTOracle.json"; import { useState, useEffect } from "react"; -import { useAccount, useNetwork } from "wagmi"; import { calculateHealthLevel } from "../helpers/healthLevel"; import { Illustration, Loading, Typography, Tooltip } from "@web3uikit/core"; import Card from "@mui/material/Card"; @@ -24,6 +24,8 @@ import Image from "next/image"; import LinearProgressWithLabel from "../components/LinearProgressWithLabel"; import Divider from "@mui/material/Divider"; import Liquidate from "../components/Liquidate"; +//wagmi +import { useAccount, useNetwork } from "wagmi"; import { useContract, useProvider } from "wagmi"; import StyledModal from "../components/StyledModal"; import erc721 from "../contracts/erc721.json"; diff --git a/pages/stats.js b/pages/stats.js new file mode 100644 index 0000000..f6c34dc --- /dev/null +++ b/pages/stats.js @@ -0,0 +1,38 @@ +import styles from "../styles/Home.module.css"; +import { getAssetPrice } from "../helpers/getAssetPrice.js"; +import { ethers } from "ethers"; +import { getNFTImage } from "../helpers/getNFTImage.js"; +import { getAddressNFTs } from "../helpers/getAddressNFTs.js"; +import { getSupportedNFTs } from "../helpers/getSupportedNFTs.js"; +import contractAddresses from "../contractAddresses.json"; +import { BigNumber } from "@ethersproject/bignumber"; +import { getAddress } from "@ethersproject/address"; +import Autocomplete from "@mui/material/Autocomplete"; +import TextField from "@mui/material/TextField"; +import loanCenterContract from "../contracts/LoanCenter.json"; +import nftOracleContract from "../contracts/NFTOracle.json"; +import { useState, useEffect } from "react"; +import { useAccount, useNetwork } from "wagmi"; +import { calculateHealthLevel } from "../helpers/healthLevel"; +import { Illustration, Loading, Typography, Tooltip } from "@web3uikit/core"; +import Card from "@mui/material/Card"; +import Box from "@mui/material/Box"; +import CardContent from "@mui/material/CardContent"; +import { CardActionArea } from "@mui/material"; +import { HelpCircle } from "@web3uikit/icons"; +import Image from "next/image"; +import LinearProgressWithLabel from "../components/LinearProgressWithLabel"; +import Divider from "@mui/material/Divider"; +import Liquidate from "../components/Liquidate"; +import { useContract, useProvider } from "wagmi"; +import StyledModal from "../components/StyledModal"; +import erc721 from "../contracts/erc721.json"; + +// "0xB4FBF271143F4FBf7B91A5ded31805e42b2208d6" + +export default function Stats() { + return ( + <div className=''>stats</div> + ) +} +