Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: Phase 1+2 — FA→Lucide, variant-* → preset-*, dark mode forms

Browse Source 
Phase 1 (global quick wins):
- app.css: add global dark mode utility for .input/.select/.textarea
- events menu nav + layout: replace all FontAwesome icons with Lucide
- events settings: replace FA icons, standardize variant-* → preset-*

Phase 2 (module-by-module migration):
- root +layout.svelte: fix hardcoded banner colors → preset-filled-error/warning
- journals entry list: replace slate-* with gray-*, HSL eye colors → CSS tokens
- pres mgmt presenter view: variant-soft-warning → preset-tonal-warning, FA edit → Lucide
- badges (4 files): variant-* → preset-*, FA spinner → Lucide Loader2, dynamic alert fix
- events session list + event hub: variant-soft/filled → preset-tonal/filled
- leads module (12 files): complete variant-* → preset-* migration across all
  exhibitor sign-in, QR scanner, manual search, tracking list, manage tab,
  custom questions, license list, exhibit page, lead detail page + form

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-03-16 11:53:07 -04:00
parent a79be722ae
commit 99df204763
25 changed files with 159 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/app.css
View File

@@ -137,6 +137,37 @@ html.light { color-scheme: light; }
}
}
/* ============================================================
* Global dark mode fix for Skeleton UI form elements.
*
* Skeleton v3 form classes (.input, .select, .textarea) do not
* include dark mode styles — browser renders them light even when
* html.dark is active, producing white text on white backgrounds.
*
* This eliminates the need for per-component <style> patches.
* Components that previously had local overrides for this can
* remove them and rely on this rule instead.
*
* Matches the gray-700 bg / gray-100 text palette used throughout
* the app for dark mode neutral surfaces.
* ============================================================ */
.dark .input:not([type='checkbox']):not([type='radio']):not([type='range']),
.dark .select,
.dark .textarea {
color: rgb(243 244 246); /* gray-100 */
background-color: rgb(55 65 81); /* gray-700 */
border-color: rgb(75 85 99); /* gray-600 */
}
.dark .input::placeholder,
.dark .textarea::placeholder {
color: rgb(156 163 175); /* gray-400 — legible at reduced opacity */
}
/* Option elements in dark selects — forces browser native dark chrome */
.dark .select option {
color: rgb(243 244 246);
background-color: rgb(55 65 81);
}
/* There are no more Tailwind layers. */
html,

10
src/routes/+layout.svelte
View File

@@ -291,18 +291,18 @@
</svelte:head>
{#if browser && (is_offline || api_unreachable)}
<div class="print:hidden fixed top-0 left-0 right-0 z-100 p-4 bg-orange-600/90 text-white text-center shadow-2xl flex items-center justify-center gap-4">
<div class="print:hidden fixed top-0 left-0 right-0 z-100 p-4 preset-filled-error-500 text-center shadow-2xl flex items-center justify-center gap-4">
<span class="text-xl font-bold">{is_offline ? 'Offline' : api_error_msg}</span>
<button class="btn btn-sm variant-filled-white text-orange-600" onclick={() => window.location.reload()}>Retry</button>
<button class="btn btn-sm preset-tonal-surface" onclick={() => window.location.reload()}>Retry</button>
</div>
{/if}
{#if browser && flag_expired}
<div class="print:hidden fixed top-0 left-0 right-0 z-50 px-4 py-2 bg-amber-500 text-white shadow-xl flex items-center justify-between gap-4">
<div class="print:hidden fixed top-0 left-0 right-0 z-50 px-4 py-2 preset-filled-warning-500 shadow-xl flex items-center justify-between gap-4">
<p class="text-sm font-semibold">Your session has expired. Please reload or sign in again.</p>
<div class="flex gap-2 items-center shrink-0">
<button class="btn btn-sm variant-filled-white text-amber-700" onclick={() => window.location.reload()}>Reload</button>
<button class="btn btn-sm" onclick={() => { flag_expired = false; ae_auth_error.set({ type: null, ts: null }); }}>✕</button>
<button class="btn btn-sm preset-tonal-surface" onclick={() => window.location.reload()}>Reload</button>
<button class="btn btn-sm preset-outlined-surface" onclick={() => { flag_expired = false; ae_auth_error.set({ type: null, ts: null }); }}>✕</button>
</div>
</div>
{/if}

12
src/routes/events/+layout.svelte
View File

@@ -14,7 +14,9 @@
House,
Library,
RefreshCw,
Satellite
Satellite,
ArrowUp,
ArrowDown
} from '@lucide/svelte';
// *** Import Aether specific variables and functions
@@ -171,7 +173,7 @@
}}
title="A new version of One Sky IT's Aether Events module is available. Click to reload the page and use the latest version."
>
<span class="fas fa-sync-alt fa-spin m-1"></span>
<RefreshCw size="1em" class="animate-spin shrink-0" aria-hidden="true" />
<span class="m-4 sm:mx-8 text-wrap">
New Events Module Version Available!<br />
Click to Reload<br />
@@ -179,7 +181,7 @@
You may need to sign in again.
</div>
</span>
<span class="fas fa-sync-alt fa-spin m-1"></span>
<RefreshCw size="1em" class="animate-spin shrink-0" aria-hidden="true" />
<!-- <span class="text-xs">
$events_loc.ver=${$events_loc?.ver}<br>
@@ -317,7 +319,7 @@
}}
title="Scroll to top"
>
<span class="fas fa-arrow-up"></span>
<ArrowUp size="1em" aria-hidden="true" />
Scroll to Top
</button>
@@ -346,7 +348,7 @@
}}
title="Scroll to bottom"
>
<span class="fas fa-arrow-down"></span>
<ArrowDown size="1em" aria-hidden="true" />
Scroll to Bottom
<!-- yTop={yTop} yScroll={yScroll} yHeight={yHeight} scroll_y={scroll_y} scrollTop={scroll_container().scrollTop} total={scroll_container().scrollTop + yHeight} -->
</button>

7
src/routes/events/[event_id]/(badges)/badges/ae_comp__badge_create_form.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
// import { createEventDispatcher } from 'svelte';
import { Loader2 } from '@lucide/svelte';
import type { key_val } from '$lib/stores/ae_stores';
import { events_func } from '$lib/ae_events_functions';
import { ae_api } from '$lib/stores/ae_stores';
@@ -126,16 +127,16 @@
<div class="flex justify-end gap-2">
<button
type="button"
class="btn variant-filled-tertiary"
class="btn preset-tonal-surface"
onclick={handle_cancel}>Cancel</button
>
<button
type="submit"
class="btn variant-filled-primary"
class="btn preset-filled-primary"
disabled={submit_status === 'loading'}
>
{#if submit_status === 'loading'}
<span class="fas fa-spinner fa-spin mr-2"></span>
<Loader2 size="1em" class="animate-spin" aria-hidden="true" />
{/if}
Create Badge
</button>

13
src/routes/events/[event_id]/(badges)/badges/ae_comp__badge_upload_form.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
// import { createEventDispatcher } from 'svelte';
import { Loader2 } from '@lucide/svelte';
import type { key_val } from '$lib/stores/ae_stores';
import { events_func } from '$lib/ae_events_functions';
import { ae_api } from '$lib/stores/ae_stores';
@@ -159,9 +160,9 @@
{#if upload_status !== 'idle'}
<div
class="alert variant-soft-{upload_status === 'error'
? 'error'
: 'info'}"
class="alert"
class:preset-tonal-error={upload_status === 'error'}
class:preset-tonal-surface={upload_status !== 'error'}
>
<p>{upload_message}</p>
{#if upload_status === 'processing' || upload_status === 'loading'}
@@ -180,20 +181,20 @@
<div class="flex justify-end gap-2">
<button
type="button"
class="btn variant-filled-tertiary"
class="btn preset-tonal-surface"
onclick={handle_cancel}
disabled={upload_status === 'loading' ||
upload_status === 'processing'}>Cancel</button
>
<button
type="submit"
class="btn variant-filled-primary"
class="btn preset-filled-primary"
disabled={!selected_file ||
upload_status === 'loading' ||
upload_status === 'processing'}
>
{#if upload_status === 'loading' || upload_status === 'processing'}
<span class="fas fa-spinner fa-spin mr-2"></span>
<Loader2 size="1em" class="animate-spin" aria-hidden="true" />
{/if}
Upload Badges
</button>

9
src/routes/events/[event_id]/(badges)/templates/+page.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import { liveQuery } from 'dexie';
import { Pencil, Trash2 } from '@lucide/svelte';
import { events_func } from '$lib/ae_events_functions';
import { ae_api } from '$lib/stores/ae_stores';
import { events_slct } from '$lib/stores/ae_events_stores';
@@ -103,23 +104,23 @@
<div>
<button
type="button"
class="btn btn-sm variant-filled-primary"
class="btn btn-sm preset-filled-primary"
onclick={() =>
edit_template(
template.event_badge_template_id
)}
>
<span class="fas fa-edit"></span> Edit
<Pencil size="1em" aria-hidden="true" /> Edit
</button>
<button
type="button"
class="btn btn-sm variant-filled-error ml-2"
class="btn btn-sm preset-filled-error ml-2"
onclick={() =>
delete_template(
template.event_badge_template_id
)}
>
<span class="fas fa-trash"></span> Delete
<Trash2 size="1em" aria-hidden="true" /> Delete
</button>
</div>
</li>

7
src/routes/events/[event_id]/(badges)/templates/ae_comp__badge_template_form.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import { untrack } from 'svelte';
import { Loader2 } from '@lucide/svelte';
import type { key_val } from '$lib/stores/ae_stores';
import { events_func } from '$lib/ae_events_functions';
import { ae_api } from '$lib/stores/ae_stores';
@@ -217,17 +218,17 @@
<div class="flex justify-end gap-2">
<button
type="button"
class="btn variant-filled-tertiary"
class="btn preset-tonal-surface"
onclick={handle_cancel}
disabled={submit_status === 'loading'}>Cancel</button
>
<button
type="submit"
class="btn variant-filled-primary"
class="btn preset-filled-primary"
disabled={submit_status === 'loading'}
>
{#if submit_status === 'loading'}
<span class="fas fa-spinner fa-spin mr-2"></span>
<Loader2 size="1em" class="animate-spin" aria-hidden="true" />
{/if}
{template_id ? 'Save Changes' : 'Create Template'}
</button>

12
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/+page.svelte
View File

@@ -398,7 +398,7 @@
<!-- Add Lead / Lead List Toggle -->
<button
type="button"
class="btn btn-sm variant-filled-primary font-bold shadow-sm px-2 sm:px-4"
class="btn btn-sm preset-filled-primary font-bold shadow-sm px-2 sm:px-4"
onclick={toggle_main_tab}
>
{#if active_tab === 'add'}
@@ -415,8 +415,8 @@
<button
type="button"
class="btn btn-sm transition-colors px-2 sm:px-3"
class:variant-filled-success={active_tab === 'payment'}
class:variant-ghost-success={active_tab !== 'payment'}
class:preset-filled-success={active_tab === 'payment'}
class:preset-outlined-success={active_tab !== 'payment'}
onclick={() => set_active_tab('payment')}
title="Payment & Upgrades"
>
@@ -428,8 +428,8 @@
<button
type="button"
class="btn btn-sm transition-colors px-2 sm:px-3"
class:variant-filled-surface={active_tab === 'manage'}
class:variant-ghost-surface={active_tab !== 'manage'}
class:preset-tonal-surface={active_tab === 'manage'}
class:preset-outlined-surface={active_tab !== 'manage'}
onclick={toggle_manage_tab}
title="Manage Exhibit"
>
@@ -459,7 +459,7 @@
<h2 class="text-xl sm:text-2xl font-bold">Lead List</h2>
<button
type="button"
class="btn btn-sm variant-ghost-secondary"
class="btn btn-sm preset-outlined-secondary"
onclick={handle_export}
>
<Download size="1.2em" class="mr-2" /> Export

12
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_custom_questions.svelte
View File

@@ -100,12 +100,12 @@
<div class="space-y-3">
{#each questions as q, i (i)}
<div class="card p-4 variant-soft border border-surface-500/10 space-y-3 animate-in fade-in slide-in-from-right-2">
<div class="card p-4 preset-tonal-surface border border-surface-500/10 space-y-3 animate-in fade-in slide-in-from-right-2">
<!-- Question header row: number + delete (always visible for mobile) -->
<div class="flex items-center justify-between">
<span class="text-[10px] uppercase font-black opacity-30 tracking-widest">Question {i + 1}</span>
<button
class="btn btn-sm variant-ghost-error px-2 py-1"
class="btn btn-sm preset-outlined-error px-2 py-1"
onclick={() => remove_question(i)}
title="Remove question"
>
@@ -133,7 +133,7 @@
<!-- Response Type -->
<div class="space-y-1">
<label class="text-[10px] uppercase font-bold opacity-40" for="custom-q-{i}-type">Response Type</label>
<select id="custom-q-{i}-type" bind:value={q.type} class="select variant-filled-surface text-xs p-1 rounded w-full">
<select id="custom-q-{i}-type" bind:value={q.type} class="select preset-tonal-surface text-xs p-1 rounded w-full">
<option value="text">Short Text</option>
<option value="textarea">Long Text</option>
<option value="toggle">Yes / No (Toggle)</option>
@@ -174,13 +174,13 @@
{/if}
<div class="flex gap-2 pt-2">
<button class="btn btn-sm variant-filled-secondary flex-1" onclick={add_question}>
<button class="btn btn-sm preset-filled-secondary flex-1" onclick={add_question}>
<Plus size="1.2em" class="mr-2" /> Add Question
</button>
<button
class="btn btn-sm flex-1 transition-all"
class:variant-filled-primary={is_dirty}
class:variant-ghost-surface={!is_dirty}
class:preset-filled-primary={is_dirty}
class:preset-outlined-surface={!is_dirty}
onclick={save_questions}
disabled={is_saving || !is_dirty}
>

6
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_license_list.svelte
View File

@@ -98,7 +98,7 @@
<div class="space-y-3">
{#each local_license_li as license, i (i)}
<div class="card p-4 variant-soft border border-surface-500/10 space-y-3 relative group animate-in fade-in slide-in-from-right-2">
<div class="card p-4 preset-tonal-surface border border-surface-500/10 space-y-3 relative group animate-in fade-in slide-in-from-right-2">
<button
class="absolute top-2 right-2 p-2 text-error-500 opacity-0 group-hover:opacity-100 transition-opacity"
onclick={() => remove_license(i)}
@@ -152,7 +152,7 @@
<div class="flex gap-2 pt-2">
<button
class="btn btn-sm variant-filled-secondary flex-1"
class="btn btn-sm preset-filled-secondary flex-1"
onclick={add_license}
disabled={local_license_li.length >= (license_max || 1)}
>
@@ -160,7 +160,7 @@
</button>
<button
class="btn btn-sm variant-filled-primary flex-1"
class="btn btn-sm preset-filled-primary flex-1"
onclick={save_licenses}
disabled={is_saving}
>

12
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_signin.svelte
View File

@@ -101,7 +101,7 @@
}
</script>
<div class="exhibit-signin card p-6 variant-filled-surface shadow-xl border border-surface-500/20 space-y-6">
<div class="exhibit-signin card p-6 preset-tonal-surface shadow-xl border border-surface-500/20 space-y-6">
<!-- Tab Toggle -->
<div class="flex p-1 bg-surface-500/10 rounded-xl">
@@ -132,7 +132,7 @@
<div class="space-y-2 animate-in fade-in slide-in-from-left-2">
<label class="label">
<span class="text-[10px] uppercase font-bold opacity-50 ml-1 tracking-widest">Booth Passcode</span>
<div class="input-group input-group-divider grid-cols-[auto_1fr] variant-soft rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group input-group-divider grid-cols-[auto_1fr] preset-tonal-surface rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group-shim"><Key size="1.2em" /></div>
<input
type="text"
@@ -148,7 +148,7 @@
<div class="space-y-4 animate-in fade-in slide-in-from-right-2">
<label class="label">
<span class="text-[10px] uppercase font-bold opacity-50 ml-1 tracking-widest">Email Address</span>
<div class="input-group input-group-divider grid-cols-[auto_1fr] variant-soft rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group input-group-divider grid-cols-[auto_1fr] preset-tonal-surface rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group-shim"><Mail size="1.2em" /></div>
<input
type="email"
@@ -161,7 +161,7 @@
<label class="label">
<span class="text-[10px] uppercase font-bold opacity-50 ml-1 tracking-widest">Personal Passcode</span>
<div class="input-group input-group-divider grid-cols-[auto_1fr] variant-soft rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group input-group-divider grid-cols-[auto_1fr] preset-tonal-surface rounded-xl overflow-hidden border border-surface-500/20">
<div class="input-group-shim"><Key size="1.2em" /></div>
<input
type="text"
@@ -176,7 +176,7 @@
{/if}
{#if status === 'error'}
<div class="p-3 rounded-lg variant-soft-error flex items-start gap-3 animate-shake">
<div class="p-3 rounded-lg preset-tonal-error flex items-start gap-3 animate-shake">
<CircleAlert size="1.2em" class="shrink-0 mt-0.5" />
<p class="text-xs font-bold leading-tight">{error_msg}</p>
</div>
@@ -184,7 +184,7 @@
<button
type="submit"
class="btn btn-lg variant-filled-primary w-full font-bold shadow-lg shadow-primary-500/20 group"
class="btn btn-lg preset-filled-primary w-full font-bold shadow-lg shadow-primary-500/20 group"
disabled={status === 'submitting'}
>
{#if status === 'submitting'}

8
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__exhibit_tracking_obj_li.svelte
View File

@@ -1,4 +1,6 @@
<script lang="ts">
import { Loader2 } from '@lucide/svelte';
interface Props {
lq__event_exhibit_tracking_obj_li: any;
log_lvl?: number;
@@ -64,10 +66,10 @@
<div class="ae_comp__exhibit_tracking_obj_li w-full px-2 sm:px-4">
{#if !lq__event_exhibit_tracking_obj_li}
<div class="flex justify-center p-10">
<span class="fas fa-spinner fa-spin fa-2x opacity-20"></span>
<Loader2 size="2rem" class="animate-spin opacity-20" aria-hidden="true" />
</div>
{:else if lq__event_exhibit_tracking_obj_li.length === 0}
<div class="card p-8 text-center variant-soft-surface">
<div class="card p-8 text-center preset-tonal-surface">
<p class="text-xl opacity-50">No leads found yet.</p>
<p class="text-sm opacity-50 mt-2">
Start scanning badges to collect leads!
@@ -85,7 +87,7 @@
{#each lq__event_exhibit_tracking_obj_li as event_tracking_obj (event_tracking_obj.event_exhibit_tracking_id)}
<a
href={`/events/${page.params.event_id}/leads/exhibit/${event_tracking_obj.event_exhibit_id}/lead/${event_tracking_obj.event_exhibit_tracking_id}`}
class="card card-hover p-4 variant-filled-surface border-l-4 border-primary-500 flex flex-col md:flex-row gap-4 items-start md:items-center"
class="card card-hover p-4 preset-tonal-surface border-l-4 border-primary-500 flex flex-col md:flex-row gap-4 items-start md:items-center"
>
<div class="flex-grow space-y-1">
<div class="flex items-center gap-2">

6
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__lead_manual_search.svelte
View File

@@ -142,7 +142,7 @@
{#each results as badge (badge.event_badge_id_random ?? badge.event_badge_id)}
{@const badge_id = badge.event_badge_id_random || badge.event_badge_id}
{@const existing_id = $existing_leads_map?.get(badge_id) ?? (last_added_badge_id === badge_id ? last_added_tracking_id : '')}
<div class="card p-3 flex justify-between items-center variant-soft shadow-sm">
<div class="card p-3 flex justify-between items-center preset-tonal-surface shadow-sm">
<div>
<div class="font-bold">{badge.full_name}</div>
<div class="text-xs opacity-70">{badge.affiliations || badge.email || ''}</div>
@@ -151,14 +151,14 @@
{#if existing_id}
<a
href={`/events/${page.params.event_id}/leads/exhibit/${exhibit_id}/lead/${existing_id}`}
class="btn btn-sm variant-filled-secondary"
class="btn btn-sm preset-filled-secondary"
>
<Eye size="1em" class="mr-1" />
View
</a>
{:else if add_error_id === badge_id}
<span class="text-xs text-error-500 font-bold">Add failed — retry?
<button type="button" class="btn btn-sm variant-ghost-error ml-1" onclick={() => add_as_lead(badge)}>
<button type="button" class="btn btn-sm preset-outlined-error ml-1" onclick={() => add_as_lead(badge)}>
Retry
</button>
</span>

12
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_comp__lead_qr_scanner.svelte
View File

@@ -140,7 +140,7 @@
<p class="text-center opacity-70 italic text-sm">Point camera at the badge QR code</p>
{:else if scanning_status === 'already_added'}
<div class="card p-6 w-full max-w-md space-y-4 variant-soft-secondary shadow-xl border-2 border-secondary-500 animate-in zoom-in">
<div class="card p-6 w-full max-w-md space-y-4 preset-tonal-secondary shadow-xl border-2 border-secondary-500 animate-in zoom-in">
<div class="text-center space-y-2">
<CheckCircle size="3em" class="mx-auto text-secondary-500" />
<h3 class="h3 font-bold">Already Captured</h3>
@@ -150,7 +150,7 @@
<a
href={`/events/${page.params.event_id}/leads/exhibit/${exhibit_id}/lead/${existing_tracking_id}`}
class="btn btn-xl w-full variant-filled-secondary font-bold py-6"
class="btn btn-xl w-full preset-filled-secondary font-bold py-6"
>
<Eye size="1.5em" class="mr-2" />
View Lead Details
@@ -166,7 +166,7 @@
</div>
{:else if scanning_status === 'found' || scanning_status === 'adding'}
<div class="card p-6 w-full max-w-md space-y-4 variant-soft-primary shadow-xl border-2 border-primary-500">
<div class="card p-6 w-full max-w-md space-y-4 preset-tonal-primary shadow-xl border-2 border-primary-500">
<div class="text-center">
<h3 class="h3 font-bold">{found_badge?.full_name || 'Badge Found'}</h3>
<p class="opacity-70">{found_badge?.affiliations || ''}</p>
@@ -198,7 +198,7 @@
</div>
{:else if scanning_status === 'success'}
<div class="card p-10 w-full max-w-md flex flex-col items-center space-y-4 variant-soft-success shadow-xl">
<div class="card p-10 w-full max-w-md flex flex-col items-center space-y-4 preset-tonal-success shadow-xl">
<CheckCircle size="4em" class="text-success-500 animate-bounce" />
<div class="text-center">
<h3 class="h4 font-bold">Lead Added!</h3>
@@ -208,7 +208,7 @@
{#if new_tracking_id}
<a
href={`/events/${page.params.event_id}/leads/exhibit/${exhibit_id}/lead/${new_tracking_id}`}
class="btn btn-sm variant-ghost-surface w-full"
class="btn btn-sm preset-outlined-surface w-full"
>
<Eye size="1em" class="mr-1" /> View Details
</a>
@@ -217,7 +217,7 @@
</div>
{:else if scanning_status === 'error'}
<div class="card p-6 w-full max-w-md flex flex-col items-center space-y-4 variant-soft-error">
<div class="card p-6 w-full max-w-md flex flex-col items-center space-y-4 preset-tonal-error">
<CircleAlert size="3em" class="text-error-500" />
<p class="text-center font-bold">{error_msg}</p>
<button type="button" class="btn btn-sm preset-filled-error" onclick={reset_scanner}>

6
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_tab__add.svelte
View File

@@ -49,7 +49,7 @@
<!-- QR / Search toggle (takes remaining space) -->
<button
type="button"
class="btn btn-sm variant-filled-secondary font-bold shadow-sm px-4 py-2.5 flex items-center gap-2 flex-1 transition-all"
class="btn btn-sm preset-filled-secondary font-bold shadow-sm px-4 py-2.5 flex items-center gap-2 flex-1 transition-all"
onclick={() => set_mode(mode === 'qr' ? 'search' : 'qr')}
>
{#if mode === 'qr'}
@@ -68,7 +68,7 @@
type="button"
class="btn btn-sm px-3 py-2.5 rounded-none transition-all"
class:preset-filled-primary={scan_qualify === 'rapid'}
class:variant-ghost-surface={scan_qualify !== 'rapid'}
class:preset-outlined-surface={scan_qualify !== 'rapid'}
onclick={() => set_scan_qualify('rapid')}
title="Rapid Scan — reset immediately and scan the next person"
>
@@ -78,7 +78,7 @@
type="button"
class="btn btn-sm px-3 py-2.5 rounded-none border-l border-surface-500/20 transition-all"
class:preset-filled-secondary={scan_qualify === 'qualify'}
class:variant-ghost-surface={scan_qualify !== 'qualify'}
class:preset-outlined-surface={scan_qualify !== 'qualify'}
onclick={() => set_scan_qualify('qualify')}
title="Qualify Mode — open lead detail after adding to fill in notes"
>

22
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_tab__manage.svelte
View File

@@ -65,7 +65,7 @@
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<!-- Priority / Payment Toggle -->
<div class="card p-3 variant-soft flex items-center justify-between">
<div class="card p-3 preset-tonal-surface flex items-center justify-between">
<div class="text-[10px] uppercase font-black opacity-40">Payment Status</div>
<Element_ae_obj_field_editor_v3
object_type="event_exhibit"
@@ -80,7 +80,7 @@
</div>
<!-- Max Licenses -->
<div class="card p-3 variant-soft flex items-center justify-between">
<div class="card p-3 preset-tonal-surface flex items-center justify-between">
<div class="text-[10px] uppercase font-black opacity-40">Max Licenses</div>
<Element_ae_obj_field_editor_v3
object_type="event_exhibit"
@@ -94,7 +94,7 @@
</div>
<!-- Small Devices -->
<div class="card p-3 variant-soft flex items-center justify-between">
<div class="card p-3 preset-tonal-surface flex items-center justify-between">
<div class="text-[10px] uppercase font-black opacity-40">Small Devices</div>
<Element_ae_obj_field_editor_v3
object_type="event_exhibit"
@@ -108,7 +108,7 @@
</div>
<!-- Large Devices -->
<div class="card p-3 variant-soft flex items-center justify-between">
<div class="card p-3 preset-tonal-surface flex items-center justify-between">
<div class="text-[10px] uppercase font-black opacity-40">Large Devices</div>
<Element_ae_obj_field_editor_v3
object_type="event_exhibit"
@@ -133,7 +133,7 @@
<div class="grid grid-cols-1 gap-6">
<!-- Name -->
<div class="card p-4 variant-soft shadow-sm">
<div class="card p-4 preset-tonal-surface shadow-sm">
<div class="label mb-2">
<span class="text-xs uppercase font-black opacity-40 tracking-widest">Exhibitor Name</span>
</div>
@@ -151,7 +151,7 @@
</div>
<!-- Description -->
<div class="card p-4 variant-soft shadow-sm">
<div class="card p-4 preset-tonal-surface shadow-sm">
<div class="label mb-2">
<span class="text-xs uppercase font-black opacity-40 tracking-widest">Booth Description / Promo</span>
</div>
@@ -222,7 +222,7 @@
<!-- Sign Out -->
{#if !$ae_loc.manager_access}
<button
class="btn variant-ghost-error w-full mt-2"
class="btn preset-outlined-error w-full mt-2"
onclick={handle_signout}
>
<LogOut size="1.2em" class="mr-2" /> Sign Out of Booth
@@ -339,7 +339,7 @@
<h3 class="text-lg font-bold uppercase tracking-wider">App Settings</h3>
</div>
<div class="card p-4 space-y-6 variant-soft shadow-inner">
<div class="card p-4 space-y-6 preset-tonal-surface shadow-inner">
<!-- Interface Prefs -->
<div class="space-y-3">
<div class="text-[10px] uppercase font-black opacity-40 tracking-widest">Interface Preferences</div>
@@ -396,17 +396,17 @@
<div class="space-y-3">
<div class="text-[10px] uppercase font-black opacity-40 tracking-widest">Maintenance & Reset</div>
<div class="grid grid-cols-2 gap-2">
<button class="btn btn-sm variant-filled-warning" onclick={() => window.location.reload()}>
<button class="btn btn-sm preset-filled-warning" onclick={() => window.location.reload()}>
<span class="fas fa-sync mr-2"></span> Reload App
</button>
<button class="btn btn-sm variant-ghost-error" onclick={() => {
<button class="btn btn-sm preset-outlined-error" onclick={() => {
if(confirm('Clear all local cached data (IDB)?')) {
db_events.delete().then(() => window.location.reload());
}
}}>
<span class="fas fa-database mr-2"></span> Clear IDB
</button>
<button class="btn btn-sm variant-ghost-error col-span-2" onclick={() => {
<button class="btn btn-sm preset-outlined-error col-span-2" onclick={() => {
if(confirm('Reset all local app settings and sign out?')) {
localStorage.clear();
window.location.reload();

6
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/ae_tab__start.svelte
View File

@@ -37,15 +37,15 @@
<!-- Features Grid (Compact) -->
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 max-w-2xl mx-auto px-4">
<div class="flex flex-col items-center text-center p-4 rounded-xl variant-soft-surface">
<div class="flex flex-col items-center text-center p-4 rounded-xl preset-tonal-surface">
<CircleCheck size="1.5em" class="text-success-500 mb-2" />
<span class="text-xs font-bold uppercase tracking-wider">Fast Capture</span>
</div>
<div class="flex flex-col items-center text-center p-4 rounded-xl variant-soft-surface">
<div class="flex flex-col items-center text-center p-4 rounded-xl preset-tonal-surface">
<UserCheck size="1.5em" class="text-secondary-500 mb-2" />
<span class="text-xs font-bold uppercase tracking-wider">Staff IDs</span>
</div>
<div class="flex flex-col items-center text-center p-4 rounded-xl variant-soft-surface">
<div class="flex flex-col items-center text-center p-4 rounded-xl preset-tonal-surface">
<ShieldCheck size="1.5em" class="text-primary-500 mb-2" />
<span class="text-xs font-bold uppercase tracking-wider">Secure Sync</span>
</div>

12
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/lead/[exhibit_tracking_id]/+page.svelte
View File

@@ -63,7 +63,7 @@
<div class="flex items-center gap-4">
<a
href={`/events/${page.params.event_id}/leads/exhibit/${page.params.exhibit_id}`}
class="btn btn-sm variant-ghost-surface"
class="btn btn-sm preset-outlined-surface"
>
<ChevronLeft size="1.2em" />
<span class="hidden sm:inline ml-1">Back</span>
@@ -75,8 +75,8 @@
{#if $lq__lead_obj}
<button
class="btn btn-sm"
class:variant-filled-primary={is_edit_mode}
class:variant-ghost-surface={!is_edit_mode}
class:preset-filled-primary={is_edit_mode}
class:preset-outlined-surface={!is_edit_mode}
onclick={() => is_edit_mode = !is_edit_mode}
>
{#if is_edit_mode}
@@ -88,7 +88,7 @@
{/if}
{#if $lq__lead_obj?.priority}
<span class="badge variant-filled-warning font-bold flex items-center gap-1">
<span class="badge preset-filled-warning font-bold flex items-center gap-1">
<Star size="1em" fill="currentColor" />
Priority
</span>
@@ -109,7 +109,7 @@
<!-- Left: Profile Info -->
<div class="lg:col-span-2 space-y-6">
<!-- Attendee Core Identity -->
<div class="card p-4 variant-soft shadow-lg border-l-4 border-primary-500 space-y-2">
<div class="card p-4 preset-tonal-surface shadow-lg border-l-4 border-primary-500 space-y-2">
<!-- Name row: small inline icon -->
<div class="flex items-center gap-2">
<User size="1.4em" class="text-primary-500 flex-none" />
@@ -255,7 +255,7 @@
</div>
<!-- Status Indicator -->
<div class="card p-4 flex items-center gap-3 variant-soft shadow-sm">
<div class="card p-4 flex items-center gap-3 preset-tonal-surface shadow-sm">
{#if is_edit_mode}
<div class="flex-1 flex items-center justify-between">
<div class="font-bold text-sm">Enabled</div>

10
src/routes/events/[event_id]/(leads)/leads/exhibit/[exhibit_id]/lead/[exhibit_tracking_id]/ae_comp__lead_detail_form.svelte
View File

@@ -108,13 +108,13 @@
{#if q.type === 'textarea'}
<textarea
bind:value={flat_responses[key]}
class="textarea variant-filled-surface rounded-lg p-3 text-sm"
class="textarea rounded-lg p-3 text-sm"
rows="3"
placeholder="Type response..."
></textarea>
{:else if q.type === 'toggle'}
<div class="flex items-center gap-4 p-3 variant-soft rounded-lg">
<div class="flex items-center gap-4 p-3 preset-tonal-surface rounded-lg">
<input
type="checkbox"
bind:checked={flat_responses[key]}
@@ -127,7 +127,7 @@
<!-- type 'option' is the current schema; 'select' is legacy compat -->
<select
bind:value={flat_responses[key]}
class="select variant-filled-surface rounded-lg p-3 text-sm"
class="select rounded-lg p-3 text-sm"
>
{#if Array.isArray(q.option_li)}
{#each q.option_li as opt (opt)}
@@ -146,7 +146,7 @@
<input
type="text"
bind:value={flat_responses[key]}
class="input variant-filled-surface rounded-lg p-3 text-sm"
class="input rounded-lg p-3 text-sm"
placeholder="Type response..."
/>
{/if}
@@ -160,7 +160,7 @@
{/if}
<button
class="btn variant-filled-primary w-full font-bold shadow-lg"
class="btn preset-filled-primary w-full font-bold shadow-lg"
disabled={status === 'saving'}
onclick={handle_save}
>

7
src/routes/events/[event_id]/(pres_mgmt)/presenter/[presenter_id]/presenter_view.svelte
View File

@@ -1,4 +1,6 @@
<script lang="ts">
import { Pencil } from '@lucide/svelte';
interface Props {
log_lvl?: number;
// export let event_presenter_id: string;
@@ -866,11 +868,10 @@
<button type="button"
title="Edit your passcode"
class="btn btn-sm variant-soft-warning"
class="btn btn-sm preset-tonal-warning"
class:hidden={!$ae_loc.trusted_access}
>
<span class="fas fa-edit">
</span>
<Pencil size="1em" aria-hidden="true" />
Edit
</button> -->
</li>

5
src/routes/events/[event_id]/+page.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import { liveQuery } from 'dexie';
import { Wrench } from '@lucide/svelte';
import { db_events } from '$lib/ae_events/db_events';
import { ae_util } from '$lib/ae_utils/ae_utils';
import { events_slct } from '$lib/stores/ae_events_stores';
@@ -93,9 +94,9 @@
</div>
{#if $ae_loc.administrator_access && $ae_loc.edit_mode}
<section class="card p-6 variant-soft-warning border-l-4 border-warning-500 mt-12 bg-surface-100 dark:bg-surface-800 shadow-lg">
<section class="card p-6 preset-tonal-warning border-l-4 border-warning-500 mt-12 shadow-lg">
<div class="flex items-center gap-4">
<span class="fas fa-tools text-3xl"></span>
<Wrench size="2rem" class="shrink-0" aria-hidden="true" />
<div>
<h3 class="text-xl font-bold">Event Admin Settings</h3>
<p>You have elevated privileges. Use the menu above to access advanced settings and reports.</p>

24
src/routes/events/[event_id]/settings/+page.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { page } from '$app/state';
import { goto } from '$app/navigation';
import { Lock } from '@lucide/svelte';
import { Lock, Printer, Plus, Upload, FileText, BarChart2 } from '@lucide/svelte';
import { liveQuery } from 'dexie';
import { db_events, type Event } from '$lib/ae_events/db_events';
import { onMount } from 'svelte';
@@ -111,14 +111,14 @@
class="btn btn-primary"
onclick={() => (show_create_badge_modal = true)}
>
<span class="fas fa-plus mr-2"></span> Add New Badge
<Plus size="1em" aria-hidden="true" /> Add New Badge
</button>
<button
type="button"
class="btn btn-primary ml-2"
onclick={() => (show_upload_badge_modal = true)}
>
<span class="fas fa-upload mr-2"></span> Upload Badge
<Upload size="1em" aria-hidden="true" /> Upload Badge
List
</button>
</div>
@@ -129,22 +129,22 @@
<div class="flex flex-wrap justify-center gap-2 mt-2">
<a
href={`/events/${event_id}/badges/print_list?printed_status=not_printed`}
class="btn variant-filled-secondary"
class="btn preset-filled-secondary"
>
<span class="fas fa-print mr-2"></span> Print All Unprinted
<Printer size="1em" aria-hidden="true" /> Print All Unprinted
</a>
<a
href={`/events/${event_id}/badges/print_list?badge_type_code=guest&printed_status=not_printed`}
class="btn variant-filled-secondary"
class="btn preset-filled-secondary"
>
<span class="fas fa-print mr-2"></span> Print Unprinted
<Printer size="1em" aria-hidden="true" /> Print Unprinted
Guests
</a>
<a
href={`/events/${event_id}/badges/print_list`}
class="btn variant-filled-secondary"
class="btn preset-filled-secondary"
>
<span class="fas fa-print mr-2"></span> Print All
<Printer size="1em" aria-hidden="true" /> Print All
</a>
</div>
</div>
@@ -154,13 +154,13 @@
href={`/events/${event_id}/templates`}
class="btn btn-tertiary"
>
<span class="fas fa-file-alt mr-2"></span> Manage Badge Templates
<FileText size="1em" aria-hidden="true" /> Manage Badge Templates
</a>
<a
href={`/events/${event_id}/badges/stats`}
class="btn btn-tertiary"
>
<span class="fas fa-chart-bar mr-2"></span> Badge Printing
<BarChart2 size="1em" aria-hidden="true" /> Badge Printing
Stats
</a>
</div>
@@ -443,6 +443,6 @@
</div>
<h1 class="h1 font-black">Access Restricted</h1>
<p class="max-w-md opacity-70">Event settings require administrator access. Redirecting…</p>
<a href={`/events/${event_id}`} class="btn variant-filled-primary">Return to Event</a>
<a href={`/events/${event_id}`} class="btn preset-filled-primary">Return to Event</a>
</section>
{/if}

2
src/routes/events/ae_comp__event_session_obj_li.svelte
View File

@@ -187,7 +187,7 @@
{#if (show__session_presentations || show__session_files) && $ae_loc.manager_access}
<button
type="button"
class="btn btn-icon btn-sm variant-soft-surface"
class="btn btn-icon btn-sm preset-tonal-surface"
onclick={() =>
toggle_details(
session_obj.event_session_id

20
src/routes/events/ae_comp__events_menu_nav.svelte
View File

@@ -8,6 +8,7 @@
slct,
slct_trigger
} from '$lib/stores/ae_stores';
import { TrendingUp, MapPin, Wrench, Search, GraduationCap, Plane, Settings } from '@lucide/svelte';
interface Props {
// import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/stores/ae_events_stores';
@@ -64,7 +65,7 @@
class="btn btn-sm mx-1 ae_btn_warning"
class:hidden={!ae_core}
>
<span class="fas fa-cogs m-1"></span>
<Settings size="1em" aria-hidden="true" />
Æ Core
</a>
@@ -73,7 +74,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!events__reports}
>
<span class="fas fa-chart-line m-1"></span>
<TrendingUp size="1em" aria-hidden="true" />
Pres Mgmt Reports
</a>
<a
@@ -81,8 +82,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!events__locations}
>
<!-- <span class="fas fa-map-marker-alt m-1"></span> -->
<span class="fas fa-map-marked-alt m-1"></span>
<MapPin size="1em" aria-hidden="true" />
Locations
</a>
<a
@@ -90,7 +90,7 @@
class="btn btn-sm mx-1 ae_btn_warning"
class:hidden={!events__settings}
>
<span class="fas fa-tools m-1"></span>
<Wrench size="1em" aria-hidden="true" />
Admin Tools
</a>
</span>
@@ -103,7 +103,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!events__session_search}
>
<span class="fas fa-search m-1"></span>
<Search size="1em" aria-hidden="true" />
Session Search
</a>
<a
@@ -111,8 +111,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!events__session_id}
>
<!-- <span class="fas fa-arrow-left m-1"></span> -->
<span class="fas fa-chalkboard-teacher m-1"></span>
<GraduationCap size="1em" aria-hidden="true" />
Back to Session
</a>
<!-- eslint-disable-next-line svelte/valid-compile -->
@@ -121,7 +120,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!event_id}
>
<span class="fas fa-plane m-1"></span>
<Plane size="1em" aria-hidden="true" />
Launcher
</a>
<a
@@ -129,8 +128,7 @@
class="btn btn-sm mx-1 ae_btn_info"
class:hidden={!events__location_id}
>
<!-- <span class="fas fa-map m-1"></span> -->
<span class="fas fa-map-marker-alt m-1"></span>
<MapPin size="1em" aria-hidden="true" />
Session Location
</a>
</span>

10
src/routes/journals/ae_comp__journal_entry_obj_li.svelte
View File

@@ -602,8 +602,8 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
.hide_professional)}
class="journal__content
w-full p-1
bg-slate-100 text-gray-900
dark:bg-slate-900 dark:text-gray-100
bg-gray-100 text-gray-900
dark:bg-gray-900 dark:text-gray-100
shadow-lg rounded-lg
border border-gray-200 dark:border-gray-700
text-wrap text-sm font-mono whitespace-pre-wrap
@@ -730,15 +730,13 @@ Journal ID: ${journals_journal_entry_obj?.journal_id}
{#if journals_journal_entry_obj.hide}
<EyeOff
strokeWidth="1"
color="hsla( 0, 100%, 50%, .5)"
class="inline-block"
class="inline-block text-error-500/60"
/>
<span class="hidden md:inline">Hidden</span>
{:else}
<Eye
strokeWidth="2.5"
color="hsla( 120, 100%, 25%, .5)"
class="inline-block"
class="inline-block text-success-700 dark:text-success-400"
/>
<span class="hidden lg:inline">Visible</span>
{/if}