ChronoCraft/zoe-shaldon
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(ui): enhance Countdown and layout components

Browse Source 
* Improve Countdown component styling and structure
* Update layout to include responsive menu and background pattern
* Adjust PhotoBackground and page styles for better presentation
* Add damask pattern SVG for background use
This commit is contained in:
warkanum
2026-08-11 23:58:28 +02:00
parent 39f5b8d5cc
commit 143161c234
8 changed files with 262 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/src/routes/photos/+page.svelte
+14 -14
View File
@@ -65,7 +65,7 @@
{#if !isOpen}
<div class="flex flex-col items-center gap-6 text-center">
<h1 class="font-serif text-4xl">Photo uploads open on the wedding day</h1>
<p class="text-surface-600-400 text-lg">Come back on {formatFullDate(wedding.date)} to share your photos with Zoé &amp; Shaldon.</p>
<p class="text-surface-600-400 text-2xl">Come back on {formatFullDate(wedding.date)} to share your photos with Zoé &amp; Shaldon.</p>
</div>
{:else if status === 'done'}
<div class="preset-filled-primary-500 rounded-base max-w-md p-4 text-center">
@@ -74,36 +74,36 @@
{:else}
<div class="w-full max-w-md">
<h1 class="font-serif text-4xl">Share your photos</h1>
<p class="text-surface-600-400 mt-2 mb-8 text-lg">
<p class="text-surface-600-400 mt-2 mb-8 text-2xl">
Upload photos from the day — up to {MAX_FILES} at a time, {MAX_SIZE_MB}MB each.
</p>
<form class="flex flex-col gap-4" onsubmit={onSubmit}>
<label class="label">
<span class="label-text">Name *</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700" type="text" required bind:value={name} disabled={status === 'submitting'} />
<span class="label-text text-2xl">Name *</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700 text-2xl" type="text" required bind:value={name} disabled={status === 'submitting'} />
</label>
<label class="label">
<span class="label-text">Message to the couple (optional)</span>
<textarea class="textarea border border-surface-300 focus:border-primary-500 dark:border-surface-700" rows="3" bind:value={message} disabled={status === 'submitting'}
<span class="label-text text-2xl">Message to the couple (optional)</span>
<textarea class="textarea border border-surface-300 focus:border-primary-500 dark:border-surface-700 text-2xl" rows="3" bind:value={message} disabled={status === 'submitting'}
></textarea>
</label>
<label class="label">
<span class="label-text">Email (optional)</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700" type="email" bind:value={email} disabled={status === 'submitting'} />
<span class="label-text text-2xl">Email (optional)</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700 text-2xl" type="email" bind:value={email} disabled={status === 'submitting'} />
</label>
<label class="label">
<span class="label-text">Phone (optional)</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700" type="tel" bind:value={phone} disabled={status === 'submitting'} />
<span class="label-text text-2xl">Phone (optional)</span>
<input class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700 text-2xl" type="tel" bind:value={phone} disabled={status === 'submitting'} />
</label>
<label class="label">
<span class="label-text">Photos *</span>
<span class="label-text text-2xl">Photos *</span>
<input
class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700"
class="input border border-surface-300 focus:border-primary-500 dark:border-surface-700 text-2xl"
type="file"
accept="image/*"
multiple
@@ -114,10 +114,10 @@
</label>
{#if status === 'error'}
<p class="text-error-500 text-base">{errorMessage}</p>
<p class="text-error-500 text-2xl">{errorMessage}</p>
{/if}
<button class="btn preset-filled-secondary-500 mt-2" type="submit" disabled={status === 'submitting'}>
<button class="btn preset-filled-secondary-500 mt-2 text-2xl" type="submit" disabled={status === 'submitting'}>
{status === 'submitting' ? 'Uploading…' : 'Upload photos'}
</button>
</form>