JohnCosta27/Haystack
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

fix: styling

Browse Source
This commit is contained in:
John Costa
2025-07-02 14:28:14 +01:00
parent be302b77d4
commit a65ef5f548
1 changed files with 25 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
frontend/src/notifications/ProcessingImages.tsx
View File

@ -74,29 +74,32 @@ export const ProcessingImages: Component = () => {
<LoadingCircle status="complete" /> <LoadingCircle status="complete" />
</Show> </Show>
</Popover.Trigger> </Popover.Trigger>
<Popover.Content class="shadow-2xl flex flex-col gap-2 bg-slate-800 rounded-xl"> <Popover.Portal>
<For each={Object.entries(notifications.state.ProcessingImages)}> <Popover.Content class="shadow-2xl flex flex-col gap-2 bg-slate-800 rounded-xl p-2">
{([id, _image]) => ( <For each={Object.entries(notifications.state.ProcessingImages)}>
<Show when={_image}> {([id, _image]) => (
{(image) => ( <Show when={_image}>
<div class="flex gap-2 w-full justify-center"> {(image) => (
<img <div class="flex gap-2 w-full justify-center">
class="w-16 h-16 aspect-square" <img
alt="processing" class="w-16 h-16 aspect-square rounded"
src={`${base}/image/${id}`} alt="processing"
/> src={`${base}/image/${id}`}
<div class="flex flex-col gap-1"> />
<p class="text-slate-100">{image().ImageName}</p> <div class="flex flex-col gap-1">
<p class="text-slate-100">{image().ImageName}</p>
</div>
<LoadingCircle
status="loading"
class="ml-auto self-center"
/>
</div> </div>
<div class="ml-auto px-4 py-2 flex place-items-center"> )}
<LoadingCircle status="loading" class="ml-auto" /> </Show>
</div> )}
</div> </For>
)} </Popover.Content>
</Show> </Popover.Portal>
)}
</For>
</Popover.Content>
</Popover> </Popover>
); );
}; };