feat(web) dark mode (#867)

This commit is contained in:
Alex
2022-10-26 11:10:48 -05:00
committed by GitHub
parent ae96508e15
commit f94176a910
39 changed files with 362 additions and 186 deletions

View File

@@ -22,7 +22,7 @@
<div class="flex flex-col gap-5">
<div>
<p class="text-sm">TOTAL USAGE</p>
<p class="text-sm dark:text-immich-dark-fg">TOTAL USAGE</p>
<div class="flex mt-5 justify-between">
<StatsCard logo={CameraIris} title={'PHOTOS'} value={stats.photos.toString()} />
@@ -33,9 +33,11 @@
</div>
<div>
<p class="text-sm">USER USAGE DETAIL</p>
<p class="text-sm dark:text-immich-dark-fg">USER USAGE DETAIL</p>
<table class="text-left w-full mt-5">
<thead class="border rounded-md mb-4 bg-gray-50 flex text-immich-primary w-full h-12">
<thead
class="border rounded-md mb-4 bg-gray-50 dark:bg-immich-dark-gray dark:border-immich-dark-gray flex text-immich-primary dark:text-immich-dark-primary w-full h-12"
>
<tr class="flex w-full place-items-center">
<th class="text-center w-1/5 font-medium text-sm">User</th>
<th class="text-center w-1/5 font-medium text-sm">Photos</th>
@@ -44,11 +46,13 @@
<th class="text-center w-1/5 font-medium text-sm">Size</th>
</tr>
</thead>
<tbody class="overflow-y-auto rounded-md w-full max-h-[320px] block border">
<tbody
class="overflow-y-auto rounded-md w-full max-h-[320px] block border dark:border-immich-dark-gray dark:text-immich-dark-bg"
>
{#each stats.usageByUser as user, i}
<tr
class={`text-center flex place-items-center w-full h-[50px] ${
i % 2 == 0 ? 'bg-immich-gray' : 'bg-immich-bg'
i % 2 == 0 ? 'bg-immich-gray dark:bg-[#e5e5e5]' : 'bg-immich-bg dark:bg-[#eeeeee]'
}`}
>
<td class="text-sm px-2 w-1/5 text-ellipsis">{getFullName(user.userId)}</td>