refactor: use UI library variable for table (#18105)

This commit is contained in:
Alex
2025-05-05 17:39:52 -05:00
committed by GitHub
parent 52975eadb3
commit df2cf5d106
14 changed files with 55 additions and 67 deletions

View File

@@ -1,15 +1,15 @@
<script lang="ts">
import { flip } from 'svelte/animate';
import { slide } from 'svelte/transition';
import { AppRoute } from '$lib/constants';
import type { AlbumResponseDto } from '@immich/sdk';
import { albumViewSettings } from '$lib/stores/preferences.store';
import type { ContextMenuPosition } from '$lib/utils/context-menu';
import { type AlbumGroup, isAlbumGroupCollapsed, toggleAlbumGroupCollapsing } from '$lib/utils/album-utils';
import { mdiChevronRight } from '@mdi/js';
import AlbumCard from '$lib/components/album-page/album-card.svelte';
import Icon from '$lib/components/elements/icon.svelte';
import { AppRoute } from '$lib/constants';
import { albumViewSettings } from '$lib/stores/preferences.store';
import { type AlbumGroup, isAlbumGroupCollapsed, toggleAlbumGroupCollapsing } from '$lib/utils/album-utils';
import type { ContextMenuPosition } from '$lib/utils/context-menu';
import type { AlbumResponseDto } from '@immich/sdk';
import { mdiChevronRight } from '@mdi/js';
import { t } from 'svelte-i18n';
import { flip } from 'svelte/animate';
import { slide } from 'svelte/transition';
interface Props {
albums: AlbumResponseDto[];
@@ -48,7 +48,7 @@
<button
type="button"
onclick={() => toggleAlbumGroupCollapsing(group.id)}
class="w-full text-start mt-2 pt-2 pe-2 pb-2 rounded-md transition-colors cursor-pointer dark:text-immich-dark-fg hover:text-immich-primary dark:hover:text-immich-dark-primary hover:bg-immich-gray dark:hover:bg-immich-dark-gray"
class="w-full text-start mt-2 pt-2 pe-2 pb-2 rounded-md transition-colors cursor-pointer dark:text-immich-dark-fg hover:text-immich-primary dark:hover:text-immich-dark-primary hover:bg-subtle dark:hover:bg-immich-dark-gray"
aria-expanded={!isCollapsed}
>
<Icon

View File

@@ -1,12 +1,12 @@
<script lang="ts">
import { goto } from '$app/navigation';
import { AppRoute, dateFormats } from '$lib/constants';
import type { AlbumResponseDto } from '@immich/sdk';
import type { ContextMenuPosition } from '$lib/utils/context-menu';
import { user } from '$lib/stores/user.store';
import { locale } from '$lib/stores/preferences.store';
import { mdiShareVariantOutline } from '@mdi/js';
import Icon from '$lib/components/elements/icon.svelte';
import { AppRoute, dateFormats } from '$lib/constants';
import { locale } from '$lib/stores/preferences.store';
import { user } from '$lib/stores/user.store';
import type { ContextMenuPosition } from '$lib/utils/context-menu';
import type { AlbumResponseDto } from '@immich/sdk';
import { mdiShareVariantOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
interface Props {
@@ -31,7 +31,7 @@
</script>
<tr
class="flex h-[50px] w-full place-items-center border-[3px] border-transparent p-2 text-center odd:bg-immich-gray even:bg-immich-bg hover:cursor-pointer hover:border-immich-primary/75 odd:dark:bg-immich-dark-gray/75 even:dark:bg-immich-dark-gray/50 dark:hover:border-immich-dark-primary/75 md:p-5"
class="flex h-[50px] w-full place-items-center border-[3px] border-transparent p-2 text-center odd:bg-subtle even:bg-immich-bg hover:cursor-pointer hover:border-immich-primary/75 odd:dark:bg-immich-dark-gray/75 even:dark:bg-immich-dark-gray/50 dark:hover:border-immich-dark-primary/75 md:p-5"
onclick={() => goto(`${AppRoute.ALBUMS}/${album.id}`)}
{oncontextmenu}
>