├── public ├── robots.txt ├── favicon.ico ├── logo192.png ├── logo512.png ├── Weirdos NFT-screenshot.jpg ├── manifest.json └── index.html ├── src ├── assets │ ├── Home GIF.gif │ ├── Home Video.mp4 │ ├── Rounded-Text-Black.png │ ├── Rounded-Text-White.png │ ├── icons8-ethereum-48.png │ ├── Plus.svg │ ├── Ethereum.svg │ ├── icons8-facebook.svg │ ├── icons8-sun.svg │ ├── icons8-linkedin.svg │ ├── icons8-instagram.svg │ ├── Vector.svg │ ├── icons8-twitter.svg │ ├── Arrow.svg │ └── Nfts │ │ ├── bighead-5.svg │ │ ├── bighead-2.svg │ │ ├── bighead-8.svg │ │ ├── bighead-4.svg │ │ └── bighead-7.svg ├── setupTests.js ├── App.test.js ├── reportWebVitals.js ├── components │ ├── Confetti.jsx │ ├── CoverVideo.jsx │ ├── Logo.jsx │ ├── Button.jsx │ ├── ScrollToTop.jsx │ ├── Accordion.jsx │ ├── DrawSvg.jsx │ ├── TypeWriterText.jsx │ ├── sections │ │ ├── Home.jsx │ │ ├── Faqs.jsx │ │ ├── Team.jsx │ │ ├── About.jsx │ │ ├── Showcase.jsx │ │ └── Roadmap.jsx │ ├── FooterBanner.jsx │ ├── Carousel.jsx │ ├── Footer.jsx │ └── Navbar.jsx ├── Icons │ ├── Minus.js │ ├── Plus.js │ ├── Facebook.js │ ├── Instagram.js │ ├── LinkedIn.js │ ├── Twitter.js │ ├── Vector.js │ └── Arrow.js ├── styles │ ├── GlobalStyles.jsx │ └── Themes.jsx ├── index.js ├── App.js └── logo.svg ├── .gitignore ├── netlify.toml ├── README.md └── package.json /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/public/logo192.png -------------------------------------------------------------------------------- /public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/public/logo512.png -------------------------------------------------------------------------------- /src/assets/Home GIF.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/src/assets/Home GIF.gif -------------------------------------------------------------------------------- /src/assets/Home Video.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/src/assets/Home Video.mp4 -------------------------------------------------------------------------------- /public/Weirdos NFT-screenshot.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/public/Weirdos NFT-screenshot.jpg -------------------------------------------------------------------------------- /src/assets/Rounded-Text-Black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/src/assets/Rounded-Text-Black.png -------------------------------------------------------------------------------- /src/assets/Rounded-Text-White.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/src/assets/Rounded-Text-White.png -------------------------------------------------------------------------------- /src/assets/icons8-ethereum-48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/israelmitolu/The-Weirdos-NFT/HEAD/src/assets/icons8-ethereum-48.png -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import { render, screen } from '@testing-library/react'; 2 | import App from './App'; 3 | 4 | test('renders learn react link', () => { 5 | render(); 6 | const linkElement = screen.getByText(/learn react/i); 7 | expect(linkElement).toBeInTheDocument(); 8 | }); 9 | -------------------------------------------------------------------------------- /src/assets/Plus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /src/assets/Ethereum.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/components/Confetti.jsx: -------------------------------------------------------------------------------- 1 | import useWindowSize from "react-use/lib/useWindowSize"; 2 | import Confetti from "react-confetti"; 3 | 4 | const ConfettiComponent = () => { 5 | const { width, height } = useWindowSize(); 6 | 7 | return ( 8 | 14 | ); 15 | }; 16 | 17 | export default ConfettiComponent; 18 | -------------------------------------------------------------------------------- /src/assets/icons8-facebook.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/Icons/Minus.js: -------------------------------------------------------------------------------- 1 | export function Minus(props) { 2 | return ( 3 | 11 | 12 | 13 | 14 | 15 | 16 | ); 17 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | 25 | # Local Netlify folder 26 | .netlify 27 | -------------------------------------------------------------------------------- /src/assets/icons8-sun.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/Icons/Plus.js: -------------------------------------------------------------------------------- 1 | export function Plus(props) { 2 | return ( 3 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | ); 18 | } 19 | 20 | -------------------------------------------------------------------------------- /src/Icons/Facebook.js: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | const Facebook = (props) => ( 4 | 5 | 6 | 7 | ) 8 | 9 | export default Facebook 10 | -------------------------------------------------------------------------------- /src/Icons/Instagram.js: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | const Instagram = (props) => ( 4 | 5 | 6 | 7 | ) 8 | 9 | export default Instagram 10 | -------------------------------------------------------------------------------- /src/components/CoverVideo.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styled from "styled-components"; 3 | import Gif from "../assets/Home Video.mp4"; 4 | 5 | const CoverVideo = () => { 6 | return ( 7 | 8 | 10 | ); 11 | }; 12 | 13 | const VideoContainer = styled.div` 14 | width: 100%; 15 | 16 | video { 17 | width: 100%; 18 | height: auto; 19 | } 20 | 21 | @media (max-width: 64em) { 22 | min-width: 40vh; 23 | } 24 | `; 25 | 26 | export default CoverVideo; 27 | -------------------------------------------------------------------------------- /src/Icons/LinkedIn.js: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | const LinkedIn = (props) => ( 4 | 5 | 6 | 7 | ) 8 | 9 | export default LinkedIn 10 | -------------------------------------------------------------------------------- /src/assets/icons8-linkedin.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/styles/GlobalStyles.jsx: -------------------------------------------------------------------------------- 1 | import { createGlobalStyle } from "styled-components"; 2 | 3 | const GlobalStyles = createGlobalStyle` 4 | *, ::before, ::after{ 5 | margin: 0; 6 | padding: 0; 7 | box-sizing: border-box; 8 | } 9 | 10 | body{ 11 | font-family: Rubik, sans-serif; 12 | overflow-x: hidden ; 13 | } 14 | 15 | h1,h2,h3,h4{ 16 | margin: 0; 17 | padding: 0; 18 | } 19 | a{ 20 | color: inherit; 21 | text-decoration: none; 22 | } 23 | 24 | ul{ 25 | list-style: none; 26 | } 27 | 28 | 29 | `; 30 | 31 | export default GlobalStyles; 32 | -------------------------------------------------------------------------------- /src/components/Logo.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import styled from "styled-components"; 3 | import { Link } from "react-router-dom"; 4 | 5 | const Logo = () => { 6 | return ( 7 | 8 | w. 9 | 10 | ); 11 | }; 12 | 13 | const LogoText = styled.h1` 14 | font-size: ${(props) => props.theme.fontxxxl}; 15 | font-style: italic; 16 | color: ${(props) => props.theme.text}; 17 | transition: all 0.2s ease; 18 | 19 | &:hover { 20 | transform: scale(1.1); 21 | } 22 | 23 | @media (max-width: 64em) { 24 | font-size: ${(props) => props.theme.fontxxl}; 25 | } 26 | `; 27 | export default Logo; 28 | -------------------------------------------------------------------------------- /src/assets/icons8-instagram.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import App from "./App"; 4 | import "../node_modules/normalize.css/normalize.css"; 5 | import { BrowserRouter } from "react-router-dom"; 6 | // import reportWebVitals from "./reportWebVitals"; 7 | 8 | ReactDOM.render( 9 | 10 | 11 | 12 | 13 | , 14 | document.getElementById("root") 15 | ); 16 | 17 | // If you want to start measuring performance in your app, pass a function 18 | // to log results (for example: reportWebVitals(console.log)) 19 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 20 | // reportWebVitals(); 21 | -------------------------------------------------------------------------------- /src/Icons/Twitter.js: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | const Twitter = (props) => ( 4 | 5 | 6 | 7 | ) 8 | 9 | export default Twitter 10 | -------------------------------------------------------------------------------- /src/assets/Vector.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | # example netlify.toml 2 | [build] 3 | command = "npm run build" 4 | functions = "netlify/functions" 5 | publish = "build" 6 | 7 | ## Uncomment to use this redirect for Single Page Applications like create-react-app. 8 | ## Not needed for static site generators. 9 | #[[redirects]] 10 | # from = "/*" 11 | # to = "/index.html" 12 | # status = 200 13 | 14 | ## (optional) Settings for Netlify Dev 15 | ## https://github.com/netlify/cli/blob/main/docs/netlify-dev.md#project-detection 16 | #[dev] 17 | # command = "yarn start" # Command to start your dev server 18 | # port = 3000 # Port that the dev server will be listening on 19 | # publish = "dist" # Folder with the static content for _redirect file 20 | 21 | ## more info on configuring this file: https://www.netlify.com/docs/netlify-toml-reference/ 22 | -------------------------------------------------------------------------------- /src/assets/icons8-twitter.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/styles/Themes.jsx: -------------------------------------------------------------------------------- 1 | // This file contains variables for different thremes 2 | 3 | export const Light = { 4 | body: "#fff", 5 | text: "#202020", 6 | bodyRgba: "255, 255, 255", 7 | textRgba: "32,32,32", 8 | 9 | carouselColor: "#EEEDDE", 10 | 11 | fontxs: "0.75rem", 12 | fontsm: "0.875rem", 13 | fontmd: "1rem", // 1rem = 16px 14 | fontlg: "1.25rem", 15 | fontxl: "2rem", 16 | fontxxl: "3rem", 17 | fontxxxl: "4rem", 18 | 19 | fontButton: "0.875rem", 20 | 21 | navHeight: "5rem", 22 | }; 23 | 24 | export const Dark = { 25 | body: "#202020", 26 | text: "#fff", 27 | bodyRgba: "32,32,32", 28 | textRgba: "255, 255, 255", 29 | 30 | carouselColor: "#EEEDDE", 31 | 32 | fontxs: "0.75rem", 33 | fontsm: "0.875rem", 34 | fontmd: "1rem", // 1rrem = 16px 35 | fontlg: "1.25rem", 36 | fontxl: "2rem", 37 | fontxxl: "3rem", 38 | fontxxxl: "4rem", 39 | 40 | fontButton: "0.875rem", 41 | 42 | navHeight: "5rem", 43 | }; 44 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import { ThemeProvider } from "styled-components"; 2 | import { Light } from "./styles/Themes"; 3 | import GLobalStyles from "./styles/GlobalStyles"; 4 | 5 | import Navbar from "./components/Navbar"; 6 | import Home from "./components/sections/Home"; 7 | import About from "./components/sections/About"; 8 | import Roadmap from "./components/sections/Roadmap"; 9 | import Showcase from "./components/sections/Showcase"; 10 | import Team from "./components/sections/Team"; 11 | import Faqs from "./components/sections/Faqs"; 12 | import Footer from "./components/Footer"; 13 | import ScrollToTop from "./components/ScrollToTop"; 14 | 15 | function App() { 16 | return ( 17 | <> 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 |