Mostly style improvements for mobile sized
This commit is contained in:
@@ -1288,12 +1288,13 @@ $effect(() => {
|
||||
|
||||
</div>
|
||||
|
||||
<section class="relative">
|
||||
<!-- <section class="relative"> -->
|
||||
<section class="relative transition-all">
|
||||
<!-- Menu Button -->
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => (show_menu = !show_menu)}
|
||||
class="btn variant-outline-secondary hover:preset-filled-secondary-500 transition py-1 px-2 w-24 *:hover:inline"
|
||||
class="btn variant-outline-secondary hover:preset-filled-secondary-500 py-1 px-2 w-24 *:hover:inline transition-all"
|
||||
title="Toggle menu"
|
||||
>
|
||||
<Menu size="1.5em" class="inline-block" />
|
||||
@@ -1301,17 +1302,31 @@ $effect(() => {
|
||||
</button>
|
||||
|
||||
<!-- Menu -->
|
||||
{#if show_menu}
|
||||
<!-- {#if show_menu} -->
|
||||
<div
|
||||
class="absolute top-12 right-0 bg-white dark:bg-gray-800 shadow-xl rounded-lg p-4 z-50 w-80 space-y-0.5 border border-gray-500"
|
||||
class="
|
||||
absolute top-12 right-0
|
||||
p-4 z-50 w-80
|
||||
space-y-0.5
|
||||
bg-white dark:bg-gray-800
|
||||
border border-gray-500
|
||||
shadow-xl rounded-lg
|
||||
min-w-72
|
||||
max-w-fit
|
||||
"
|
||||
class:hidden={show_menu}
|
||||
>
|
||||
|
||||
|
||||
<!-- <div class="flex flex-row flex-wrap gap-1 items-center justify-end"> -->
|
||||
|
||||
<!-- Category code for journal entry -->
|
||||
<!-- Give list of categories to base the new entry on -->
|
||||
<div class="flex flex-row items-center justify-evenly gap-2 w-full">
|
||||
<div
|
||||
class="
|
||||
flex flex-row items-center justify-evenly gap-2 w-full
|
||||
"
|
||||
>
|
||||
|
||||
<span class="text-sm text-gray-500 hidden sm:inline">
|
||||
Category:
|
||||
</span>
|
||||
@@ -1482,7 +1497,7 @@ $effect(() => {
|
||||
<!-- Toggle if entry should be used as a template entry (cloneable). Only visible in edit_mode. -->
|
||||
<button
|
||||
type="button"
|
||||
class:hidden={($lq__journal_obj.cfg_json?.hide_btn_template) || !$ae_loc.edit_mode}
|
||||
class:hidden={($lq__journal_obj?.cfg_json?.hide_btn_template) || !$ae_loc.edit_mode}
|
||||
onclick={() => {
|
||||
tmp_entry_obj.template = !$lq__journal_entry_obj?.template;
|
||||
update_journal_entry();
|
||||
@@ -1989,7 +2004,7 @@ $effect(() => {
|
||||
{/if}
|
||||
|
||||
</div>
|
||||
{/if}
|
||||
<!-- {/if} -->
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
@@ -115,13 +115,14 @@ function verify_journal_passcode() {
|
||||
</h2>
|
||||
|
||||
|
||||
<div class="grow flex flex-row flex-wrap gap-2 items-center justify-end">
|
||||
|
||||
<section class="relative">
|
||||
<section class="relative transition-all">
|
||||
<!-- Menu Button -->
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => (show_menu = !show_menu)}
|
||||
class="btn variant-outline-secondary hover:preset-filled-secondary-500 transition py-1 px-2 w-24 *:hover:inline"
|
||||
class="btn variant-outline-secondary hover:preset-filled-secondary-500 py-1 px-2 w-24 *:hover:inline transition-all"
|
||||
title="Toggle menu"
|
||||
>
|
||||
<Menu size="1.5em" class="inline-block" />
|
||||
@@ -129,11 +130,25 @@ function verify_journal_passcode() {
|
||||
</button>
|
||||
|
||||
<!-- Menu -->
|
||||
{#if show_menu}
|
||||
<!-- {#if show_menu} -->
|
||||
<div
|
||||
class="absolute top-12 right-0 bg-white dark:bg-gray-800 shadow-xl rounded-lg p-4 z-50 w-80 space-y-0.5 border border-gray-500"
|
||||
class="
|
||||
absolute top-12 right-0
|
||||
p-4 z-50 w-80
|
||||
space-y-0.5
|
||||
bg-white dark:bg-gray-800
|
||||
border border-gray-500
|
||||
shadow-xl rounded-lg
|
||||
min-w-72
|
||||
max-w-fit
|
||||
"
|
||||
class:hidden={show_menu}
|
||||
>
|
||||
<div class="flex flex-row flex-wrap gap-1 items-center justify-between">
|
||||
<div
|
||||
class="
|
||||
flex flex-row flex-wrap items-center justify-evenly gap-2 w-full
|
||||
"
|
||||
>
|
||||
|
||||
<span class="text-sm text-gray-500">
|
||||
<span class="fas fa-info-circle text-blue-500"></span>
|
||||
@@ -252,9 +267,10 @@ function verify_journal_passcode() {
|
||||
|
||||
|
||||
</div>
|
||||
{/if}
|
||||
<!-- {/if} -->
|
||||
</section>
|
||||
|
||||
</div>
|
||||
|
||||
</header>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user