Added volunteer signup.

frontend/src/pages/Settings.svelte

@@ -16,6 +16,10 @@
   let smtpFromName = $state('')
   let baseURL = $state('')
   let testEmail = $state('')
+  let noteLabel = $state('Additional note')
+  let noteRequired = $state(false)
+  let shiftSignupsOpen = $state(false)
+  let togglingSignups = $state(false)
 
   onMount(async () => {
     try {
@@ -27,6 +31,9 @@
       smtpFrom = s.smtp_from ?? ''
       smtpFromName = s.smtp_from_name ?? ''
       baseURL = s.base_url ?? ''
+      noteLabel = s.volunteer_note_label ?? 'Additional note'
+      noteRequired = s.volunteer_note_required ?? false
+      shiftSignupsOpen = s.shift_signups_open ?? false
     } catch (err) {
       error = err.message
     } finally {
@@ -48,6 +55,8 @@
         smtp_from: smtpFrom,
         smtp_from_name: smtpFromName,
         base_url: baseURL,
+        volunteer_note_label: noteLabel,
+        volunteer_note_required: noteRequired,
       })
       smtpPassword = ''
       success = 'Settings saved.'
@@ -58,6 +67,23 @@
     }
   }
 
+  async function toggleSignups() {
+    const opening = !shiftSignupsOpen
+    if (opening && !confirm('This will email all confirmed volunteers their shift signup links. Continue?')) return
+    togglingSignups = true
+    error = ''
+    success = ''
+    try {
+      const result = await api.settings.toggleShiftSignups(opening)
+      shiftSignupsOpen = result.shift_signups_open
+      success = opening ? 'Shift signups opened. Emails are being sent.' : 'Shift signups closed.'
+    } catch (err) {
+      error = err.message
+    } finally {
+      togglingSignups = false
+    }
+  }
+
   async function sendTest() {
     if (!testEmail) return
     testing = true
@@ -135,7 +161,7 @@
     </form>
 
     <!-- Test email -->
-    <div class="card">
+    <div class="card" style="margin-bottom:1.5rem">
       <h2 style="font-size:0.95rem;font-weight:700;margin-bottom:1rem">Test Email</h2>
       <div style="display:flex;gap:0.5rem;align-items:flex-end">
         <div class="form-group" style="flex:1;margin-bottom:0">
@@ -147,5 +173,44 @@
         </button>
       </div>
     </div>
+
+    <!-- Volunteer Signup -->
+    <div class="card" style="margin-bottom:1.5rem">
+      <h2 style="font-size:0.95rem;font-weight:700;margin-bottom:1rem">Volunteer Signup</h2>
+      <div class="form-group">
+        <label for="s-note-label">Note Field Label</label>
+        <input id="s-note-label" bind:value={noteLabel} placeholder="Additional note" />
+      </div>
+      <label style="display:flex;align-items:center;gap:0.5rem;font-size:0.875rem;cursor:pointer">
+        <input type="checkbox" bind:checked={noteRequired} />
+        Note field is required
+      </label>
+      <p class="text-muted" style="font-size:0.78rem;margin-top:0.75rem">
+        Signup form: <a href="/#/volunteer-signup" target="_blank" style="color:var(--c-accent)">/#/volunteer-signup</a>
+      </p>
+    </div>
+
+    <!-- Shift Signups -->
+    <div class="card">
+      <h2 style="font-size:0.95rem;font-weight:700;margin-bottom:1rem">Shift Signups</h2>
+      <div style="display:flex;align-items:center;gap:1rem">
+        <span style="font-size:0.875rem">
+          Status: <strong>{shiftSignupsOpen ? 'Open' : 'Closed'}</strong>
+        </span>
+        <button class="btn {shiftSignupsOpen ? 'btn-ghost' : 'btn-primary'}"
+          onclick={toggleSignups} disabled={togglingSignups}>
+          {#if togglingSignups}
+            Working…
+          {:else}
+            {shiftSignupsOpen ? 'Close Signups' : 'Open Signups'}
+          {/if}
+        </button>
+      </div>
+      {#if !shiftSignupsOpen}
+        <p class="text-muted" style="font-size:0.78rem;margin-top:0.75rem">
+          Opening signups will email all confirmed volunteers their shift signup links.
+        </p>
+      {/if}
+    </div>
   {/if}
 </div>