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

This commit is contained in:
Alex 2023-07-18 13:19:39 -05:00 committed by GitHub
parent f28fc8fa5c
commit 7316ad5a72
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
117 changed files with 638 additions and 555 deletions

View file

@ -19,35 +19,35 @@
<div
on:click={onButtonClicked}
on:keydown={onButtonClicked}
class="flex gap-4 justify-between place-items-center w-full transition-[padding] delay-100 duration-100 py-3 rounded-r-full hover:bg-immich-gray dark:hover:bg-immich-dark-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:text-immich-dark-primary hover:cursor-pointer
class="flex w-full place-items-center justify-between gap-4 rounded-r-full py-3 transition-[padding] delay-100 duration-100 hover:cursor-pointer hover:bg-immich-gray hover:text-immich-primary dark:text-immich-dark-fg dark:hover:bg-immich-dark-gray dark:hover:text-immich-dark-primary
{isSelected
? 'bg-immich-primary/10 dark:bg-immich-dark-primary/10 text-immich-primary dark:text-immich-dark-primary hover:bg-immich-primary/25'
? 'bg-immich-primary/10 text-immich-primary hover:bg-immich-primary/25 dark:bg-immich-dark-primary/10 dark:text-immich-dark-primary'
: ''}
pl-5 group-hover:sm:px-5 md:px-5
"
>
<div class="flex gap-4 place-items-center w-full overflow-hidden truncate">
<div class="flex w-full place-items-center gap-4 overflow-hidden truncate">
<svelte:component this={logo} size="1.5em" class="shrink-0 {flippedLogo ? '-scale-x-100' : ''}" />
<p class="font-medium text-sm">{title}</p>
<p class="text-sm font-medium">{title}</p>
</div>
<div
class="transition-[height] group-hover:sm:overflow-visible md:overflow-visible overflow-hidden duration-100 delay-1000 sm:group-hover:h-auto md:h-auto h-0"
class="h-0 overflow-hidden transition-[height] delay-1000 duration-100 sm:group-hover:h-auto group-hover:sm:overflow-visible md:h-auto md:overflow-visible"
>
{#if $$slots.moreInformation}
<div
class="relative flex justify-center select-none cursor-default"
class="relative flex cursor-default select-none justify-center"
on:mouseenter={() => (showMoreInformation = true)}
on:mouseleave={() => (showMoreInformation = false)}
>
<div class="hover:cursor-help p-1 text-gray-600 dark:text-gray-400">
<div class="p-1 text-gray-600 hover:cursor-help dark:text-gray-400">
<InformationOutline />
</div>
{#if showMoreInformation}
<div class="absolute right-6 top-0">
<div
class="flex place-items-center place-content-center whitespace-nowrap rounded-3xl shadow-lg py-3 px-6 bg-immich-bg text-immich-fg dark:bg-gray-600 dark:text-immich-dark-fg text-xs border dark:border-immich-dark-gray"
class="flex place-content-center place-items-center whitespace-nowrap rounded-3xl border bg-immich-bg px-6 py-3 text-xs text-immich-fg shadow-lg dark:border-immich-dark-gray dark:bg-gray-600 dark:text-immich-dark-fg"
class:hidden={!showMoreInformation}
transition:fade={{ duration: 200 }}
>