Cleaning up the styles for the Session related content.
This commit is contained in:
@@ -209,7 +209,7 @@ if (!$events_sess.pres_mgmt) $events_sess.pres_mgmt = {};
|
|||||||
{:else}
|
{:else}
|
||||||
<!-- Metadata Section: Session identity card — name, time, room, host, description -->
|
<!-- Metadata Section: Session identity card — name, time, room, host, description -->
|
||||||
<div
|
<div
|
||||||
class="bg-surface-50-950 border-surface-200-800 rounded-xl border p-4 shadow-sm">
|
class="">
|
||||||
<Session_view
|
<Session_view
|
||||||
{lq__event_presenter_obj}
|
{lq__event_presenter_obj}
|
||||||
{lq__event_session_obj}
|
{lq__event_session_obj}
|
||||||
|
|||||||
@@ -136,11 +136,23 @@ $effect(() => {
|
|||||||
Show: name, time, room, host, description. Hide admin noise unless edit_mode.
|
Show: name, time, room, host, description. Hide admin noise unless edit_mode.
|
||||||
Section 508: all interactive elements labelled, focus rings, sufficient contrast.
|
Section 508: all interactive elements labelled, focus rings, sufficient contrast.
|
||||||
-->
|
-->
|
||||||
<section class="space-y-3">
|
<section class="space-y-2">
|
||||||
<!-- SESSION HERO: Name + Schedule + Room -->
|
<!-- SESSION HERO: Name + Schedule + Room -->
|
||||||
<div
|
<div
|
||||||
class="border-surface-200-800 bg-surface-50-900 overflow-hidden rounded-xl border shadow-sm">
|
class="
|
||||||
<div class="flex flex-col gap-3 px-4 pt-4 pb-3">
|
border-surface-200-800 bg-surface-50-900 overflow-hidden rounded-xl border shadow-sm
|
||||||
|
|
||||||
|
flex flex-col
|
||||||
|
items-center justify-center
|
||||||
|
gap-3 px-4 py-2
|
||||||
|
transition-all
|
||||||
|
w-full
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<!-- <div class="
|
||||||
|
|
||||||
|
"
|
||||||
|
> -->
|
||||||
<!-- QR code: floats top-right, compact by default, toggle to enlarge.
|
<!-- QR code: floats top-right, compact by default, toggle to enlarge.
|
||||||
Only rendered once the async URL is resolved (string), never while
|
Only rendered once the async URL is resolved (string), never while
|
||||||
it is still the boolean `true` loading placeholder. -->
|
it is still the boolean `true` loading placeholder. -->
|
||||||
@@ -180,26 +192,25 @@ $effect(() => {
|
|||||||
|
|
||||||
<!-- Session Name: the primary identity check -->
|
<!-- Session Name: the primary identity check -->
|
||||||
{#if $lq__event_session_obj}
|
{#if $lq__event_session_obj}
|
||||||
<div>
|
|
||||||
{#if $ae_loc.edit_mode}
|
|
||||||
<Element_ae_obj_field_editor
|
|
||||||
object_type={'event_session'}
|
|
||||||
object_id={$lq__event_session_obj.id}
|
|
||||||
field_name={'name'}
|
|
||||||
field_type={'text'}
|
|
||||||
current_value={$lq__event_session_obj.name}
|
|
||||||
on_success={() =>
|
|
||||||
events_func.load_ae_obj_id__event_session({
|
|
||||||
api_cfg: $ae_api,
|
|
||||||
event_session_id: $lq__event_session_obj.id
|
|
||||||
})}>
|
|
||||||
<div class="text-lg leading-snug font-bold">
|
|
||||||
{$lq__event_session_obj.name}
|
|
||||||
</div>
|
|
||||||
</Element_ae_obj_field_editor>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
{#if $ae_loc.edit_mode}
|
{#if $ae_loc.edit_mode}
|
||||||
|
<div>
|
||||||
|
<Element_ae_obj_field_editor
|
||||||
|
object_type={'event_session'}
|
||||||
|
object_id={$lq__event_session_obj.id}
|
||||||
|
field_name={'name'}
|
||||||
|
field_type={'text'}
|
||||||
|
current_value={$lq__event_session_obj.name}
|
||||||
|
on_success={() =>
|
||||||
|
events_func.load_ae_obj_id__event_session({
|
||||||
|
api_cfg: $ae_api,
|
||||||
|
event_session_id: $lq__event_session_obj.id
|
||||||
|
})}>
|
||||||
|
<div class="text-lg leading-snug font-bold">
|
||||||
|
{$lq__event_session_obj.name}
|
||||||
|
</div>
|
||||||
|
</Element_ae_obj_field_editor>
|
||||||
|
|
||||||
<Element_ae_obj_field_editor
|
<Element_ae_obj_field_editor
|
||||||
object_type="event_session"
|
object_type="event_session"
|
||||||
object_id={$lq__event_session_obj.id}
|
object_id={$lq__event_session_obj.id}
|
||||||
@@ -216,8 +227,9 @@ $effect(() => {
|
|||||||
<span class="badge preset-tonal-surface mt-1 text-xs"
|
<span class="badge preset-tonal-surface mt-1 text-xs"
|
||||||
>code: {$lq__event_session_obj.code}</span>
|
>code: {$lq__event_session_obj.code}</span>
|
||||||
</Element_ae_obj_field_editor>
|
</Element_ae_obj_field_editor>
|
||||||
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
|
||||||
{:else}
|
{:else}
|
||||||
<!-- Skeleton placeholder while LiveQuery resolves -->
|
<!-- Skeleton placeholder while LiveQuery resolves -->
|
||||||
<!-- <div class="bg-surface-200-800 h-7 w-2/3 animate-pulse rounded">
|
<!-- <div class="bg-surface-200-800 h-7 w-2/3 animate-pulse rounded">
|
||||||
@@ -226,7 +238,15 @@ $effect(() => {
|
|||||||
|
|
||||||
<!-- Date/Time + Room as info chips -->
|
<!-- Date/Time + Room as info chips -->
|
||||||
{#if $lq__event_session_obj}
|
{#if $lq__event_session_obj}
|
||||||
<div class="flex flex-wrap items-center gap-2">
|
<div class="
|
||||||
|
flex flex-wrap
|
||||||
|
items-center justify-center
|
||||||
|
gap-2
|
||||||
|
transition-all
|
||||||
|
max-w-xl
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<div class="flex flex-wrap items-center gap-1">
|
||||||
<span
|
<span
|
||||||
class="bg-primary-500/10 text-primary-700 dark:text-primary-300 inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-sm font-semibold transition-colors duration-200">
|
class="bg-primary-500/10 text-primary-700 dark:text-primary-300 inline-flex items-center gap-1.5 rounded-full px-3 py-1 text-sm font-semibold transition-colors duration-200">
|
||||||
<button
|
<button
|
||||||
@@ -306,7 +326,7 @@ $effect(() => {
|
|||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<div class="flex flex-wrap items-center gap-2">
|
<div class="flex flex-wrap items-center gap-1">
|
||||||
<!-- Room/Location: editable in edit_mode via select from this event's locations.
|
<!-- Room/Location: editable in edit_mode via select from this event's locations.
|
||||||
WHY: event_location_id is a FK — staff need to pick from known rooms,
|
WHY: event_location_id is a FK — staff need to pick from known rooms,
|
||||||
not type a raw UUID. The liveQuery above loads locations for this event. -->
|
not type a raw UUID. The liveQuery above loads locations for this event. -->
|
||||||
@@ -340,12 +360,14 @@ $effect(() => {
|
|||||||
</span>
|
</span>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
{:else}
|
{:else}
|
||||||
<div
|
<div
|
||||||
class="bg-surface-200-800 h-5 w-1/2 animate-pulse rounded-full">
|
class="bg-surface-200-800 h-5 w-1/2 animate-pulse rounded-full">
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
<!-- </div> -->
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Host / POC: visible when assigned and layout config allows -->
|
<!-- Host / POC: visible when assigned and layout config allows -->
|
||||||
|
|||||||
Reference in New Issue
Block a user