feat(header): Versionsnummer unter dem Logo
Some checks failed
Build & Publish Docker Image / build-and-push (push) Has been cancelled
Some checks failed
Build & Publish Docker Image / build-and-push (push) Has been cancelled
Liest KOCHWAS_TAG via +layout.server.ts aus $env/dynamic/private und zeigt den Tag als kleine graue Zeile unter dem Brand-Text auf der Startseite. Fallback "dev" wenn nicht gesetzt. Auf engen Screens mit ausgeblendetem Brand verschwindet auch die Version. docker-compose.prod.yml reicht die Host-Env-Variable jetzt in den Container durch (vorher nur fuers Image-Tag-Binding interpoliert).
This commit is contained in:
8
src/routes/+layout.server.ts
Normal file
8
src/routes/+layout.server.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
import type { LayoutServerLoad } from './$types';
|
||||
import { env } from '$env/dynamic/private';
|
||||
|
||||
export const load: LayoutServerLoad = () => {
|
||||
return {
|
||||
version: env.KOCHWAS_TAG ?? 'dev'
|
||||
};
|
||||
};
|
||||
@@ -19,7 +19,7 @@
|
||||
import { registerServiceWorker } from '$lib/client/sw-register';
|
||||
import { SearchStore } from '$lib/client/search.svelte';
|
||||
|
||||
let { children } = $props();
|
||||
let { data, children } = $props();
|
||||
|
||||
const navStore = new SearchStore({
|
||||
pageSize: 30,
|
||||
@@ -115,7 +115,10 @@
|
||||
<header class="bar">
|
||||
<div class="bar-inner">
|
||||
{#if $page.url.pathname === '/'}
|
||||
<a href="/" class="brand">Kochwas</a>
|
||||
<div class="brand-stack">
|
||||
<a href="/" class="brand">Kochwas</a>
|
||||
<span class="version" title="Deployment-Tag">{data.version}</span>
|
||||
</div>
|
||||
{:else}
|
||||
<a href="/" class="home-back" aria-label="Zurück zur Startseite">
|
||||
<ArrowLeft size={22} strokeWidth={2} />
|
||||
@@ -307,6 +310,13 @@
|
||||
padding: 0.6rem 1rem;
|
||||
position: relative;
|
||||
}
|
||||
.brand-stack {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
line-height: 1;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.brand {
|
||||
font-size: 1.15rem;
|
||||
font-weight: 700;
|
||||
@@ -314,6 +324,13 @@
|
||||
color: #2b6a3d;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.version {
|
||||
margin-top: 2px;
|
||||
font-size: 0.65rem;
|
||||
color: #9aa8a0;
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
.home-back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -544,7 +561,7 @@
|
||||
}
|
||||
@media (max-width: 520px) {
|
||||
/* App-Icon auf engen Screens komplett aus — die Suche bekommt den Platz. */
|
||||
.brand {
|
||||
.brand-stack {
|
||||
display: none;
|
||||
}
|
||||
.nav-link {
|
||||
|
||||
Reference in New Issue
Block a user