Accommodate onion urls

src/app.css

@@ -119,6 +119,10 @@
   @apply overflow-hidden text-ellipsis;
 }
 
+[data-tip]::before {
+  @apply ellipsize;
+}
+
 .content-padding-x {
   @apply px-4 sm:px-8 md:px-12;
 }

src/app/commands.ts

@@ -376,7 +376,6 @@ export const checkRelayAuth = async (url: string, timeout = 3000) => {
 
 export const attemptRelayAccess = async (url: string, claim = "") => {
   const checks = [
-    () => checkRelayProfile(url),
     () => checkRelayConnection(url),
     () => checkRelayAccess(url, claim),
     () => checkRelayAuth(url),

src/app/components/MenuSpace.svelte

@@ -71,7 +71,7 @@
   <SecondaryNavSection class="max-h-screen">
     <div>
       <SecondaryNavItem class="w-full !justify-between" on:click={openMenu}>
-        <strong>{displayRelayUrl(url)}</strong>
+        <strong class="ellipsize">{displayRelayUrl(url)}</strong>
         <Icon icon="alt-arrow-down" />
       </SecondaryNavItem>
       {#if showMenu}

src/routes/spaces/[relay]/+page.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import {page} from "$app/stores"
   import type {TrustedEvent} from "@welshman/util"
+  import {displayRelayUrl} from "@welshman/util"
   import {deriveRelay} from "@welshman/app"
   import {fade} from "@lib/transition"
   import Icon from "@lib/components/Icon.svelte"
@@ -79,11 +80,11 @@
             </div>
           </div>
         </div>
-        <div>
+        <div class="min-w-0">
           <h2 class="ellipsize whitespace-nowrap text-xl">
             <RelayName {url} />
           </h2>
-          <p class="text-sm opacity-75">{url}</p>
+          <p class="ellipsize text-sm opacity-75">{displayRelayUrl(url)}</p>
         </div>
       </div>
       <RelayDescription {url} />