chore: tailwindcss v4 and z-war clean up (#18358)

* chore: styling tweak

* replace full-screen-modal, update docs

* scrubber

* fix: control app bar in memory viewer

* face lift

* pr feedback

* clean up
This commit is contained in:
Alex 2025-05-19 09:32:23 -05:00 committed by GitHub
parent 2431e04a09
commit c8641d24f6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
42 changed files with 871 additions and 928 deletions

View file

@ -2,9 +2,8 @@
import FormatMessage from '$lib/components/i18n/format-message.svelte';
import { websocketStore } from '$lib/stores/websocket';
import type { ServerVersionResponseDto } from '@immich/sdk';
import { Button } from '@immich/ui';
import { Button, Modal, ModalBody, ModalFooter } from '@immich/ui';
import { t } from 'svelte-i18n';
import FullScreenModal from './full-screen-modal.svelte';
let showModal = $state(false);
@ -39,33 +38,38 @@
</script>
{#if showModal}
<FullScreenModal title="🎉 {$t('new_version_available')}" onClose={() => (showModal = false)}>
<div>
<FormatMessage key="version_announcement_message">
{#snippet children({ tag, message })}
{#if tag === 'link'}
<span class="font-medium underline">
<a href="https://github.com/immich-app/immich/releases/latest" target="_blank" rel="noopener noreferrer">
{message}
</a>
</span>
{:else if tag === 'code'}
<code>{message}</code>
{/if}
{/snippet}
</FormatMessage>
</div>
<Modal size="small" title="🎉 {$t('new_version_available')}" onClose={() => (showModal = false)} icon={false}>
<ModalBody>
<div>
<FormatMessage key="version_announcement_message">
{#snippet children({ tag, message })}
{#if tag === 'link'}
<span class="font-medium underline">
<a
href="https://github.com/immich-app/immich/releases/latest"
target="_blank"
rel="noopener noreferrer"
>
{message}
</a>
</span>
{:else if tag === 'code'}
<code>{message}</code>
{/if}
{/snippet}
</FormatMessage>
</div>
<div class="mt-4 font-medium">{$t('version_announcement_closing')}</div>
<div class="mt-4 font-medium">{$t('version_announcement_closing')}</div>
<div class="font-sm mt-8">
<code>{$t('server_version')}: {serverVersion}</code>
<br />
<code>{$t('latest_version')}: {releaseVersion}</code>
</div>
{#snippet stickyBottom()}
<div class="font-sm mt-8">
<code>{$t('server_version')}: {serverVersion}</code>
<br />
<code>{$t('latest_version')}: {releaseVersion}</code>
</div>
</ModalBody>
<ModalFooter>
<Button fullWidth shape="round" onclick={onAcknowledge}>{$t('acknowledge')}</Button>
{/snippet}
</FullScreenModal>
</ModalFooter>
</Modal>
{/if}