refac: allow chat menu in mobile

This commit is contained in:
Timothy J. Baek 2024-09-18 01:30:09 +02:00
parent 771482c6e6
commit 705508a674
2 changed files with 28 additions and 14 deletions

View File

@ -82,7 +82,7 @@
}}
>
<button
class="hidden md:flex cursor-pointer px-2 py-2 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-850 transition"
class="flex cursor-pointer px-2 py-2 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-850 transition"
id="chat-context-menu-button"
>
<div class=" m-auto self-center">
@ -105,19 +105,21 @@
</Menu>
{/if}
<Tooltip content={$i18n.t('Controls')}>
<button
class=" flex cursor-pointer px-2 py-2 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-850 transition"
on:click={() => {
showControls.set(!$showControls);
}}
aria-label="Controls"
>
<div class=" m-auto self-center">
<AdjustmentsHorizontal className=" size-5" strokeWidth="0.5" />
</div>
</button>
</Tooltip>
{#if !$mobile}
<Tooltip content={$i18n.t('Controls')}>
<button
class=" flex cursor-pointer px-2 py-2 rounded-xl hover:bg-gray-50 dark:hover:bg-gray-850 transition"
on:click={() => {
showControls.set(!$showControls);
}}
aria-label="Controls"
>
<div class=" m-auto self-center">
<AdjustmentsHorizontal className=" size-5" strokeWidth="0.5" />
</div>
</button>
</Tooltip>
{/if}
<Tooltip content={$i18n.t('New Chat')}>
<button

View File

@ -17,6 +17,7 @@
import { get } from 'svelte/store';
import Clipboard from '$lib/components/icons/Clipboard.svelte';
import { toast } from 'svelte-sonner';
import AdjustmentsHorizontal from '$lib/components/icons/AdjustmentsHorizontal.svelte';
const i18n = getContext('i18n');
@ -126,6 +127,17 @@
<div class="flex items-center">{$i18n.t('Settings')}</div>
</DropdownMenu.Item> -->
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
id="chat-controls-button"
on:click={async () => {
await showControls.set(true);
}}
>
<AdjustmentsHorizontal className=" size-4" strokeWidth="0.5" />
<div class="flex items-center">{$i18n.t('Controls')}</div>
</DropdownMenu.Item>
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-gray-800 rounded-md"
id="chat-overview-button"