rehlert/bea-edit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

layout footer fix
Build and Push Docker Image / build (push) Successful in 41s
Details

Browse Source
This commit is contained in:
rehlert
2026-08-27 09:48:36 +02:00
parent 037050e1c1
commit 2b22fcb0e8
2 changed files with 72 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/+layout.svelte
+56 -49
View File
@@ -1,58 +1,65 @@
<script lang="ts"> <script lang="ts">
import './layout.css'; import './layout.css';
import favicon from '$lib/assets/favicon.svg'; import favicon from '$lib/assets/favicon.svg';
let {children} = $props(); let { children } = $props();
</script> </script>
<svelte:head> <svelte:head>
<link rel="icon" href={favicon}/> <link rel="icon" href={favicon} />
</svelte:head> </svelte:head>
<header style="height:72px" class="bg-white shadow grid place-content-center"> <div class="flex min-h-dvh flex-col">
<a href="/"> <header style="height:72px" class="grid shrink-0 place-content-center bg-white shadow">
<img height="33px" src="/logo.svg" alt="logo"/> <a href="/">
</a> <img height="33px" src="/logo.svg" alt="logo" />
</header> </a>
{@render children()} </header>
<footer class="flex flex-col justify-end gap-15 min-h-78.5 h-96 px-4 mt-8.75 text-white py-8.75" <div class="flex-1">
style="background-image: url('/footer.svg');background-position: top right; background-size: cover; background-repeat: no-repeat"> {@render children()}
<div class="w-full max-w-360 mx-auto"> </div>
<h2 class="hidden font-bold mb-4">Nominandum GmbH</h2>
<div class="flex flex-row flex-wrap gap-15 text-[14px] leading-5 mx-auto"> <footer
<div> class="mt-8.75 flex h-96 min-h-78.5 shrink-0 flex-col justify-end gap-15 px-4 py-8.75 text-white"
<a class="underline" href="/impressum">Impressum</a><br/> style="background-image: url('/footer.svg');background-position: top right; background-size: cover; background-repeat: no-repeat"
<a class="underline" href="/datenschutz">Datenschutzerklärung</a><br/> >
</div> <div class="mx-auto w-full max-w-360">
</div> <h2 class="mb-4 hidden font-bold">Nominandum GmbH</h2>
<div class="hidden flex-row flex-wrap gap-15 text-[14px] leading-5 mx-auto"> <div class="mx-auto flex flex-row flex-wrap gap-15 text-[14px] leading-5">
<div class="not-sm:hidden"> <div>
Holstenwall 1<br/> <a class="underline" href="/impressum">Impressum</a><br />
20355 Hamburg<br/> <a class="underline" href="/datenschutz">Datenschutzerklärung</a><br />
<br/> </div>
info[at]nom.legal </div>
</div>
<div class="not-sm:hidden"> <div class="mx-auto hidden flex-row flex-wrap gap-15 text-[14px] leading-5">
Geschäftsführer Andreas Damke <br/> <div class="not-sm:hidden">
AG Hamburg <br/> Holstenwall 1<br />
HRB 161778<br/> 20355 Hamburg<br />
UstId. DE321802543 <br />
</div> info[at]nom.legal
<div> </div>
<a class="underline" href="/impressum">Impressum</a><br/> <div class="not-sm:hidden">
<a class="underline" href="/datenschutz">Datenschutzerklärung</a><br/> Geschäftsführer Andreas Damke <br />
<a class="underline" href="">Nutzungsbedingungen</a><br/> AG Hamburg <br />
</div> HRB 161778<br />
<div class="grow"> UstId. DE321802543
<a class="underline" href="">Instagram</a><br/> </div>
<a class="underline" href="">LinkedIn</a><br/> <div>
</div> <a class="underline" href="/impressum">Impressum</a><br />
<div class="self-end text-gray-400"> <a class="underline" href="/datenschutz">Datenschutzerklärung</a><br />
&copy; 2018-{new Date().getFullYear()} all rights reserved.<br/> <a class="underline" href="">Nutzungsbedingungen</a><br />
Nominandum is a protected trademark. </div>
</div> <div class="grow">
</div> <a class="underline" href="">Instagram</a><br />
</div> <a class="underline" href="">LinkedIn</a><br />
</footer> </div>
<div class="self-end text-gray-400">
&copy; 2018-{new Date().getFullYear()} all rights reserved.<br />
Nominandum is a protected trademark.
</div>
</div>
</div>
</footer>
</div>
tests/e2e/toolbox.spec.ts
+16
View File
@@ -97,6 +97,22 @@ test('start page exposes only working tools and forwards a dropped ZIP to beA',
expect(pageErrors).toEqual([]); expect(pageErrors).toEqual([]);
}); });
test('short tool pages keep the footer flush with the viewport bottom', async ({ page }) => {
const expectFooterAtViewportBottom = async (viewport: { width: number; height: number }) => {
await page.setViewportSize(viewport);
await page.goto('/tools/watermark');
const footerBottom = await page.locator('footer').evaluate((footer) => {
return footer.getBoundingClientRect().bottom;
});
expect(Math.abs(footerBottom - viewport.height)).toBeLessThanOrEqual(1);
};
await expectFooterAtViewportBottom({ width: 1440, height: 900 });
await expectFooterAtViewportBottom({ width: 390, height: 844 });
});
test('merge accepts dropped PDFs and downloads a merged PDF', async ({ page }) => { test('merge accepts dropped PDFs and downloads a merged PDF', async ({ page }) => {
const pageErrors = trackPageErrors(page); const pageErrors = trackPageErrors(page);
await page.goto('/tools/merge'); await page.goto('/tools/merge');