style(launcher): Phase 3 — FA→Lucide icon migration across all launcher files
Replaces all FontAwesome <span class="fas/fab fa-*"> with Lucide Svelte components across 20 launcher files. launcher_cfg_section.svelte icon prop changed from FA string to AnyComponent (svelte:component for dynamic render). Dynamic file-extension icon now uses ae_util.file_extension_icon_lucide(). Fixes class: directives on components (invalid in Svelte 5) → ternary class. Removes title prop from Lucide components → wrapping <span title="...">. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -20,11 +20,25 @@
|
||||
import { listen, idle, onIdle, restartCountdown } from 'svelte-idle';
|
||||
|
||||
import {
|
||||
// Brain,
|
||||
// House, Library,
|
||||
LoaderCircle,
|
||||
// RefreshCw,
|
||||
Satellite
|
||||
Satellite,
|
||||
MapPin,
|
||||
Laptop,
|
||||
BedDouble,
|
||||
MousePointer,
|
||||
Wifi,
|
||||
Network,
|
||||
X,
|
||||
CalendarDays,
|
||||
Clock,
|
||||
Biohazard,
|
||||
Search,
|
||||
GraduationCap,
|
||||
Info,
|
||||
ZoomIn,
|
||||
Minimize2,
|
||||
Monitor,
|
||||
List
|
||||
} from '@lucide/svelte';
|
||||
|
||||
// *** Import Aether specific variables and functions
|
||||
@@ -640,14 +654,14 @@
|
||||
}}
|
||||
title="Toggle Edit Mode to show location options and more"
|
||||
>
|
||||
<span class="fas fa-map-marker-alt"></span>
|
||||
<MapPin size="1em" />
|
||||
<span class="sr-only">Location:</span>
|
||||
</button>
|
||||
{$lq__event_location_obj?.name}
|
||||
</h3>
|
||||
{:else}
|
||||
<div class="flex flex-row gap-1 items-center justify-center">
|
||||
<span class="fas fa-spinner fa-spin mx-1"></span>
|
||||
<LoaderCircle size="1em" class="animate-spin mx-1" />
|
||||
<span>Loading event...</span>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -725,7 +739,7 @@
|
||||
<div
|
||||
class="flex flex-row items-center justify-center p-8 opacity-50"
|
||||
>
|
||||
<span class="fas fa-map-marker-alt mx-2 text-2xl"></span>
|
||||
<MapPin size="1.5em" class="mx-2" />
|
||||
<span>Please select a location from the menu</span>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -783,11 +797,11 @@
|
||||
title="Toggle Edit Mode to show location options and more"
|
||||
>
|
||||
<span class="sr-only">Location:</span>
|
||||
<span class="fas fa-map-marker-alt"></span>
|
||||
<MapPin size="1em" />
|
||||
</button>
|
||||
{$lq__event_location_obj?.name}
|
||||
{#if $lq__event_device_obj?.name}
|
||||
<span class="fas fa-laptop mx-1"></span>
|
||||
<Laptop size="1em" class="mx-1" />
|
||||
{$lq__event_device_obj?.name}
|
||||
{/if}
|
||||
</div>
|
||||
@@ -799,10 +813,10 @@
|
||||
title="The user is currently {$idle ? 'idle' : 'active'}"
|
||||
>
|
||||
{#if $idle}
|
||||
<span class="fas fa-bed mx-1"></span>
|
||||
<BedDouble size="1em" class="mx-1" />
|
||||
<span class="hidden group-hover:inline"> Idle </span>
|
||||
{:else}
|
||||
<span class="fas fa-mouse-pointer mx-1"></span>
|
||||
<MousePointer size="1em" class="mx-1" />
|
||||
<span class="hidden group-hover:inline"> Active </span>
|
||||
{/if}
|
||||
</span>
|
||||
@@ -811,7 +825,7 @@
|
||||
class="group px-2 py-0.5 rounded-md transition-colors duration-300"
|
||||
title="Online status = {online?.current}"
|
||||
>
|
||||
<span class="fas fa-wifi mx-1"></span>
|
||||
<Wifi size="1em" class="mx-1" />
|
||||
{online?.current ? '' : 'Offline!'}
|
||||
</span>
|
||||
|
||||
@@ -828,10 +842,10 @@
|
||||
: 'disconnected'} API: {$ae_api?.base_url}"
|
||||
>
|
||||
{#if $events_sess.launcher.ws_connect_status == 'connected'}
|
||||
<span class="fas fa-sitemap mx-1 text-green-700"></span>
|
||||
<Network size="1em" class="mx-1 text-green-700" />
|
||||
<span class="hidden group-hover:inline"> WS Connected </span>
|
||||
{:else}
|
||||
<span class="fas fa-times mx-1"></span>
|
||||
<X size="1em" class="mx-1" />
|
||||
<span class="hidden group-hover:inline"> WS Disconnected </span>
|
||||
{/if}
|
||||
</span>
|
||||
@@ -862,11 +876,11 @@
|
||||
class="current_datetime font-mono px-2 hover:font-bold hover:bg-white dark:hover:bg-slate-700 transition-colors"
|
||||
>
|
||||
<span class="hidden md:inline">
|
||||
<span class="fas fa-calendar-alt"></span>
|
||||
<CalendarDays size="1em" />
|
||||
{ae_util.iso_datetime_formatter($time, 'date_full_no_year')}
|
||||
</span>
|
||||
<span class="hidden sm:inline">
|
||||
<span class="fas fa-clock"></span>
|
||||
<Clock size="1em" />
|
||||
</span>
|
||||
{#if $events_loc.launcher?.time_hours == 12}
|
||||
{ae_util.iso_datetime_formatter($time, 'time_12_long')}
|
||||
@@ -884,7 +898,7 @@
|
||||
class:opacity-25={!$ae_loc.trusted_access}
|
||||
class:hover:opacity-75={!$ae_loc.trusted_access}
|
||||
>
|
||||
<span class="fas fa-biohazard"></span>
|
||||
<Biohazard size="1em" />
|
||||
<span class="hidden">Launcher Config</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -923,7 +937,7 @@
|
||||
href="/events/{$events_slct.event_id}"
|
||||
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
|
||||
>
|
||||
<span class="fas fa-search m-1"></span>
|
||||
<Search size="1em" class="m-1" />
|
||||
Session Search
|
||||
</a>
|
||||
{#if $events_slct?.event_location_id}
|
||||
@@ -931,7 +945,7 @@
|
||||
href="/events/{$events_slct.event_id}/location/{$events_slct.event_location_id}"
|
||||
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
|
||||
>
|
||||
<span class="fas fa-map-marker m-1"></span>
|
||||
<MapPin size="1em" class="m-1" />
|
||||
View Selected Location
|
||||
</a>
|
||||
{/if}
|
||||
@@ -940,7 +954,7 @@
|
||||
href="/events/{$events_slct.event_id}/session/{$events_slct.event_session_id}"
|
||||
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
|
||||
>
|
||||
<span class="fas fa-chalkboard-teacher m-1"></span>
|
||||
<GraduationCap size="1em" class="m-1" />
|
||||
View Selected Session
|
||||
</a>
|
||||
{/if}
|
||||
@@ -974,7 +988,7 @@
|
||||
onclick={() => ($events_loc.launcher.hide_drawer__debug = true)}
|
||||
class="mb-4 dark:text-white"
|
||||
>
|
||||
<span class="fas fa-times"></span>
|
||||
<X size="1em" />
|
||||
<span class="hidden">Close Debug Drawer</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -1022,7 +1036,7 @@
|
||||
}}
|
||||
title="Close Modal"
|
||||
>
|
||||
<span class="fas fa-times my-1.5"></span>
|
||||
<X size="1em" class="my-1.5" />
|
||||
<span class="hidden group-hover:inline"> Close</span>
|
||||
</button>
|
||||
{/snippet}
|
||||
@@ -1068,7 +1082,7 @@
|
||||
/>
|
||||
{:else}
|
||||
<div class="flex flex-row items-center justify-center p-4">
|
||||
<span class="fas fa-info-circle mx-1"></span>
|
||||
<Info size="1em" class="mx-1" />
|
||||
<span>No image selected</span>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -1103,10 +1117,10 @@
|
||||
: 'Fit image to screen'}
|
||||
>
|
||||
{#if modal_zoom_fit}
|
||||
<span class="fas fa-search-plus mr-1"></span>
|
||||
<ZoomIn size="1em" class="mr-1" />
|
||||
<span class="hidden sm:inline">Zoom</span>
|
||||
{:else}
|
||||
<span class="fas fa-compress mr-1"></span>
|
||||
<Minimize2 size="1em" class="mr-1" />
|
||||
<span class="hidden sm:inline">Fit</span>
|
||||
{/if}
|
||||
</button>
|
||||
@@ -1127,8 +1141,8 @@
|
||||
$events_sess.launcher.ws_connect_status != 'connected'}
|
||||
title="Close poster on this device and on the remote display (screensaver resumes)"
|
||||
>
|
||||
<span class="fas fa-tv mr-1"></span>
|
||||
<span class="fas fa-times"></span>
|
||||
<Monitor size="1em" class="mr-1" />
|
||||
<X size="1em" />
|
||||
<span class="hidden sm:inline ml-1">Close Both</span>
|
||||
</button>
|
||||
|
||||
@@ -1147,7 +1161,7 @@
|
||||
$events_sess.launcher.ws_connect_status != 'connected')}
|
||||
title="Close poster on this device only — remote display keeps showing"
|
||||
>
|
||||
<span class="fas fa-list mr-1"></span>
|
||||
<List size="1em" class="mr-1" />
|
||||
<span class="hidden sm:inline">Back to List</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user