From ab604f4c8f3a6f12ab0b5fe2dd2ede723aa68775 Mon Sep 17 00:00:00 2001 From: mgabor <> Date: Wed, 24 Apr 2024 13:26:53 +0200 Subject: [PATCH] style tweaks --- .../album-page/user-selection-modal.svelte | 55 ++++++++++--------- 1 file changed, 28 insertions(+), 27 deletions(-) diff --git a/web/src/lib/components/album-page/user-selection-modal.svelte b/web/src/lib/components/album-page/user-selection-modal.svelte index 74756975ca..4bc05fc6b6 100644 --- a/web/src/lib/components/album-page/user-selection-modal.svelte +++ b/web/src/lib/components/album-page/user-selection-modal.svelte @@ -22,7 +22,7 @@ export let onClose: () => void; let users: UserResponseDto[] = []; let selectedUsers: UserResponseDto[] = []; - let role = AlbumUserRole.Editor + let role = AlbumUserRole.Editor; const dispatch = createEventDispatcher<{ select: AddUserDto[]; @@ -116,32 +116,33 @@ </div> {#if users.length > 0} - <div class="flex items-center gap-2 py-3"> - Add users as: - <Dropdown - class="flex-grow" - title="Role" - options={[ - { title: 'Editor', value: AlbumUserRole.Editor }, - { title: 'Viewer', value: AlbumUserRole.Viewer }, - ]} - selectedOption={{ title: 'Editor', value: AlbumUserRole.Editor }} - render={({ title }) => title} - on:select={({ detail: { value } }) => role = value} - /> - <div class="flex-grow"> - <Button - size="sm" - fullwidth - rounded="full" - disabled={selectedUsers.length === 0} - on:click={() => - dispatch( - 'select', - Object.values(selectedUsers).map((user) => ({ userId: user.id, role })), - )}>Add</Button - > - </div> + <div class="flex items-baseline gap-2 py-3"> + <p>Add users as:</p> + <div class="flex-grow"> + <Dropdown + title="Role" + options={[ + { title: 'Editor', value: AlbumUserRole.Editor }, + { title: 'Viewer', value: AlbumUserRole.Viewer }, + ]} + selectedOption={{ title: 'Editor', value: AlbumUserRole.Editor }} + render={({ title }) => title} + on:select={({ detail: { value } }) => (role = value)} + /> + </div> + <div class="w-[50%]"> + <Button + size="sm" + fullwidth + rounded="full" + disabled={selectedUsers.length === 0} + on:click={() => + dispatch( + 'select', + Object.values(selectedUsers).map((user) => ({ userId: user.id, role })), + )}>Add</Button + > + </div> </div> {/if}