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
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 55 additions and 67 deletions

View file

@ -1,10 +1,10 @@
<script lang="ts">
import { onMount } from 'svelte';
import { getAssetThumbnailUrl } from '$lib/utils';
import { getAllAlbums, type AlbumResponseDto } from '@immich/sdk';
import { handleError } from '$lib/utils/handle-error';
import { t } from 'svelte-i18n';
import { userInteraction } from '$lib/stores/user.svelte';
import { getAssetThumbnailUrl } from '$lib/utils';
import { handleError } from '$lib/utils/handle-error';
import { getAllAlbums, type AlbumResponseDto } from '@immich/sdk';
import { onMount } from 'svelte';
import { t } from 'svelte-i18n';
let albums: AlbumResponseDto[] = $state([]);
@ -27,7 +27,7 @@
<a
href={'/albums/' + album.id}
title={album.albumName}
class="flex w-full place-items-center justify-between gap-4 rounded-e-full py-3 transition-[padding] delay-100 duration-100 hover:cursor-pointer hover:bg-immich-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary ps-10 group-hover:sm:px-10 md:px-10"
class="flex w-full place-items-center justify-between gap-4 rounded-e-full py-3 transition-[padding] delay-100 duration-100 hover:cursor-pointer hover:bg-subtle hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary ps-10 group-hover:sm:px-10 md:px-10"
>
<div>
<div

View file

@ -1,8 +1,8 @@
<script lang="ts">
import Icon from '$lib/components/elements/icon.svelte';
import { mdiChevronDown, mdiChevronLeft } from '@mdi/js';
import { resolveRoute } from '$app/paths';
import { page } from '$app/state';
import Icon from '$lib/components/elements/icon.svelte';
import { mdiChevronDown, mdiChevronLeft } from '@mdi/js';
import type { Snippet } from 'svelte';
import { t } from 'svelte-i18n';
@ -41,7 +41,7 @@
<button
type="button"
aria-label={$t('recent-albums')}
class="relative flex cursor-default pt-4 pb-4 select-none justify-center hover:cursor-pointer hover:bg-immich-gray hover:fill-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary rounded h-fill"
class="relative flex cursor-default pt-4 pb-4 select-none justify-center hover:cursor-pointer hover:bg-subtle hover:fill-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary rounded h-fill"
onclick={() => (dropdownOpen = !dropdownOpen)}
>
<Icon
@ -59,7 +59,7 @@
data-sveltekit-preload-data={preloadData ? 'hover' : 'off'}
draggable="false"
aria-current={isSelected ? 'page' : undefined}
class="flex w-full place-items-center gap-4 rounded-e-full py-3 transition-[padding] delay-100 duration-100 hover:cursor-pointer hover:bg-immich-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary
class="flex w-full place-items-center gap-4 rounded-e-full py-3 transition-[padding] delay-100 duration-100 hover:cursor-pointer hover:bg-subtle hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary
{isSelected
? 'bg-immich-primary/10 text-immich-primary hover:bg-immich-primary/10 dark:bg-immich-dark-primary/10 dark:text-immich-dark-primary'
: ''}"