github-mirrors/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-05-18 03:10:24 +03:00
Code Issues Packages Projects Releases Wiki Activity

refactor: page container (#25038)

Browse Source
This commit is contained in:
Jason Rasmussen
2026-01-05 10:44:29 -05:00
committed by GitHub
parent eb718145c0
commit 57fca378bc
4 changed files with 32 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/lib/components/server-statistics/ServerStatisticsPanel.svelte
+6 -5
View File
@@ -3,7 +3,7 @@
import { locale } from '$lib/stores/preferences.store';
import { getByteUnitString, getBytesWithUnit } from '$lib/utils/byte-units';
import type { ServerStatsResponseDto } from '@immich/sdk';
import { Icon } from '@immich/ui';
import { Heading, Icon } from '@immich/ui';
import { mdiCameraIris, mdiChartPie, mdiPlayCircle } from '@mdi/js';
import { t } from 'svelte-i18n';
@@ -25,15 +25,16 @@
let [statsUsage, statsUsageUnit] = $derived(getBytesWithUnit(stats.usage, stats.usage > TiB ? 2 : 0));
</script>
<div class="flex flex-col gap-5">
<div class="flex flex-col gap-5 my-4">
<div>
<p class="text-sm dark:text-immich-dark-fg uppercase">{$t('total_usage')}</p>
<Heading size="tiny" class="mb-2">{$t('total_usage')}</Heading>
<div class="mt-5 hidden justify-between lg:flex gap-4">
<div class="hidden justify-between lg:flex gap-4">
<StatsCard icon={mdiCameraIris} title={$t('photos')} value={stats.photos} />
<StatsCard icon={mdiPlayCircle} title={$t('videos')} value={stats.videos} />
<StatsCard icon={mdiChartPie} title={$t('storage')} value={statsUsage} unit={statsUsageUnit} />
</div>
<div class="mt-5 flex lg:hidden">
<div class="flex flex-col justify-between rounded-3xl bg-subtle p-5 dark:bg-immich-dark-gray">
<div class="flex flex-wrap gap-x-12">
@@ -78,7 +79,7 @@
</div>
<div>
<p class="text-sm dark:text-immich-dark-fg uppercase">{$t('user_usage_detail')}</p>
<Heading size="tiny" class="mb-2">{$t('user_usage_detail')}</Heading>
<table class="mt-5 w-full text-start">
<thead
class="mb-4 flex h-12 w-full rounded-md border bg-gray-50 text-primary dark:border-immich-dark-gray dark:bg-immich-dark-gray"