your personal website on atproto - mirror blento.app

fixes

+42 -31
-12
src/lib/website/Account.svelte
··· 25 <Button variant="ghost" onclick={logout}>Logout</Button> 26 </Popover> 27 </div> 28 - {:else if !user.isInitializing} 29 - <div 30 - class="dark:bg-base-950 border-base-200 dark:border-base-900 fixed top-4 right-4 z-20 flex flex-col gap-4 rounded-2xl border bg-white p-4 shadow-lg" 31 - > 32 - <span class="text-sm font-semibold">Login to edit your page</span> 33 - 34 - <Button 35 - onclick={async () => { 36 - await login(data.handle as ActorIdentifier); 37 - }}>Login</Button 38 - > 39 - </div> 40 {/if}
··· 25 <Button variant="ghost" onclick={logout}>Logout</Button> 26 </Popover> 27 </div> 28 {/if}
+7 -2
src/lib/website/EditableProfile.svelte
··· 8 import type { Editor } from '@tiptap/core'; 9 import MadeWithBlento from './MadeWithBlento.svelte'; 10 11 - let { data = $bindable() }: { data: WebsiteData } = $props(); 12 13 let profilePosition = $derived(getProfilePosition(data)); 14 ··· 219 220 <div class={['h-10.5 w-1', profilePosition === 'side' && '@5xl/wrapper:hidden']}></div> 221 222 - <MadeWithBlento class="hidden {profilePosition === 'side' && '@5xl/wrapper:block'}" /> 223 </div> 224 </div>
··· 8 import type { Editor } from '@tiptap/core'; 9 import MadeWithBlento from './MadeWithBlento.svelte'; 10 11 + let { 12 + data = $bindable(), 13 + hideBlento = false 14 + }: { data: WebsiteData; hideBlento?: boolean } = $props(); 15 16 let profilePosition = $derived(getProfilePosition(data)); 17 ··· 222 223 <div class={['h-10.5 w-1', profilePosition === 'side' && '@5xl/wrapper:hidden']}></div> 224 225 + {#if !hideBlento} 226 + <MadeWithBlento class="hidden {profilePosition === 'side' && '@5xl/wrapper:block'}" /> 227 + {/if} 228 </div> 229 </div>
+7 -1
src/lib/website/EditableWebsite.svelte
··· 33 import Account from './Account.svelte'; 34 import EditBar from './EditBar.svelte'; 35 import SaveModal from './SaveModal.svelte'; 36 import { user } from '$lib/atproto'; 37 import { launchConfetti } from '@foxui/visual'; 38 ··· 41 }: { 42 data: WebsiteData; 43 } = $props(); 44 45 let imageDragOver = $state(false); 46 ··· 615 ]} 616 > 617 {#if !getHideProfileSection(data)} 618 - <EditableProfile bind:data /> 619 {/if} 620 621 <div ··· 840 /> 841 842 <Toaster /> 843 </Context>
··· 33 import Account from './Account.svelte'; 34 import EditBar from './EditBar.svelte'; 35 import SaveModal from './SaveModal.svelte'; 36 + import FloatingEditButton from './FloatingEditButton.svelte'; 37 import { user } from '$lib/atproto'; 38 import { launchConfetti } from '@foxui/visual'; 39 ··· 42 }: { 43 data: WebsiteData; 44 } = $props(); 45 + 46 + // Check if floating login button will be visible (to hide MadeWithBlento) 47 + const showLoginOnEditPage = $derived(!user.isInitializing && !user.isLoggedIn); 48 49 let imageDragOver = $state(false); 50 ··· 619 ]} 620 > 621 {#if !getHideProfileSection(data)} 622 + <EditableProfile bind:data hideBlento={showLoginOnEditPage} /> 623 {/if} 624 625 <div ··· 844 /> 845 846 <Toaster /> 847 + 848 + <FloatingEditButton {data} /> 849 </Context>
-14
src/lib/website/EmptyState.svelte
··· 69 <!-- Spacer for grid height --> 70 <div class="hidden @[42rem]/grid:block" style="height: {(maxHeight / 8) * 100}cqw;"></div> 71 <div class="@[42rem]/grid:hidden" style="height: {(maxMobileHeight / 4) * 100}cqw;"></div> 72 - 73 - {#if !user.isLoggedIn} 74 - <div 75 - class="dark:bg-base-950 border-base-200 dark:border-base-900 fixed top-4 right-4 z-20 flex flex-col gap-4 rounded-2xl border bg-white p-4 shadow-lg" 76 - > 77 - <span class="text-sm font-semibold">Login to edit your page</span> 78 - 79 - <Button 80 - onclick={async () => { 81 - await login(data.handle as ActorIdentifier); 82 - }}>Login</Button 83 - > 84 - </div> 85 - {/if}
··· 69 <!-- Spacer for grid height --> 70 <div class="hidden @[42rem]/grid:block" style="height: {(maxHeight / 8) * 100}cqw;"></div> 71 <div class="@[42rem]/grid:hidden" style="height: {(maxMobileHeight / 4) * 100}cqw;"></div>
+23 -1
src/lib/website/FloatingEditButton.svelte
··· 11 12 const isOwnPage = $derived(user.isLoggedIn && user.profile?.did === data.did); 13 const isBlento = $derived(!env.PUBLIC_IS_SELFHOSTED && data.handle === 'blento.app'); 14 const showLoginOnBlento = $derived( 15 isBlento && !user.isInitializing && !user.isLoggedIn && user.profile?.handle !== data.handle 16 ); 17 const showEditBlentoButton = $derived( 18 isBlento && user.isLoggedIn && user.profile?.handle !== data.handle 19 ); 20 </script> 21 22 - {#if isOwnPage} 23 <div class="fixed bottom-6 left-6 z-49 hidden lg:block"> 24 <Button size="lg" href="{page.url}/edit"> 25 <svg ··· 37 /> 38 </svg> 39 Edit Website 40 </Button> 41 </div> 42 {:else if showLoginOnBlento}
··· 11 12 const isOwnPage = $derived(user.isLoggedIn && user.profile?.did === data.did); 13 const isBlento = $derived(!env.PUBLIC_IS_SELFHOSTED && data.handle === 'blento.app'); 14 + const isEditPage = $derived(page.url.pathname.endsWith('/edit')); 15 const showLoginOnBlento = $derived( 16 isBlento && !user.isInitializing && !user.isLoggedIn && user.profile?.handle !== data.handle 17 ); 18 + const showLoginOnEditPage = $derived(isEditPage && !user.isInitializing && !user.isLoggedIn); 19 const showEditBlentoButton = $derived( 20 isBlento && user.isLoggedIn && user.profile?.handle !== data.handle 21 ); 22 </script> 23 24 + {#if isOwnPage && !isEditPage} 25 <div class="fixed bottom-6 left-6 z-49 hidden lg:block"> 26 <Button size="lg" href="{page.url}/edit"> 27 <svg ··· 39 /> 40 </svg> 41 Edit Website 42 + </Button> 43 + </div> 44 + {:else if showLoginOnEditPage} 45 + <div class="fixed bottom-6 left-6 z-49"> 46 + <Button size="lg" onclick={() => login(data.handle as ActorIdentifier)}> 47 + <svg 48 + xmlns="http://www.w3.org/2000/svg" 49 + fill="none" 50 + viewBox="0 0 24 24" 51 + stroke-width="1.5" 52 + stroke="currentColor" 53 + class="size-5" 54 + > 55 + <path 56 + stroke-linecap="round" 57 + stroke-linejoin="round" 58 + d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" 59 + /> 60 + </svg> 61 + Login 62 </Button> 63 </div> 64 {:else if showLoginOnBlento}
+5 -1
src/lib/website/Website.svelte
··· 21 import FloatingEditButton from './FloatingEditButton.svelte'; 22 import { user } from '$lib/atproto'; 23 import { env } from '$env/dynamic/public'; 24 25 let { data }: { data: WebsiteData } = $props(); 26 27 // Check if floating edit button will be visible (to hide MadeWithBlento) 28 const isOwnPage = $derived(user.isLoggedIn && user.profile?.did === data.did); 29 const isBlento = $derived(!env.PUBLIC_IS_SELFHOSTED && data.handle === 'blento.app'); 30 const showFloatingButton = $derived( 31 - isOwnPage || 32 (isBlento && !user.isInitializing && !user.isLoggedIn) || 33 (isBlento && user.isLoggedIn && user.profile?.handle !== data.handle) 34 );
··· 21 import FloatingEditButton from './FloatingEditButton.svelte'; 22 import { user } from '$lib/atproto'; 23 import { env } from '$env/dynamic/public'; 24 + import { page } from '$app/state'; 25 26 let { data }: { data: WebsiteData } = $props(); 27 28 // Check if floating edit button will be visible (to hide MadeWithBlento) 29 const isOwnPage = $derived(user.isLoggedIn && user.profile?.did === data.did); 30 const isBlento = $derived(!env.PUBLIC_IS_SELFHOSTED && data.handle === 'blento.app'); 31 + const isEditPage = $derived(page.url.pathname.endsWith('/edit')); 32 + const showLoginOnEditPage = $derived(isEditPage && !user.isInitializing && !user.isLoggedIn); 33 const showFloatingButton = $derived( 34 + (isOwnPage && !isEditPage) || 35 + showLoginOnEditPage || 36 (isBlento && !user.isInitializing && !user.isLoggedIn) || 37 (isBlento && user.isLoggedIn && user.profile?.handle !== data.handle) 38 );