Dominik
/
kurwafolio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

a

This commit is contained in:
Dominik Strangas 2023-11-04 20:06:08 +01:00
parent 596bf7e9f5
commit 48f8c7f226
4 changed files with 28 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Navigation.tsx
View File

@ -2,7 +2,11 @@ import { Show, createSignal } from "solid-js";
const [mobileNav, showMobileNav] = createSignal(false); const [mobileNav, showMobileNav] = createSignal(false);
const setShowMobileNav = (val: boolean) => showMobileNav(val); const setShowMobileNav = () => {
console.log("herre");
showMobileNav(!mobileNav())
};
export const Navigation = () => { export const Navigation = () => {
return ( return (
@ -11,7 +15,7 @@ export const Navigation = () => {
<Show when={mobileNav()}> <Show when={mobileNav()}>
<div class={`fixed transition-all z-30 h-screen w-screen bg-zinc-900 flex flex-col`}> <div class={`fixed transition-all z-30 h-screen w-screen bg-zinc-900 flex flex-col`}>
<div class="w-screen border-b-2 border-b-zinc-50 h-14 bg-zinc-900 flex items-center"> <div class="w-screen border-b-2 border-b-zinc-50 h-14 bg-zinc-900 flex items-center">
<button class="h-full w-auto aspect-square hover:bg-zinc-700" onclick={() => showMobileNav(false)}> <button class="h-full w-auto aspect-square hover:bg-zinc-700" onclick={() => setShowMobileNav()}>
<img class="ml-4 h-5 w-5" src="/img/x.svg" alt="" /> <img class="ml-4 h-5 w-5" src="/img/x.svg" alt="" />
</button> </button>
</div> </div>
@ -38,7 +42,7 @@ export const Navigation = () => {
</div> </div>
</Show> </Show>
<nav class="md:hidden h-14 w-screen bg-emerald-500 flex items-center"> <nav class="md:hidden h-14 w-screen bg-emerald-500 flex items-center">
<button onclick={() => setShowMobileNav(true)}> <button onclick={() => setShowMobileNav()}>
<img class="ml-4" src="/img/menu.svg" alt="" /> <img class="ml-4" src="/img/menu.svg" alt="" />
</button> </button>
</nav> </nav>

17
src/layouts/PageLayout.astro Normal file
View File

@ -0,0 +1,17 @@
---
import {Navigation} from '../components/Navigation'
import Footer from '../views/Footer.astro';
---
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<Navigation />
<article>
<slot />
</article>
<Footer />
</body>
</html>

1
src/pages/impress.astro
View File

@ -22,7 +22,6 @@ const encryptedPhoneNumber = btoa("+49 176 6400 1756");
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Dominik - FullStackDev</title> <title>Dominik - FullStackDev</title>
</head> </head>
<body class="bg-zinc-900 text-zinc-100"> <body class="bg-zinc-900 text-zinc-100">

9
src/pages/products.astro
View File

@ -1,20 +1,19 @@
--- ---
import { Navigation } from "../components/Navigation"; import { Navigation } from "../components/Navigation";
import Footer from "../views/Footer.astro"; import Footer from "../views/Footer.astro";
import PageLayout from '../layouts/PageLayout.astro'
--- ---
<Navigation /> <PageLayout>
<div class="h-screen w-screen flex flex-col"> <div class="h-screen w-screen flex flex-col">
<div class="flex-1 w-screen bg-zinc-900 flex justify-center items-center py-8 px-12"> <div class="flex-1 w-screen bg-zinc-900 flex justify-center items-center py-8 px-12">
<div class="grid grid-cols-1 2xl:grid-cols-2 grid-rows-3 xl:w-1/2 h-full gap-7"> <div class="grid grid-cols-1 2xl:grid-cols-2 grid-rows-3 xl:w-1/2 h-full gap-7">
<div <div
class="col-span-1 2xl:row-span-2 bg-yellow-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between" class="col-span-1 2xl:row-span-2 bg-yellow-300 rounded-2xl transition hover:scale-[1.02] p-6 duration-300 flex flex-col justify-between"
> >
<a target="_blank" class="group" href="https://github.com/ZktSn0w/ColrJS"> <p class="text-2xl font-bold font-mono text-zinc-800 transition">
<p class="text-2xl underline font-bold font-mono group-hover:text-emerald-500 text-emerald-800 transition">
Web-Entwicklung Web-Entwicklung
</p> </p>
</a>
<div class="flex flex-col gap-4 max-xl:hidden"> <div class="flex flex-col gap-4 max-xl:hidden">
<p class="font-mono text-lg break-words"> <p class="font-mono text-lg break-words">
Als Webentwickler nutze ich moderne Frameworks, um erstklassige Websites mit einem herausragenden Als Webentwickler nutze ich moderne Frameworks, um erstklassige Websites mit einem herausragenden
@ -67,5 +66,5 @@ import Footer from "../views/Footer.astro";
</div> </div>
</div> </div>
</div> </div>
<Footer />
</div> </div>
</PageLayout>