JoshS/Portfolio-v3
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Layout function o.O

Browse source 
Cleaned up the code and that's about it.
This commit is contained in:
Robert S 2021-12-10 23:09:37 +01:00
parent b9ed40b2b9
commit 79cc0cb8d1
No known key found for this signature in database
GPG key ID: DD534ED7DF3857A5
10 changed files with 234 additions and 283 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
components/Footer.js → components/footer.js
View file

@ -1,11 +1,12 @@
import Link from "next/link";
import RomanNumerals from './romanNumerals';
export default function Footer() {
return (
<>
<footer className="container px-5 py-8 mx-auto flex items-center sm:flex-row flex-col">
<p className="text-xl">
© MMXXI
© {RomanNumerals(new Date().getFullYear())}
{" "}
<Link href="/">
<a>Robert S.</a>

37
components/layout.js Normal file
View file

@ -0,0 +1,37 @@
import Link from 'next/link';
import Head from 'next/head';
import Navbar from "./navbar";
import Footer from "./footer";
export default function Layout({
children,
title = '',
}) {
return (
<>
<Head>
<meta charSet="UTF-8"/>
<title>Robert S. {title && `- ${title}`}</title>
<meta name="description" content="A developer and tech enthusiast from the Netherlands." />
<meta name="keywords" content="HTML,CSS,JavaScript,Python,SQL,MySQL,PostgreSQL,MongoDB,Redis,Flask,Tailwind,TailwindCSS,Bootstrap" />
<meta name="author" content="Robert Stokreef" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:title" content="Robert S. - My work" />
<meta property="og:description" content="A developer and tech enthusiast from the Netherlands." />
<meta property="og:url" content="https://robert-s.dev/work" />
<meta property="og:image" content="https://robert-s.dev/logo.jpg" />
<meta name="theme-color" content="#F43F5E" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ThatGuy5275" />
<meta name="twitter:title" content="Robert S. - My work" />
<meta name="twitter:description" content="A developer and tech enthusiast from the Netherlands."/>
<meta name="twitter:image" content="https://robert-s.dev/logo.jpg"/>
</Head>
<div className="flex flex-col min-h-screen">
<Navbar />
{children}
<Footer />
</div>
</>
)
}

2
components/Navbar.js → components/navbar.js
View file

@ -1,6 +1,6 @@
import Link from "next/link";
import {useState} from "react";
import NavLink from "./NavLink";
import NavLink from "./navlink";
export default function Navbar() {
const [active, setActive] = useState(false)

0
components/NavLink.js → components/navlink.js
View file

13
components/romanNumerals.js Normal file
View file

@ -0,0 +1,13 @@
export default function RomanNumerals(num) {
if (isNaN(num))
return NaN;
let digits = String(+num).split(""),
key = ["", "C", "CC", "CCC", "CD", "D", "DC", "DCC", "DCCC", "CM",
"", "X", "XX", "XXX", "XL", "L", "LX", "LXX", "LXXX", "XC",
"", "I", "II", "III", "IV", "V", "VI", "VII", "VIII", "IX"],
roman = "",
i = 3;
while (i--)
roman = (key[+digits.pop() + (i * 10)] || "") + roman;
return Array(+digits.join("") + 1).join("M") + roman;
}

31
pages/about.js
View file

@ -1,32 +1,9 @@
import Head from "next/head";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/layout";
import { motion } from "framer-motion";
export default function About() {
return (
<div>
<Head>
<meta charSet="UTF-8"/>
<title>Robert S. - About me</title>
<meta name="description" content="A developer and tech enthusiast from the Netherlands." />
<meta name="keywords" content="HTML,CSS,JavaScript,Python,SQL,MySQL,PostgreSQL,MongoDB,Redis,Flask,Tailwind,TailwindCSS,Bootstrap" />
<meta name="author" content="Robert Stokreef" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:title" content="Robert S. - About me" />
<meta property="og:description" content="A developer and tech enthusiast from the Netherlands." />
<meta property="og:url" content="https://robert-s.dev/about" />
<meta property="og:image" content="https://robert-s.dev/logo.jpg" />
<meta name="theme-color" content="#F43F5E" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ThatGuy5275" />
<meta name="twitter:title" content="Robert S. - About me" />
<meta name="twitter:description" content="A developer and tech enthusiast from the Netherlands."/>
<meta name="twitter:image" content="https://robert-s.dev/logo.jpg"/>
</Head>
<div className="flex flex-col min-h-screen">
<Navbar />
<Layout title="About me">
<div className="flex flex-grow items-center">
<div className="w-full">
<div className="container flex mx-auto justify-center">
@ -66,8 +43,6 @@ export default function About() {
</div>
</div>
</div>
<Footer />
</div>
</div>
</Layout>
)
}

31
pages/contact.js
View file

@ -1,32 +1,9 @@
import Head from "next/head";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/layout";
import {motion} from "framer-motion";
export default function Contact() {
return (
<div>
<Head>
<meta charSet="UTF-8"/>
<title>Robert S. - Contact me</title>
<meta name="description" content="A developer and tech enthusiast from the Netherlands." />
<meta name="keywords" content="HTML,CSS,JavaScript,Python,SQL,MySQL,PostgreSQL,MongoDB,Redis,Flask,Tailwind,TailwindCSS,Bootstrap" />
<meta name="author" content="Robert Stokreef" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:title" content="Robert S. - Contact me" />
<meta property="og:description" content="A developer and tech enthusiast from the Netherlands." />
<meta property="og:url" content="https://robert-s.dev/contact" />
<meta property="og:image" content="https://robert-s.dev/logo.jpg" />
<meta name="theme-color" content="#F43F5E" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ThatGuy5275" />
<meta name="twitter:title" content="Robert S. - Contact me" />
<meta name="twitter:description" content="A developer and tech enthusiast from the Netherlands."/>
<meta name="twitter:image" content="https://robert-s.dev/logo.jpg"/>
</Head>
<div className="flex flex-col min-h-screen">
<Navbar />
<Layout title="Contact me">
<div className="flex flex-grow items-center">
<div className="w-full">
<div className="container flex mx-auto justify-center">
@ -95,8 +72,6 @@ export default function Contact() {
</div>
</div>
</div>
<Footer />
</div>
</div>
</Layout>
)
}

31
pages/index.js
View file

@ -1,32 +1,9 @@
import Head from "next/head";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/layout";
import { motion } from "framer-motion";
export default function Home() {
return (
<div>
<Head>
<meta charSet="UTF-8"/>
<title>Robert S.</title>
<meta name="description" content="A developer and tech enthusiast from the Netherlands." />
<meta name="keywords" content="HTML,CSS,JavaScript,Python,SQL,MySQL,PostgreSQL,MongoDB,Redis,Flask,Tailwind,TailwindCSS,Bootstrap" />
<meta name="author" content="Robert Stokreef" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:title" content="Robert S." />
<meta property="og:description" content="A developer and tech enthusiast from the Netherlands." />
<meta property="og:url" content="https://robert-s.dev/" />
<meta property="og:image" content="https://robert-s.dev/logo.jpg" />
<meta name="theme-color" content="#F43F5E" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ThatGuy5275" />
<meta name="twitter:title" content="Robert S." />
<meta name="twitter:description" content="A developer and tech enthusiast from the Netherlands."/>
<meta name="twitter:image" content="https://robert-s.dev/logo.jpg"/>
</Head>
<div className="flex flex-col min-h-screen">
<Navbar />
<Layout>
<div className="flex flex-grow items-center">
<div className="w-full">
<div className="container flex mx-auto justify-center">
@ -41,8 +18,6 @@ export default function Home() {
</div>
</div>
</div>
<Footer />
</div>
</div>
</Layout>
)
}

31
pages/work.js
View file

@ -1,32 +1,9 @@
import Head from "next/head";
import Navbar from "../components/Navbar";
import Footer from "../components/Footer";
import Layout from "../components/layout";
import { motion } from "framer-motion";
export default function Work() {
return (
<div>
<Head>
<meta charSet="UTF-8"/>
<title>Robert S. - My work</title>
<meta name="description" content="A developer and tech enthusiast from the Netherlands." />
<meta name="keywords" content="HTML,CSS,JavaScript,Python,SQL,MySQL,PostgreSQL,MongoDB,Redis,Flask,Tailwind,TailwindCSS,Bootstrap" />
<meta name="author" content="Robert Stokreef" />
<link rel="icon" href="/favicon.ico" />
<meta property="og:title" content="Robert S. - My work" />
<meta property="og:description" content="A developer and tech enthusiast from the Netherlands." />
<meta property="og:url" content="https://robert-s.dev/work" />
<meta property="og:image" content="https://robert-s.dev/logo.jpg" />
<meta name="theme-color" content="#F43F5E" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ThatGuy5275" />
<meta name="twitter:title" content="Robert S. - My work" />
<meta name="twitter:description" content="A developer and tech enthusiast from the Netherlands."/>
<meta name="twitter:image" content="https://robert-s.dev/logo.jpg"/>
</Head>
<div className="flex flex-col min-h-screen">
<Navbar />
<Layout title="My work">
<div className="flex flex-grow items-center">
<div className="w-full">
<div className="container flex mx-auto justify-center">
@ -98,8 +75,6 @@ export default function Work() {
</div>
</div>
</div>
<Footer />
</div>
</div>
</Layout>
)
}

BIN
public/forum-banner.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 12 KiB