KevinMidboe/immich
1
0
Fork 0
mirror of https://github.com/KevinMidboe/immich.git synced 2026-01-16 22:25:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(web): centralize buttons (#2200)

Browse Source
This commit is contained in:
Michel Heusschen
2023-04-07 18:45:00 +02:00
committed by GitHub
parent 767410959a
commit ab5b92ae68
42 changed files with 248 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
web/src/routes/(user)/albums/+page.svelte
View File

@@ -9,6 +9,7 @@
import { useAlbums } from './albums.bloc';
import empty1Url from '$lib/assets/empty-1.svg';
import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
export let data: PageData;
@@ -32,15 +33,12 @@
<UserPageLayout user={data.user} title={data.meta.title}>
<div slot="buttons">
<button
on:click={handleCreateAlbum}
class="immich-text-button text-sm dark:hover:bg-immich-dark-primary/25 dark:text-immich-dark-fg"
>
<span>
<LinkButton on:click={handleCreateAlbum}>
<div class="flex place-items-center gap-2 text-sm">
<PlusBoxOutline size="18" />
</span>
<p>Create album</p>
</button>
Create album
</div>
</LinkButton>
</div>
<!-- Album Card -->

2
web/src/routes/(user)/favorites/+page.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts">
import CircleIconButton from '$lib/components/shared-components/circle-icon-button.svelte';
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';
import CreateSharedLinkModal from '$lib/components/shared-components/create-share-link-modal/create-shared-link-modal.svelte';
import GalleryViewer from '$lib/components/shared-components/gallery-viewer/gallery-viewer.svelte';

2
web/src/routes/(user)/photos/+page.svelte
View File

@@ -2,7 +2,7 @@
import { goto } from '$app/navigation';
import AssetGrid from '$lib/components/photos-page/asset-grid.svelte';
import AlbumSelectionModal from '$lib/components/shared-components/album-selection-modal.svelte';
import CircleIconButton from '$lib/components/shared-components/circle-icon-button.svelte';
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
import ContextMenu from '$lib/components/shared-components/context-menu/context-menu.svelte';
import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
import ControlAppBar from '$lib/components/shared-components/control-app-bar.svelte';

27
web/src/routes/(user)/sharing/+page.svelte
View File

@@ -11,6 +11,7 @@
} from '$lib/components/shared-components/notification/notification';
import empty2Url from '$lib/assets/empty-2.svg';
import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
export let data: PageData;
@@ -34,25 +35,19 @@
<UserPageLayout user={data.user} title={data.meta.title}>
<div class="flex" slot="buttons">
<button
on:click={createSharedAlbum}
class="flex place-items-center gap-1 text-sm hover:bg-immich-primary/5 p-2 rounded-lg font-medium hover:text-gray-700 dark:hover:bg-immich-dark-primary/25 dark:text-immich-dark-fg"
>
<span>
<LinkButton on:click={createSharedAlbum}>
<div class="flex place-items-center gap-1 text-sm">
<PlusBoxOutline size="18" />
</span>
<p>Create shared album</p>
</button>
Create shared album
</div>
</LinkButton>
<button
on:click={() => goto('/sharing/sharedlinks')}
class="flex place-items-center gap-1 text-sm hover:bg-immich-primary/5 p-2 rounded-lg font-medium hover:text-gray-700 dark:hover:bg-immich-dark-primary/25 dark:text-immich-dark-fg"
>
<span>
<LinkButton on:click={() => goto('/sharing/sharedlinks')}>
<div class="flex place-items-center gap-1 text-sm">
<Link size="18" />
</span>
<p>Shared links</p>
</button>
Shared links
</div>
</LinkButton>
</div>
<section>

9
web/src/routes/+page.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
import { goto } from '$app/navigation';
import Button from '$lib/components/elements/buttons/button.svelte';
import ImmichLogo from '$lib/components/shared-components/immich-logo.svelte';
</script>
@@ -13,10 +14,8 @@
>
Welcome to IMMICH Web
</h1>
<button
class="border px-4 py-4 rounded-md bg-immich-primary dark:bg-immich-dark-primary dark:text-immich-dark-gray dark:border-immich-dark-gray hover:bg-immich-primary/75 text-white font-bold w-[200px]"
on:click={() => goto('/auth/register')}
>Getting Started
</button>
<Button size="lg" rounded="lg" on:click={() => goto('/auth/register')}>
<span class="font-bold px-2">Getting Started</span>
</Button>
</div>
</section>

13
web/src/routes/admin/user-management/+page.svelte
View File

@@ -12,6 +12,7 @@
import RestoreDialogue from '$lib/components/admin-page/restore-dialoge.svelte';
import { page } from '$app/stores';
import { locale } from '$lib/stores/preferences.store';
import Button from '$lib/components/elements/buttons/button.svelte';
let allUsers: UserResponseDto[] = [];
let shouldShowEditUserForm = false;
@@ -151,12 +152,8 @@
Please inform the user, and they will need to change the password at the next log-on.
</p>
<div class="flex w-full">
<button
on:click={() => (shouldShowInfoPanel = false)}
class="mt-6 bg-immich-primary hover:bg-immich-primary/75 px-6 py-3 text-white rounded-full shadow-md w-full font-medium"
>Done
</button>
<div class="flex w-full mt-6">
<Button fullwidth on:click={() => (shouldShowInfoPanel = false)}>Done</Button>
</div>
</div>
</FullScreenModal>
@@ -221,7 +218,5 @@
</tbody>
</table>
<button on:click={() => (shouldShowCreateUserForm = true)} class="immich-btn-primary"
>Create user</button
>
<Button size="sm" on:click={() => (shouldShowCreateUserForm = true)}>Create user</Button>
</section>