self-hosted/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-06-24 04:46:50 +02:00
Code Issues Releases Activity

chore(web): prettier (#2821)

Browse Source 
Co-authored-by: Thomas Way <thomas@6f.io>
This commit is contained in:
Jason Rasmussen
2023-07-01 00:50:47 -04:00
committed by GitHub
parent 7c2f7d6c51
commit f55b3add80
242 changed files with 12794 additions and 13426 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
web/src/lib/components/shared-components/control-app-bar.svelte
View File

@ -1,72 +1,72 @@
<script lang="ts">
import { browser } from '$app/environment';
import { browser } from '$app/environment';
import { createEventDispatcher, onDestroy, onMount } from 'svelte';
import Close from 'svelte-material-icons/Close.svelte';
import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
import { fly } from 'svelte/transition';
import { createEventDispatcher, onDestroy, onMount } from 'svelte';
import Close from 'svelte-material-icons/Close.svelte';
import CircleIconButton from '../elements/buttons/circle-icon-button.svelte';
import { fly } from 'svelte/transition';
export let showBackButton = true;
export let backIcon = Close;
export let tailwindClasses = '';
export let forceDark = false;
export let showBackButton = true;
export let backIcon = Close;
export let tailwindClasses = '';
export let forceDark = false;
let appBarBorder = 'bg-immich-bg border border-transparent';
let appBarBorder = 'bg-immich-bg border border-transparent';
const dispatch = createEventDispatcher();
const dispatch = createEventDispatcher();
const onScroll = () => {
if (window.pageYOffset > 80) {
appBarBorder = 'border border-gray-200 bg-gray-50 dark:border-gray-600';
const onScroll = () => {
if (window.pageYOffset > 80) {
appBarBorder = 'border border-gray-200 bg-gray-50 dark:border-gray-600';
if (forceDark) {
appBarBorder = 'border border-gray-600';
}
} else {
appBarBorder = 'bg-immich-bg border border-transparent';
}
};
if (forceDark) {
appBarBorder = 'border border-gray-600';
}
} else {
appBarBorder = 'bg-immich-bg border border-transparent';
}
};
onMount(() => {
if (browser) {
document.addEventListener('scroll', onScroll);
}
});
onMount(() => {
if (browser) {
document.addEventListener('scroll', onScroll);
}
});
onDestroy(() => {
if (browser) {
document.removeEventListener('scroll', onScroll);
}
});
onDestroy(() => {
if (browser) {
document.removeEventListener('scroll', onScroll);
}
});
</script>
<div in:fly={{ y: 10, duration: 200 }} class="fixed top-0 w-full bg-transparent z-[100]">
<div
id="asset-selection-app-bar"
class={`grid grid-cols-3 justify-between ${appBarBorder} rounded-lg p-2 mx-2 mt-2 transition-all place-items-center ${tailwindClasses} dark:bg-immich-dark-gray ${
forceDark && 'bg-immich-dark-gray text-white'
}`}
>
<div class="flex place-items-center gap-6 dark:text-immich-dark-fg justify-self-start">
{#if showBackButton}
<CircleIconButton
on:click={() => dispatch('close-button-click')}
logo={backIcon}
backgroundColor={'transparent'}
hoverColor={'#e2e7e9'}
size={'24'}
forceDark
/>
{/if}
<slot name="leading" />
</div>
<div
id="asset-selection-app-bar"
class={`grid grid-cols-3 justify-between ${appBarBorder} rounded-lg p-2 mx-2 mt-2 transition-all place-items-center ${tailwindClasses} dark:bg-immich-dark-gray ${
forceDark && 'bg-immich-dark-gray text-white'
}`}
>
<div class="flex place-items-center gap-6 dark:text-immich-dark-fg justify-self-start">
{#if showBackButton}
<CircleIconButton
on:click={() => dispatch('close-button-click')}
logo={backIcon}
backgroundColor={'transparent'}
hoverColor={'#e2e7e9'}
size={'24'}
forceDark
/>
{/if}
<slot name="leading" />
</div>
<div class="w-full">
<slot />
</div>
<div class="w-full">
<slot />
</div>
<div class="flex place-items-center gap-1 mr-4 justify-self-end">
<slot name="trailing" />
</div>
</div>
<div class="flex place-items-center gap-1 mr-4 justify-self-end">
<slot name="trailing" />
</div>
</div>
</div>