helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore(web): sort tailwindcss class automatically (#3330)

Browse source
This commit is contained in:
Alex 2023-07-18 13:19:39 -05:00 • committed by GitHub
parent f28fc8fa5c
commit 7316ad5a72
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
117 changed files with 638 additions and 555 deletions
Download patch file Download diff file Expand all files Collapse all files

2
web/src/lib/components/user-settings-page/change-password-settings.svelte
View file

@ -42,7 +42,7 @@
<section class="my-4">
<div in:fade={{ duration: 500 }}>
<form autocomplete="off" on:submit|preventDefault>
<div class="flex flex-col gap-4 ml-4 mt-4">
<div class="ml-4 mt-4 flex flex-col gap-4">
<SettingInputField
inputType={SettingInputFieldType.PASSWORD}
label="PASSWORD"

12
web/src/lib/components/user-settings-page/device-card.svelte
View file

@ -22,9 +22,9 @@
};
</script>
<div class="flex flex-row w-full">
<div class="flex w-full flex-row">
<!-- TODO: Device Image -->
<div class="hidden sm:flex pr-2 justify-center items-center text-immich-primary dark:text-immich-dark-primary">
<div class="hidden items-center justify-center pr-2 text-immich-primary dark:text-immich-dark-primary sm:flex">
{#if device.deviceOS === 'Android'}
<Android size="40" />
{:else if device.deviceOS === 'iOS' || device.deviceOS === 'Mac OS'}
@ -41,8 +41,8 @@
<Help size="40" />
{/if}
</div>
<div class="pl-4 sm:pl-0 flex flex-row grow justify-between gap-1">
<div class="flex flex-col gap-1 justify-center dark:text-white">
<div class="flex grow flex-row justify-between gap-1 pl-4 sm:pl-0">
<div class="flex flex-col justify-center gap-1 dark:text-white">
<span class="text-sm">
{#if device.deviceType || device.deviceOS}
<span>{device.deviceOS || 'Unknown'} • {device.deviceType || 'Unknown'}</span>
@ -56,10 +56,10 @@
</div>
</div>
{#if !device.current}
<div class="text-sm flex flex-col justify-center">
<div class="flex flex-col justify-center text-sm">
<button
on:click={() => dispatcher('delete')}
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
class="rounded-full bg-immich-primary p-3 text-gray-100 transition-all duration-150 hover:bg-immich-primary/75 dark:bg-immich-dark-primary dark:text-gray-700"
title="Log out"
>
<TrashCanOutline size="16" />

6
web/src/lib/components/user-settings-page/device-list.svelte
View file

@ -71,13 +71,13 @@
<section class="my-4">
{#if currentDevice}
<div class="mb-6">
<h3 class="font-medium text-xs mb-2 text-immich-primary dark:text-immich-dark-primary">CURRENT DEVICE</h3>
<h3 class="mb-2 text-xs font-medium text-immich-primary dark:text-immich-dark-primary">CURRENT DEVICE</h3>
<DeviceCard device={currentDevice} />
</div>
{/if}
{#if otherDevices.length > 0}
<div class="mb-6">
<h3 class="font-medium text-xs mb-2 text-immich-primary dark:text-immich-dark-primary">OTHER DEVICES</h3>
<h3 class="mb-2 text-xs font-medium text-immich-primary dark:text-immich-dark-primary">OTHER DEVICES</h3>
{#each otherDevices as device, i}
<DeviceCard {device} on:delete={() => (deleteDevice = device)} />
{#if i !== otherDevices.length - 1}
@ -85,7 +85,7 @@
{/if}
{/each}
</div>
<h3 class="font-medium text-xs mb-2 text-immich-primary dark:text-immich-dark-primary">LOG OUT ALL DEVICES</h3>
<h3 class="mb-2 text-xs font-medium text-immich-primary dark:text-immich-dark-primary">LOG OUT ALL DEVICES</h3>
<div class="flex justify-end">
<Button color="red" size="sm" on:click={() => (deleteAll = true)}>Log Out All Devices</Button>
</div>

2
web/src/lib/components/user-settings-page/oauth-settings.svelte
View file

@ -60,7 +60,7 @@
<div in:fade={{ duration: 500 }}>
<div class="flex justify-end">
{#if loading}
<div class="flex place-items-center place-content-center">
<div class="flex place-content-center place-items-center">
<LoadingSpinner />
</div>
{:else if config.enabled}

10
web/src/lib/components/user-settings-page/partner-selection-modal.svelte
View file

@ -37,22 +37,22 @@
<BaseModal on:close={() => dispatch('close')}>
<svelte:fragment slot="title">
<span class="flex gap-2 place-items-center">
<span class="flex place-items-center gap-2">
<ImmichLogo width={24} />
<p class="font-medium">Add partner</p>
</span>
</svelte:fragment>
<div class="max-h-[300px] overflow-y-auto immich-scrollbar">
<div class="immich-scrollbar max-h-[300px] overflow-y-auto">
{#if availableUsers.length > 0}
{#each availableUsers as user}
<button
on:click={() => selectUser(user)}
class="w-full flex place-items-center gap-4 py-4 px-5 hover:bg-gray-200 dark:hover:bg-gray-700 transition-all"
class="flex w-full place-items-center gap-4 px-5 py-4 transition-all hover:bg-gray-200 dark:hover:bg-gray-700"
>
{#if selectedUsers.includes(user)}
<span
class="bg-immich-primary dark:bg-immich-dark-primary text-white dark:text-immich-dark-bg rounded-full w-12 h-12 border flex place-items-center place-content-center text-3xl dark:border-immich-dark-gray"
class="flex h-12 w-12 place-content-center place-items-center rounded-full border bg-immich-primary text-3xl text-white dark:border-immich-dark-gray dark:bg-immich-dark-primary dark:text-immich-dark-bg"
>✓</span
>
{:else}
@ -71,7 +71,7 @@
</button>
{/each}
{:else}
<p class="text-sm p-5">
<p class="p-5 text-sm">
Looks like you shared your photos with all users or you don't have any user to share with.
</p>
{/if}

2
web/src/lib/components/user-settings-page/partner-settings.svelte
View file

@ -56,7 +56,7 @@
{#if partners.length > 0}
<div class="flex flex-row gap-4">
{#each partners as partner (partner.id)}
<div class="flex rounded-lg gap-4 py-4 px-5 transition-all">
<div class="flex gap-4 rounded-lg px-5 py-4 transition-all">
<UserAvatar user={partner} size="md" autoColor />
<div class="text-left">
<p class="text-immich-fg dark:text-immich-dark-fg">

26
web/src/lib/components/user-settings-page/user-api-key-list.svelte
View file

@ -116,43 +116,43 @@
<section class="my-4">
<div class="flex flex-col gap-2" in:fade={{ duration: 500 }}>
<div class="flex justify-end mb-2">
<div class="mb-2 flex justify-end">
<Button size="sm" on:click={() => (newKey = { name: 'API Key' })}>New API Key</Button>
</div>
{#if keys.length > 0}
<table class="text-left w-full">
<table class="w-full text-left">
<thead
class="border rounded-md mb-4 bg-gray-50 flex text-immich-primary w-full h-12 dark:bg-immich-dark-gray dark:text-immich-dark-primary dark:border-immich-dark-gray"
class="mb-4 flex h-12 w-full rounded-md border bg-gray-50 text-immich-primary dark:border-immich-dark-gray dark:bg-immich-dark-gray dark:text-immich-dark-primary"
>
<tr class="flex w-full place-items-center">
<th class="text-center w-1/3 font-medium text-sm">Name</th>
<th class="text-center w-1/3 font-medium text-sm">Created</th>
<th class="text-center w-1/3 font-medium text-sm">Action</th>
<th class="w-1/3 text-center text-sm font-medium">Name</th>
<th class="w-1/3 text-center text-sm font-medium">Created</th>
<th class="w-1/3 text-center text-sm font-medium">Action</th>
</tr>
</thead>
<tbody class="overflow-y-auto rounded-md w-full block border dark:border-immich-dark-gray">
<tbody class="block w-full overflow-y-auto rounded-md border dark:border-immich-dark-gray">
{#each keys as key, i}
{#key key.id}
<tr
class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-fg ${
class={`flex h-[80px] w-full place-items-center text-center dark:text-immich-dark-fg ${
i % 2 == 0 ? 'bg-immich-gray dark:bg-immich-dark-gray/75' : 'bg-immich-bg dark:bg-immich-dark-gray/50'
}`}
>
<td class="text-sm px-4 w-1/3 text-ellipsis">{key.name}</td>
<td class="text-sm px-4 w-1/3 text-ellipsis"
<td class="w-1/3 text-ellipsis px-4 text-sm">{key.name}</td>
<td class="w-1/3 text-ellipsis px-4 text-sm"
>{new Date(key.createdAt).toLocaleDateString($locale, format)}
</td>
<td class="text-sm px-4 w-1/3 text-ellipsis">
<td class="w-1/3 text-ellipsis px-4 text-sm">
<button
on:click={() => (editKey = key)}
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
class="rounded-full bg-immich-primary p-3 text-gray-100 transition-all duration-150 hover:bg-immich-primary/75 dark:bg-immich-dark-primary dark:text-gray-700"
>
<PencilOutline size="16" />
</button>
<button
on:click={() => (deleteKey = key)}
class="bg-immich-primary dark:bg-immich-dark-primary text-gray-100 dark:text-gray-700 rounded-full p-3 transition-all duration-150 hover:bg-immich-primary/75"
class="rounded-full bg-immich-primary p-3 text-gray-100 transition-all duration-150 hover:bg-immich-primary/75 dark:bg-immich-dark-primary dark:text-gray-700"
>
<TrashCanOutline size="16" />
</button>

2
web/src/lib/components/user-settings-page/user-profile-settings.svelte
View file

@ -37,7 +37,7 @@
<section class="my-4">
<div in:fade={{ duration: 500 }}>
<form autocomplete="off" on:submit|preventDefault>
<div class="flex flex-col gap-4 ml-4 mt-4">
<div class="ml-4 mt-4 flex flex-col gap-4">
<SettingInputField
inputType={SettingInputFieldType.TEXT}
label="USER ID"