Compare commits
10 commits
4c8dd84e82
...
e623ec6a50
| Author | SHA1 | Date | |
|---|---|---|---|
 Le fishe au chocolat
|
e623ec6a50 | ||
|
Le fishe au chocolat
|
5c2efd4f7b | ||
|
Le fishe au chocolat
|
dfed98af2d | ||
|
Le fishe au chocolat
|
98fcfaa01b | ||
|
Le fishe au chocolat
|
1d9763b118 | ||
|
Le fishe au chocolat
|
1db1f645dd | ||
|
Le fishe au chocolat
|
24286c77ae | ||
|
Le fishe au chocolat
|
52b1f0a76d | ||
|
Le fishe au chocolat
|
5a8d49714f | ||
|
Le fishe au chocolat
|
1ac8649c9d |
11
src/app/contact/page.tsx
Normal file
11
src/app/contact/page.tsx
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
export default function Contact() {
|
||||
return (
|
||||
<>
|
||||
<main className="flex flex-col space-y-2 text-gray-50 text-xl font-[Bitcount]">
|
||||
<p>contact me on Discord: gamrston</p>
|
||||
<p>contact me on Telegram: <a className="hover:text-gray-300" href="https://t.me/periodicbrake">periodicbrake</a></p>
|
||||
<p>contact me via Email: <a className="hover:text-gray-300" href="periodicbrake63@gmail.com">periodicbrake63@gmail.com</a></p>
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
|
@ -14,4 +14,4 @@
|
|||
body {
|
||||
background: var(--color-gray-950);
|
||||
color: var(--color-gray-950);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,13 +1,20 @@
|
|||
import type { Metadata } from "next";
|
||||
import { Bitcount } from "next/font/google";
|
||||
import { Bitcount, Italianno } from "next/font/google";
|
||||
import "./globals.css";
|
||||
import Header from "@/components/header";
|
||||
import Footer from "@/components/footer";
|
||||
|
||||
const bitCount = Bitcount({
|
||||
variable: "--font-bitcount",
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
const italianno = Italianno({
|
||||
weight: "400",
|
||||
variable: "--font-italianno",
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "unemployment heaven",
|
||||
description: "AI sucks. but who cares, i'll never let it take my job",
|
||||
|
|
@ -19,12 +26,21 @@ export default function RootLayout({
|
|||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en" className={`${bitCount.variable} h-full antialiased`}>
|
||||
<html
|
||||
lang="en"
|
||||
className={`${bitCount.variable} ${italianno.variable}
|
||||
h-full antialiased`}
|
||||
>
|
||||
<head></head>
|
||||
<body className="min-h-full flex flex-col">
|
||||
<body className="min-h-screen grid grid-rows-[auto_1fr_auto]">
|
||||
<Header />
|
||||
<div className="content-center flex">{children}</div>
|
||||
|
||||
<main className="flex flex-col justify-center items-center py-10">
|
||||
{children}
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +1,17 @@
|
|||
export default function Legal() {
|
||||
return (
|
||||
<div className="flex ">
|
||||
<div className="w-3/5 h-200 bg-gray-700 border-gray-600 border rounded-xl"></div>
|
||||
<div className="space-y-4 flex flex-col w-3/5 p-15 bg-gray-700 border-gray-600 border rounded-xl my-15">
|
||||
<h1 className="font-[Bitcount] text-4xl text-gray-50">Data policy</h1>
|
||||
<p className="ml-2 text-gray-50 font-[Bitcount] text-xl">
|
||||
Where does your data go? Idk fam tbh i just know google got smth to do
|
||||
with the fonts{" "}
|
||||
</p>
|
||||
<h1 className="font-[Bitcount] text-4xl text-gray-50">
|
||||
EULA
|
||||
</h1>
|
||||
<p className="ml-2 text-gray-50 font-[Bitcount] text-xl">
|
||||
gng who said i was a product ✌️
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,52 @@
|
|||
import Image from "next/image";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="flex flex-col flex-1 items-center justify-center bg-zinc-50 font-sans dark:bg-black">
|
||||
<main className="flex flex-1 w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
|
||||
const startDate = new Date("2011-08-30");
|
||||
const now = new Date();
|
||||
|
||||
let years = now.getFullYear() - startDate.getFullYear();
|
||||
|
||||
// On vérifie si l'anniversaire n'est pas encore passé cette année
|
||||
if (
|
||||
now.getMonth() < startDate.getMonth() ||
|
||||
(now.getMonth() === startDate.getMonth() &&
|
||||
now.getDate() < startDate.getDate())
|
||||
) {
|
||||
years--;
|
||||
}
|
||||
return (
|
||||
<>
|
||||
<main className="flex flex-col space-y-5 mx-10">
|
||||
<h1 className="font-[Bitcount] text-gray-50 text-4xl">Who am I?</h1>
|
||||
<p className="ml-5 font-[Bitcount] text-gray-50 text-xl">
|
||||
🤨 do some research idk? More seriously I am a:
|
||||
<br />
|
||||
- french
|
||||
<br />- {years}yo High school student <br />- somewhat full stack dev
|
||||
<br />- Who knows how to center a div without ai (with enough energy
|
||||
drinks)
|
||||
</p>
|
||||
<h1 className="font-[Bitcount] text-gray-50 text-4xl">
|
||||
What can I build
|
||||
</h1>
|
||||
<p className="ml-5 font-[Bitcount] text-gray-50 text-xl">
|
||||
- pretty much anything that doesn't involve microsoft (i hate them)
|
||||
</p>
|
||||
<h1 className="font-[Bitcount] text-gray-50 text-4xl">My toolbox</h1>
|
||||
<p className="ml-5 font-[Bitcount] text-gray-50 text-xl">
|
||||
- Zed and micro (truly goated)
|
||||
<br />- NextJS and tailwind (guess what i made with them; clue: it
|
||||
starts with this and ends with website)
|
||||
<br />- a 10yo desktop that is now used as a homelab (in other terms,
|
||||
my slave)
|
||||
<br />- the laptop my region gave me (thx{" "}
|
||||
<a href="https://www.grandest.fr" className="text-blue-300">
|
||||
Grand est
|
||||
</a>
|
||||
)
|
||||
<br/>- <a href="https://www.infomaniak.com" className="text-blue-300">infomaniak</a> (cuz 77.192.72.192 is hard to remember)
|
||||
</p>
|
||||
<h1 className="font-[Bitcount] text-gray-50 text-2xl">I sometimes do stuff for free, contact me and we'll see if you're lucky</h1>
|
||||
</main>
|
||||
</div>
|
||||
<p className="mt-5 font-normal font-[Italianno] text-gray-500 text-4xl">'' Why need a whole earth if your already in the best place you'll ever be ,, <a href="#" className="text-gray-400">-me on a random friday</a></p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
0
src/components/footer.css
Normal file
0
src/components/footer.css
Normal file
9
src/components/footer.tsx
Normal file
9
src/components/footer.tsx
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
export default function Footer() {
|
||||
return (
|
||||
<>
|
||||
<div className="w-full border-t border-t-gray-500 bg-black py-5 pl-4">
|
||||
<h1 className="text-gray-600 font-[Bitcount] text-2xl ">periodicbrake.fr</h1>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
@import url("https://fonts.googleapis.com/css2?family=Bitcount+Grid+Double:wght@352&display=swap");
|
||||
|
||||
pagetitle {
|
||||
font-family: "Bitcount Grid Double", system-ui;
|
||||
}
|
||||
|
|
@ -1,12 +1,14 @@
|
|||
import "./header.css";
|
||||
import Image from "next/image"
|
||||
import Link from "next/link";
|
||||
|
||||
function Header() {
|
||||
return (
|
||||
<div className="items-center header flex flex-row w-100% h-20 border-b-solid border-b-gray-700 border-b-2 bg-gray-900 " id="header container">
|
||||
<Image height={256} width={256} src="/pfp.png" className="ml-3.5 animate-[spin_3s_linear_infinite] rounded-full basis-15 h-15" id="pfp" alt="pfp"/>
|
||||
<h1 className="ml-3.5 pagetitle text-4xl text-bold text-white font-[Bitcount]" id="page-title">PERIODICBRAKE</h1>
|
||||
<div className="basis-auto" id="header-separator"/>
|
||||
<div className="basis-auto w-full" id="header-separator" />
|
||||
<Link href="/contact" className="mr-3.5 text-3xl text-bold text-white hover:text-gray-200 font-[Bitcount]"><p>Contact</p></Link>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue