mirror of
https://github.com/immich-app/immich
synced 2025-11-07 17:27:20 +00:00
feat(web,a11y): consolidate BaseModal into FullScreenModal (#8787)
* feat(web,a11y): FullScreenModal sticky buttons * chore(web): combine BaseModal into FullScreenModal --------- Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
parent
28f591d01b
commit
bcdec25843
29 changed files with 251 additions and 337 deletions
|
|
@ -8,12 +8,12 @@
|
|||
import { SharedLinkType, createSharedLink, updateSharedLink, type SharedLinkResponseDto } from '@immich/sdk';
|
||||
import { mdiContentCopy, mdiLink } from '@mdi/js';
|
||||
import { createEventDispatcher } from 'svelte';
|
||||
import BaseModal from '../base-modal.svelte';
|
||||
import type { ImmichDropDownOption } from '../dropdown-button.svelte';
|
||||
import DropdownButton from '../dropdown-button.svelte';
|
||||
import { NotificationType, notificationController } from '../notification/notification';
|
||||
import SettingInputField, { SettingInputFieldType } from '../settings/setting-input-field.svelte';
|
||||
import SettingSwitch from '../settings/setting-switch.svelte';
|
||||
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
|
||||
|
||||
export let onClose: () => void;
|
||||
export let albumId: string | undefined = undefined;
|
||||
|
|
@ -159,8 +159,8 @@
|
|||
};
|
||||
</script>
|
||||
|
||||
<BaseModal id="create-shared-link-modal" title={getTitle()} icon={mdiLink} {onClose}>
|
||||
<section class="mx-6 mb-6">
|
||||
<FullScreenModal id="create-shared-link-modal" title={getTitle()} icon={mdiLink} {onClose}>
|
||||
<section>
|
||||
{#if shareType === SharedLinkType.Album}
|
||||
{#if !editingLink}
|
||||
<div>Let anyone with the link see photos and people in this album.</div>
|
||||
|
|
@ -246,29 +246,22 @@
|
|||
</div>
|
||||
</section>
|
||||
|
||||
<hr />
|
||||
|
||||
<section slot="sticky-bottom">
|
||||
<svelte:fragment slot="sticky-bottom">
|
||||
{#if !sharedLink}
|
||||
{#if editingLink}
|
||||
<div class="flex justify-end">
|
||||
<Button size="sm" on:click={handleEditLink}>Confirm</Button>
|
||||
</div>
|
||||
<Button size="sm" fullwidth on:click={handleEditLink}>Confirm</Button>
|
||||
{:else}
|
||||
<div class="flex justify-end">
|
||||
<Button size="sm" on:click={handleCreateSharedLink}>Create link</Button>
|
||||
</div>
|
||||
<Button size="sm" fullwidth on:click={handleCreateSharedLink}>Create link</Button>
|
||||
{/if}
|
||||
{:else}
|
||||
<div class="flex w-full gap-4">
|
||||
<div class="flex w-full gap-2">
|
||||
<input class="immich-form-input w-full" bind:value={sharedLink} disabled />
|
||||
|
||||
<LinkButton on:click={() => (sharedLink ? copyToClipboard(sharedLink) : '')}>
|
||||
<div class="flex place-items-center gap-2 text-sm">
|
||||
<Icon path={mdiContentCopy} size="18" />
|
||||
<Icon path={mdiContentCopy} ariaLabel="Copy link to clipboard" size="18" />
|
||||
</div>
|
||||
</LinkButton>
|
||||
</div>
|
||||
{/if}
|
||||
</section>
|
||||
</BaseModal>
|
||||
</svelte:fragment>
|
||||
</FullScreenModal>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue