Implement mechanism to remove and add shared user in album on web (#369)

* AFixed overlay issue of modal

* Added modal with existing user

* Added custom scrollbar to all pages

* Fixed Document is not define when access document DOM node in browswer

* Added context menu

* Added api to remove user from album

* Handle user leave album

* Added share button to non-shared album

* Added padding to album viewer:

* Fixed margin top of asset selection page

* Fixed issue cannot push to dockerhub
This commit is contained in:
Alex 2022-07-23 13:08:49 -05:00 committed by GitHub
parent 6021124688
commit 3b97c7729b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
20 changed files with 405 additions and 142 deletions

View file

@ -1,18 +1,41 @@
<script lang="ts">
/**
* This is the circle icon component.
*/
import { createEventDispatcher } from 'svelte';
export let logo: any;
export let backgroundColor: string = '';
export let logoColor: string = '';
export let backgroundColor: string = 'transparent';
export let hoverColor: string = '#e2e7e9';
export let logoColor: string = '#5f6368';
export let size = '24';
export let title = '';
let iconButton: HTMLButtonElement;
const dispatch = createEventDispatcher();
$: {
if (iconButton) {
iconButton.style.backgroundColor = backgroundColor;
iconButton.style.setProperty('--immich-icon-button-hover-color', hoverColor);
}
}
</script>
<button
class="rounded-full p-3 flex place-items-center place-content-center text-gray-50 hover:bg-gray-800"
class:background-color={backgroundColor}
class:color={logoColor}
{title}
bind:this={iconButton}
class={`immich-circle-icon-button rounded-full p-3 flex place-items-center place-content-center transition-all`}
on:click={() => dispatch('click')}
>
<svelte:component this={logo} size="24" />
<svelte:component this={logo} {size} color={logoColor} />
</button>
<style>
:root {
--immich-icon-button-hover-color: #d3d3d3;
}
.immich-circle-icon-button:hover {
background-color: var(--immich-icon-button-hover-color) !important;
}
</style>