morgan
/
chatgpt-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

don't wrap long chat names

This commit is contained in:
Webifi 2023-05-28 13:17:43 -05:00
parent 5158317343
commit 8841cfa859
1 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/lib/Sidebar.svelte
View File

@ -53,9 +53,9 @@
<ul> --> <ul> -->
{#each sortedChats as chat} {#each sortedChats as chat}
<li> <li>
<a style="position: relative" href={`#/chat/${chat.id}`} class:is-disabled={!$apiKeyStorage} class:is-active={activeChatId === chat.id}> <a class="chat-menu-item" href={`#/chat/${chat.id}`} class:is-disabled={!$apiKeyStorage} class:is-active={activeChatId === chat.id}>
<a class="is-pulled-right is-hidden px-1 py-0 greyscale has-text-weight-bold delete-button" href={'$'} on:click|preventDefault={() => delChat(chat.id)}><Fa icon={faTrash} /></a> <a class="is-pulled-right is-hidden px-1 py-0 greyscale has-text-weight-bold delete-button" href={'$'} on:click|preventDefault={() => delChat(chat.id)}><Fa icon={faTrash} /></a>
{chat.name || `Chat ${chat.id}`} <span>{chat.name || `Chat ${chat.id}`}</span>
</a> </a>
</li> </li>
{/each} {/each}
@ -125,3 +125,21 @@
</li> </li>
</ul> </ul>
</aside> </aside>
<style>
.chat-menu-item {
position: relative;
}
.chat-menu-item span {
display: block;
white-space:nowrap;
overflow: hidden;
-webkit-mask-image: linear-gradient(to right, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
mask-image: linear-gradient(to right, rgba(0,0,0,1) 90%, rgba(0,0,0,0));
}
.chat-menu-item .delete-button {
position: absolute;
right: .4em;
z-index: 200;
}
</style>