c-l/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2024-12-29 15:11:58 +00:00
Code Releases Activity

feat(web): add sticky date headers for asset-date-group (#7824)

Browse source 
* feat(web): add sticky date headers for asset-date-group

* use existing classes
This commit is contained in:
Sam Holton 2024-03-10 15:32:05 -04:00 committed by GitHub
parent 60c521101a
commit d257cdcbbf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 4 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
web/src/lib/components/photos-page/asset-date-group.svelte
View file

@ -127,7 +127,7 @@
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
class="mt-5 flex flex-col"
class="flex flex-col"
on:mouseenter={() => {
isMouseOverGroup = true;
assetMouseEventHandler(groupTitle, null);
@ -138,8 +138,8 @@
}}
>
<!-- Date group title -->
<p
class="mb-2 flex h-6 place-items-center text-xs font-medium text-immich-fg dark:text-immich-dark-fg md:text-sm"
<div
class="flex z-[100] sticky top-0 pt-7 pb-5 h-6 place-items-center text-xs font-medium text-immich-fg bg-immich-bg dark:bg-immich-dark-bg dark:text-immich-dark-fg md:text-sm"
style="width: {geometry[groupIndex].containerWidth}px"
>
{#if !singleSelect && ((hoveredDateGroup == groupTitle && isMouseOverGroup) || $selectedGroup.has(groupTitle))}
@ -160,7 +160,7 @@
<span class="truncate first-letter:capitalize" title={groupTitle}>
{groupTitle}
</span>
</p>
</div>
<!-- Image grid -->
<div