feat: add a base layout for base HTML
This commit is contained in:
21
src/layouts/BaseLayout.astro
Normal file
21
src/layouts/BaseLayout.astro
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
---
|
||||||
|
import "../styles/global.css";
|
||||||
|
const { title } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="de">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
|
<meta name="color-scheme" content="light dark" />
|
||||||
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
<title>{title}</title>
|
||||||
|
</head>
|
||||||
|
<body
|
||||||
|
class="flex min-h-screen flex-col justify-center p-6 sm:px-14 md:px-24 lg:px-32"
|
||||||
|
>
|
||||||
|
<slot />
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -8,91 +8,78 @@ import KeyoxideLogo from "../images/Keyoxide.svg";
|
|||||||
import LinkedInLogo from "../images/LinkedIn.svg";
|
import LinkedInLogo from "../images/LinkedIn.svg";
|
||||||
import MatrixLogo from "../images/Matrix-logo.svg";
|
import MatrixLogo from "../images/Matrix-logo.svg";
|
||||||
import portrait from "../images/portrait.jpg";
|
import portrait from "../images/portrait.jpg";
|
||||||
import "../styles/global.css";
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||||
---
|
---
|
||||||
|
|
||||||
<!doctype html>
|
<BaseLayout>
|
||||||
<html lang="de">
|
<main>
|
||||||
<head>
|
<article class="flex flex-col items-center gap-10">
|
||||||
<meta charset="utf-8" />
|
<Image
|
||||||
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
alt="Portrait von Kai Moschcau"
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
class="rounded-full"
|
||||||
<meta name="color-scheme" content="light dark" />
|
priority
|
||||||
<meta name="generator" content={Astro.generator} />
|
src={portrait}
|
||||||
<title>kmoschcau.de</title>
|
width={200}
|
||||||
</head>
|
height={200}
|
||||||
<body
|
/>
|
||||||
class="flex min-h-screen flex-col justify-center p-6 sm:px-14 md:px-24 lg:px-32"
|
<h1>Kai Moschcau</h1>
|
||||||
>
|
<section class="text-soft">
|
||||||
<main>
|
<p>Fachinformatiker für Anwendungsentwicklung</p>
|
||||||
<article class="flex flex-col items-center gap-10">
|
</section>
|
||||||
<Image
|
<nav>
|
||||||
alt="Portrait von Kai Moschcau"
|
<ul class="flex flex-col gap-2">
|
||||||
class="rounded-full"
|
<li>
|
||||||
priority
|
<ExternalLink
|
||||||
src={portrait}
|
cssClass="link-matrix"
|
||||||
width={200}
|
href="https://matrix.to/#/@kmoschcau:matrix.org"
|
||||||
height={200}
|
title="Mein Matrix-Konto"
|
||||||
/>
|
>
|
||||||
<h1>Kai Moschcau</h1>
|
<InlineSvg SvgComponent={MatrixLogo} slot="logo" />
|
||||||
<section class="text-soft">
|
<span>@kmoschcau:matrix.org</span>
|
||||||
<p>Fachinformatiker für Anwendungsentwicklung</p>
|
</ExternalLink>
|
||||||
</section>
|
</li>
|
||||||
<nav>
|
<li>
|
||||||
<ul class="flex flex-col gap-2">
|
<ExternalLink
|
||||||
<li>
|
cssClass="link-github"
|
||||||
<ExternalLink
|
href="https://github.com/kmoschcau/"
|
||||||
cssClass="link-matrix"
|
title="Mein GitHub-Konto"
|
||||||
href="https://matrix.to/#/@kmoschcau:matrix.org"
|
>
|
||||||
title="Mein Matrix-Konto"
|
<InlineSvg SvgComponent={GitHubLogo} slot="logo" />
|
||||||
>
|
<span>kmoschcau</span>
|
||||||
<InlineSvg SvgComponent={MatrixLogo} slot="logo" />
|
</ExternalLink>
|
||||||
<span>@kmoschcau:matrix.org</span>
|
</li>
|
||||||
</ExternalLink>
|
<li>
|
||||||
</li>
|
<ExternalLink
|
||||||
<li>
|
cssClass="link-gitlab"
|
||||||
<ExternalLink
|
href="https://gitlab.com/kmoschcau"
|
||||||
cssClass="link-github"
|
title="Mein GitLab-Konto"
|
||||||
href="https://github.com/kmoschcau/"
|
>
|
||||||
title="Mein GitHub-Konto"
|
<InlineSvg SvgComponent={GitLabLogo} slot="logo" />
|
||||||
>
|
<span>kmoschcau</span>
|
||||||
<InlineSvg SvgComponent={GitHubLogo} slot="logo" />
|
</ExternalLink>
|
||||||
<span>kmoschcau</span>
|
</li>
|
||||||
</ExternalLink>
|
<li>
|
||||||
</li>
|
<ExternalLink
|
||||||
<li>
|
cssClass="link-linked-in"
|
||||||
<ExternalLink
|
href="https://www.linkedin.com/in/kmoschcau/"
|
||||||
cssClass="link-gitlab"
|
title="Mein LinkedIn-Konto"
|
||||||
href="https://gitlab.com/kmoschcau"
|
>
|
||||||
title="Mein GitLab-Konto"
|
<InlineSvg SvgComponent={LinkedInLogo} slot="logo" />
|
||||||
>
|
<span>kmoschcau</span>
|
||||||
<InlineSvg SvgComponent={GitLabLogo} slot="logo" />
|
</ExternalLink>
|
||||||
<span>kmoschcau</span>
|
</li>
|
||||||
</ExternalLink>
|
<li>
|
||||||
</li>
|
<ExternalLink
|
||||||
<li>
|
cssClass="link-keyoxide"
|
||||||
<ExternalLink
|
href="https://keyoxide.org/8CE00E9495B5030DA9217208DF16F424177090BB"
|
||||||
cssClass="link-linked-in"
|
title="Mein Keyoxide-Eintrag"
|
||||||
href="https://www.linkedin.com/in/kmoschcau/"
|
>
|
||||||
title="Mein LinkedIn-Konto"
|
<InlineSvg SvgComponent={KeyoxideLogo} slot="logo" />
|
||||||
>
|
<span>Keyoxide</span>
|
||||||
<InlineSvg SvgComponent={LinkedInLogo} slot="logo" />
|
</ExternalLink>
|
||||||
<span>kmoschcau</span>
|
</li>
|
||||||
</ExternalLink>
|
</ul>
|
||||||
</li>
|
</nav>
|
||||||
<li>
|
</article>
|
||||||
<ExternalLink
|
</main>
|
||||||
cssClass="link-keyoxide"
|
</BaseLayout>
|
||||||
href="https://keyoxide.org/8CE00E9495B5030DA9217208DF16F424177090BB"
|
|
||||||
title="Mein Keyoxide-Eintrag"
|
|
||||||
>
|
|
||||||
<InlineSvg SvgComponent={KeyoxideLogo} slot="logo" />
|
|
||||||
<span>Keyoxide</span>
|
|
||||||
</ExternalLink>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
</article>
|
|
||||||
</main>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|||||||
7
src/pages/skills.astro
Normal file
7
src/pages/skills.astro
Normal file
@@ -0,0 +1,7 @@
|
|||||||
|
---
|
||||||
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||||
|
---
|
||||||
|
|
||||||
|
<BaseLayout>
|
||||||
|
<p>Skills</p>
|
||||||
|
</BaseLayout>
|
||||||
Reference in New Issue
Block a user