KevinMidboe/immich
1
0
Fork 0
mirror of https://github.com/KevinMidboe/immich.git synced 2025-10-29 17:40:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(web): sort tailwindcss class automatically (#3330)

Browse Source
This commit is contained in:
Alex
2023-07-18 13:19:39 -05:00
committed by GitHub
parent f28fc8fa5c
commit 7316ad5a72
117 changed files with 638 additions and 555 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/lib/components/photos-page/asset-date-group.svelte
View File

@@ -155,7 +155,7 @@
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
class="flex flex-col mt-5"
class="mt-5 flex flex-col"
on:mouseenter={() => {
isMouseOverGroup = true;
assetMouseEventHandler(dateGroupTitle, null);
@@ -167,7 +167,7 @@
>
<!-- Date group title -->
<p
class="font-medium text-xs md:text-sm text-immich-fg dark:text-immich-dark-fg mb-2 flex place-items-center h-6"
class="mb-2 flex h-6 place-items-center text-xs font-medium text-immich-fg dark:text-immich-dark-fg md:text-sm"
style="width: {geometry[groupIndex].containerWidth}px"
>
{#if (hoveredDateGroup == dateGroupTitle && isMouseOverGroup) || $selectedGroup.has(dateGroupTitle)}
@@ -185,7 +185,7 @@
</div>
{/if}
<span class="first-letter:capitalize truncate" title={dateGroupTitle}>
<span class="truncate first-letter:capitalize" title={dateGroupTitle}>
{dateGroupTitle}
</span>
</p>

2
web/src/lib/components/photos-page/asset-grid.svelte
View File

@@ -283,7 +283,7 @@
<!-- Right margin MUST be equal to the width of immich-scrubbable-scrollbar -->
<section
id="asset-grid"
class="overflow-y-auto ml-4 mb-4 mr-[60px] scrollbar-hidden"
class="scrollbar-hidden mb-4 ml-4 mr-[60px] overflow-y-auto"
bind:clientHeight={viewportHeight}
bind:clientWidth={viewportWidth}
bind:this={assetGridElement}

14
web/src/lib/components/photos-page/memory-lane.svelte
View File

@@ -37,7 +37,7 @@
<section
id="memory-lane"
bind:this={memoryLaneElement}
class="relative overflow-x-hidden whitespace-nowrap mt-5 transition-all"
class="relative mt-5 overflow-x-hidden whitespace-nowrap transition-all"
bind:offsetWidth
on:scroll={onScroll}
>
@@ -46,7 +46,7 @@
{#if canScrollLeft}
<div class="absolute left-4 top-[6rem] z-20" transition:fade={{ duration: 200 }}>
<button
class="rounded-full opacity-50 hover:opacity-100 p-2 border border-gray-500 bg-gray-100 text-gray-500"
class="rounded-full border border-gray-500 bg-gray-100 p-2 text-gray-500 opacity-50 hover:opacity-100"
on:click={scrollLeft}
>
<ChevronLeft size="36" /></button
@@ -56,7 +56,7 @@
{#if canScrollRight}
<div class="absolute right-4 top-[6rem] z-20" transition:fade={{ duration: 200 }}>
<button
class="rounded-full opacity-50 hover:opacity-100 p-2 border border-gray-500 bg-gray-100 text-gray-500"
class="rounded-full border border-gray-500 bg-gray-100 p-2 text-gray-500 opacity-50 hover:opacity-100"
on:click={scrollRight}
>
<ChevronRight size="36" /></button
@@ -69,18 +69,18 @@
<div class="inline-block" bind:offsetWidth={innerWidth}>
{#each $memoryStore as memory, i (memory.title)}
<button
class="memory-card relative inline-block mr-8 rounded-xl aspect-video h-[215px]"
class="memory-card relative mr-8 inline-block aspect-video h-[215px] rounded-xl"
on:click={() => goto(`/memory?memory=${i}`)}
>
<img
class="rounded-xl h-full w-full object-cover"
class="h-full w-full rounded-xl object-cover"
src={api.getAssetThumbnailUrl(memory.assets[0].id, 'JPEG')}
alt={memory.title}
draggable="false"
/>
<p class="absolute bottom-2 left-4 text-lg text-white z-10">{memory.title}</p>
<p class="absolute bottom-2 left-4 z-10 text-lg text-white">{memory.title}</p>
<div
class="absolute top-0 left-0 w-full h-full rounded-xl bg-gradient-to-t from-black/40 via-transparent to-transparent z-0 hover:bg-black/20 transition-all"
class="absolute left-0 top-0 z-0 h-full w-full rounded-xl bg-gradient-to-t from-black/40 via-transparent to-transparent transition-all hover:bg-black/20"
/>
</button>
{/each}