Show space url in page top bar

src/lib/components/PageBar.svelte

@@ -1,5 +1,8 @@
 <script lang="ts">
   import type {Snippet} from "svelte"
+  import {displayRelayUrl} from "@welshman/util"
+  import {page} from "$app/stores"
+  import {decodeRelay} from "@app/core/state"
 
   interface Props {
     icon?: Snippet
@@ -12,12 +15,18 @@
 </script>
 
 <div data-component="PageBar" class="cw top-sai fixed z-nav p-2 {props.class}">
-  <div
-    class="flex min-h-12 items-center justify-between gap-4 rounded-xl bg-base-100 px-4 shadow-md">
-    <div class="ellipsize flex items-center gap-4 whitespace-nowrap">
-      {@render props.icon?.()}
-      {@render props.title?.()}
+  <div class="rounded-xl bg-base-100 p-4 shadow-md h-20 md:h-12 flex flex-col justify-center">
+    <div class="flex items-center justify-between gap-4">
+      <div class="ellipsize flex items-center gap-4 whitespace-nowrap">
+        {@render props.icon?.()}
+        {@render props.title?.()}
+      </div>
+      {@render props.action?.()}
     </div>
-    {@render props.action?.()}
+    {#if $page.params.relay}
+      <div class="text-xs text-primary md:hidden">
+        {displayRelayUrl(decodeRelay($page.params.relay))}
+      </div>
+    {/if}
   </div>
 </div>

src/lib/components/PageContent.svelte

@@ -14,6 +14,6 @@
   {...props}
   bind:this={element}
   data-component="PageContent"
-  class="scroll-container cw cb fixed top-[calc(var(--sait)+3rem)] z-feature overflow-y-auto overflow-x-hidden {props.class}">
+  class="scroll-container cw cb fixed top-[calc(var(--sait)+5rem)] md:top-[calc(var(--sait)+3rem)] z-feature overflow-y-auto overflow-x-hidden {props.class}">
   {@render children?.()}
 </div>