UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-03-16 18:38:44 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

refac: styling

Browse Source
This commit is contained in:
Timothy J. Baek 2024-10-06 02:49:16 -07:00
parent 75780256d1
commit 059ac466e0
2 changed files with 12 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/lib/components/chat/Artifacts.svelte
View File

@ -26,7 +26,7 @@
getContents(); getContents();
} }
function getContents() { const getContents = () => {
contents = []; contents = [];
messages.forEach((message) => { messages.forEach((message) => {
if (message.content) { if (message.content) {
@ -101,12 +101,8 @@
} }
}); });
if (messages.length === 0 || (messages.at(-1)?.done && contents.length === 0)) {
showArtifacts.set(false);
showControls.set(false);
}
selectedContentIdx = contents ? contents.length - 1 : 0; selectedContentIdx = contents ? contents.length - 1 : 0;
} };
function navigateContent(direction: 'prev' | 'next') { function navigateContent(direction: 'prev' | 'next') {
console.log(selectedContentIdx); console.log(selectedContentIdx);
@ -149,6 +145,8 @@
}); });
}); });
}; };
onMount(() => {});
</script> </script>
<div class=" w-full h-full relative flex flex-col bg-gray-50 dark:bg-gray-850"> <div class=" w-full h-full relative flex flex-col bg-gray-50 dark:bg-gray-850">
@ -157,18 +155,16 @@
<div class=" absolute top-0 left-0 right-0 bottom-0 z-10"></div> <div class=" absolute top-0 left-0 right-0 bottom-0 z-10"></div>
{/if} {/if}
<div <div class=" absolute pointer-events-none z-50 w-full flex items-center justify-end p-4">
class=" absolute pointer-events-none z-50 w-full flex items-center justify-end p-4 dark:text-gray-100"
>
<button <button
class="self-center pointer-events-auto" class="self-center pointer-events-auto p-1 rounded-full bg-white dark:bg-gray-850"
on:click={() => { on:click={() => {
dispatch('close'); dispatch('close');
showControls.set(false); showControls.set(false);
showArtifacts.set(false); showArtifacts.set(false);
}} }}
> >
<XMark className="size-4" /> <XMark className="size-3 text-gray-900 dark:text-white" />
</button> </button>
</div> </div>
@ -186,7 +182,9 @@
></iframe> ></iframe>
</div> </div>
{:else} {:else}
<div class="m-auto text-xs">{$i18n.t('No HTML, CSS, or JavaScript content found.')}</div> <div class="m-auto font-medium text-xs text-gray-900 dark:text-white">
{$i18n.t('No HTML, CSS, or JavaScript content found.')}
</div>
{/if} {/if}
</div> </div>
</div> </div>

4
src/lib/components/chat/Messages/ContentRenderer.svelte
View File

@ -4,7 +4,7 @@
import Markdown from './Markdown.svelte'; import Markdown from './Markdown.svelte';
import LightBlub from '$lib/components/icons/LightBlub.svelte'; import LightBlub from '$lib/components/icons/LightBlub.svelte';
import { showArtifacts, showControls, showOverview } from '$lib/stores'; import { mobile, showArtifacts, showControls, showOverview } from '$lib/stores';
export let id; export let id;
export let content; export let content;
@ -73,7 +73,7 @@
on:code={(e) => { on:code={(e) => {
const { lang } = e.detail; const { lang } = e.detail;
console.log('code', lang); console.log('code', lang);
if (['html', 'svg'].includes(lang)) { if (['html', 'svg'].includes(lang) && !$mobile) {
showArtifacts.set(true); showArtifacts.set(true);
showControls.set(true); showControls.set(true);
} }