nvrl/narlblog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

improved mobile layout

Browse Source
This commit is contained in:
Nils Pukropp
2026-03-25 14:31:52 +01:00
parent da0c3b5b67
commit 52e11a422c
2 changed files with 26 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/layouts/Layout.astro
View File

@@ -42,26 +42,26 @@ try {
<body class={`bg-base text-text selection:bg-surface2 selection:text-text ${siteConfig.theme}`}>
<div class="fixed inset-0 z-[-1] bg-[radial-gradient(ellipse_at_top,_var(--tw-gradient-stops))] from-surface0 via-base to-base"></div>
<nav class="max-w-6xl mx-auto px-6 py-8">
<header class="glass px-6 py-4 flex items-center justify-between">
<nav class="max-w-6xl mx-auto px-4 md:px-6 py-4 md:py-8">
<header class="glass px-4 py-3 md:px-6 md:py-4 flex items-center justify-between">
<div>
<a href="/" class="text-2xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-mauve to-blue block">
<a href="/" class="text-xl md:text-2xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-mauve to-blue block">
{siteConfig.title}
</a>
<p class="text-[10px] text-subtext0 uppercase tracking-widest">{siteConfig.subtitle}</p>
<p class="text-[8px] md:text-[10px] text-subtext0 uppercase tracking-widest">{siteConfig.subtitle}</p>
</div>
<div class="flex gap-4 items-center">
<div class="flex gap-3 md:gap-4 items-center text-sm md:text-base">
<a href="/" class="text-subtext0 hover:text-text transition-colors">Home</a>
<a href="/admin" class="text-subtext0 hover:text-mauve transition-colors">Admin</a>
</div>
</header>
</nav>
<main class="max-w-6xl mx-auto px-6 py-8">
<main class="max-w-6xl mx-auto px-4 md:px-6 py-4 md:py-8">
<slot />
</main>
<footer class="max-w-6xl mx-auto px-6 py-12 text-center text-sm text-subtext1 border-t border-white/5 mt-12">
<footer class="max-w-6xl mx-auto px-4 md:px-6 py-8 md:py-12 text-center text-xs md:text-sm text-subtext1 border-t border-white/5 mt-8 md:mt-12">
<p class="mb-2">{siteConfig.footer}</p>
<div class="text-subtext0 opacity-50">
&copy; {new Date().getFullYear()} {siteConfig.title}