Work on general style clean up. So much to do...

This commit is contained in:
Scott Idem
2025-06-19 12:54:40 -04:00
parent 9617071361
commit 1e0c6ec91b
6 changed files with 211 additions and 113 deletions

View File

@@ -792,7 +792,7 @@ async function handle_update__data_store(
<button
type="button"
class="ae_btn_edit__ds btn hover:preset-tonal-warning text-xs absolute top-0 right-0 opacity-30 hover:opacity-100 transition delay-700 hover:delay-200 m-1 p-1"
class="ae_btn_edit__ds btn hover:preset-tonal-warning text-xs absolute top-0 right-0 opacity-30 hover:opacity-100 transition delay-700 hover:delay-200 p-1 z-50"
class:opacity-5={!$ae_loc.manager_access}
class:hidden={!(
($ae_loc.manager_access && $ae_loc.edit_mode)

View File

@@ -4,9 +4,17 @@ let log_lvl: number = 0;
// *** Import Svelte specific
import { browser } from '$app/environment';
// *** Import other supporting libraries
// import * as icons from '@lucide/svelte';
import {
Brain,
House, Library,
RefreshCw,
Satellite
} from '@lucide/svelte';
import { AppBar } from '@skeletonlabs/skeleton-svelte';
import { Modal } from '@skeletonlabs/skeleton-svelte';
// import { Modal } from '@skeletonlabs/skeleton-svelte';
// import type {
// ModalComponent
// } from '@skeletonlabs/skeleton-svelte';
@@ -132,44 +140,76 @@ if (browser) {
slotHeader={($ae_loc.iframe ? 'iframe' : '')}
slotFooter={($ae_loc.iframe ? 'iframe' : '')}
> -->
<main>
{#snippet header()}
<!-- App Bar -->
<AppBar
gridColumns="grid-cols-3"
slotDefault="place-self-center"
slotTrail="place-content-end"
padding="px-4"
>
{#snippet lead()}
<Element_data_store
ds_code="hub__page__appshell_header_lead"
ds_type="html"
/>
<div
class:iframe={$ae_loc?.iframe}
class="ae_events h-full max-h-full max-w-6xl overflow-auto flex flex-col gap-1 m-auto"
>
{/snippet}
<!-- OSIT's Aether App -->
<!-- {@html (browser ? JSON.parse(localStorage.getItem('ae_ds__hub__site__appshell_header')).html : '-- not found --')} -->
<!-- {@html $ae_sess.site_appshell_header} -->
<Element_data_store
ds_code="hub__site__appshell_header"
ds_type="html"
/>
{#snippet trail()}
<nav
class="
submenu
flex flex-row flex-wrap
items-center justify-between
gap-1
border-b-2
p-1
px-2
pb-2
"
>
<span class="justify-self-start">
<Element_data_store
ds_code="hub__page__appshell_header_trail"
ds_type="html"
/>
<!-- Be sure to explain what &AElig; (Aether) means in the title text or similar! -->
<Satellite
size="1.5em"
class="mx-1 inline-block text-gray-500"
/>
<abbr title="Aether - IDAA Module">
Æ
IDAA
</abbr>
</span>
<Element_data_store
ds_code="hub__site__appshell_header"
ds_type="html"
/>
<a
href="/"
class="btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-filled-success-500"
>
<House />
<span class="hidden md:inline">
Home
</span>
</a>
</nav>
{/snippet}
</AppBar>
<section
class:iframe={$ae_loc?.iframe}
class="main_content grow px-1 md:px-2 pb-28"
>
{/snippet}
<!-- OLD: App Bar -->
<!-- <AppBar
gridColumns="grid-cols-3"
slotDefault="place-self-center"
slotTrail="place-content-end"
padding="px-4"
>
<Element_data_store
ds_code="hub__page__appshell_header_lead"
ds_type="html"
/>
<Element_data_store
ds_code="hub__site__appshell_header"
ds_type="html"
/>
<Element_data_store
ds_code="hub__page__appshell_header_trail"
ds_type="html"
/>
</AppBar> -->
<!-- !($ae_loc.site_access_key && $ae_loc.site_domain_access_key)
@@ -185,22 +225,28 @@ if (browser) {
{#snippet footer()}
<!-- {#snippet footer()} -->
<div
class="flex text-sm sm:text-sm md:text-md lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1"
class:ae_debug={$ae_loc.debug}
>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
</div>
<!-- {/snippet} -->
{/snippet}
</section>
</main>
<section
class="footer_contenttext-sm sm:text-sm md:text-md lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1 py-0.5 min-h-7"
class:ae_debug={$ae_loc.debug}
>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
</section>
</div>
<!-- </AppShell> -->

View File

@@ -86,8 +86,8 @@ import { events_loc, events_sess, events_slct, events_trigger, events_trig } fro
$events_sess.launcher.controller_trigger_send = null;
}}
class="btn btn-sm hover:preset-filled-primary-500"
class:preset-tonal-warning border border-warning-500={!$events_loc.launcher.ws_connect}
class:preset-tonal-success border border-success-500={$events_loc.launcher.ws_connect}
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
class:preset-tonal-success={$events_loc.launcher.ws_connect}
>
{#if $events_loc.launcher.ws_connect}
<!-- <span class="fas fa-signal m-1"></span> -->

View File

@@ -133,7 +133,7 @@ export let lq__event_obj: any;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={!$events_loc.pres_mgmt?.hide__device_code}
class:preset-tonal-warning border border-warning-500={$events_loc.pres_mgmt?.hide__device_code}
class:preset-tonal-warning border-warning-500={$events_loc.pres_mgmt?.hide__device_code}
title="Show or hide the device code."
>
{#if !$events_loc.pres_mgmt.hide__device_code}
@@ -153,7 +153,7 @@ export let lq__event_obj: any;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={!$events_loc.pres_mgmt?.hide__location_code}
class:preset-tonal-warning border border-warning-500={$events_loc.pres_mgmt?.hide__location_code}
class:preset-tonal-warning border-warning-500={$events_loc.pres_mgmt?.hide__location_code}
title="Show or hide the location code."
>
{#if !$events_loc.pres_mgmt.hide__location_code}
@@ -173,7 +173,7 @@ export let lq__event_obj: any;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={!$events_loc.pres_mgmt?.hide__session_code}
class:preset-tonal-warning border border-warning-500={$events_loc.pres_mgmt?.hide__session_code}
class:preset-tonal-warning border-warning-500={$events_loc.pres_mgmt?.hide__session_code}
title="Show or hide the session code."
>
{#if !$events_loc.pres_mgmt.hide__session_code}

View File

@@ -1,18 +1,25 @@
<script lang="ts">
/** @type {import('./$types').LayoutData} */
let log_lvl: number = 1;
// Imports
// *** Import Svelte specific
import { browser } from '$app/environment';
// *** Import other supporting libraries
// import * as icons from '@lucide/svelte';
import {
Brain,
House, Library,
RefreshCw,
Satellite
} from '@lucide/svelte';
import { AppBar } from '@skeletonlabs/skeleton-svelte';
import type {
ModalComponent
} from '@skeletonlabs/skeleton-svelte';
// *** Import Aether specific variables and functions
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/ae_idaa_stores';
@@ -97,57 +104,85 @@ function add_activity_log(
<title>IDAA - {$idaa_loc?.title ?? 'Æ loading...'}</title>
</svelte:head>
<Modal components={modalRegistry}
<!-- <Modal components={modalRegistry}
regionBackdrop=''
regionBody=''
regionHeader='modal-header card-header text-2xl font-bold'
regionFooter='modal-footer flex justify-between space-x-2'
/>
/> -->
<div
class:iframe={$ae_loc?.iframe}
class="ae_idaa h-full max-h-full max-w-6xl overflow-auto flex flex-col gap-1 m-auto"
>
<nav
class="
submenu
flex flex-row flex-wrap
items-center justify-between
gap-1
border-b-2
p-1
px-2
pb-2
"
>
<span class="justify-self-start">
<!-- Be sure to explain what &AElig; (Aether) means in the title text or similar! -->
<Satellite
size="1.5em"
class="mx-1 inline-block text-gray-500"
/>
<abbr title="Aether - IDAA Module">
Æ
IDAA
</abbr>
</span>
<a
href="/"
class="btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-filled-success-500"
>
<House />
<span class="hidden md:inline">
Home
</span>
</a>
</nav>
<!-- App Shell -->
<AppShell
<!-- <AppShell
regionPage={($ae_loc?.iframe ? 'iframe' : '')}
slotHeader={($ae_loc?.iframe ? 'iframe' : '')}
slotFooter={($ae_loc?.iframe ? 'iframe' : '')}
> -->
<section
class:iframe={$ae_loc?.iframe}
class="main_content grow px-1 md:px-2 pb-28"
>
{#snippet header()}
<!-- App Bar -->
<AppBar
gridColumns="grid-cols-3"
slotDefault="place-self-center"
slotTrail="place-content-end"
padding="px-4"
>
{#snippet lead()}
<Element_data_store
ds_code="hub__page__appshell_header_lead"
ds_type="html"
/>
<!-- OLD: App Bar -->
<!-- <AppBar
gridColumns="grid-cols-3"
slotDefault="place-self-center"
slotTrail="place-content-end"
padding="px-4"
>
<Element_data_store
ds_code="hub__page__appshell_header_lead"
ds_type="html"
/>
<Element_data_store
ds_code="hub__site__appshell_header"
ds_type="html"
/>
<Element_data_store
ds_code="hub__page__appshell_header_trail"
ds_type="html"
/>
</AppBar> -->
{/snippet}
<!-- OSIT's Aether App -->
<!-- {@html (browser ? JSON.parse(localStorage.getItem('ae_ds__hub__site__appshell_header')).html : '-- not found --')} -->
<!-- {@html $ae_sess.site_appshell_header} -->
<Element_data_store
ds_code="hub__site__appshell_header"
ds_type="html"
/>
{#snippet trail()}
<Element_data_store
ds_code="hub__page__appshell_header_trail"
ds_type="html"
/>
{/snippet}
</AppBar>
{/snippet}
<!-- !($ae_loc.site_access_key && $ae_loc.site_domain_access_key)
@@ -161,24 +196,22 @@ function add_activity_log(
<!-- Page Route Content -->
{@render children?.()}
</section>
{#snippet footer()}
<section
class="footer_content flex text-sm sm:text-sm lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1 py-0.5 min-h-7"
class:ae_debug={$ae_loc?.debug}
>
<div
class="flex text-sm sm:text-sm lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1"
class:ae_debug={$ae_loc?.debug}
>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
</div>
{/snippet}
</section>
</AppShell>
</div>
<!-- </AppShell> -->

View File

@@ -21,10 +21,8 @@ import type { key_val } from '$lib/ae_stores';
// import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct } from '$lib/ae_stores';
import { journals_loc, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
// import { journals_func } from '$lib/ae_journals/ae_journals_functions';
// import Element_data_store from '$lib/element_data_store_v2.svelte';
import Element_data_store from '$lib/element_data_store_v2.svelte';
// *** Setup Svelte properties
interface Props {
@@ -76,7 +74,10 @@ $journals_slct.journal_obj_li = ae_acct.slct.journal_obj_li;
{#if $ae_loc.user_id && $ae_loc.person_id && $ae_loc.trusted_access}
<!-- These are needed: h-full overflow-auto -->
<div class="ae_journals h-full max-h-full max-w-6xl overflow-auto flex flex-col gap-1 m-auto">
<div
class:iframe={$ae_loc?.iframe}
class="ae_journals h-full max-h-full max-w-6xl overflow-auto flex flex-col gap-1 m-auto"
>
<nav
class="
@@ -191,10 +192,28 @@ $journals_slct.journal_obj_li = ae_acct.slct.journal_obj_li;
</section> -->
<!-- Add overflow-auto to section element to have the main nav sort of sticky at top -->
<section class="main_content grow px-1 md:px-2 pb-28">
<section
class:iframe={$ae_loc?.iframe}
class="main_content grow px-1 md:px-2 pb-28"
>
{@render children()}
</section>
<section
class="footer_content flex text-sm sm:text-sm lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1 py-0.5 min-h-7"
class:ae_debug={$ae_loc?.debug}
>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
</section>
</div>
{:else}