Browse Source

initial commit

main
Adrian Baumgart 2 months ago
parent
commit
f144ffa913
Signed by: exc_bad_access GPG Key ID: B6CC77BC47B56030
  1. 21
      LICENSE
  2. 35
      README.md
  3. 105
      components/Navbar.js
  4. 7
      components/Page.js
  5. 1252
      package-lock.json
  6. 5
      package.json
  7. 86
      pages/index.js
  8. 96
      pages/legal.js
  9. 50
      pages/pgp.js
  10. 125
      pages/privacy.js
  11. 6
      postcss.config.js
  12. 25
      styles/globals.css
  13. 17
      tailwind.config.js

21
LICENSE

@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021 Adrian Baumgart
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

35
README.md

@ -1,34 +1 @@
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
## Getting Started
First, run the development server:
```bash
npm run dev
# or
yarn dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
## Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
my website at [https://abmgrt.dev](https://abmgrt.dev)

105
components/Navbar.js

@ -0,0 +1,105 @@
import { useState } from 'react';
export default function Navbar({ title }) {
const [dropdownToggled, setDropdownToggled] = useState(false);
return (
<div className="top-0 left-0 right-0 m-0 bg-gradient-to-r from-pink-500 via-red-500 to-yellow-500 w-full h-auto py-4 flex items-center justify-between">
<p className="font-bold text-white ml-4 text-xl">{title}</p>
<div className="items-center md:flex hidden">
<NavbarLink title="PGP/GPG" href="/pgp" />
<NavbarLink title="Legal disclosure" href="/legal" />
<NavbarLink title="Privacy" href="/privacy" />
<NavbarLink title="Home" href="/" />
<img
src={
'http://www.gravatar.com/avatar/1615be3776f4bdfa985afdea244eb1b3'
}
className="w-10 h-10 rounded-full ml-4 mr-4 border shadow"
/>
</div>
<div className="md:hidden">
<button
type="button"
onClick={() => {
setDropdownToggled(!dropdownToggled);
}}
>
<div className="flex items-center pl-4 p-4 h-16 text-white">
<p style={{ fontSize: '13px', fontWeight: 'bold' }}>Menu</p>
<svg
class="-mr-1 ml-2 h-5 w-5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
aria-hidden="true"
>
<path
fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"
/>
</svg>
<img
src={
'http://www.gravatar.com/avatar/1615be3776f4bdfa985afdea244eb1b3'
}
className="w-10 h-10 rounded-full ml-4 mr-4 border shadow"
/>
</div>
</button>
<div
class={`origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white dark:bg-dark-tertiary ring-1 ring-black ring-opacity-5 divide-y divide-gray-100 dark:divide-gray-900 mr-4 ${
dropdownToggled
? 'transition ease-out duration-100 transform opacity-100 scale-100'
: 'transition ease-in duration-75 transform opacity-0 scale-0'
}`}
role="menu"
aria-orientation="vertical"
aria-labelledby="options-menu"
>
<div class="py-1">
<a
href="/"
class="block px-4 py-2 text-sm text-gray-700 dark:text-white hover:bg-gray-100 dark:hover:bg-dark-secondary hover:text-gray-900 dark:hover:text-gray-100"
role="menuitem"
>
Home
</a>
<a
href="/pgp"
class="block px-4 py-2 text-sm text-gray-700 dark:text-white hover:bg-gray-100 dark:hover:bg-dark-secondary hover:text-gray-900 dark:hover:text-gray-100"
role="menuitem"
>
PGP/GPG
</a>
</div>
<div class="py-1">
<a
href="/privacy"
class="block px-4 py-2 text-sm text-gray-700 dark:text-white hover:bg-gray-100 dark:hover:bg-dark-secondary hover:text-gray-900 dark:hover:text-gray-100"
role="menuitem"
>
Privacy Policy
</a>
<a
href="/legal"
class="block px-4 py-2 text-sm text-gray-700 dark:text-white hover:bg-gray-100 dark:hover:bg-dark-secondary hover:text-gray-900 dark:hover:text-gray-100"
role="menuitem"
>
Legal Disclosure
</a>
</div>
</div>
</div>
</div>
);
}
function NavbarLink({ title, href }) {
return (
<a href={href} className="ml-4 text-white underline">
{title}
</a>
);
}
//from-pink-500 via-red-500 to-yellow-500

7
components/Page.js

@ -0,0 +1,7 @@
export default function Page({ children }) {
return (
<div className="dark:bg-dark-primary w-full h-full min-h-screen mx-auto dark:text-white">
{children}
</div>
);
}

1252
package-lock.json
File diff suppressed because it is too large
View File

5
package.json

@ -11,5 +11,10 @@
"next": "10.0.7",
"react": "17.0.1",
"react-dom": "17.0.1"
},
"devDependencies": {
"autoprefixer": "^10.2.4",
"postcss": "^8.2.6",
"tailwindcss": "^2.0.3"
}
}

86
pages/index.js

@ -1,65 +1,27 @@
import Head from 'next/head'
import styles from '../styles/Home.module.css'
import Head from 'next/head';
import Navbar from '../components/Navbar';
import Page from '../components/Page';
export default function Home() {
return (
<div className={styles.container}>
<Head>
<title>Create Next App</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<h1 className={styles.title}>
Welcome to <a href="https://nextjs.org">Next.js!</a>
</h1>
<p className={styles.description}>
Get started by editing{' '}
<code className={styles.code}>pages/index.js</code>
</p>
<div className={styles.grid}>
<a href="https://nextjs.org/docs" className={styles.card}>
<h3>Documentation &rarr;</h3>
<p>Find in-depth information about Next.js features and API.</p>
</a>
<a href="https://nextjs.org/learn" className={styles.card}>
<h3>Learn &rarr;</h3>
<p>Learn about Next.js in an interactive course with quizzes!</p>
</a>
<a
href="https://github.com/vercel/next.js/tree/master/examples"
className={styles.card}
>
<h3>Examples &rarr;</h3>
<p>Discover and deploy boilerplate example Next.js projects.</p>
</a>
<a
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
className={styles.card}
>
<h3>Deploy &rarr;</h3>
<p>
Instantly deploy your Next.js site to a public URL with Vercel.
</p>
</a>
</div>
</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{' '}
<img src="/vercel.svg" alt="Vercel Logo" className={styles.logo} />
</a>
</footer>
</div>
)
return (
<Page>
<Navbar title="Home" />
<div className="w-full flex flex-col items-center text-center justify-center mt-20 px-4">
<p className="font-bold text-3xl">Hello there!</p>
<p className="mt-2">
This website is not done yet. Idk what to put here. While you're
waiting, please enjoy this nyan cat video:
</p>
<iframe
className="mt-4"
width="560"
height="315"
src="https://www.youtube-nocookie.com/embed/QH2-TGUlwu4"
frameBorder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowFullScreen
></iframe>
</div>
</Page>
);
}

96
pages/legal.js

@ -0,0 +1,96 @@
import Navbar from '../components/Navbar';
import Page from '../components/Page';
export default function Legal() {
return (
<Page>
<Navbar title="Legal Disclosure" />
<div className="m-4">
<h1 className="font-bold text-3xl">Legal Disclosure</h1>
<p className="text-gray-500 mt-2">
Because German Law wants me to put this information <b>publicly</b>{' '}
and <b>visible to anyone</b> on my <b>personal</b> website{' '}
</p>
<p className="my-2">-------------</p>
<p className="my-2 font-bold text-lg">
Information in accordance with Section 5 TMG
</p>
<div className="my-4">
<p>Adrian Baumgart</p>
<p>Karl-Gehrig-Straße 2</p>
<p>69226 Nussloch</p>
</div>
<div className="my-2">
<h2 className="font-bold text-xl">Contact Information</h2>
<p className="mt-2">
Telephone:{' '}
<a href="tel:+4915165909306" className="underline text-blue-600">
+4915165909306
</a>
</p>
<p>
E-Mail:{' '}
<a
href="mailto:adrian@abmgrt.dev"
target="_blank"
className="underline text-blue-600"
>
adrian@abmgrt.dev
</a>
</p>
<p>
Internet address:{' '}
<a
href="https://abmgrt.dev"
target="_blank"
className="underline text-blue-600"
>
https://abmgrt.dev
</a>
</p>
</div>
<h2 className="mt-4 font-bold text-2xl">Disclaimer</h2>
<p className="font-semibold text-xl mt-2">Accountability for content</p>
<div className="mt-1">
The contents of our pages have been created with the utmost care.
However, we cannot guarantee the contents' accuracy, completeness or
topicality. According to statutory provisions, we are furthermore
responsible for our own content on these web pages. In this matter,
please note that we are not obliged to monitor the transmitted or
saved information of third parties, or investigate circumstances
pointing to illegal activity. Our obligations to remove or block the
use of information under generally applicable laws remain unaffected
by this as per §§ 8 to 10 of the Telemedia Act (TMG).
</div>
<p className="font-semibold text-xl mt-2">Accountability for links</p>
<div className="mt-1">
Responsibility for the content of external links (to web pages of
third parties) lies solely with the operators of the linked pages. No
violations were evident to us at the time of linking. Should any legal
infringement become known to us, we will remove the respective link
immediately.
</div>
<p className="font-semibold text-xl mt-2">Copyright</p>
<div className="mt-1">
Our web pages and their contents are subject to German copyright law.
Unless expressly permitted by law, every form of utilizing,
reproducing or processing works subject to copyright protection on our
web pages requires the prior consent of the respective owner of the
rights. Individual reproductions of a work are only allowed for
private use. The materials from these pages are copyrighted and any
unauthorized use may violate copyright laws.
</div>
<div className="my-4">
<i>Thanks to: </i>
<a
href="http://www.translate-24h.de"
target="_blank"
className="underline text-blue-600"
>
translate-24h.de English Translations
</a>
</div>
</div>
</Page>
);
}

50
pages/pgp.js

@ -0,0 +1,50 @@
import Navbar from '../components/Navbar';
import Page from '../components/Page';
export default function PGP() {
return (
<Page>
<Navbar title="PGP" />
<div className="m-4">
<p className="font-bold text-3xl">PGP Public keys</p>
<p className="font-semibold mt-2">
If you contact me via email, please use my PGP public key to encrypt
the content of the email.
</p>
<p className="my-2 text-gray-600">
Obviously you don't have to but it'd be nice because encryption is
important
</p>
<p className="mb-4">
My main email address is <b>adrian@abmgrt.dev</b>, so please use this
if you try to contact me, thanks! ^^
</p>
<div>
<PGPEntry email="adrian@abmgrt.dev" />
<PGPEntry email="adrianbaumgart132@gmail.com" />
<p className="text-gray-700 mt-2">
School email address Not disclosed, please contact me to get the
email address and PGP public key
</p>
</div>
</div>
</Page>
);
}
function PGPEntry({ email }) {
return (
<div>
<p>
<b>{email}:</b>{' '}
<a
href={`https://dl.abmgrt.dev/pgp/${email}.asc`}
target="_blank"
className="underline text-blue-600"
>
PGP public key
</a>
</p>
</div>
);
}

125
pages/privacy.js

@ -0,0 +1,125 @@
import Navbar from '../components/Navbar';
import Page from '../components/Page';
export default function Privacy() {
return (
<Page>
<Navbar title="Privacy Policy" />
<div className="m-4">
<h1 className="font-bold text-3xl">Never gonna give up your Privacy</h1>
<p>-------</p>
<p>
<a
href="https://www.youtube.com/watch?v=graKroRK8Hg"
target="_blank"
className="underline text-blue-600"
>
Listen to the instrumental here
</a>
</p>
<p>-------</p>
<p className="mb-2">
<i>
<u>Effective date: February 21, 2021</u>
</i>
</p>
<PrivacyLine>We're no strangers to privacy</PrivacyLine>
<PrivacyLine>You know your rights and so do I</PrivacyLine>
<PrivacyLine>Transparency and trust is what I want</PrivacyLine>
<PrivacyLine>You wouldn't get this from any other site</PrivacyLine>
<PrivacyLine>I just wanna tell you what I'm doing</PrivacyLine>
<PrivacyLine>Gotta make you understand</PrivacyLine>
<PrivacyLine>Never gonna steal your data</PrivacyLine>
<PrivacyLine>Never gonna sell it to Facebook</PrivacyLine>
<PrivacyLine>Never gonna use data for something harmful</PrivacyLine>
<PrivacyLine>Never gonna make you worried</PrivacyLine>
<PrivacyLine>Never gonna break the law</PrivacyLine>
<PrivacyLine>Never gonna tell a lie and hurt you</PrivacyLine>
<PrivacyLine>We've known each other for so long</PrivacyLine>
<PrivacyLine>We might collect data regarding your usage</PrivacyLine>
<PrivacyLine>Of course this is all private</PrivacyLine>
<PrivacyLine>Only Cloudflare and I can see it</PrivacyLine>
<PrivacyLine>And if you wanna see their privacy policy</PrivacyLine>
<PrivacyLine>
Here it is:{' '}
<a
href="https://www.cloudflare.com/privacypolicy/"
target="_blank"
className="underline text-blue-600"
>
https://www.cloudflare.com/privacypolicy/
</a>
</PrivacyLine>
<PrivacyLine>Never gonna steal your data</PrivacyLine>
<PrivacyLine>Never gonna sell it to Facebook</PrivacyLine>
<PrivacyLine>Never gonna use data for something harmful</PrivacyLine>
<PrivacyLine>Never gonna make you worried</PrivacyLine>
<PrivacyLine>Never gonna break the law</PrivacyLine>
<PrivacyLine>Never gonna tell a lie and hurt you</PrivacyLine>
<PrivacyLine>Never gonna steal your data</PrivacyLine>
<PrivacyLine>Never gonna sell it to Facebook</PrivacyLine>
<PrivacyLine>Never gonna use data for something harmful</PrivacyLine>
<PrivacyLine>Never gonna make you worried</PrivacyLine>
<PrivacyLine>Never gonna break the law</PrivacyLine>
<PrivacyLine>Never gonna tell a lie and hurt you</PrivacyLine>
<PrivacyLine>Never gonna steal, never gonna steal</PrivacyLine>
<PrivacyLine>(Your data)</PrivacyLine>
<PrivacyLine>(Ooh) Never gonna steal, never gonna steal</PrivacyLine>
<PrivacyLine>(Your data)</PrivacyLine>
<PrivacyLine>We've known each other for so long</PrivacyLine>
<PrivacyLine>We really want you to feel safe here</PrivacyLine>
<PrivacyLine>
And if you wonder you can check the source code{' '}
<a
href="https://git.abmgrt.dev/exc_bad_access/abmgrt.dev"
target="_blank"
className="underline text-blue-600"
>
here
</a>
</PrivacyLine>
<PrivacyLine>If you're a nerd you can read this</PrivacyLine>
<PrivacyLine>I just wanna tell you what I'm doing</PrivacyLine>
<PrivacyLine>Gotta make you understand</PrivacyLine>
<PrivacyLine>Never gonna steal your data</PrivacyLine>
<PrivacyLine>Never gonna sell it to Facebook</PrivacyLine>
<PrivacyLine>Never gonna use data for something harmful</PrivacyLine>
<PrivacyLine>Never gonna make you worried</PrivacyLine>
<PrivacyLine>Never gonna break the law</PrivacyLine>
<PrivacyLine>Never gonna tell a lie and hurt you</PrivacyLine>
<PrivacyLine>Never gonna steal your data</PrivacyLine>
<PrivacyLine>Never gonna sell it to Facebook</PrivacyLine>
<PrivacyLine>Never gonna use data for something harmful</PrivacyLine>
<PrivacyLine>Never gonna make you worried</PrivacyLine>
<PrivacyLine>Never gonna break the law</PrivacyLine>
<PrivacyLine>Never gonna tell a lie and hurt you</PrivacyLine>
<PrivacyLine>Never gonna give you my data</PrivacyLine>
<PrivacyLine>But just in case, here it is:</PrivacyLine>
<PrivacyLine>Never gonna call me at</PrivacyLine>
<PrivacyLine>
<a href="tel:+4915165909306" className="underline text-blue-600">
+4915165909306
</a>
</PrivacyLine>
<PrivacyLine>Never gonna send me an email</PrivacyLine>
<PrivacyLine>But I will reply</PrivacyLine>
<PrivacyLine>
Send it to{' '}
<a
href="mailto:adrian@abmgrt.dev"
className="underline text-blue-600"
>
adrian@abmgrt.dev
</a>
</PrivacyLine>
<PrivacyLine>And that's it!</PrivacyLine>
</div>
</Page>
);
}
function PrivacyLine({ children }) {
return <p className="m-1">{children}</p>;
}

6
postcss.config.js

@ -0,0 +1,6 @@
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

25
styles/globals.css

@ -1,16 +1,27 @@
html,
body {
padding: 0;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
padding: 0;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
}
@media (prefers-color-scheme: dark) {
html,
body {
@apply bg-dark-primary;
}
}
a {
color: inherit;
text-decoration: none;
color: inherit;
text-decoration: none;
}
* {
box-sizing: border-box;
box-sizing: border-box;
}
@tailwind base;
@tailwind components;
@tailwind utilities;

17
tailwind.config.js

@ -0,0 +1,17 @@
module.exports = {
purge: [],
darkMode: 'media', // or 'media' or 'class'
theme: {
backgroundColor: (theme) => ({
...theme('colors'),
'dark-primary': '#0f0f0f',
'dark-secondary': '#1c1c1c',
'dark-tertiary': '#212121',
}),
extend: {},
},
variants: {
extend: {},
},
plugins: [],
};
Loading…
Cancel
Save