looks good so far

This commit is contained in:
2025-11-05 04:28:29 +01:00
parent 10c9102ac5
commit 779f3e14c3
17 changed files with 299 additions and 11 deletions

View File

@@ -0,0 +1,22 @@
<footer class="relative py-6 mt-6">
<div class="absolute backdrop-blur-xs bottom-0 h-full w-screen left-[50%] right-[50%] ml-[-50vw] mr-[-50vw] -z-1"></div>
<div class="container mx-auto px-4 flex flex-col md:flex-row justify-between items-center opacity-80">
<div class="mb-4 md:mb-0">
<h1 class="text-xl font-serif font-bold">{{ .Site.Title }}</h1>
</div>
<div class="flex flex-col md:flex-row space-y-2 md:space-y-0 md:space-x-6 mb-4 md:mb-0 text-center">
{{ $footerMenu := .Site.Data.footer.links }}
{{ range $footerMenu }}
<a href="{{ .url }}" {{ if strings.HasPrefix .url "http" }}target="_blank"{{ end }} class="hover:drop-shadow-pink-400 hover:drop-shadow-[0_0_6px]">
{{ .name | safeHTML }}
</a>
{{ end }}
</div>
</div>
<div class="text-center mt-4 opacity-50">
&copy; {{ now.Format "2006" }} {{ .Site.Title }}. All rights reserved.
</div>
</div>
</footer>

View File

@@ -2,15 +2,33 @@
<header class="fixed inset-x-0 z-100">
<div
id="menu-blur"
class="absolute opacity-0 inset-x-0 top-0 h-full backdrop-blur-2xl shadow-2xl"
class="absolute opacity-100 inset-x-0 top-0 h-full backdrop-blur-2xl shadow-2xl"
role="presentation"
tab-index="-1"></div>
{{ with resources.Get "js/background-blur.js" }}
{{ with . | minify | fingerprint "sha256" }}
<script src="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" data-blur-id="menu-blur"></script>
{{ end }}
{{ end }}
<div
class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-25 lg:px-32">
<nav class="flex items-center py-6 pr-2 md:pr-4 pb-[3px] pl-0">
<a href="{{ "/" | relURL }}" class="text-base font-medium"
>{{ .Site.Title }}</a
>
<nav class="flex items-center py-6">
<a href="{{ "/" | relURL }}" class="text-base font-serif font-bold hover:drop-shadow-pink-400 hover:drop-shadow-[0_0_6px]">
{{ .Site.Title }}
</a>
</nav>
</div>
</header>
{{ with .Params.Image | default "/images/bg-landing.jpg" }}
<div class="fixed inset-0 top-0 -z-10 bg-black/60">
<img src="{{ . }}" class="w-full h-full object-cover -z-10" role="presentation">
<div class="absolute inset-0 h-full bg-linear-to-t to-transparent mix-blend-soft-light from-neutral-800"></div>
<div class="absolute inset-0 h-full bg-linear-to-t opacity-60 mix-blend-soft-light from-neutral-800 to-neutral-800"></div>
</div>
<div id="background-blur" class="fixed opacity-0 inset-x-0 top-0 h-full -z-10 backdrop-blur-2xl"></div>
{{ with resources.Get "js/background-blur.js" }}
{{ with . | minify | fingerprint "sha256" }}
<script src="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" data-blur-id="background-blur"></script>
{{ end }}
{{ end }}
{{ end }}

View File

@@ -0,0 +1 @@
<br/>

View File

@@ -14,12 +14,28 @@
{{ partial "head.html" . }}
</head>
<body
class="flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32 text-lg bg-white text-neutral-900 dark:bg-neutral-800 dark:text-white scrollbar-thin scrollbar-track-neutral-200 scrollbar-thumb-neutral-400 dark:scrollbar-track-neutral-800 dark:scrollbar-thumb-neutral-600">
class="flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32 text-lg bg-black text-white">
{{ partial "header.html" . }}
<main>
<main class="grow">
{{ block "main" . }}
{{ end }}
</main>
{{ partial "footer.html" . }}
{{ with resources.Get "js/registerLauti.js" }}
{{$opts := dict
"minify" (not hugo.IsDevelopment)
"sourceMap" (cond hugo.IsDevelopment "external" "")
"targetPath" "js/main.js"
}}
{{ with . | js.Build $opts }}
{{ if hugo.IsDevelopment }}
<script src="{{ .RelPermalink }}"></script>
{{ else }}
{{ with . | fingerprint }}
<script src="{{ .RelPermalink }}" integrity="{{ .Data.Integrity }}" crossorigin="anonymous"></script>
{{ end }}
{{ end }}
{{ end }}
{{ end }}
</body>
</html>

View File

@@ -1,3 +1,32 @@
{{ define "main" }}
<h1>{{ .Title }}</h1>
<!-- Text content -->
<article class="relative z-10 w-full">
<!-- Curved headline using SVG -->
<svg viewBox="25 0 450 300" class="mx-auto w-full drop-shadow-pink-400 drop-shadow-[0_0_6px]">
<defs>
<path id="curve" d="M 50 150 Q 250 10 450 150" />
</defs>
<text width="500">
<textPath href="#curve" startOffset="50%" text-anchor="middle"
class="fill-pink-200 text-4xl font-bold font-serif uppercase">
{{ .Title }}
</textPath>
</text>
<!-- Subtext -->
<text x="250" y="190" text-anchor="middle" class="fill-pink-200 text-3xl md:text-2xl font-bold font-serif">
{{ .Params.Subtitle }}
</text>
<text x="250" y="225" text-anchor="middle" class="fill-pink-200 text-3xl md:text-2xl font-bold font-serif">
{{ .Params.Location }}
</text>
</svg>
</article>
<article class="grid grid-cols-1 md:grid-cols-[1fr_300px] lg:grid-cols-[1fr_350px] gap-6">
<section class="prose lg:prose-xl prose-invert backdrop-blur-xs shadow-xl/20 p-6 rounded-lg">
{{ .Content }}
</section>
<lauti-calendar-list title="Nächste Bike Nights" group="2e2994eb-ae45-4297-a2f6-9f7948da784c" infos="name,location,time" link></lauti-calendar-list>
</article>
{{ end }}

6
layouts/single.html Normal file
View File

@@ -0,0 +1,6 @@
{{ define "main" }}
<section class="prose lg:prose-xl prose-invert backdrop-blur-xs shadow-xl/20 p-6 rounded-lg">
<h1>{{.Title}}</h1>
{{.Content}}
</section>
{{end}}