├── .nvmrc
├── .eslintrc.json
├── css
    └── index.css
├── tailwind.config.js
├── public
    ├── screenshot.png
    ├── tailwind-logo.svg
    ├── critter.svg
    └── team-of-critters.svg
├── jsconfig.json
├── .gitignore
├── components
    ├── layout.js
    ├── footer.js
    └── header.js
├── postcss.config.js
├── pages
    ├── _app.js
    ├── _document.js
    ├── index.js
    └── about.js
├── .all-contributorsrc
├── LICENSE
├── package.json
└── README.md


/.nvmrc:
--------------------------------------------------------------------------------
1 | lts/*


--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 |   "extends": "next/core-web-vitals"
3 | }
4 | 


--------------------------------------------------------------------------------
/css/index.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 | 


--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   purge: ["./components/**/*.js", "./pages/**/*.js"],
3 | };
4 | 


--------------------------------------------------------------------------------
/public/screenshot.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/taylorbryant/next-starter-tailwind/HEAD/public/screenshot.png


--------------------------------------------------------------------------------
/jsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 |   "compilerOptions": {
3 |     "baseUrl": ".",
4 |     "paths": {
5 |       "@components/*": ["components/*"]
6 |     }
7 |   }
8 | }
9 | 


--------------------------------------------------------------------------------
/.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 | # next.js
12 | /.next/
13 | /out/
14 | 
15 | # production
16 | /build
17 | 
18 | # misc
19 | .DS_Store
20 | .env*
21 | 
22 | # debug
23 | npm-debug.log*
24 | yarn-debug.log*
25 | yarn-error.log*
26 | 


--------------------------------------------------------------------------------
/components/layout.js:
--------------------------------------------------------------------------------
 1 | import Header from "./header";
 2 | import Footer from "./footer";
 3 | 
 4 | export default function Layout(props) {
 5 |   return (
 6 |     <div className="flex flex-col min-h-screen">
 7 |       <Header />
 8 | 
 9 |       <main className="flex-1 lg:container px-4 py-6 mx-auto md:px-6 md:py-12">
10 |         {props.children}
11 |       </main>
12 | 
13 |       <Footer />
14 |     </div>
15 |   );
16 | }
17 | 


--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |   plugins: [
 3 |     "tailwindcss",
 4 |     "postcss-flexbugs-fixes",
 5 |     "postcss-100vh-fix",
 6 |     "postcss-hover-media-feature",
 7 |     [
 8 |       "postcss-preset-env",
 9 |       {
10 |         autoprefixer: {
11 |           flexbox: "no-2009",
12 |         },
13 |         stage: 3,
14 |         features: {
15 |           "custom-properties": false,
16 |         },
17 |       },
18 |     ],
19 |   ],
20 | };
21 | 


--------------------------------------------------------------------------------
/public/tailwind-logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" width="54" height="54" fill="#fff" viewBox="0 0 54 54"><path d="M13.5 22.1c1.8-7.2 6.3-10.8 13.5-10.8 10.8 0 12.15 8.1 17.55 9.45 3.6.9 6.75-.45 9.45-4.05-1.8 7.2-6.3 10.8-13.5 10.8-10.8 0-12.15-8.1-17.55-9.45-3.6-.9-6.75.45-9.45 4.05zM0 38.3c1.8-7.2 6.3-10.8 13.5-10.8 10.8 0 12.15 8.1 17.55 9.45 3.6.9 6.75-.45 9.45-4.05-1.8 7.2-6.3 10.8-13.5 10.8-10.8 0-12.15-8.1-17.55-9.45-3.6-.9-6.75.45-9.45 4.05z"/></svg>


--------------------------------------------------------------------------------
/pages/_app.js:
--------------------------------------------------------------------------------
 1 | import "../css/index.css";
 2 | import Head from "next/head";
 3 | import Layout from "@components/layout";
 4 | 
 5 | function MyApp({ Component, pageProps }) {
 6 |   return (
 7 |     <Layout>
 8 |       <Head>
 9 |         <title>Next.js Starter Tailwind</title>
10 |         <meta
11 |           name="Description"
12 |           content="A Next.js starter styled using Tailwind CSS."
13 |         />
14 |       </Head>
15 | 
16 |       <Component {...pageProps} />
17 |     </Layout>
18 |   );
19 | }
20 | 
21 | export default MyApp;
22 | 


--------------------------------------------------------------------------------
/pages/_document.js:
--------------------------------------------------------------------------------
 1 | import Document, { Html, Head, Main, NextScript } from "next/document";
 2 | 
 3 | class MyDocument extends Document {
 4 |   static async getInitialProps(ctx) {
 5 |     const initialProps = await Document.getInitialProps(ctx);
 6 |     return { ...initialProps };
 7 |   }
 8 | 
 9 |   render() {
10 |     return (
11 |       <Html lang="en">
12 |         <Head />
13 |         <body>
14 |           <Main />
15 |           <NextScript />
16 |         </body>
17 |       </Html>
18 |     );
19 |   }
20 | }
21 | 
22 | export default MyDocument;
23 | 


--------------------------------------------------------------------------------
/pages/index.js:
--------------------------------------------------------------------------------
 1 | import Image from "next/image";
 2 | 
 3 | export default function IndexPage() {
 4 |   return (
 5 |     <div className="flex flex-col items-center justify-center space-y-12">
 6 |       <Image
 7 |         src="/team-of-critters.svg"
 8 |         alt="Four one-eyed aliens playing"
 9 |         width={576}
10 |         height={429.734}
11 |         priority
12 |       />
13 | 
14 |       <h2 className="p-3 font-bold bg-yellow-300 md:text-2xl">
15 |         Hi! Welcome to your first Next.js site.
16 |       </h2>
17 |     </div>
18 |   );
19 | }
20 | 


--------------------------------------------------------------------------------
/components/footer.js:
--------------------------------------------------------------------------------
 1 | export default function Footer() {
 2 |   return (
 3 |     <footer className="bg-blue-600">
 4 |       <ul className="flex items-center justify-between lg:container px-4 py-6 mx-auto text-sm text-white md:px-6">
 5 |         <li>
 6 |           Created by{" "}
 7 |           <a
 8 |             href="https://taylorbryant.dev/"
 9 |             target="_blank"
10 |             rel="noopener noreferrer"
11 |             className="font-bold"
12 |           >
13 |             Taylor Bryant
14 |           </a>
15 |         </li>
16 | 
17 |         <li>
18 |           <a
19 |             href="https://github.com/oddstronaut/next-starter-tailwind"
20 |             target="_blank"
21 |             rel="noopener noreferrer"
22 |             className="font-bold"
23 |           >
24 |             GitHub
25 |           </a>
26 |         </li>
27 |       </ul>
28 |     </footer>
29 |   );
30 | }
31 | 


--------------------------------------------------------------------------------
/.all-contributorsrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "files": [
 3 |     "README.md"
 4 |   ],
 5 |   "imageSize": 100,
 6 |   "commit": false,
 7 |   "contributors": [
 8 |     {
 9 |       "login": "Mozart409",
10 |       "name": "Amadeus",
11 |       "avatar_url": "https://avatars2.githubusercontent.com/u/38767929?v=4",
12 |       "profile": "https://github.com/Mozart409",
13 |       "contributions": [
14 |         "code",
15 |         "ideas"
16 |       ]
17 |     },
18 |     {
19 |       "login": "egdavid",
20 |       "name": "David Eugene",
21 |       "avatar_url": "https://avatars3.githubusercontent.com/u/10560326?v=4",
22 |       "profile": "https://www.synaptech.fr",
23 |       "contributions": [
24 |         "code"
25 |       ]
26 |     }
27 |   ],
28 |   "contributorsPerLine": 7,
29 |   "projectName": "next-starter-tailwind",
30 |   "projectOwner": "taylorbryant",
31 |   "repoType": "github",
32 |   "repoHost": "https://github.com",
33 |   "skipCi": true
34 | }
35 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2020 Taylor Bryant
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.


--------------------------------------------------------------------------------
/pages/about.js:
--------------------------------------------------------------------------------
 1 | import Image from "next/image";
 2 | 
 3 | export default function AboutPage() {
 4 |   return (
 5 |     <div className="grid md:grid-cols-2 gap-6 grid-cols-1">
 6 |       <div>
 7 |         <section className="mb-6">
 8 |           <h2 className="mb-3 text-xl font-bold">What is Tailwind?</h2>
 9 | 
10 |           <p>
11 |             Tailwind CSS is a highly customizable, low-level CSS framework that
12 |             gives you all of the building blocks you need to build bespoke
13 |             designs without any annoying opinionated styles you have to fight to
14 |             override.
15 |           </p>
16 |         </section>
17 | 
18 |         <section>
19 |           <h2 className="mb-3 text-xl font-bold">What is Next.js?</h2>
20 |           <p>
21 |             Next.js is a minimalistic framework for creating server-rendered
22 |             React applications.
23 |           </p>
24 |         </section>
25 |       </div>
26 | 
27 |       <Image
28 |         alt="A one-eyed alien holding a broken cable connected between a server and a desktop computer"
29 |         src="/critter.svg"
30 |         width={476}
31 |         height={297.17}
32 |       />
33 |     </div>
34 |   );
35 | }
36 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "next-starter-tailwind",
 3 |   "version": "2.0.0",
 4 |   "description": "Next.js starter styled with Tailwind CSS",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "dev": "next",
 8 |     "build": "next build",
 9 |     "start": "next start",
10 |     "lint": "next lint"
11 |   },
12 |   "repository": {
13 |     "type": "git",
14 |     "url": "git+https://github.com/taylorbryant/next-starter-tailwind.git"
15 |   },
16 |   "author": "Taylor Bryant",
17 |   "license": "MIT",
18 |   "bugs": {
19 |     "url": "https://github.com/taylorbryant/next-starter-tailwind/issues"
20 |   },
21 |   "homepage": "https://github.com/taylorbryant/next-starter-tailwind#readme",
22 |   "dependencies": {
23 |     "next": "12.2.4",
24 |     "react": "17.0.2",
25 |     "react-dom": "17.0.2"
26 |   },
27 |   "devDependencies": {
28 |     "autoprefixer": "10.3.4",
29 |     "classnames": "2.3.1",
30 |     "eslint": "7.32.0",
31 |     "eslint-config-next": "11.1.2",
32 |     "postcss": "8.3.6",
33 |     "postcss-100vh-fix": "1.0.2",
34 |     "postcss-flexbugs-fixes": "5.0.2",
35 |     "postcss-hover-media-feature": "1.0.1",
36 |     "postcss-preset-env": "6.7.0",
37 |     "tailwindcss": "2.2.15"
38 |   }
39 | }


--------------------------------------------------------------------------------
/components/header.js:
--------------------------------------------------------------------------------
 1 | import Link from "next/link";
 2 | import { useState } from "react";
 3 | import cn from "classnames";
 4 | import Image from "next/image";
 5 | 
 6 | export default function Header() {
 7 |   const [mobileMenuIsOpen, setMobileMenuIsOpen] = useState(false);
 8 | 
 9 |   return (
10 |     <header className="bg-green-600">
11 |       <div className="flex flex-wrap items-center justify-between lg:container px-4 py-6 mx-auto md:flex-no-wrap md:px-6">
12 |         <div className="flex items-center">
13 |           <Image
14 |             src="/tailwind-logo.svg"
15 |             width={40}
16 |             height={40}
17 |             priority
18 |             alt="Tailwind CSS logo"
19 |           />
20 | 
21 |           <Link href="/">
22 |             <a className="text-lg md:text-xl font-bold ml-3 text-white">
23 |               Next.js Starter Tailwind
24 |             </a>
25 |           </Link>
26 |         </div>
27 | 
28 |         <button
29 |           className="flex items-center block px-3 py-2 text-white border border-white rounded md:hidden"
30 |           onClick={() => setMobileMenuIsOpen(!mobileMenuIsOpen)}
31 |         >
32 |           <svg
33 |             className="w-3 h-3 fill-current"
34 |             viewBox="0 0 20 20"
35 |             xmlns="http://www.w3.org/2000/svg"
36 |           >
37 |             <title>Menu</title>
38 |             <path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z" />
39 |           </svg>
40 |         </button>
41 | 
42 |         <ul
43 |           className={cn(
44 |             "md:flex flex-col md:flex-row md:items-center md:justify-center text-sm w-full md:w-auto",
45 |             mobileMenuIsOpen ? `block` : `hidden`
46 |           )}
47 |         >
48 |           {[
49 |             { title: "Home", route: "/" },
50 |             { title: "About", route: "/about" },
51 |           ].map(({ route, title }) => (
52 |             <li className="mt-3 md:mt-0 md:ml-6" key={title}>
53 |               <Link href={route}>
54 |                 <a className="block text-white">{title}</a>
55 |               </Link>
56 |             </li>
57 |           ))}
58 |         </ul>
59 |       </div>
60 |     </header>
61 |   );
62 | }
63 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # Next.js Starter Tailwind
 2 | 
 3 | <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
 4 | 
 5 | [![All Contributors](https://img.shields.io/badge/all_contributors-2-orange.svg?style=flat-square)](#contributors-)
 6 | 
 7 | <!-- ALL-CONTRIBUTORS-BADGE:END -->
 8 | 
 9 | ![alt text](https://github.com/taylorbryant/next-starter-tailwind/blob/master/public/screenshot.png "Screenshot of Tailwind Next.js Starter homepage")
10 | 
11 |  <div align="center">
12 |  <p><strong>A <a href="https://nextjs.org" target="_blank">Next.js</a> starter styled using <a href="https://tailwindcss.com/" target="_blank">Tailwind CSS</a>.</strong></p>
13 |  <p>Uses Tailwind CSS' <a href="https://tailwindcss.com/docs/controlling-file-size" target="_blank">built-in purge option</a> to remove unused CSS.</p>
14 |  <p>Illustrations by <a href="https://undraw.co/" target="_blank">unDraw</a>.</p>
15 |  <p>View demo <a href="https://next-starter-tailwind.taylorbryant.dev" target="_blank">here</a>.</p>
16 | </div>
17 | 
18 | ## Deploy
19 | 
20 | ### Vercel
21 | 
22 | [![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/import/git?s=https%3A%2F%2Fgithub.com%2Ftaylorbryant%2Fnext-starter-tailwind%2Ftree%2Fmaster)
23 | 
24 | ## License
25 | 
26 | [MIT](https://github.com/taylorbryant/next-starter-tailwind/blob/master/LICENSE.md)
27 | 
28 | ## How you can help
29 | 
30 | Enjoying this starter and want to help? You can:
31 | 
32 | - [Create an issue](https://github.com/taylorbryant/next-starter-tailwind/issues/new) with some constructive criticism
33 | - [Submit a pull request](https://github.com/taylorbryant/next-starter-tailwind/compare) with some improvements to the project
34 | 
35 | ## Contributors ✨
36 | 
37 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
38 | 
39 | <!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
40 | <!-- prettier-ignore-start -->
41 | <!-- markdownlint-disable -->
42 | <table>
43 |   <tr>
44 |     <td align="center"><a href="https://github.com/Mozart409"><img src="https://avatars2.githubusercontent.com/u/38767929?v=4" width="100px;" alt=""/><br /><sub><b>Amadeus</b></sub></a><br /><a href="https://github.com/taylorbryant/next-starter-tailwind/commits?author=Mozart409" title="Code">💻</a> <a href="#ideas-Mozart409" title="Ideas, Planning, & Feedback">🤔</a></td>
45 |     <td align="center"><a href="https://www.synaptech.fr"><img src="https://avatars3.githubusercontent.com/u/10560326?v=4" width="100px;" alt=""/><br /><sub><b>David Eugene</b></sub></a><br /><a href="https://github.com/taylorbryant/next-starter-tailwind/commits?author=egdavid" title="Code">💻</a></td>
46 |   </tr>
47 | </table>
48 | 
49 | <!-- markdownlint-enable -->
50 | <!-- prettier-ignore-end -->
51 | 
52 | <!-- ALL-CONTRIBUTORS-LIST:END -->
53 | 
54 | This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!
55 | 


--------------------------------------------------------------------------------
/public/critter.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" id="aa03ddf9-f8f2-4819-a4ce-be9b0a220741" width="1119.609" height="699" data-name="Layer 1" viewBox="0 0 1119.609 699"><title>server down</title><circle cx="292.609" cy="213" r="213" fill="#f2f2f2"/><path fill="#2f2e41" d="M31.39089,151.64237c0,77.49789,48.6181,140.20819,108.70073,140.20819" transform="translate(-31.39089 -100.5)"/><path fill="#ed8936" d="M140.09162,291.85056c0-78.36865,54.255-141.78356,121.30372-141.78356" transform="translate(-31.39089 -100.5)"/><path fill="#ed8936" d="M70.77521,158.66768c0,73.61476,31.00285,133.18288,69.31641,133.18288" transform="translate(-31.39089 -100.5)"/><path fill="#2f2e41" d="M140.09162,291.85056c0-100.13772,62.7103-181.16788,140.20819-181.16788" transform="translate(-31.39089 -100.5)"/><path fill="#a8a8a8" d="M117.22379,292.83905s15.41555-.47479,20.06141-3.783,23.713-7.2585,24.86553-1.95278,23.16671,26.38821,5.76263,26.5286-40.43935-2.711-45.07627-5.53549S117.22379,292.83905,117.22379,292.83905Z" transform="translate(-31.39089 -100.5)"/><path d="M168.224,311.78489c-17.40408.14042-40.43933-2.71094-45.07626-5.53548-3.53126-2.151-4.93843-9.86945-5.40926-13.43043-.32607.014-.51463.02-.51463.02s.97638,12.43276,5.61331,15.2573,27.67217,5.67589,45.07626,5.53547c5.02386-.04052,6.7592-1.82793,6.66391-4.47526C173.87935,310.756,171.96329,311.75474,168.224,311.78489Z" opacity=".2" transform="translate(-31.39089 -100.5)"/><ellipse cx="198.609" cy="424.5" fill="#3f3d56" rx="187" ry="25.44"/><ellipse cx="198.609" cy="424.5" opacity=".1" rx="157" ry="21.359"/><ellipse cx="836.609" cy="660.5" fill="#3f3d56" rx="283" ry="38.5"/><ellipse cx="310.609" cy="645.5" fill="#3f3d56" rx="170" ry="23.127"/><path fill="none" stroke="#2f2e41" stroke-miterlimit="10" stroke-width="2" d="M494,726.5c90,23,263-30,282-90" transform="translate(-31.39089 -100.5)"/><path fill="none" stroke="#2f2e41" stroke-miterlimit="10" stroke-width="2" d="M341,359.5s130-36,138,80-107,149-17,172" transform="translate(-31.39089 -100.5)"/><path fill="none" stroke="#2f2e41" stroke-miterlimit="10" stroke-width="2" d="M215.40233,637.78332s39.0723-10.82,41.47675,24.04449-32.15951,44.78287-5.10946,51.69566" transform="translate(-31.39089 -100.5)"/><path fill="#2f2e41" d="M810.09554,663.73988,802.218,714.03505s-38.78182,20.60284-11.51335,21.20881,155.73324,0,155.73324,0,24.84461,0-14.54318-21.81478l-7.87756-52.719Z" transform="translate(-31.39089 -100.5)"/><path d="M785.21906,734.69812c6.193-5.51039,16.9989-11.252,16.9989-11.252l7.87756-50.2952,113.9216.10717,7.87756,49.582c9.185,5.08711,14.8749,8.987,18.20362,11.97818,5.05882-1.15422,10.58716-5.44353-18.20362-21.38921l-7.87756-52.719-113.9216,3.02983L802.218,714.03506S769.62985,731.34968,785.21906,734.69812Z" opacity=".1" transform="translate(-31.39089 -100.5)"/><rect width="513.253" height="357.52" x="578.433" y="212.689" fill="#2f2e41" rx="18.046"/><rect width="478.713" height="267.837" x="595.703" y="231.777" fill="#3f3d56"/><circle cx="835.059" cy="223.293" r="3.03" fill="#f2f2f2"/><path fill="#2f2e41" d="M1123.07694,621.32226V652.6628a18.04341,18.04341,0,0,1-18.04568,18.04568H627.86949A18.04341,18.04341,0,0,1,609.8238,652.6628V621.32226Z" transform="translate(-31.39089 -100.5)"/><polygon fill="#2f2e41" points="968.978 667.466 968.978 673.526 642.968 673.526 642.968 668.678 643.417 667.466 651.452 645.651 962.312 645.651 968.978 667.466"/><path fill="#2f2e41" d="M1125.828,762.03359c-.59383,2.539-2.83591,5.21743-7.90178,7.75032-18.179,9.08949-55.1429-2.42386-55.1429-2.42386s-28.4804-4.84773-28.4804-17.573a22.72457,22.72457,0,0,1,2.49658-1.48459c7.64294-4.04351,32.98449-14.02122,77.9177.42248a18.73921,18.73921,0,0,1,8.54106,5.59715C1125.07908,756.45353,1126.50669,759.15715,1125.828,762.03359Z" transform="translate(-31.39089 -100.5)"/><path d="M1125.828,762.03359c-22.251,8.526-42.0843,9.1622-62.43871-4.975-10.26507-7.12617-19.59089-8.88955-26.58979-8.75618,7.64294-4.04351,32.98449-14.02122,77.9177.42248a18.73921,18.73921,0,0,1,8.54106,5.59715C1125.07908,756.45353,1126.50669,759.15715,1125.828,762.03359Z" opacity=".1" transform="translate(-31.39089 -100.5)"/><ellipse cx="1066.538" cy="654.135" fill="#f2f2f2" rx="7.878" ry="2.424"/><circle cx="835.059" cy="545.667" r="11.513" fill="#f2f2f2"/><polygon points="968.978 667.466 968.978 673.526 642.968 673.526 642.968 668.678 643.417 667.466 968.978 667.466" opacity=".1"/><rect width="208" height="242" x="108.609" y="159" fill="#2f2e41"/><rect width="250" height="86" x="87.609" y="135" fill="#3f3d56"/><rect width="250" height="86" x="87.609" y="237" fill="#3f3d56"/><rect width="250" height="86" x="87.609" y="339" fill="#3f3d56"/><rect width="16" height="16" x="271.609" y="150" fill="#ed8936" opacity=".4"/><rect width="16" height="16" x="294.609" y="150" fill="#ed8936" opacity=".8"/><rect width="16" height="16" x="317.609" y="150" fill="#ed8936"/><rect width="16" height="16" x="271.609" y="251" fill="#ed8936" opacity=".4"/><rect width="16" height="16" x="294.609" y="251" fill="#ed8936" opacity=".8"/><rect width="16" height="16" x="317.609" y="251" fill="#ed8936"/><rect width="16" height="16" x="271.609" y="352" fill="#ed8936" opacity=".4"/><rect width="16" height="16" x="294.609" y="352" fill="#ed8936" opacity=".8"/><rect width="16" height="16" x="317.609" y="352" fill="#ed8936"/><circle cx="316.609" cy="538" r="79" fill="#2f2e41"/><rect width="24" height="43" x="280.609" y="600" fill="#2f2e41"/><rect width="24" height="43" x="328.609" y="600" fill="#2f2e41"/><ellipse cx="300.609" cy="643.5" fill="#2f2e41" rx="20" ry="7.5"/><ellipse cx="348.609" cy="642.5" fill="#2f2e41" rx="20" ry="7.5"/><circle cx="318.609" cy="518" r="27" fill="#fff"/><circle cx="318.609" cy="518" r="9" fill="#3f3d56"/><path fill="#ed8936" d="M271.36733,565.03228c-6.37889-28.56758,14.01185-57.43392,45.544-64.47477s62.2651,10.41,68.644,38.9776-14.51861,39.10379-46.05075,46.14464S277.74622,593.59986,271.36733,565.03228Z" transform="translate(-31.39089 -100.5)"/><ellipse cx="417.215" cy="611.344" fill="#2f2e41" rx="39.5" ry="12.4" transform="translate(-238.28665 112.98044) rotate(-23.17116)"/><ellipse cx="269.215" cy="664.344" fill="#2f2e41" rx="39.5" ry="12.4" transform="translate(-271.07969 59.02084) rotate(-23.17116)"/><path fill="#fff" d="M394,661.5c0,7.732-19.90861,23-42,23s-43-14.268-43-22,20.90861-6,43-6S394,653.768,394,661.5Z" transform="translate(-31.39089 -100.5)"/></svg>


--------------------------------------------------------------------------------
/public/team-of-critters.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" id="b32a285a-6b04-4396-8e15-f52ff515c3cb" width="1115.914" height="832.564" data-name="Layer 1" viewBox="0 0 1115.914 832.564"><title>good team</title><line x1="389.957" x2="533.957" y1="255.282" y2="255.282" fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><ellipse cx="248.867" cy="443.498" fill="#2f2e41" rx="39.5" ry="12.4" transform="translate(-296.29734 483.90373) rotate(-69.08217)"/><path fill="#f2f2f2" d="M1153.37778,543.01392c15.6657,116.58889-5.66624,233.30465-114.16871,278.75349S805.90441,816.10117,760.45558,707.5987s61.78473-173.424,114.16871-278.75349C981.00055,214.95244,1104.72832,180.94968,1153.37778,543.01392Z" transform="translate(-42.04308 -33.7182)"/><ellipse cx="916" cy="794.436" fill="#3f3d56" rx="170" ry="23.127"/><rect width="24" height="43" x="858.752" y="753.632" fill="#2f2e41" transform="translate(313.59438 1787.2135) rotate(-105.45227)"/><ellipse cx="844.359" cy="777.24" fill="#2f2e41" rx="7.5" ry="20" transform="translate(-218.60626 219.34424) rotate(-15.45227)"/><ellipse cx="965.361" cy="688.069" fill="#2f2e41" rx="39.5" ry="12.4" transform="translate(111.82337 1518.54826) rotate(-82.28111)"/><circle cx="915.585" cy="728.299" r="79" fill="#2f2e41"/><rect width="24" height="43" x="858.752" y="739.632" fill="#2f2e41" transform="translate(327.08832 1769.4834) rotate(-105.45227)"/><ellipse cx="844.359" cy="763.24" fill="#2f2e41" rx="7.5" ry="20" transform="translate(-214.87616 218.83818) rotate(-15.45227)"/><circle cx="936.329" cy="683.043" r="27" fill="#fff"/><circle cx="944.963" cy="671.116" r="9" fill="#3f3d56"/><path fill="#5a67d8" d="M1048.85766,816.30571c29.23451-1.46311,51.62459-28.80779,50.00965-61.07607s-26.62336-57.24079-55.85786-55.77768-33.822,24.41244-32.20709,56.68072S1019.62316,817.76882,1048.85766,816.30571Z" transform="translate(-42.04308 -33.7182)"/><path fill="#fff" d="M925.34085,728.59207a18,18,0,0,1-2.90424-35.88266c9.90873-.802,12.611,7.06452,13.413,16.97325S935.24957,727.79008,925.34085,728.59207Z" transform="translate(-42.04308 -33.7182)"/><polyline fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2" points="49.464 361.025 491.957 361.025 560.56 394.447 669.866 447.699 741.334 313.887 943.574 313.887"/><circle cx="222.811" cy="375.025" r="13.685" fill="#5a67d8"/><circle cx="350.541" cy="361.025" r="13.685" fill="#5a67d8"/><circle cx="560.384" cy="394.478" r="13.685" fill="#5a67d8"/><circle cx="855.379" cy="313.887" r="13.685" fill="#5a67d8"/><circle cx="712.443" cy="367.108" r="13.685" fill="#5a67d8"/><circle cx="427.576" cy="581.441" r="14.756" fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><ellipse cx="170" cy="809.436" fill="#3f3d56" rx="170" ry="23.127"/><circle cx="160.805" cy="696.436" r="79" fill="#2f2e41"/><rect width="24" height="43" x="124.805" y="758.436" fill="#2f2e41"/><rect width="24" height="43" x="172.805" y="758.436" fill="#2f2e41"/><ellipse cx="144.805" cy="801.936" fill="#2f2e41" rx="20" ry="7.5"/><ellipse cx="192.805" cy="800.936" fill="#2f2e41" rx="20" ry="7.5"/><circle cx="162.805" cy="676.436" r="27" fill="#fff"/><circle cx="162.805" cy="676.436" r="9" fill="#3f3d56"/><path fill="#5a67d8" d="M126.215,656.68687c-6.37889-28.56758,14.01185-57.43391,45.544-64.47476s62.2651,10.41,68.644,38.97759-14.51861,39.1038-46.05075,46.14465S132.59385,685.25445,126.215,656.68687Z" transform="translate(-42.04308 -33.7182)"/><circle cx="133.805" cy="469.436" r="79" fill="#2f2e41"/><rect width="24" height="43" x="97.805" y="531.436" fill="#2f2e41"/><rect width="24" height="43" x="145.805" y="531.436" fill="#2f2e41"/><ellipse cx="117.805" cy="574.936" fill="#2f2e41" rx="20" ry="7.5"/><ellipse cx="165.805" cy="573.936" fill="#2f2e41" rx="20" ry="7.5"/><circle cx="135.805" cy="449.436" r="27" fill="#fff"/><circle cx="135.805" cy="449.436" r="9" fill="#3f3d56"/><path fill="#5a67d8" d="M99.215,429.68687c-6.37889-28.56758,14.01185-57.43391,45.544-64.47476s62.2651,10.41,68.644,38.97759-14.51861,39.1038-46.05075,46.14465S105.59385,458.25445,99.215,429.68687Z" transform="translate(-42.04308 -33.7182)"/><ellipse cx="86.867" cy="466.498" fill="#2f2e41" rx="12.4" ry="39.5" transform="translate(-413.89514 311.35892) rotate(-64.62574)"/><path fill="#fff" d="M137.04308,531.65459c0,7.732,19.90861,23,42,23s42.80455-21.768,42.80455-29.5-20.71316,1.5-42.80455,1.5S137.04308,523.92261,137.04308,531.65459Z" transform="translate(-42.04308 -33.7182)"/><rect width="126.129" height="64.161" x="835.474" y="564.71" fill="#5a67d8"/><rect width="126.129" height="64.161" x="825.603" y="575.129" fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><rect width="36" height="36" x="226.603" y="199" fill="#ff6584"/><rect width="36" height="36" x="217.603" y="187" fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><circle cx="906.052" cy="189.47" r="79" fill="#2f2e41"/><rect width="24" height="43" x="974.585" y="279.578" fill="#2f2e41" transform="matrix(-0.98401, 0.17813, -0.17813, -0.98401, 1968.98075, 387.87775)"/><rect width="24" height="43" x="927.353" y="288.128" fill="#2f2e41" transform="translate(1876.79468 413.25547) rotate(169.73894)"/><ellipse cx="939.065" cy="336.103" fill="#2f2e41" rx="20" ry="7.5" transform="translate(-36.79955 652.79249) rotate(-40.26106)"/><ellipse cx="985.313" cy="327.731" fill="#2f2e41" rx="20" ry="7.5" transform="translate(-20.43292 680.69811) rotate(-40.26106)"/><circle cx="900.521" cy="170.146" r="27" fill="#fff"/><circle cx="889.424" cy="160.468" r="9" fill="#3f3d56"/><path fill="#5a67d8" d="M1010.41514,137.24473c1.188-29.247-24.01866-54.01935-56.30069-55.33066s-59.41488,21.335-60.60291,50.582,21.2521,35.89214,53.53414,37.20345S1009.22711,166.49171,1010.41514,137.24473Z" transform="translate(-42.04308 -33.7182)"/><ellipse cx="875.15" cy="208.796" fill="#2f2e41" rx="12.4" ry="39.5" transform="translate(434.06107 981.45545) rotate(-77.0899)"/><ellipse cx="1030.224" cy="234.584" fill="#2f2e41" rx="12.4" ry="39.5" transform="translate(529.35145 1152.63631) rotate(-77.0899)"/><path fill="#fff" d="M969.79256,254.32118a18,18,0,1,1-35.42423,6.41281c-1.77085-9.78213,5.79238-13.24363,15.57451-15.01448S968.02171,244.53905,969.79256,254.32118Z" transform="translate(-42.04308 -33.7182)"/><line x1="712.603" x2="803.603" y1="99" y2="169" fill="none" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><circle cx="669.603" cy="68" r="68" fill="#ff6584"/><ellipse cx="935.71" cy="706.84" fill="#2f2e41" rx="39.5" ry="12.4" transform="translate(67.55305 1505.41525) rotate(-82.28111)"/><circle cx="68.811" cy="786.025" r="13.685" fill="#5a67d8"/><rect width="36" height="36" x="256.603" y="770" fill="#ff6584"/><circle cx="256.811" cy="794.025" r="13.685" fill="#5a67d8"/><circle cx="461.957" cy="255.025" r="13.685" fill="#5a67d8"/><circle cx="727.721" cy="679.252" r="6.535" fill="#ff6584"/><line x1="759.739" x2="759.739" y1="787.725" y2="713.313" fill="#3f3d56" stroke="#3f3d56" stroke-miterlimit="10" stroke-width="2"/><circle cx="759.739" cy="713.313" r="10.523" fill="#3f3d56"/><path fill="#3f3d56" d="M801.78241,792.89275s-1.50326-32.33193-32.32009-28.57378" transform="translate(-42.04308 -33.7182)"/></svg>


--------------------------------------------------------------------------------