diff --git a/public/img_thumb.png b/public/img_thumb.png index b933a2c..c9ca7f7 100644 Binary files a/public/img_thumb.png and b/public/img_thumb.png differ diff --git a/public/videos/web.mp4 b/public/videos/web.mp4 new file mode 100644 index 0000000..fe28eef Binary files /dev/null and b/public/videos/web.mp4 differ diff --git a/src/app/build/page.tsx b/src/app/build/index.tsx similarity index 100% rename from src/app/build/page.tsx rename to src/app/build/index.tsx diff --git a/src/app/ecosystem/layout.tsx b/src/app/ecosystem/layout.tsx deleted file mode 100644 index e6279d2..0000000 --- a/src/app/ecosystem/layout.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { Metadata } from "next"; -import Tutorials from "../../sections/tutorials"; - -export const metadata: Metadata = { - title: "Ecosystem", - description: "Explore Aura Network's tech stack including Found Contract Suite, Pyxis Smart Account, Fee Registry, Software Development Kit and Infrastructure Application.", -}; - -export default function Layout({ - children, -}: Readonly<{ - children: React.ReactNode; -}>) { - return ( -
- {children} - -
- - ); -} diff --git a/src/app/ecosystem/page.tsx b/src/app/ecosystem/page.tsx index 943ad09..b5cce11 100644 --- a/src/app/ecosystem/page.tsx +++ b/src/app/ecosystem/page.tsx @@ -37,291 +37,309 @@ import validator_8 from "@/assets/images/ecosystem/validator_8.png"; import validator_9 from "@/assets/images/ecosystem/validator_9.png"; import yooldo from "@/assets/images/ecosystem/yooldo.png"; - import { useEffect, useState } from "react"; import Card from "../../components/Card"; import Select from "../../components/Select"; import useWindowSize from "../../hooks/useWindowSize"; const options = [ - { value: 'All', label: 'All ' }, - { value: 'Infrastructure', label: 'Infrastructure' }, - { value: 'NFT', label: 'NFT' }, - { value: 'CEX', label: 'CEX' }, - { value: 'Wallet', label: 'Wallet' }, - { value: 'DeFi', label: 'DeFi' }, - { value: 'Validator', label: 'Validator' }, - { value: 'Web3 Game', label: 'Web3 Game' }, - { value: 'SocialFi', label: 'SocialFi' }, - { value: 'Web2 Transition', label: 'Web2 Transition' }, + { value: "All", label: "All " }, + { value: "Infrastructure", label: "Infrastructure" }, + { value: "NFT", label: "NFT" }, + { value: "CEX", label: "CEX" }, + { value: "Wallet", label: "Wallet" }, + { value: "DeFi", label: "DeFi" }, + { value: "Validator", label: "Validator" }, + { value: "Web3 Game", label: "Web3 Game" }, + { value: "SocialFi", label: "SocialFi" }, + { value: "Web2 Transition", label: "Web2 Transition" }, ]; const data = [ - { - title: 'Aurascan', - description: 'The next generation blockchain explorer for Aura Network', - tag: 'Infrastructure', - img: aura_scan, - link: 'https://aurascan.io/' - }, - { - title: 'Pyxis Safe', - description: 'Multi-signature and fine -grain access control, asset management tool', - tag: 'Infrastructure', - img: pyxis, - link: 'https://pyxis.aura.network/' - }, - { - title: 'Horoscope', - description: 'An indexing service to provide real-time data for Aura ecosystem', - tag: 'Infrastructure', - img: horo, - link: 'https://horoscope.aura.network/' - }, - { - title: 'Band Protocol', - description: 'A cross-chain data oracle platform that aggregates and connects real-world data and APIs to smart contracts.', - tag: 'Infrastructure', - img: band, - link: 'https://www.bandprotocol.com/' - }, - { - title: 'Nois Network', - description: 'Reliable Randomness For the Interchain', - tag: 'Infrastructure', - img: nois, - link: 'https://nois.network/' - }, - { - title: 'Dev3Map', - description: 'The Interchain Developers Metrics Map', - tag: 'Infrastructure', - img: dev3, - link: 'https://beta.dev3map.com/' - }, - { - title: 'Nimbus', - description: 'A Personalized Portfolio for Crypto investors', - tag: 'DeFi', - img: nimbus, - link: 'https://getnimbus.io/' - }, - { - title: 'Halotrade', - description: 'Seamless crypto trading, built for all', - tag: 'DeFi', - img: halotrade, - link: 'https://halotrade.zone/' - }, - { - title: 'BingX', - tag: 'CEX', - img: bingx, - link: 'https://bingx.com/vi-vn/' - }, - { - title: 'MEXC', - tag: 'CEX', - img: mexc, - link: 'https://www.mexc.com/' - }, - { - title: 'ONUS', - tag: 'CEX', - img: onus, - link: 'https://goonus.io/' - }, - { - title: 'Gate', - tag: 'CEX', - img: gate, - link: 'http://gate.io' - }, - { - title: 'Aliniex', - tag: 'CEX', - img: aliniex, - link: 'https://aliniex.com/' - - }, - { - title: 'Monsterra', - description: 'A leading multi-chain NFT Game with free-to-play-and-earn mechanism developed by CrescentShine Studio, offering gamers an unparalleled and immersive gaming experience.', - tag: 'Web3 Game', - img: monsterra, - link: 'https://monsterra.io/' - }, - { - title: 'Yooldo', - description: 'Yooldo is a gaming platform renowned for its innovative Anti abuse system, Jury DAO', - tag: 'Web3 Game', - img: yooldo, - link: 'https://www.yooldo.gg/' - }, - { - title: 'AhaFast Ride 2 Earn', - description: 'Spearheading the Blockchain O2O (Online-to-offline) movement in Vietnam', - tag: 'Web2 Transition', - img: ahafast, - link: 'https://twitter.com/ahafastofficial' - }, - { - title: 'Subwallet', - description: 'A non-custodial Web3 Wallet', - tag: 'Wallet', - img: sub_wallet, - link: 'https://www.subwallet.app/' - }, - { - title: 'Coin98', - description: 'The #1 non-custodial, multi-chain wallet, and DeFi gateway, designed to seamlessly connect users to the crypto world in a safe and secure manner.', - tag: 'Wallet', - img: c98, - link: 'https://coin98.com/wallet' - }, - { - title: 'Keplr', - description: 'Wallet for the Inter blockchain ecosystem', - tag: 'Wallet', - img: keplr, - link: 'https://www.klever.io/' - }, - { - title: 'Leap Wallet', - description: 'The Super Wallet‍ for Web3', - tag: 'Wallet', - img: leap, - link: 'https://www.leapwallet.io/' - }, - { - title: 'Klever', - description: 'The Ultimate Crypto Wallet for Your Digital Assets', - tag: 'Wallet', - img: klever, - link: 'https://www.klever.io/' - }, - { - title: 'SeekHYPE', - description: 'NFT Marketplace for IP', - tag: 'NFT', - img: seekhype, - link: 'https://beta.seekhype.io/' - }, - { - title: 'Stakify', - description: 'NFT Staking Campaign Platform', - tag: 'NFT', - img: stakify, - link: 'https://stakify.zone/' - }, - { - title: 'Aura Validators', - tag: 'Validator', - img: aura_scan, - listImgs: [validator_0, validator_1, validator_2, validator_3, validator_4, validator_5, validator_6, validator_7, validator_8, validator_9, validator_10, validator_11], - link: 'https://aurascan.io/validators' - }, - { - title: 'Micro3', - description: 'A Decentralized SocialFi Mint-To-Earn platform that empowers Web3 projects and individuals through the creator economy, leveraging advanced LayerZero and Chainlink technologies.', - tag: 'SocialFi', - img: micro3, - link: 'https://micro3.io/', - isBigger: true - }, -] + { + title: "Aurascan", + description: "The next generation blockchain explorer for Aura Network", + tag: "Infrastructure", + img: aura_scan, + link: "https://aurascan.io/", + }, + { + title: "Pyxis Safe", + description: + "Multi-signature and fine -grain access control, asset management tool", + tag: "Infrastructure", + img: pyxis, + link: "https://pyxis.aura.network/", + }, + { + title: "Horoscope", + description: + "An indexing service to provide real-time data for Aura ecosystem", + tag: "Infrastructure", + img: horo, + link: "https://horoscope.aura.network/", + }, + { + title: "Band Protocol", + description: + "A cross-chain data oracle platform that aggregates and connects real-world data and APIs to smart contracts.", + tag: "Infrastructure", + img: band, + link: "https://www.bandprotocol.com/", + }, + { + title: "Nois Network", + description: "Reliable Randomness For the Interchain", + tag: "Infrastructure", + img: nois, + link: "https://nois.network/", + }, + { + title: "Dev3Map", + description: "The Interchain Developers Metrics Map", + tag: "Infrastructure", + img: dev3, + link: "https://beta.dev3map.com/", + }, + { + title: "Nimbus", + description: "A Personalized Portfolio for Crypto investors", + tag: "DeFi", + img: nimbus, + link: "https://getnimbus.io/", + }, + { + title: "Halotrade", + description: "Seamless crypto trading, built for all", + tag: "DeFi", + img: halotrade, + link: "https://halotrade.zone/", + }, + { + title: "BingX", + tag: "CEX", + img: bingx, + link: "https://bingx.com/vi-vn/", + }, + { + title: "MEXC", + tag: "CEX", + img: mexc, + link: "https://www.mexc.com/", + }, + { + title: "ONUS", + tag: "CEX", + img: onus, + link: "https://goonus.io/", + }, + { + title: "Gate", + tag: "CEX", + img: gate, + link: "http://gate.io", + }, + { + title: "Aliniex", + tag: "CEX", + img: aliniex, + link: "https://aliniex.com/", + }, + { + title: "Monsterra", + description: + "A leading multi-chain NFT Game with free-to-play-and-earn mechanism developed by CrescentShine Studio, offering gamers an unparalleled and immersive gaming experience.", + tag: "Web3 Game", + img: monsterra, + link: "https://monsterra.io/", + }, + { + title: "Yooldo", + description: + "Yooldo is a gaming platform renowned for its innovative Anti abuse system, Jury DAO", + tag: "Web3 Game", + img: yooldo, + link: "https://www.yooldo.gg/", + }, + { + title: "AhaFast Ride 2 Earn", + description: + "Spearheading the Blockchain O2O (Online-to-offline) movement in Vietnam", + tag: "Web2 Transition", + img: ahafast, + link: "https://twitter.com/ahafastofficial", + }, + { + title: "Subwallet", + description: "A non-custodial Web3 Wallet", + tag: "Wallet", + img: sub_wallet, + link: "https://www.subwallet.app/", + }, + { + title: "Coin98", + description: + "The #1 non-custodial, multi-chain wallet, and DeFi gateway, designed to seamlessly connect users to the crypto world in a safe and secure manner.", + tag: "Wallet", + img: c98, + link: "https://coin98.com/wallet", + }, + { + title: "Keplr", + description: "Wallet for the Inter blockchain ecosystem", + tag: "Wallet", + img: keplr, + link: "https://www.klever.io/", + }, + { + title: "Leap Wallet", + description: "The Super Wallet‍ for Web3", + tag: "Wallet", + img: leap, + link: "https://www.leapwallet.io/", + }, + { + title: "Klever", + description: "The Ultimate Crypto Wallet for Your Digital Assets", + tag: "Wallet", + img: klever, + link: "https://www.klever.io/", + }, + { + title: "SeekHYPE", + description: "NFT Marketplace for IP", + tag: "NFT", + img: seekhype, + link: "https://beta.seekhype.io/", + }, + { + title: "Stakify", + description: "NFT Staking Campaign Platform", + tag: "NFT", + img: stakify, + link: "https://stakify.zone/", + }, + { + title: "Aura Validators", + tag: "Validator", + img: aura_scan, + listImgs: [ + validator_0, + validator_1, + validator_2, + validator_3, + validator_4, + validator_5, + validator_6, + validator_7, + validator_8, + validator_9, + validator_10, + validator_11, + ], + link: "https://aurascan.io/validators", + }, + { + title: "Micro3", + description: + "A Decentralized SocialFi Mint-To-Earn platform that empowers Web3 projects and individuals through the creator economy, leveraging advanced LayerZero and Chainlink technologies.", + tag: "SocialFi", + img: micro3, + link: "https://micro3.io/", + isBigger: true, + }, +]; function Ecosystem() { - const { isMobile } = useWindowSize(); - const [selectedTag, setSelectedTag] = useState('All'); - const [displayedItems, setDisplayedItems] = useState(6); - const [visibleItems, setVisibleItems] = useState(data.slice(0, 6)); + const { isMobile } = useWindowSize(); + const [selectedTag, setSelectedTag] = useState("All"); + const [displayedItems, setDisplayedItems] = useState(6); + const [visibleItems, setVisibleItems] = useState(data.slice(0, 6)); - const filteredData = selectedTag && selectedTag !== 'All' - ? data.filter(item => item.tag === selectedTag) - : data; + const filteredData = + selectedTag && selectedTag !== "All" + ? data.filter((item) => item.tag === selectedTag) + : data; - useEffect(() => { - setDisplayedItems(isMobile ? 6 : 12); - }, [isMobile]); + useEffect(() => { + setDisplayedItems(isMobile ? 6 : 12); + }, [isMobile]); - useEffect(() => { - setVisibleItems(filteredData.slice(0, displayedItems)); - }, [selectedTag, displayedItems, data]); + useEffect(() => { + setVisibleItems(filteredData.slice(0, displayedItems)); + }, [selectedTag, displayedItems, data]); - const handleSelect = (option: string) => { - setSelectedTag(option); - setDisplayedItems(6); - }; + const handleSelect = (option: string) => { + setSelectedTag(option); + setDisplayedItems(6); + }; - const loadMore = () => { - setDisplayedItems(prev => prev + 6); - }; + const loadMore = () => { + setDisplayedItems((prev) => prev + 6); + }; - - return ( -
-
-
-
-
-
-
-

- Ecosystem -

- - Explore applications and integrations in the Aura ecosystem. - -
-
-
-
- +
+
+ {options.map((e, i) => ( +
handleSelect(e.value)} + > + {e.label}
+ ))} +
+
+
+ {visibleItems.map((e, index) => { + if (e.isBigger) { + return ( +
+ +
+ ); + } + return ( +
+ +
+ ); + })} +
+ {visibleItems.length < filteredData.length && ( + + )}
+
- ); +
+
+ ); } export default Ecosystem; diff --git a/src/app/get-aura/page.tsx b/src/app/get-aura/index.tsx similarity index 100% rename from src/app/get-aura/page.tsx rename to src/app/get-aura/index.tsx diff --git a/src/app/globals.css b/src/app/globals.css index c9528e0..6ed2b51 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -6,16 +6,16 @@ --foreground-rgb: 255, 255, 255; --background-start-rgb: 214, 219, 220; --background-end-rgb: 255, 255, 255; - --blur-dark-charcoal: #1F1C1999; + --blur-dark-charcoal: #1f1c1999; --dark-charcoal: #171513; --medium-charcoal: #292523; - --light-charcoal: #3B3632; - --black-charcoal: #0C0A09; + --light-charcoal: #3b3632; + --black-charcoal: #0c0a09; --blur-grayish-brown: rgba(64, 59, 53, 0.45); - --light-yellow: #FFD369; - --medium-gray: #968C7C; - --swiper-pagination-color: #FFBF61; - --swiper-pagination-bullet-inactive-color: #2C2925; + --light-yellow: #ffd369; + --medium-gray: #968c7c; + --swiper-pagination-color: #ffbf61; + --swiper-pagination-bullet-inactive-color: #2c2925; } html:focus-within { @@ -30,7 +30,7 @@ html:focus-within { body { color: rgb(var(--foreground-rgb)); - background: var(--black-charcoal) + /* background: var(--black-charcoal) */ } @layer utilities { @@ -59,14 +59,18 @@ body { .border-gradient { border-width: 1px; border-style: solid; - border-image-source: linear-gradient(180deg, rgba(160, 150, 114, 0.2) 0%, rgba(160, 150, 114, 0) 100%); + border-image-source: linear-gradient( + 180deg, + rgba(160, 150, 114, 0.2) 0%, + rgba(160, 150, 114, 0) 100% + ); border-image-slice: 1; border-radius: 8px; } } .main-container { - padding-top: 118px; + /* padding-top: 118px; */ margin: auto; padding-right: 24px; padding-left: 24px; @@ -101,9 +105,12 @@ body { } } +.icon .cathay2 { + display: none; +} @media only screen and (min-width: 1024px) { .main-container { - padding-top: 324px; + /* padding-top: 324px; */ margin: auto; } @@ -117,117 +124,157 @@ body { border-radius: 32px !important; } + /* cathay icon */ + .icon:hover .cathay1 { + display: none; + } + .icon:hover .cathay2 { + display: block; + } + /* bayer icon */ + .icon:hover #bayer path { + fill: #10384f; + } + .icon:hover #bayer #path1 { + fill: #89d329; + } + .icon:hover #bayer #path2 { + fill: #00bcff; + } + + .icon:hover #bayer2 { + display: block; + } + /* sga icon */ + .icon:hover #sga #sga1 { + fill: #f99f1c; + } + .icon:hover #sga .sga2 { + fill: #232f67; + } + /* aia icon */ + .icon:hover #aia path { + fill: #d31145; + } + /* vpb icon */ + .icon:hover #vpb #vpb1 { + fill: #e00500; + } + .icon:hover #vpb #vpb2 { + fill: #00b74f; + } + /* Coin98 icon */ -.icon:hover #coin98 path { - fill: url(#paint0_linear_561_9462); -} + .icon:hover #coin98 path { + fill: url(#paint0_linear_561_9462); + } -/* Hashed icon */ -.icon:hover #hashed path { - fill: white; -} + /* Hashed icon */ + .icon:hover #hashed path { + fill: black; + } -/* Fpt icon */ -.icon:hover #fpt #Vector { - fill: #1C6EB2; -} + /* Fpt icon */ + .icon:hover #fpt #Vector { + fill: #1c6eb2; + } -.icon:hover #fpt #Vector_2 { - fill: #F3762F; -} + .icon:hover #fpt #Vector_2 { + fill: #f3762f; + } -.icon:hover #fpt #Vector_3 { - fill: #1FB351; -} + .icon:hover #fpt #Vector_3 { + fill: #1fb351; + } -.icon:hover #fpt #Vector_4, -.icon:hover #fpt #Vector_5, -.icon:hover #fpt #Vector_6 { - fill: white; -} + .icon:hover #fpt #Vector_4, + .icon:hover #fpt #Vector_5, + .icon:hover #fpt #Vector_6 { + fill: white; + } -/* Kyber icon */ -.icon:hover #kyber #Group #Vector, -.icon:hover #kyber #Group #Vector_2, -.icon:hover #kyber #Group #Vector_3, -.icon:hover #kyber #Group #Vector_4, -.icon:hover #kyber #Group #Vector_5, -.icon:hover #kyber #Group #Vector_6, -.icon:hover #kyber #Group #Vector_7, -.icon:hover #kyber #Group #Vector_8, -.icon:hover #kyber #Group #Vector_9, -.icon:hover #kyber #Group #Vector_10, -.icon:hover #kyber #Group #Vector_11, -.icon:hover #kyber #Group #Vector_12, -.icon:hover #kyber #Group #Vector_13, -.icon:hover #kyber #Group #Vector_14 { - fill: white; -} + /* Kyber icon */ + .icon:hover #kyber #Group #Vector, + .icon:hover #kyber #Group #Vector_2, + .icon:hover #kyber #Group #Vector_3, + .icon:hover #kyber #Group #Vector_4, + .icon:hover #kyber #Group #Vector_5, + .icon:hover #kyber #Group #Vector_6, + .icon:hover #kyber #Group #Vector_7, + .icon:hover #kyber #Group #Vector_8, + .icon:hover #kyber #Group #Vector_9, + .icon:hover #kyber #Group #Vector_10, + .icon:hover #kyber #Group #Vector_11, + .icon:hover #kyber #Group #Vector_12, + .icon:hover #kyber #Group #Vector_13, + .icon:hover #kyber #Group #Vector_14 { + fill: black; + } -.icon:hover #kyber #Vector_15, -.icon:hover #kyber #Vector_16, -.icon:hover #kyber #Vector_17, -.icon:hover #kyber #Vector_18 { - fill: #39CDA1; -} + .icon:hover #kyber #Vector_15, + .icon:hover #kyber #Vector_16, + .icon:hover #kyber #Vector_17, + .icon:hover #kyber #Vector_18 { + fill: #39cda1; + } -/* Blizzard icon */ -.icon:hover #blizzard path { - fill: #E74A46; -} + /* Blizzard icon */ + .icon:hover #blizzard path { + fill: #e74a46; + } -/* NGC icon */ -.icon:hover #ngc path { - fill: white; -} + /* NGC icon */ + .icon:hover #ngc path { + fill: black; + } -/* NGC icon */ -.icon:hover #crypto path { - fill: white; -} + /* NGC icon */ + .icon:hover #crypto path { + fill: black; + } -/* Crypto icon */ -.icon:hover #crypto #Vector_1, -.icon:hover #crypto #Vector_2, -.icon:hover #crypto #Vector_3, -.icon:hover #crypto #Vector_4, -.icon:hover #crypto #Vector_5 { - fill: #48FFCF; -} -.icon:hover #crypto #Vector_6 { - fill: white; -} + /* Crypto icon */ + .icon:hover #crypto #Vector_1, + .icon:hover #crypto #Vector_2, + .icon:hover #crypto #Vector_3, + .icon:hover #crypto #Vector_4, + .icon:hover #crypto #Vector_5 { + fill: #48ffcf; + } + .icon:hover #crypto #Vector_6 { + fill: black; + } -/* zentry icon */ -.icon:hover #zentry path { - fill: white; -} + /* zentry icon */ + .icon:hover #zentry path { + fill: black; + } -/* dwf icon */ -.icon:hover #dwf path { - fill: white; -} + /* dwf icon */ + .icon:hover #dwf path { + fill: black; + } -/* gbv icon */ -.icon:hover #gbv mask { - fill: #F1D050; -} + /* gbv icon */ + .icon:hover #gbv mask { + fill: #f1d050; + } -/* kucoin icon */ -.icon:hover #kucoin path { - fill: #28CD96; -} + /* kucoin icon */ + .icon:hover #kucoin path { + fill: #28cd96; + } -/* finance icon */ -.icon:hover #finance #Vector_2 { - fill: #00FFB9 -} -.icon:hover #finance #Vector_3 { - fill: #00DAFF; -} -.icon:hover #finance path { - fill: white; -} + /* finance icon */ + .icon:hover #finance #Vector_2 { + fill: #00ffb9; + } + .icon:hover #finance #Vector_3 { + fill: #00daff; + } + .icon:hover #finance path { + fill: black; + } } @media only screen and (min-width: 1280px) { @@ -238,7 +285,7 @@ body { @media only screen and (min-width: 1536px) { .main-container { - max-width: 1216px; + max-width: 1360px; margin: auto; padding-right: 0px; padding-left: 0px; @@ -247,26 +294,24 @@ body { @media only screen and (min-width: 1728px) { .main-container { - max-width: 1408px; + max-width: 1360px; margin: auto; padding-right: 0px; padding-left: 0px; } } - - /* Statistic card */ .statistic-card:hover #card-bg circle { fill: url(#paint0_linear_566_10821); - fill-opacity: 1 + fill-opacity: 1; } .statistic-card:hover { - background: url("../assets/images/img_mask.webp"), #221F1C; + background: url("../assets/images/img_mask.webp"), #221f1c; background-size: cover; background-repeat: no-repeat; - border: 1px solid #FD9552; + border: 1px solid #fd9552; } /* Ecosystem card */ @@ -301,7 +346,7 @@ body { .swiper-pagination-fraction, .swiper-pagination-custom, -.swiper-horizontal>.swiper-pagination-bullets, +.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal { bottom: 0 !important; height: 18px !important; @@ -309,8 +354,8 @@ body { /* Handle */ ::-webkit-scrollbar-thumb { - background: linear-gradient(339deg, #FFD569, #FC8E4F, #FF697B); - border-radius: 10px; + background: #0b1d30; + /* border-radius: 10px; */ } ::-webkit-scrollbar { @@ -318,11 +363,11 @@ body { } /* Navbar */ -.nav-input:checked~.header>.nav-menu { +.nav-input:checked ~ .header > .nav-menu { display: block; } -.nav-input:checked~.header>.nav-container { +.nav-input:checked ~ .header > .nav-container { border-radius: 1rem 1rem 0 0; } @@ -330,15 +375,15 @@ body { display: none; } -.nav-input:checked~.header>.nav-container .nav-icon-menu { +.nav-input:checked ~ .header > .nav-container .nav-icon-menu { display: none; } -.nav-input:checked~.header>.nav-container .nav-icon-close { +.nav-input:checked ~ .header > .nav-container .nav-icon-close { display: block; } -.nav-input:checked~.nav-overlay { +.nav-input:checked ~ .nav-overlay { display: block; } @@ -353,19 +398,22 @@ body { } /* Section selector */ -.section-selector:checked~.section-menu { +.section-selector:checked ~ .section-menu { display: block; } /* Active section */ .active { - border-left: 2px solid #F7B85F; + border-left: 2px solid #f7b85f; border-top: none; border-right: none; border-bottom: none; } .border-linear { - border-image: linear-gradient(180deg, rgba(160, 150, 114, 0.2) 0%, rgba(160, 150, 114, 0) 100%); + border-image: linear-gradient( + 180deg, + rgba(160, 150, 114, 0.2) 0%, + rgba(160, 150, 114, 0) 100% + ); } - diff --git a/src/app/icon.ico b/src/app/icon.ico index 9bb0d17..d5671fb 100644 Binary files a/src/app/icon.ico and b/src/app/icon.ico differ diff --git a/src/app/introduction/page.tsx b/src/app/introduction/index.tsx similarity index 100% rename from src/app/introduction/page.tsx rename to src/app/introduction/index.tsx diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f291a76..f57565b 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,17 +1,18 @@ "use client"; import { aura } from "@/common/aura-chain"; -import { RainbowKitProvider, getDefaultConfig } from "@rainbow-me/rainbowkit"; +// import { RainbowKitProvider, getDefaultConfig } from "@rainbow-me/rainbowkit"; import "@rainbow-me/rainbowkit/styles.css"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; import { Inter, JetBrains_Mono } from "next/font/google"; import localFont from "next/font/local"; import Script from "next/script"; -import { ToastContainer } from "react-toastify"; +// import { ToastContainer } from "react-toastify"; import "react-toastify/dist/ReactToastify.css"; -import { WagmiProvider } from "wagmi"; +// import { WagmiProvider } from "wagmi"; import Footer from "../components/Footer"; import Header from "../components/Header"; import "./globals.css"; +import { WagmiProvider } from "wagmi"; const ppmori = localFont({ src: "./../assets/fonts/PPMori-SemiBold.otf", @@ -20,9 +21,20 @@ const ppmori = localFont({ const inter = Inter({ subsets: ["latin"] }); const jetBrains_mono = JetBrains_Mono({ - subsets: ['latin'], + subsets: ["latin"], variable: "--font-jetBrains-mono", -}) +}); + +const interTight = localFont({ + src: "./../assets/fonts/InterTight-VariableFont_wght.ttf", + variable: "--font-inter-tight", + weight: "100 900", +}); +const nacelle = localFont({ + src: "./../assets/fonts/Nacelle-SemiBold.otf", + variable: "--font-nacelle", + weight: "100 900", +}); // export const metadata: Metadata = { // title: "Aura Network - The Layer 1 for emerging countries", @@ -38,64 +50,65 @@ export default function RootLayout({ children: React.ReactNode; }>) { const queryClient = new QueryClient(); - const configWallet = getDefaultConfig({ - appName: "Aura Network", - projectId: "86b13026f2930979d852f7dac07666b1", - chains: [aura], - ssr: false, // If your dApp uses server side rendering (SSR) - }); + // const configWallet = getDefaultConfig({ + // appName: "Aura Network", + // projectId: "86b13026f2930979d852f7dac07666b1", + // chains: [aura], + // ssr: false, // If your dApp uses server side rendering (SSR) + // }); return ( - - - -