Tweak navigation to show profile image at all times

This commit is contained in:
Jon Staab
2024-10-18 14:37:38 -07:00
parent 96a307cb01
commit 62683d38a2
2 changed files with 20 additions and 19 deletions

View File

@@ -10,13 +10,6 @@
</script> </script>
<div class="column menu gap-2"> <div class="column menu gap-2">
<Link href="/settings/profile">
<CardButton>
<div slot="icon"><Icon icon="user-circle" size={7} /></div>
<div slot="title">Profile</div>
<div slot="info">Customize your profile</div>
</CardButton>
</Link>
<Link href="/settings/relays"> <Link href="/settings/relays">
<CardButton> <CardButton>
<div slot="icon"><Icon icon="remote-controller-minimalistic" size={7} /></div> <div slot="icon"><Icon icon="remote-controller-minimalistic" size={7} /></div>
@@ -26,7 +19,7 @@
</Link> </Link>
<Link href="/settings"> <Link href="/settings">
<CardButton> <CardButton>
<div slot="icon"><Icon icon="notes-minimalistic" size={7} /></div> <div slot="icon"><Icon icon="settings" size={7} /></div>
<div slot="title">Settings</div> <div slot="title">Settings</div>
<div slot="info">Get into the details about how Flotilla works</div> <div slot="info">Get into the details about how Flotilla works</div>
</CardButton> </CardButton>

View File

@@ -25,7 +25,7 @@
<div class="flex h-full flex-col justify-between"> <div class="flex h-full flex-col justify-between">
<div> <div>
<PrimaryNavItem href="/home/people" class="tooltip-right"> <PrimaryNavItem href="/home/people" class="tooltip-right">
<Avatar src={$userProfile?.picture} class="!h-10 !w-10" /> <Avatar icon="home-smile" class="!h-10 !w-10" />
</PrimaryNavItem> </PrimaryNavItem>
{#each getMembershipUrls($userMembership) as url (url)} {#each getMembershipUrls($userMembership) as url (url)}
<PrimaryNavItem <PrimaryNavItem
@@ -43,7 +43,10 @@
</PrimaryNavItem> </PrimaryNavItem>
</div> </div>
<div> <div>
<PrimaryNavItem title="Settings" href="/settings/profile" class="tooltip-right"> <PrimaryNavItem title="Profile" href="/settings/profile" class="tooltip-right">
<Avatar src={$userProfile?.picture} class="!h-10 !w-10" />
</PrimaryNavItem>
<PrimaryNavItem title="Settings" href="/settings/relays" class="tooltip-right">
<Avatar icon="settings" class="!h-10 !w-10" /> <Avatar icon="settings" class="!h-10 !w-10" />
</PrimaryNavItem> </PrimaryNavItem>
</div> </div>
@@ -53,15 +56,20 @@
<slot /> <slot />
<div class="fixed bottom-0 left-0 right-0 z-nav h-14 bg-base-100 md:hidden border border-top border-base-200"> <div class="fixed bottom-0 left-0 right-0 z-nav h-14 bg-base-100 md:hidden border border-top border-base-200">
<div class="m-auto flex max-w-sm justify-between px-2"> <div class="m-auto flex max-w-md justify-between px-2">
<PrimaryNavItem title="Home" on:click={showHomeMenu}> <div class="flex gap-4 sm:gap-8">
<Avatar icon="home-smile" class="!h-10 !w-10" /> <PrimaryNavItem title="Home" on:click={showHomeMenu}>
</PrimaryNavItem> <Avatar icon="home-smile" class="!h-10 !w-10" />
<PrimaryNavItem title="Spaces" on:click={showSpacesMenu}> </PrimaryNavItem>
<SpaceAvatar /> <PrimaryNavItem title="Spaces" on:click={showSpacesMenu}>
</PrimaryNavItem> <SpaceAvatar />
<PrimaryNavItem title="Settings" on:click={showSettingsMenu}> </PrimaryNavItem>
<Avatar icon="settings" class="!h-10 !w-10" /> <PrimaryNavItem title="Settings" on:click={showSettingsMenu}>
<Avatar icon="settings" class="!h-10 !w-10" />
</PrimaryNavItem>
</div>
<PrimaryNavItem title="Settings" href="/settings/profile">
<Avatar src={$userProfile?.picture} class="!h-10 !w-10" />
</PrimaryNavItem> </PrimaryNavItem>
</div> </div>
</div> </div>