Added 404 page and Layout component

dependabot/npm_and_yarn/typescript-eslint/parser-4.33.0
Guusvanmeerveld 3 years ago
parent 902c2ae3c7
commit c4f3ae4390

@ -0,0 +1,12 @@
import Navbar from "./Navbar";
import Footer from "./Footer";
const Layout = ({ children }) => (
<>
<Navbar />
{children}
<Footer />
</>
);
export default Layout;

14
package-lock.json generated

@ -8,6 +8,7 @@
"name": "portfolio",
"version": "0.1.0",
"dependencies": {
"dotenv": "^8.2.0",
"next": "10.0.8",
"react": "17.0.1",
"react-dom": "17.0.1",
@ -821,6 +822,14 @@
"npm": ">=1.2"
}
},
"node_modules/dotenv": {
"version": "8.2.0",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
"integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw==",
"engines": {
"node": ">=8"
}
},
"node_modules/electron-to-chromium": {
"version": "1.3.683",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.683.tgz",
@ -2978,6 +2987,11 @@
"resolved": "https://registry.npmjs.org/domain-browser/-/domain-browser-1.2.0.tgz",
"integrity": "sha512-jnjyiM6eRyZl2H+W8Q/zLMA481hzi0eszAaBUzIVnmYVDBbnLxVNnfu1HgEBvCbL+71FrxMl3E6lpKH7Ge3OXA=="
},
"dotenv": {
"version": "8.2.0",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.2.0.tgz",
"integrity": "sha512-8sJ78ElpbDJBHNeBzUbUVLsqKdccaa/BXF1uPTw3GrvQTBgrQrtObr2mUrE38vzYd8cEv+m/JBfDLioYcfXoaw=="
},
"electron-to-chromium": {
"version": "1.3.683",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.683.tgz",

@ -8,6 +8,7 @@
"start": "next start"
},
"dependencies": {
"dotenv": "^8.2.0",
"next": "10.0.8",
"react": "17.0.1",
"react-dom": "17.0.1",

@ -1,20 +1,19 @@
import Page from "../components/Page";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/Layout";
const NotFound = () => (
<Page title="Page not found" description="This page either doesn't exist or has been deleted">
<Navbar />
<div className="message">
<div>
<div className="header">Not found</div>
<div className="subtitle">This page either doesn't exist or has been deleted</div>
<a href="/" className="link button">
Go back
</a>
<Layout>
<div className="message">
<div>
<div className="header">Not found</div>
<div className="subtitle">This page either doesn't exist or has been deleted</div>
<a href="/" className="link button">
Go back
</a>
</div>
</div>
</div>
<Footer />
</Layout>
</Page>
);

@ -4,6 +4,7 @@ import "../styles/raleway.css";
import "../styles/sass/index.scss";
import "../styles/sass/thanks.scss";
import "../styles/sass/binas.scss";
import "../styles/sass/upload.scss";
function App({ Component, pageProps }) {
return <Component {...pageProps} />;

@ -1,8 +1,7 @@
import Page from "../components/Page";
import Footer from "../components/Footer";
import Navbar from "../components/Navbar";
import LazyLoad from "react-lazyload";
import { Component } from "react";
import Layout from "../components/Layout";
class Binas extends Component {
links: string[];
@ -23,15 +22,15 @@ class Binas extends Component {
render() {
return (
<Page title="Binas" description="Voor wanneer je effe de binas nodig hebt">
<Navbar />
<div className="binas">
{this.links.map((link) => (
<LazyLoad height={100} offset={100}>
<img src={link} alt="" />
</LazyLoad>
))}
</div>
<Footer />
<Layout>
<div className="binas">
{this.links.map((link) => (
<LazyLoad height={100} offset={100}>
<img src={link} alt="" />
</LazyLoad>
))}
</div>
</Layout>
</Page>
);
}

@ -1,17 +1,16 @@
import Page from "../components/Page";
import Navbar from "../components/Navbar";
import Landing from "../components/Landing";
import Projects from "../components/Projects";
import Contact from "../components/Contact";
import Footer from "../components/Footer";
import Layout from "../components/Layout";
const Home = () => (
<Page description="A simple portfolio website to display my projects." title="Projects">
<Navbar />
<Landing />
<Projects />
<Contact />
<Footer />
<Layout>
<Landing />
<Projects />
<Contact />
</Layout>
</Page>
);

@ -1,21 +1,20 @@
import Page from "../components/Page";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/Layout";
const Thanks = () => (
<Page title="Thanks!" description="Thanks for submitting your contact form!">
<Navbar />
<div className="message">
<div>
<div className="icon"></div>
<div className="header">Thank you!</div>
<div className="subtitle">Your submission is greatly appreciated!</div>
<a href="/" className="link button">
Go back
</a>
<Layout>
<div className="message">
<div>
<div className="icon"></div>
<div className="header">Thank you!</div>
<div className="subtitle">Your submission is greatly appreciated!</div>
<a href="/" className="link button">
Go back
</a>
</div>
</div>
</div>
<Footer />
</Layout>
</Page>
);

@ -0,0 +1,12 @@
import Page from "../components/Page";
import Layout from "../components/Layout";
const Upload = () => (
<Page title="Upload" description="Upload a custom file to the cdn">
<Layout>
<div className="container upload"></div>
</Layout>
</Page>
);
export default Upload;

@ -1 +1,2 @@
Disallow /binas
Disallow /binas
Disallow /upload

@ -0,0 +1,3 @@
.upload {
padding-top: 6rem;
}
Loading…
Cancel
Save