diff --git a/src/app.css b/src/app.css index 08f16f67..ca4cac22 100644 --- a/src/app.css +++ b/src/app.css @@ -167,6 +167,249 @@ html.trusted_access #appShell { /* --theme-font-family-heading: 'Liberation Sans', sans-serif; */ /* } */ +/* Using Skeleton Tailwind Presets */ +/* Built in colors (also with "contrast" option): +* - primary +* - secondary +* - tertiary +* - success +* - warning +* - error +* - surface +*/ + +/* Built in presets: +* - Filled - a filled preset of the primary brand color. +* - Tonal - a tonal preset of the primary brand color. +* - Outlined - an outlined preset of the primary brand color. +*/ + +/* Additional customized presets: +* - Glass - a custom preset using background transparency and backdrop blur. +* - Elevated - mixes a filled preset with a shadow. +* - Ghost - has no style by default, but shows a tonal preset on hover. +* - Ghost Icon - has no style by default, but shows a branded tonal preset on hover. +* - Gradient - a custom preset generated using Tailwind gradient primitives. +*/ + +/* Generic button types needed: +* - primary +* - secondary +* - tertiary +* - success +* - warning +* - error +* - neutral +* - surface +* - info +* - danger +* - normal +* - outline +* - text +*/ + +/* Aether specific button types needed: +* - open or view +* - close or hide +* - help +* - save +* - delete +* - cancel +* - confirm +* - reset +* - submit +* - next or previous +* - back +* - edit +* - create +* - add +* - remove +* - copy +* - paste +* - download +* - upload +* - print +* - share +* - search +* - filter +* - sort +* - select +* - clear +* - toggle or switch +* - expand or collapse +* - configure or settings +* - refresh or reload +* - sync or synchronize +* - play or pause +* - stop +* - like or dislike +* - favorite or unfavorite +* - follow or unfollow +* - subscribe or unsubscribe +* - vote or unvote +* - rate or review +* - report or flag +* - block or unblock +* - accept or decline +* - agree or disagree +* - confirm or cancel +* - approve or reject + + +*/ + +/* Create a custom preset in your global stylesheet */ +/* .preset-gradient { + background-image: linear-gradient(-45deg, var(--color-primary-300), var(--color-primary-700)); + color: var(--color-primary-contrast-500); +} */ +/* .preset-glass-primary { + background: color-mix(in oklab, var(--color-primary-500) 40%, transparent); + box-shadow: 0 0px 30px color-mix(in oklab, var(--color-primary-500) 50%, transparent) inset; + backdrop-filter: blur(16px); +} */ + + +/* Buttons default to the tonal presets */ +/* Buttons based on Skeleton Tailwind preset classes */ +.ae_btn_primary { + @apply preset-tonal-primary border border-primary-500 transition-all; +} +.ae_btn_secondary { + @apply preset-tonal-secondary border border-secondary-500 transition-all; + /* hover:preset-filled-secondary-500 */ +} +.ae_btn_tertiary { + @apply preset-tonal-tertiary border border-tertiary-500 transition-all; +} +.ae_btn_success { + @apply preset-tonal-success border border-success-500 transition-all; +} +.ae_btn_warning { + @apply preset-tonal-warning border border-warning-500 transition-all; +} +.ae_btn_error { + @apply preset-tonal-error border border-error-500 transition-all; +} +.ae_btn_surface { + @apply preset-tonal-surface border border-surface-500 transition-all; +} +/* Buttons customized for Aether using Skeleton Tailwind preset classes */ +.ae_btn_info { + @apply border text-cyan-950 dark:text-cyan-50 bg-cyan-50 dark:bg-cyan-950 border-cyan-500 transition-all; +} + +/* Buttons are for filled and outlined presets */ +.ae_btn_secondary_filled { + @apply preset-filled-secondary-200-800 border border-secondary-500 transition-all; + /* hover:preset-filled-secondary-500 */ +} +.ae_btn_secondary_outlined { + @apply preset-outlined-secondary-200-800 hover:preset-filled-secondary-200-800 border border-secondary-500 transition-all; + /* hover:preset-outlined-secondary-500 */ +} + + + +/* Containers customized for Aether using Skeleton Tailwind preset classes */ +.ae_container_system_menu { + @apply container; +} +.ae_container_system_options { + @apply container; +} +.ae_container_system_help { + @apply container; +} + +.ae_container_module { + @apply container; + /* @apply container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8; */ +} +/* .ae_container_module_main { + @apply container; +} */ +.ae_container_module_header { + /* LCI request 3a5997 */ + /* bg-gray-300 */ + @apply h2 text-center preset-tonal-primary rounded-md flex flex-row gap-0.25 items-center justify-between w-full p-1 px-2; +} +.ae_container_module_content { + @apply container; +} +.ae_container_module_menu { + @apply container; +} +.ae_container_module_options { + @apply container; +} + +.ae_container_actions { + @apply container preset-tonal-success border border-success-500 rounded-md flex flex-row items-center my-2 p-2; +} +.ae_container_results { + @apply container; +} +.ae_container_content { + @apply container; +} +.ae_container_content_header { + @apply container; +} +.ae_container_content_content { + @apply container; +} +.ae_container_content_footer { + @apply container; +} + +.ae_container_alert { + @apply container; +} +.ae_container_help { + @apply container; +} +.ae_container_info { + @apply container; +} +.ae_container_msg { + @apply container; +} +.ae_container_warning { + @apply container; +} +.ae_container_tag { + @apply container; +} + +.ae_container_modal { + @apply container mx-auto max-w-7xl px-4 sm:px-6 lg:px-8; +} +.ae_container_modal_header { + @apply container; +} +.ae_container_modal_content { + @apply container; +} +.ae_container_modal_footer { + @apply container; +} + + +/* Standard Aether object properties: +* - id +* - name +* - enable +* - hide +* - priority +* - sort +* - group +* - notes + */ + + + + .card-footer { border-top: 1px solid hsla(0, 0%, 0%, 0.5); margin-top: 1em; diff --git a/src/routes/events/[event_id]/+page.svelte b/src/routes/events/[event_id]/+page.svelte index 0e352119..11ea5505 100644 --- a/src/routes/events/[event_id]/+page.svelte +++ b/src/routes/events/[event_id]/+page.svelte @@ -421,7 +421,7 @@ max-w-max --> {:else if $lq__event_obj?.enable || $ae_loc.trusted_access} -

+

@@ -436,7 +436,7 @@ max-w-max --> $events_loc.pres_mgmt.show_content__event_view = 'manage_files'; } }} - class="btn btn-md hover:preset-filled-secondary-500" + class="btn ae_btn_secondary" class:preset-filled-secondary-500={$events_loc.pres_mgmt.show_content__event_view == 'manage_files'} class:preset-filled-tertiary-500={$events_loc.pres_mgmt.show_content__event_view != 'manage_files'} class:hidden={!$ae_loc.administrator_access} @@ -480,7 +480,7 @@ max-w-max --> {#if !$events_loc.pres_mgmt.show_content__event_view || $events_loc.pres_mgmt.show_content__event_view == 'default'} -
+
{ @@ -494,7 +494,7 @@ max-w-max -->