diff --git a/apps/desktop/src/lib/assets/empty-state/no-branches.svg b/apps/desktop/src/lib/assets/empty-state/no-branches.svg index 06d40bd29..f241bb624 100644 --- a/apps/desktop/src/lib/assets/empty-state/no-branches.svg +++ b/apps/desktop/src/lib/assets/empty-state/no-branches.svg @@ -1,30 +1,23 @@ - - - - - + + + + + - - - - - - - - - - - - - - - - + + + + + + + + + + + + - - - diff --git a/apps/desktop/src/lib/navigation/Branches.svelte b/apps/desktop/src/lib/navigation/Branches.svelte index cbaacb43e..4d6b128a8 100644 --- a/apps/desktop/src/lib/navigation/Branches.svelte +++ b/apps/desktop/src/lib/navigation/Branches.svelte @@ -1,4 +1,5 @@
-

{props.title}

+ {#each props.children as sidebarEntrySubject} {#if sidebarEntrySubject.type === 'branchListing'} @@ -208,14 +210,10 @@ Local
+ {#if $branchListings.length > 0} {#if searchedBranches.length > 0} - +
{#if searchTerm}
@@ -313,19 +311,14 @@ display: flex; flex-direction: column; border-bottom: 1px solid var(--clr-border-2); + margin-bottom: 12px; - &:first-child { - & .group-header { - padding-top: 0px; - } + &:last-child { + border-bottom: none; + margin-bottom: 0; } } - .group-header { - padding: 20px 14px 4px; - color: var(--clr-text-3); - } - /* EMPTY STATE */ .branches__empty-state { flex: 1; diff --git a/apps/desktop/src/lib/navigation/GroupHeader.svelte b/apps/desktop/src/lib/navigation/GroupHeader.svelte new file mode 100644 index 000000000..08cfd70c9 --- /dev/null +++ b/apps/desktop/src/lib/navigation/GroupHeader.svelte @@ -0,0 +1,56 @@ + + +
{ + if (entry?.isIntersecting) { + isIntersected = false; + } else { + isIntersected = true; + } + }, + options: { + root: null, + rootMargin: '-1px 0 90% 0', + threshold: 1 + } + }} +> +

{title}

+
+ + diff --git a/apps/desktop/src/lib/shared/ScrollableContainer.svelte b/apps/desktop/src/lib/shared/ScrollableContainer.svelte index 60b79eb73..1cd03e37b 100644 --- a/apps/desktop/src/lib/shared/ScrollableContainer.svelte +++ b/apps/desktop/src/lib/shared/ScrollableContainer.svelte @@ -9,10 +9,8 @@ export let maxHeight: string | undefined = undefined; export let scrollable: boolean | undefined = undefined; - export let scrolled = false; export let wide = false; export let initiallyVisible = false; - export let showBorderWhenScrolled = false; export let padding: ScrollbarPadding = {}; export let shift = '0'; @@ -35,12 +33,7 @@ onDestroy(() => observer.disconnect()); -
+
dispatch('dragging', data.detail)} - on:scroll={(data) => { - const event = data.detail; - const target = event.target as HTMLDivElement; - - scrolled = target.scrollTop > 0; - }} />
@@ -86,9 +73,6 @@ min-height: 100%; min-width: 100%; } - .scrolled { - border-top: 1px solid var(--clr-border-2); - } /* MODIFIERS */ .fill-viewport { diff --git a/packages/ui/src/lib/avatar/Avatar.svelte b/packages/ui/src/lib/avatar/Avatar.svelte index c1a48027f..6e100c12f 100644 --- a/packages/ui/src/lib/avatar/Avatar.svelte +++ b/packages/ui/src/lib/avatar/Avatar.svelte @@ -22,7 +22,10 @@ loading="lazy" onload={() => (isLoaded = true)} class:show={isLoaded} - use:tooltip={tooltipText} + use:tooltip={{ + text: tooltipText, + delay: 500 + }} />
diff --git a/packages/ui/src/lib/sidebarEntry/SidebarEntry.svelte b/packages/ui/src/lib/sidebarEntry/SidebarEntry.svelte index 647ff28a4..f1ea00eca 100644 --- a/packages/ui/src/lib/sidebarEntry/SidebarEntry.svelte +++ b/packages/ui/src/lib/sidebarEntry/SidebarEntry.svelte @@ -55,6 +55,8 @@ observer.disconnect(); }; }); + + const tooltipDelay = 500;