setting up project
This commit is contained in:
Generated
+6297
File diff suppressed because it is too large
Load Diff
+5
-1
@@ -10,13 +10,17 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"next": "12.0.10",
|
"next": "12.0.10",
|
||||||
"react": "17.0.2",
|
"react": "17.0.2",
|
||||||
"react-dom": "17.0.2"
|
"react-dom": "17.0.2",
|
||||||
|
"react-icons": "^4.3.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/node": "17.0.17",
|
"@types/node": "17.0.17",
|
||||||
"@types/react": "17.0.39",
|
"@types/react": "17.0.39",
|
||||||
|
"autoprefixer": "^10.4.2",
|
||||||
"eslint": "8.9.0",
|
"eslint": "8.9.0",
|
||||||
"eslint-config-next": "12.0.10",
|
"eslint-config-next": "12.0.10",
|
||||||
|
"postcss": "^8.4.6",
|
||||||
|
"tailwindcss": "^3.0.22",
|
||||||
"typescript": "4.5.5"
|
"typescript": "4.5.5"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+52
-60
@@ -1,72 +1,64 @@
|
|||||||
import type { NextPage } from 'next'
|
import Head from "next/head";
|
||||||
import Head from 'next/head'
|
import { useEffect, useRef } from "react";
|
||||||
import Image from 'next/image'
|
|
||||||
import styles from '../styles/Home.module.css'
|
import { FaTh } from "react-icons/fa";
|
||||||
|
|
||||||
|
export default function Fig() {
|
||||||
|
const inputRef = useRef<HTMLInputElement>();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
inputRef.current?.focus();
|
||||||
|
}, []);
|
||||||
|
|
||||||
const Home: NextPage = () => {
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.container}>
|
<>
|
||||||
<Head>
|
<Head>
|
||||||
<title>Create Next App</title>
|
<title>Fig | The Power of Everything</title>
|
||||||
<meta name="description" content="Generated by create next app" />
|
|
||||||
<link rel="icon" href="/favicon.ico" />
|
<link
|
||||||
|
rel="shortcut icon"
|
||||||
|
href="https://api.statvoo.com/favicon/?url=https://fig.io/"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||||
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||||
|
<link
|
||||||
|
href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;1,100;1,200&display=swap"
|
||||||
|
rel="stylesheet"
|
||||||
|
></link>
|
||||||
</Head>
|
</Head>
|
||||||
|
|
||||||
<main className={styles.main}>
|
{/* header */}
|
||||||
<h1 className={styles.title}>
|
<div className="fixed top-0 right-0 flex flex-row p-10 justify-end space-x-2">
|
||||||
Welcome to <a href="https://nextjs.org">Next.js!</a>
|
<span className="p-2 rounded-full hover:cursor-pointer hover:bg-slate-200 ">
|
||||||
</h1>
|
<FaTh className="ml-auto text-md text-slate-400" />
|
||||||
|
</span>
|
||||||
|
|
||||||
<p className={styles.description}>
|
<img
|
||||||
Get started by editing{' '}
|
className="rounded-full shadow-lg"
|
||||||
<code className={styles.code}>pages/index.tsx</code>
|
src="https://lh3.googleusercontent.com/fife/AAWUweVw1nKpPc_Q0FtNJQKi1xg6DBlirOq1ouP_Nbx9kIX2Q-h5q9wpra5k3p5xOo0QQOMvrwRVk07RdbWnEIEFW05sm_eFKamDV63uyJGRfdcChrN-CLhtV8CsDSLjJ_ezrJnH6i2yD8OJrhezUZvQvFW6J09R1HOmjCDrqrtxQmeK38mx6Q7F0Y9Z3r7sRpddR_EjUIEiK0ooHFyX3lLvy19xL_nJQKhgtsoc6EtECZ9dKX2a6P-WIF_bKC7OZRiuwsGSU0Yf1HyCz0W8GZIVRrhMidvofwHyQMBHeaZUiNfUYS9_VVQWGy9QnjmMgBDiCiN9Q9DfEKs-Xp0sN8WN82hj9TQWn4o2VhMnSZe79NholSsF4PAGUPZAoJAzNQcatVeuOwiEUm2K5QROHe-jo8SMU4oPwqhiOkA1kVuAbfZN0fBko2Dl2lCp63g-2guEhtPSFv7Arh0GbbAUZuKdeu9w64sjZP_dvr0NHjAywN7zPTauJgf95WnF2J_-yFN5016pOyDrgto02wft3-jbM2UYA8c0AA-4befSIN-OBMS80xo7A1ISI93UdXuETPG7CeaSWKGkqJjcXPQXbddYdPu7H0w4imw_GPSs8cgWKtJgm5Jke4ASwVTXBHbVioUQxYJbFWr4WiqkjT5D8CdiqymppgbxsI-mZLr85ZeTrpflDeOM1MWUrlbCCw2kSanAfpomYIz5eHxOsIBDzIUYB897tYcHF93TtxHD-RUDil5jz1E=s32-c"
|
||||||
</p>
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className={styles.grid}>
|
<main className="container mx-auto flex flex-col justify-center h-screen">
|
||||||
<a href="https://nextjs.org/docs" className={styles.card}>
|
<div
|
||||||
<h2>Documentation →</h2>
|
className="flex flex-row my-auto mx-auto w-[25rem]
|
||||||
<p>Find in-depth information about Next.js features and API.</p>
|
items-center justify-start space-x-5 border bg-slate-50 p-3 px-5 rounded-full"
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="https://nextjs.org/learn" className={styles.card}>
|
|
||||||
<h2>Learn →</h2>
|
|
||||||
<p>Learn about Next.js in an interactive course with quizzes!</p>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a
|
|
||||||
href="https://github.com/vercel/next.js/tree/canary/examples"
|
|
||||||
className={styles.card}
|
|
||||||
>
|
>
|
||||||
<h2>Examples →</h2>
|
<img
|
||||||
<p>Discover and deploy boilerplate example Next.js projects.</p>
|
ref={inputRef}
|
||||||
</a>
|
className=""
|
||||||
|
height={30}
|
||||||
|
width={30}
|
||||||
|
src="https://api.statvoo.com/favicon/?url=https://fig.io/"
|
||||||
|
/>
|
||||||
|
|
||||||
<a
|
<input
|
||||||
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
|
className="placeholder:text-slate-300 text-slate-600 text-md font-bold outline-none bg-slate-50"
|
||||||
className={styles.card}
|
placeholder="power to do"
|
||||||
>
|
/>
|
||||||
<h2>Deploy →</h2>
|
|
||||||
<p>
|
|
||||||
Instantly deploy your Next.js site to a public URL with Vercel.
|
|
||||||
</p>
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
</>
|
||||||
<footer className={styles.footer}>
|
);
|
||||||
<a
|
|
||||||
href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
>
|
|
||||||
Powered by{' '}
|
|
||||||
<span className={styles.logo}>
|
|
||||||
<Image src="/vercel.svg" alt="Vercel Logo" width={72} height={16} />
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
</footer>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default Home
|
|
||||||
|
|||||||
@@ -0,0 +1,6 @@
|
|||||||
|
module.exports = {
|
||||||
|
plugins: {
|
||||||
|
tailwindcss: {},
|
||||||
|
autoprefixer: {},
|
||||||
|
},
|
||||||
|
}
|
||||||
@@ -1,9 +1,15 @@
|
|||||||
|
@tailwind base;
|
||||||
|
@tailwind components;
|
||||||
|
@tailwind utilities;
|
||||||
|
|
||||||
html,
|
html,
|
||||||
body {
|
body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
|
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
|
||||||
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||||
|
|
||||||
|
@apply bg-slate-100;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
@@ -14,3 +20,7 @@ a {
|
|||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
font-family: "Poppins", sans-serif;
|
||||||
|
}
|
||||||
|
|||||||
@@ -0,0 +1,10 @@
|
|||||||
|
module.exports = {
|
||||||
|
content: [
|
||||||
|
"./pages/**/*.{js,ts,jsx,tsx}",
|
||||||
|
"./components/**/*.{js,ts,jsx,tsx}",
|
||||||
|
],
|
||||||
|
theme: {
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
plugins: [],
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user