style(journals): standardize Skeleton v4 preset-* classes across all journal components
- Replace all Skeleton v2 variant-* classes with v4 preset-* equivalents - variant-filled-* → preset-filled-* - variant-soft-* / variant-ghost-* → preset-tonal-* - variant-outline-* → preset-outlined-* - variant-form-material removed from inputs/selects/textareas - input-bordered removed - Fix dark mode: journal entry content hover (dark:hover:bg-blue-950) - Fix dark mode: journal obj view section/description bg and text colors - Fix modal headers: add dismissable=false + explicit X close button (all 3 journals modals) - Fix DaisyUI wrappers removed from modal_journal_entry_append - app.css: add global select padding-inline to fix text-against-border issue
This commit is contained in:
Scott Idem
@@ -63,6 +63,7 @@
|
||||
<Modal
|
||||
bind:open={show}
|
||||
autoclose={false}
|
||||
dismissable={false}
|
||||
placement="top-center"
|
||||
size="xl"
|
||||
class="relative flex flex-col mx-auto w-full bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 border border-orange-300 dark:border-orange-700 rounded-lg shadow-xl"
|
||||
@@ -70,10 +71,13 @@
|
||||
footerClass="flex flex-row gap-2 items-center justify-center w-full bg-orange-100 dark:bg-orange-900 p-4 rounded-b-lg border-t border-orange-200 dark:border-orange-800"
|
||||
>
|
||||
{#snippet header()}
|
||||
<h3 class="flex items-center gap-2 text-lg font-bold">
|
||||
<h3 class="flex-1 flex items-center gap-2 text-lg font-bold">
|
||||
<Wrench class="text-primary-500" />
|
||||
<span>Æ Journals Module Config</span>
|
||||
</h3>
|
||||
<button type="button" class="btn-icon btn-icon-sm preset-tonal-surface ml-2" onclick={() => (show = false)}>
|
||||
<X size="1.1em" />
|
||||
</button>
|
||||
{/snippet}
|
||||
|
||||
<div class="space-y-6 py-2 h-[60vh] overflow-y-auto px-4">
|
||||
@@ -84,8 +88,8 @@
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm transition-all {tab === 'form'
|
||||
? 'variant-filled-primary'
|
||||
: 'variant-soft-surface'}"
|
||||
? 'preset-filled-primary'
|
||||
: 'preset-tonal-surface'}"
|
||||
onclick={() => (tab = 'form')}
|
||||
>
|
||||
<Settings size="1.1em" class="mr-1" /> Config
|
||||
@@ -93,8 +97,8 @@
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm transition-all {tab === 'local_json'
|
||||
? 'variant-filled-primary'
|
||||
: 'variant-soft-surface'}"
|
||||
? 'preset-filled-primary'
|
||||
: 'preset-tonal-surface'}"
|
||||
onclick={() => (tab = 'local_json')}
|
||||
>
|
||||
<Database size="1.1em" class="mr-1" /> Local JSON
|
||||
@@ -102,8 +106,8 @@
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm transition-all {tab === 'session_json'
|
||||
? 'variant-filled-primary'
|
||||
: 'variant-soft-surface'}"
|
||||
? 'preset-filled-primary'
|
||||
: 'preset-tonal-surface'}"
|
||||
onclick={() => (tab = 'session_json')}
|
||||
>
|
||||
<CodeXml size="1.1em" class="mr-1" /> Session JSON
|
||||
@@ -127,7 +131,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.datetime_format}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="datetime_12_short"
|
||||
>MMM D, YY hh:mm A</option
|
||||
@@ -155,7 +159,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.time_format}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="time_12_short"
|
||||
>12-hour short (3:30 PM)</option
|
||||
@@ -235,7 +239,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.journal.qry__enabled}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="enabled">Enabled Only</option>
|
||||
<option value="not_enabled"
|
||||
@@ -252,7 +256,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.journal.qry__hidden}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="not_hidden">Visible Only</option>
|
||||
<option value="hidden">Hidden Only</option>
|
||||
@@ -267,7 +271,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.journal.qry__limit}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value={10}>10</option>
|
||||
<option value={20}>20</option>
|
||||
@@ -296,7 +300,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.entry.qry__enabled}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="enabled">Enabled Only</option>
|
||||
<option value="not_enabled"
|
||||
@@ -313,7 +317,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.entry.qry__hidden}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value="not_hidden">Visible Only</option>
|
||||
<option value="hidden">Hidden Only</option>
|
||||
@@ -328,7 +332,7 @@
|
||||
>
|
||||
<select
|
||||
bind:value={tmp_config.entry.qry__limit}
|
||||
class="select select-sm variant-form-material"
|
||||
class="select select-sm"
|
||||
>
|
||||
<option value={10}>10</option>
|
||||
<option value={20}>20</option>
|
||||
@@ -398,14 +402,14 @@
|
||||
<div class="flex gap-4">
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-ghost-surface font-bold min-w-[100px]"
|
||||
class="btn preset-tonal-surface font-bold min-w-[100px]"
|
||||
onclick={() => (show = false)}
|
||||
>
|
||||
<X size="1.2em" class="mr-2" /> Cancel
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn variant-filled-primary font-bold shadow-lg min-w-[120px]"
|
||||
class="btn preset-filled-primary font-bold shadow-lg min-w-[120px]"
|
||||
onclick={handle_save}
|
||||
>
|
||||
<Check size="1.2em" class="mr-2" /> Save Changes
|
||||
|
||||
Reference in New Issue
Block a user