feat: redesign homepage, add global footer, fix carousel font

Homepage: restored original v0 design, replaced lorem ipsum with real service descriptions, added BusinessHours (Opening Hours) section, alternating bg-gray-50 section backgrounds. Layout: added global sticky footer (hidden on /admin/schedule, /account, and ?format=pdf pages), wrapped content in min-h-screen flex layout. PortfolioCarousel: set heading to Playfair Display.
This commit is contained in:
2026-08-22 00:34:49 +01:00
parent 51d29e6bd4
commit f6caaab8a3
3 changed files with 52 additions and 43 deletions
+32 -17
View File
@@ -6,9 +6,16 @@
import { toast } from 'svelte-sonner';
import { authStore } from '$lib/stores/auth.svelte';
import { onMount } from 'svelte';
import { page } from '$app/stores';
const { children } = $props();
let hideFooter = $derived(
$page.url.pathname === '/admin/schedule' ||
$page.url.pathname === '/account' ||
$page.url.searchParams.get('format') === 'pdf'
);
// Default to 'top-center' (mobile-first approach)
let toasterPosition = $state<'top-center' | 'bottom-center'>('top-center');
@@ -59,25 +66,33 @@
/>
</svelte:head>
<NavBar />
<Toaster position={toasterPosition} />
<div class="flex min-h-screen flex-col">
<NavBar />
<Toaster position={toasterPosition} />
<main class="pt-16">
{#if authStore.currentUser?.role === 'unverified_email'}
<div class="w-full bg-red-600 py-2 pr-8 pl-8 text-center text-sm font-medium text-white">
Please verify your email address to continue. Didn't recieve the email? Check your spam
folder, or <button
type="button"
onclick={verify_email}
class="cursor-pointer border-0 bg-transparent p-0 text-white underline"
>
click here
</button>
to resend it.
</div>
<main class="flex-1 pt-16">
{#if authStore.currentUser?.role === 'unverified_email'}
<div class="w-full bg-red-600 py-2 pr-8 pl-8 text-center text-sm font-medium text-white">
Please verify your email address to continue. Didn't recieve the email? Check your spam
folder, or <button
type="button"
onclick={verify_email}
class="cursor-pointer border-0 bg-transparent p-0 text-white underline"
>
click here
</button>
to resend it.
</div>
{/if}
{@render children?.()}
</main>
{#if !hideFooter}
<footer class="border-t py-3 text-center text-xs text-gray-500 md:py-4 md:text-sm">
&copy; {new Date().getFullYear()} Crussell Nails. All rights reserved.
</footer>
{/if}
{@render children?.()}
</main>
</div>
<style>
@media print {