Browse Source

Adjusting dark mode color on the web admin panel

Alex Tran 2 years ago
parent
commit
afdfd1863f

+ 1 - 1
web/src/lib/components/admin-page/jobs/job-tile.svelte

@@ -30,7 +30,7 @@
 				</tr>
 			</thead>
 			<tbody
-				class="overflow-y-auto rounded-md w-full max-h-[320px] block border bg-white dark:border-immich-dark-gray dark:bg-[#e5e5e5] dark:text-immich-dark-bg"
+				class="overflow-y-auto rounded-md w-full max-h-[320px] block border bg-white dark:border-immich-dark-gray dark:bg-immich-dark-gray/75 dark:text-immich-dark-fg"
 			>
 				<tr class="text-center flex place-items-center w-full h-[60px]">
 					<td class="text-sm px-2 w-1/3 text-ellipsis">{jobStatus ? 'Active' : 'Idle'}</td>

+ 4 - 2
web/src/lib/components/admin-page/server-stats/server-stats-panel.svelte

@@ -47,12 +47,14 @@
 				</tr>
 			</thead>
 			<tbody
-				class="overflow-y-auto rounded-md w-full max-h-[320px] block border dark:border-immich-dark-gray dark:text-immich-dark-bg"
+				class="overflow-y-auto rounded-md w-full max-h-[320px] block border dark:border-immich-dark-gray dark:text-immich-dark-fg"
 			>
 				{#each stats.usageByUser as user, i}
 					<tr
 						class={`text-center flex place-items-center w-full h-[50px] ${
-							i % 2 == 0 ? 'bg-immich-gray dark:bg-[#e5e5e5]' : 'bg-immich-bg dark:bg-[#eeeeee]'
+							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-2 w-1/5 text-ellipsis">{getFullName(user.userId)}</td>

+ 4 - 4
web/src/lib/components/admin-page/user-management.svelte

@@ -36,12 +36,12 @@
 	>
 		{#each allUsers as user, i}
 			<tr
-				class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-bg ${
+				class={`text-center flex place-items-center w-full h-[80px] dark:text-immich-dark-fg ${
 					isDeleted(user)
-						? 'bg-red-50'
+						? 'bg-red-300 dark:bg-red-900'
 						: i % 2 == 0
-						? 'bg-immich-gray dark:bg-[#e5e5e5]'
-						: 'bg-immich-bg dark:bg-[#eeeeee]'
+						? '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/4 text-ellipsis">{user.email}</td>