1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-01-04 02:46:47 +01:00

light theme

This commit is contained in:
Alex 2024-04-08 07:37:25 +02:00
parent 16543a233b
commit 372fae20d9
No known key found for this signature in database
GPG key ID: 53CD082B3A5E1082
8 changed files with 26 additions and 26 deletions

View file

@ -9,15 +9,11 @@
mdiArchiveArrowDownOutline, mdiArchiveArrowDownOutline,
mdiHeartMultiple, mdiHeartMultiple,
mdiHeartMultipleOutline, mdiHeartMultipleOutline,
mdiHomeAutomation,
mdiImageAlbum, mdiImageAlbum,
mdiImageMultiple, mdiImageMultiple,
mdiImageMultipleOutline, mdiImageMultipleOutline,
mdiMagnify, mdiMagnify,
mdiMap, mdiMap,
mdiPageLayoutSidebarLeft,
mdiSettingsHelper,
mdiSlide,
mdiTrashCanOutline, mdiTrashCanOutline,
mdiTuneVariant, mdiTuneVariant,
} from '@mdi/js'; } from '@mdi/js';

View file

@ -4,7 +4,7 @@
</script> </script>
<div <div
class="bg-gray-800 text-white min-h-[60px] grid grid-cols-[15%_70%_15%] place-items-center place-content-center rounded-2xl mx-4 mt-2 p-2" class="bg-zinc-300 dark:bg-zinc-800 text-black dark:text-white min-h-[60px] grid grid-cols-[15%_70%_15%] place-items-center place-content-center rounded-2xl mx-4 mt-2 p-2"
> >
<p class="col-start-2 col-span-1">Add to album "RANDOM"</p> <p class="col-start-2 col-span-1">Add to album "RANDOM"</p>

View file

@ -4,7 +4,7 @@
</script> </script>
<div <div
class="bg-gray-700 text-white min-h-[60px] grid grid-cols-[15%_70%_15%] place-items-center place-content-center rounded-2xl mx-4 mt-2 p-2" class="bg-zinc-200 text-black dark:bg-zinc-700 dark:text-white min-h-[60px] grid grid-cols-[15%_70%_15%] place-items-center place-content-center rounded-2xl mx-4 mt-2 p-2"
> >
<p class="col-start-2 col-span-1">And has Alex and Henry and Nate</p> <p class="col-start-2 col-span-1">And has Alex and Henry and Nate</p>

View file

@ -1,5 +1,5 @@
<div <div
class="dark:bg-immich-dark-primary text-black min-h-[60px] flex place-items-center place-content-center mx-4 mt-2 rounded-2xl" class="bg-immich-primary text-white dark:bg-immich-dark-primary dark:text-black min-h-[60px] flex place-items-center place-content-center mx-4 mt-2 rounded-2xl"
> >
When an asset is uploaded When an asset is uploaded
</div> </div>

View file

@ -3,7 +3,7 @@
</script> </script>
<div <div
class="rounded-3xl mr-2 my-4 min-h-[60px] grid grid-cols-[32px_1fr] gap-2 place-items-center p-4 place-content-center dark:bg-gray-900 hover:dark:bg-gray-800" class="rounded-3xl mr-2 my-4 min-h-[60px] grid grid-cols-[32px_1fr] gap-2 place-items-center p-4 place-content-center bg-gray-100 hover:bg-gray-200 dark:bg-gray-900 hover:dark:bg-gray-800"
> >
<div class="w-4 h-4 rounded-full bg-green-400"></div> <div class="w-4 h-4 rounded-full bg-green-400"></div>
<p class="dark:text-gray-300">Add this photo to every albums and notify everybody about this glorious asset</p> <p class="dark:text-gray-300">Add this photo to every albums and notify everybody about this glorious asset</p>

View file

@ -7,12 +7,12 @@
import { mdiPlus } from '@mdi/js'; import { mdiPlus } from '@mdi/js';
</script> </script>
<section class="h-full"> <section class="h-full overflow-scroll">
<div <div
id="workflow-control-bar" id="workflow-control-bar"
class="flex justify-between place-items-center border-b border-gray-800 p-4 bg-zinc-900" class="sticky top-0 flex justify-between place-items-center border-b border-gray-200 dark:border-gray-800 p-4 bg-zinc-50 dark:bg-zinc-900 z-20"
> >
<p class="uppercase text-lg dark:text-white"> <p class="uppercase text-lg dark:text-white font-medium">
Add this photo to every albums and notify everybody about this glorious asset Add this photo to every albums and notify everybody about this glorious asset
</p> </p>
@ -26,19 +26,23 @@
<div id="workflows-selection"> <div id="workflows-selection">
<!-- TRIGGER BLOCK --> <!-- TRIGGER BLOCK -->
<div class="translate-y-3"> <div class="translate-y-3">
<p class="pl-4 text-sm dark:text-gray-300">TRIGGER</p> <p class="pl-4 text-xs dark:text-gray-300">TRIGGER</p>
<WorkflowTriggerCard /> <WorkflowTriggerCard />
</div> </div>
<!-- VISUAL CONNECTOR --> <!-- VISUAL CONNECTOR -->
<div class="w-full grid grid-cols-3 place-items-center place-content-center"> <div class="relative w-full grid grid-cols-3 place-items-center place-content-center z-10">
<p class="col-start-1 col-span-1 justify-self-start self-end pl-4 pb-6 text-sm dark:text-gray-300">RULES</p> <p class="col-start-1 col-span-1 justify-self-start self-end pl-4 pb-6 text-xs dark:text-gray-300">RULES</p>
<div class="col-start-2 col-span-1 flex flex-col place-items-center z-10"> <div class="col-start-2 col-span-1 flex flex-col place-items-center">
<div <div
class="rounded-full border-[6px] border-immich-dark-primary h-[20px] w-[20px] bg-white translate-y-1" class="rounded-full border-[6px] border-immich-primary dark:border-immich-dark-primary h-[20px] w-[20px] bg-white translate-y-1"
></div>
<div
class="h-[60px] w-[5px] bg-white bg-gradient-to-b from-immich-primary dark:from-immich-dark-primary via-zinc-300 dark:via-gray-600 dark:to-zinc-700"
></div>
<div
class="rounded-full border-[6px] border-zinc-200 dark:border-gray-700 h-[20px] w-[20px] bg-white -translate-y-1"
></div> ></div>
<div class="h-[60px] w-[5px] bg-white bg-gradient-to-b from-immich-dark-primary via-gray-600 to-gray-700"></div>
<div class="rounded-full border-[6px] border-gray-700 h-[20px] w-[20px] bg-white -translate-y-1"></div>
</div> </div>
</div> </div>
@ -48,16 +52,16 @@
<WorkflowRuleCard /> <WorkflowRuleCard />
<div <div
class="border-2 border-gray-700 text-white min-h-[60px] flex place-items-center place-content-center rounded-2xl mx-4 mt-2" class="border-2 dark:border-gray-700 dark:text-white min-h-[60px] flex place-items-center place-content-center rounded-2xl mx-4 mt-2"
> >
<span><Icon path={mdiPlus} /></span> ADD RULE <span><Icon path={mdiPlus} /></span> ADD RULE
</div> </div>
</div> </div>
<!-- VISUAL CONNECTOR --> <!-- VISUAL CONNECTOR -->
<div class="w-full grid grid-cols-3 place-items-center place-content-center -translate-y-9"> <div class="relative w-full grid grid-cols-3 place-items-center place-content-center -translate-y-9 z-10">
<p class="col-start-1 col-span-1 justify-self-start self-end pl-4 pb-6 text-sm dark:text-gray-300">ACTIONS</p> <p class="col-start-1 col-span-1 justify-self-start self-end pl-4 pb-6 text-xs dark:text-gray-300">ACTIONS</p>
<div class="col-start-2 col-span-1 flex flex-col place-items-center z-10"> <div class="col-start-2 col-span-1 flex flex-col place-items-center">
<div class="rounded-full border-[6px] border-gray-900 h-[20px] w-[20px] bg-white translate-y-1"></div> <div class="rounded-full border-[6px] border-gray-900 h-[20px] w-[20px] bg-white translate-y-1"></div>
<div class="h-[60px] w-[5px] bg-white bg-gradient-to-b from-gray-900 via-indigo-800 to-gray-700"></div> <div class="h-[60px] w-[5px] bg-white bg-gradient-to-b from-gray-900 via-indigo-800 to-gray-700"></div>
<div class="rounded-full border-[6px] border-gray-700 h-[20px] w-[20px] bg-white -translate-y-1"></div> <div class="rounded-full border-[6px] border-gray-700 h-[20px] w-[20px] bg-white -translate-y-1"></div>
@ -69,7 +73,7 @@
<WorkflowActionCard /> <WorkflowActionCard />
<WorkflowActionCard /> <WorkflowActionCard />
<div <div
class="border-2 border-gray-500 text-white min-h-[60px] flex place-items-center place-content-center rounded-2xl mx-4 mt-2" class="border-2 dark:border-gray-500 dark:text-white min-h-[60px] flex place-items-center place-content-center rounded-2xl mx-4 mt-2"
> >
<span><Icon path={mdiPlus} /></span> ADD ACTION <span><Icon path={mdiPlus} /></span> ADD ACTION
</div> </div>

View file

@ -3,8 +3,8 @@
import WorkflowCard from '$lib/components/workflow-page/workflow-card.svelte'; import WorkflowCard from '$lib/components/workflow-page/workflow-card.svelte';
</script> </script>
<section id="workflow-list" class="border-r border-gray-800 h-full relative overflow-scroll pr-2"> <section id="workflow-list" class="border-r border-gray-200 dark:border-gray-800 h-full relative overflow-scroll pr-2">
<div class="sticky top-0 dark:bg-immich-dark-bg flex justify-between place-items-center pr-2 py-4"> <div class="sticky top-0 dark:bg-immich-dark-bg flex justify-between place-items-center pr-2 py-4 bg-immich-bg">
<p class="text-xs dark:text-white">CURRENT WORKFLOWS</p> <p class="text-xs dark:text-white">CURRENT WORKFLOWS</p>
<Button size="sm">New Workflow</Button> <Button size="sm">New Workflow</Button>
</div> </div>

View file

@ -7,7 +7,7 @@
export let data: PageData; export let data: PageData;
</script> </script>
<UserPageLayout title={data.meta.title}> <UserPageLayout title={data.meta.title} scrollbar={false}>
<section class="grid grid-cols-[25%_1fr] h-full"> <section class="grid grid-cols-[25%_1fr] h-full">
<WorkflowList /> <WorkflowList />
<WorkflowEditor /> <WorkflowEditor />