refac: styling

This commit is contained in:
Timothy J. Baek 2024-05-14 22:22:15 -10:00
parent 13019acce6
commit 308a2e1de0
4 changed files with 23 additions and 18 deletions

View File

@ -8,6 +8,7 @@
mobile,
modelfiles,
settings,
showArchivedChats,
showSettings,
showSidebar,
user
@ -163,7 +164,7 @@
role={$user.role}
on:show={(e) => {
if (e.detail === 'archived-chat') {
// showArchivedChatsModal = true;
showArchivedChats.set(true);
}
}}
>

View File

@ -8,7 +8,8 @@
chatId,
tags,
showSidebar,
mobile
mobile,
showArchivedChats
} from '$lib/stores';
import { onMount, getContext } from 'svelte';
@ -49,7 +50,6 @@
let chatTitleEditId = null;
let chatTitle = '';
let showArchivedChatsModal = false;
let showShareChatModal = false;
let showDropdown = false;
let isEditing = false;
@ -186,7 +186,7 @@
<ShareChatModal bind:show={showShareChatModal} chatId={shareChatId} />
<ArchivedChatsModal
bind:show={showArchivedChatsModal}
bind:show={$showArchivedChats}
on:change={async () => {
await chats.set(await getChatList(localStorage.token));
}}
@ -581,6 +581,9 @@
shareChatId = selectedChatId;
showShareChatModal = true;
}}
archiveChatHandler={() => {
archiveChatHandler(chat.id);
}}
renameHandler={() => {
chatTitle = chat.title;
chatTitleEditId = chat.id;
@ -612,18 +615,6 @@
</button>
</ChatMenu>
<Tooltip content={$i18n.t('Archive')}>
<button
aria-label="Archive"
class=" self-center dark:hover:text-white transition"
on:click={() => {
archiveChatHandler(chat.id);
}}
>
<ArchiveBox />
</button>
</Tooltip>
{#if chat.id === $chatId}
<button
id="delete-chat-button"
@ -662,7 +653,7 @@
role={$user.role}
on:show={(e) => {
if (e.detail === 'archived-chat') {
showArchivedChatsModal = true;
showArchivedChats.set(true);
}
}}
>

View File

@ -9,10 +9,12 @@
import Tooltip from '$lib/components/common/Tooltip.svelte';
import Tags from '$lib/components/chat/Tags.svelte';
import Share from '$lib/components/icons/Share.svelte';
import ArchiveBox from '$lib/components/icons/ArchiveBox.svelte';
const i18n = getContext('i18n');
export let shareHandler: Function;
export let archiveChatHandler: Function;
export let renameHandler: Function;
export let deleteHandler: Function;
export let onClose: Function;
@ -36,7 +38,7 @@
<div slot="content">
<DropdownMenu.Content
class="w-full max-w-[180px] rounded-xl px-1 py-1.5 border border-gray-300/30 dark:border-gray-700/50 z-50 bg-white dark:bg-gray-850 dark:text-white shadow"
class="w-full max-w-[160px] rounded-xl px-1 py-1.5 border border-gray-300/30 dark:border-gray-700/50 z-50 bg-white dark:bg-gray-850 dark:text-white shadow"
sideOffset={-2}
side="bottom"
align="start"
@ -62,6 +64,16 @@
<div class="flex items-center">{$i18n.t('Rename')}</div>
</DropdownMenu.Item>
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer dark:hover:bg-gray-800 rounded-md"
on:click={() => {
archiveChatHandler();
}}
>
<ArchiveBox strokeWidth="2" />
<div class="flex items-center">{$i18n.t('Archive')}</div>
</DropdownMenu.Item>
<DropdownMenu.Item
class="flex gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer dark:hover:bg-gray-800 rounded-md"
on:click={() => {

View File

@ -39,6 +39,7 @@ export const settings: Writable<Settings> = writable({});
export const showSidebar = writable(false);
export const showSettings = writable(false);
export const showArchivedChats = writable(false);
export const showChangelog = writable(false);
type Model = OpenAIModel | OllamaModel;