initial commit

01lexandre · Mar 29, 2022 · 463ee1d · 463ee1d · vercel · Mar 29, 2022
1 parent 3f38007
commit 463ee1d
Show file tree

Hide file tree

Showing 18 changed files with 1,487 additions and 108 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,6 +2,7 @@
 
 # dependencies
 /node_modules
+/.idea
 /.pnp
 .pnp.js
 

diff --git a/.idea/.gitignore b/.idea/.gitignore
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
diff --git a/.idea/modules.xml b/.idea/modules.xml
diff --git a/.idea/next-website-naweby.iml b/.idea/next-website-naweby.iml
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
diff --git a/package.json b/package.json
@@ -9,9 +9,14 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@chakra-ui/react": "^1.8.7",
+    "@emotion/react": "11",
+    "@emotion/styled": "11",
+    "framer-motion": "6",
     "next": "12.1.2",
     "react": "17.0.2",
-    "react-dom": "17.0.2"
+    "react-dom": "17.0.2",
+    "styled-components": "^5.3.5"
   },
   "devDependencies": {
     "eslint": "8.12.0",

diff --git a/pages/_app.js b/pages/_app.js
diff --git a/pages/api/hello.js b/pages/api/hello.js
diff --git a/pages/index.js b/pages/index.js
diff --git a/src/pages/_app.js b/src/pages/_app.js
@@ -0,0 +1,18 @@
+import { ThemeProvider } from 'styled-components'
+import { AnimatePresence } from 'framer-motion'
+
+import GlobalStyle from '../styles/global'
+import theme from '../styles/theme'
+
+function MyApp({ Component, pageProps }) {
+  return (
+    <AnimatePresence exitBeforeEnter>
+      <ThemeProvider theme={theme}>
+        <Component {...pageProps}/>
+        <GlobalStyle />
+      </ThemeProvider>
+    </AnimatePresence>
+  )
+}
+
+export default MyApp
diff --git a/src/pages/_document.js b/src/pages/_document.js
@@ -0,0 +1,55 @@
+import React from 'react'
+import Document, {
+  Html,
+  Head,
+  Main,
+  NextScript
+} from 'next/document'
+import {ServerStyleSheet} from 'styled-components'
+
+export default class MyDocument extends Document {
+  static async getInitialProps(ctx) {
+    const sheet = new ServerStyleSheet()
+    const originalRenderPage = ctx.renderPage
+    try {
+      ctx.renderPage = () =>
+        originalRenderPage({
+          enhanceApp: App => props => sheet.collectStyles(<App {...props} />)
+        })
+      const initialProps = await Document.getInitialProps(ctx)
+      return {
+        ...initialProps,
+        styles: (
+          <>
+            {initialProps.styles}
+            {sheet.getStyleElement()}
+          </>
+        )
+      }
+    } finally {
+      sheet.seal()
+    }
+  }
+
+  render() {
+    return (
+      <Html lang="pt">
+        <Head>
+          {/* eslint-disable-next-line @next/next/no-title-in-document-head */}
+          <title>My page title</title>
+          <meta charSet="utf-8"/>
+          <meta name="robots" content="index, follow"/>
+          <link rel="icon" href="https://www.freenfe.com.br/favicon.ico"/>
+          <link
+            href="https://fonts.googleapis.com/css2?family=Montserrat:wght@100;400;600;700&display=swap"
+            rel="stylesheet"
+          />
+        </Head>
+        <body>
+        <Main/>
+        <NextScript/>
+        </body>
+      </Html>
+    )
+  }
+}
diff --git a/src/pages/index.js b/src/pages/index.js
@@ -0,0 +1,18 @@
+import Head from 'next/head'
+import styles from '../styles/Home.module.css'
+
+export default function Home() {
+  return (
+    <div className={styles.container}>
+      <Head>
+        <title>Naweby</title>
+      </Head>
+
+      <main className={styles.main}>
+        <h1 className={styles.title}>
+          Welcome to <a href="#">Naweby</a>
+        </h1>
+      </main>
+    </div>
+  )
+}
diff --git a/styles/Home.module.css → src/styles/Home.module.css b/styles/Home.module.css → src/styles/Home.module.css
diff --git a/src/styles/global.js b/src/styles/global.js
@@ -0,0 +1,52 @@
+import { createGlobalStyle } from 'styled-components'
+export default createGlobalStyle`
+  ::selection {
+    background-color: ${props => props.theme.colors.secundary};
+    color: ${props => props.theme.colors.text};
+  }
+  *, ::after, ::before {
+    box-sizing: border-box;
+  }
+  html,
+  body {
+    margin: 0;
+    padding: 0;
+    font: ${props => props.theme.fontPatterns};
+    color: ${props => props.theme.colors.text};
+    background-color: ${props => props.theme.colors.background};
+    
+    p {
+      font-size: 18px;
+      line-height: 26px;
+      margin-top: 0;
+    }
+    h1 {
+      font-size: 2rem;
+      font-weight: 700;
+      margin-top: 0;
+      margin-bottom: 1rem;
+    }
+    strong {
+      font-weight: 600;
+    }
+    button {
+      font: ${props => props.theme.fontPatterns};
+    }
+  }
+  ::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
+    border-radius: 10px;
+    background-color: #F5F5F5;
+  }
+
+  ::-webkit-scrollbar {
+    width: 12px;
+    background-color: #F5F5F5;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
+    background-color: ${props => props.theme.colors.primary};
+  }
+`
diff --git a/src/styles/theme.js b/src/styles/theme.js
@@ -0,0 +1,13 @@
+const theme = {
+  colors: {
+    background: '#f6f5fb',
+    text: '#2F2E3E',
+    primary: '#3a4ecf',
+    dark_primary: '#2a3bac',
+    secundary: '#23a488',
+    dark_secundary: '#1a7a65'
+  },
+  fontPatterns: "400 17px 'Montserrat', sans-serif !important"
+}
+
+export default theme
diff --git a/styles/globals.css b/styles/globals.css
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,6 +2,7 @@ @@
     # dependencies
     /node_modules
+    /.idea
     /.pnp
     .pnp.js
@@ Expand Down @@