futur.blue / pdsls
forked from pds.ls/pdsls
this repo has no description
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

new switch handle/did button

Juliet db02e547 a10f177b

+17 -19
+17 -19
src/components/navbar.tsx
··· 70 70 <Show when={props.params.repo}> 71 71 {/* Repository Level */} 72 72 <div class="group relative flex items-center justify-between gap-1 rounded-md border-[0.5px] border-transparent bg-transparent px-2 transition-all duration-200 hover:border-neutral-300 hover:bg-neutral-50/40 dark:hover:border-neutral-600 dark:hover:bg-neutral-800/40"> 73 - <div class="flex basis-full items-center gap-1.5"> 74 - <Tooltip text="Repository"> 75 - <span class="iconify lucide--book-user text-neutral-500 transition-colors duration-200 group-hover:text-neutral-700 dark:text-neutral-400 dark:group-hover:text-neutral-200"></span> 73 + <div class="-ml-0.5 flex basis-full items-center gap-1 sm:-ml-1 sm:gap-0.5"> 74 + <Tooltip text={showHandle() ? "Show DID" : "Show handle"}> 75 + <button 76 + type="button" 77 + class="relative flex items-center rounded p-0.5 text-neutral-500 transition-all duration-200 hover:bg-neutral-200/70 hover:text-neutral-700 active:bg-neutral-300/70 sm:p-1 dark:text-neutral-400 dark:hover:bg-neutral-700/70 dark:hover:text-neutral-200 dark:active:bg-neutral-600/70" 78 + onclick={() => { 79 + localStorage.showHandle = !showHandle(); 80 + setShowHandle(!showHandle()); 81 + }} 82 + aria-label="Switch DID/Handle" 83 + > 84 + <span class="iconify lucide--book-user shrink-0 transition-opacity duration-200 group-hover:opacity-0"></span> 85 + <span 86 + class={`iconify absolute shrink-0 opacity-0 transition-all duration-200 group-hover:opacity-100 ${showHandle() ? "rotate-y-180" : ""} lucide--arrow-left-right`} 87 + ></span> 88 + </button> 76 89 </Tooltip> 77 90 {props.params.collection || location.pathname.includes("/labels") ? 78 91 <A ··· 87 100 </span> 88 101 } 89 102 </div> 90 - <div class="flex items-center gap-0.5"> 91 - <CopyButton content={`at://${props.params.repo}`} /> 92 - <Tooltip text={showHandle() ? "Show DID" : "Show handle"}> 93 - <button 94 - class="flex items-center rounded p-0.5 text-base transition-all duration-200 hover:bg-neutral-200/70 active:bg-neutral-300/70 sm:p-1 dark:hover:bg-neutral-700/70 dark:active:bg-neutral-600/70" 95 - onclick={() => { 96 - localStorage.showHandle = !showHandle(); 97 - setShowHandle(!showHandle()); 98 - }} 99 - > 100 - <span 101 - class={`iconify shrink-0 transition-transform duration-300 ease-in-out ${showHandle() ? "rotate-y-180" : ""} lucide--arrow-left-right`} 102 - ></span> 103 - </button> 104 - </Tooltip> 105 - </div> 103 + <CopyButton content={props.params.repo} /> 106 104 </div> 107 105 </Show> 108 106