Pulled out the event reports page menu. And other clean up.

src/routes/events_pres_mgmt/event/[slug]/reports/+page.svelte

@@ -21,6 +21,8 @@ import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$
 import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
 import { events_func } from '$lib/ae_events_functions';
 
+import Event_reports_page_menu from './../../../event_reports_page_menu.svelte';
+
 // Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
 $slct.account_id = data.account_id;
 console.log(`$slct.account_id = `, $slct.account_id);
@@ -281,66 +283,13 @@ async function handle_search__event_presenter(
 </header>
 {/if}
 
-<div
-    class="pres_mgmt__reports_help {ae_snip.classes__events_pres_mgmt_menu}"
-    class:border-none={!$events_loc.pres_mgmt.show_content__reports_help}
-    >
-    <div>
-    <a href="/events_pres_mgmt/event/{$events_slct.event_obj.event_id_random}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
-        <span class="fas fa-arrow-left mx-1"></span>
-        Back to Session Search
-    </a>
 
-    <button
-        type="button"
-        on:click={() => {
-            $events_loc.pres_mgmt.show_content__reports_help = !$events_loc.pres_mgmt.show_content__reports_help;
-        }}
-        class="{ae_snip.classes__events_pres_mgmt_menu__button}"
-        title="Help and information about the session search"
-        >
-        <span class="fas fa-question-circle mx-1"></span>
-        {#if $events_loc.pres_mgmt.show_content__reports_help}
-            Hide
-        {:else}
-            Show
-        {/if}
-        Help?
-    </button>
-    </div>
 
-    <Element_data_store
-        ds_code="events__pres_mgmt__reports_help"
-        ds_name="Default: Events - Pres Mgmt Session Search Help"
-        ds_type="html"
-        for_type="event"
-        for_id={$events_slct.event_id}
-        class_li="bg-yellow-100 p-2 rounded-md border border-yellow-200"
-        show_edit={false}
-        show_edit_btn={true}
-        hide={!$events_loc.pres_mgmt.show_content__reports_help}
-        />
+<Event_reports_page_menu
+    data={data}
+    lq__event_obj={lq__event_obj}
+    />
 
-    <div>
-        <button
-            type="button"
-            on:click={() => {
-                $events_loc.pres_mgmt.show_content__reports_help = !$events_loc.pres_mgmt.show_content__reports_help;
-            }}
-            class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
-            class:hidden={!$events_loc.pres_mgmt.show_content__reports_help}
-            title="Help and information about the session search"
-            >
-            <span class="fas fa-question-circle mx-1"></span>
-            {#if $events_loc.pres_mgmt.show_content__reports_help}
-                Hide
-            {:else}
-                Show
-            {/if}
-            Help?
-        </button>
-    </div>
-</div>
 
 <div class="variant-ghost-success my-2 p-2 rounded-md flex flex-row items-center">
 

src/routes/events_pres_mgmt/event_page_menu.svelte

@@ -4,9 +4,9 @@ export let data: any;
 import type { key_val } from '$lib/ae_stores';
 import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
 import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/ae_events_stores';
-import { events_func } from '$lib/ae_events_functions';
+// import { events_func } from '$lib/ae_events_functions';
 
-import Element_ae_crud from '$lib/element_ae_crud.svelte';
+// import Element_ae_crud from '$lib/element_ae_crud.svelte';
 import Element_data_store from '$lib/element_data_store.svelte';
 // import Sign_in_out from './sign_in_out.svelte';
 
@@ -100,7 +100,7 @@ let ae_triggers: key_val = {};
         ds_type="html"
         for_type="event"
         for_id={$events_slct.event_id}
-        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md"
+        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md max-w-xl"
         show_edit={false}
         show_edit_btn={true}
         hide={$events_loc.pres_mgmt.show_menu__session_search != 'help'}

src/routes/events_pres_mgmt/event_reports_page_menu.svelte

@@ -0,0 +1,111 @@
+<script lang="ts">
+export let data: any;
+
+import type { key_val } from '$lib/ae_stores';
+import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
+import { events_loc, events_sess, events_slct, events_trigger, events_trig_kv } from '$lib/ae_events_stores';
+// import { events_func } from '$lib/ae_events_functions';
+
+// import Element_ae_crud from '$lib/element_ae_crud.svelte';
+import Element_data_store from '$lib/element_data_store.svelte';
+// import Sign_in_out from './sign_in_out.svelte';
+
+export let lq__event_obj: any;
+
+let ae_tmp: key_val = {};
+let ae_triggers: key_val = {};
+
+</script>
+
+
+<!-- New standard page specific menu 2024-08-02 -->
+<div
+    class="pres_mgmt__event_reports {ae_snip.classes__events_pres_mgmt_menu}"
+    class:border-none={!$events_loc.pres_mgmt.show_menu__event_reports}
+    >
+
+    <!-- BEGIN: The menu button options -->
+    <div
+        class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
+
+    <span
+        class="ae_menu__navigation_options"
+        >
+        <a
+            href="/events_pres_mgmt/event/{$lq__event_obj?.event_id_random}"
+            class="{ae_snip.classes__events_pres_mgmt_menu__button}"
+            >
+            <span class="fas fa-arrow-left mx-1"></span>
+            Back to Session Search
+        </a>
+    </span>
+
+    <span
+        class="ae_menu__object_options"
+        >
+        <button
+            type="button"
+            on:click={() => {
+                if ($events_loc.pres_mgmt.show_menu__event_reports == 'help') {
+                    $events_loc.pres_mgmt.show_menu__event_reports = null;
+                } else {
+                    $events_loc.pres_mgmt.show_menu__event_reports = 'help';
+                }
+            }}
+            class="{ae_snip.classes__events_pres_mgmt_menu__button}"
+            title="Help and information about the reports"
+            >
+            <span class="fas fa-question-circle mx-1"></span>
+            {#if $events_loc.pres_mgmt.show_menu__event_reports}
+                Hide Help?
+            {:else}
+                Help?
+            {/if}
+        </button>
+    </span>
+
+
+    </div> <!-- END: The menu button options -->
+
+
+    <!-- BEGIN: The expanded menu area for information and options -->
+    <div
+        class="flex flex-row items-center justify-around w-full bg-blue-100 hover:bg-blue-200 border border-blue-200 hover:border-blue-400 p-2 rounded-md"
+        class:hidden={$events_loc.pres_mgmt.show_menu__session != 'options'}
+        >
+
+    </div> <!-- END: The expanded menu area for information and options -->
+
+    <Element_data_store
+        ds_code="events__pres_mgmt__reports_help"
+        ds_name="Default: Events - Pres Mgmt Event Reports Help"
+        ds_type="html"
+        for_type="event"
+        for_id={$events_slct.event_id}
+        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md max-w-xl"
+        show_edit={false}
+        show_edit_btn={true}
+        hide={$events_loc.pres_mgmt.show_menu__event_reports != 'help'}
+        />
+
+    <div>
+        <button
+            type="button"
+            on:click={() => {
+                $events_loc.pres_mgmt.show_menu__event_reports = !$events_loc.pres_mgmt.show_menu__event_reports;
+            }}
+            class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
+            class:hidden={!$events_loc.pres_mgmt.show_menu__event_reports}
+            title="Collapse the expanded menu"
+            >
+            <span class="fas fa-chevron-up m-1"></span>
+            {#if $events_loc.pres_mgmt.show_menu__event_reports}
+                Hide
+                <!-- Collapse -->
+            {:else}
+                Show
+            {/if}
+            <!-- Menu? -->
+        </button>
+    </div>
+</div>

src/routes/events_pres_mgmt/presenter_page_menu.svelte

@@ -163,7 +163,7 @@ let ae_triggers: key_val = {};
         ds_type="html"
         for_type="event"
         for_id={$events_slct.event_id}
-        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md"
+        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md max-w-xl"
         show_edit={false}
         show_edit_btn={true}
         hide={$events_loc.pres_mgmt.show_menu__presenter != 'help'}

src/routes/events_pres_mgmt/session_page_menu.svelte

@@ -286,7 +286,7 @@ let ae_triggers: key_val = {};
         ds_type="html"
         for_type="event"
         for_id={$events_slct.event_id}
-        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md"
+        class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md max-w-xl"
         show_edit={false}
         show_edit_btn={true}
         hide={$events_loc.pres_mgmt.show_menu__session != 'help'}