From 5843b3e33a34635f71e48f16739cfaaff26575aa Mon Sep 17 00:00:00 2001
From: Jon Staab <shtaab@gmail.com>
Date: Mon, 6 Jul 2026 12:55:03 -0700
Subject: [PATCH] Tweak room name display

---
 src/app/components/ContentLinkBlock.svelte  | 4 +---
 src/app/components/ContentLinkUrl.svelte    | 4 ++--
 src/app/components/RoomNameWithImage.svelte | 5 +++--
 src/lib/components/base.css                 | 2 +-
 4 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/app/components/ContentLinkBlock.svelte b/src/app/components/ContentLinkBlock.svelte
index 7c899613..89da62cd 100644
--- a/src/app/components/ContentLinkBlock.svelte
+++ b/src/app/components/ContentLinkBlock.svelte
@@ -59,9 +59,7 @@
 </script>
 
 {#if isRoomOrRelay}
-  <div>
-    <ContentLinkUrl {url} class="link-content whitespace-nowrap" />
-  </div>
+  <ContentLinkUrl {url} class="link-content whitespace-nowrap" />
 {:else}
   <Link {external} {href} class="my-2 block">
     <div class="overflow-hidden rounded-2xl">
diff --git a/src/app/components/ContentLinkUrl.svelte b/src/app/components/ContentLinkUrl.svelte
index 278e6863..71aedfaf 100644
--- a/src/app/components/ContentLinkUrl.svelte
+++ b/src/app/components/ContentLinkUrl.svelte
@@ -4,7 +4,7 @@
   import LinkRound from "@assets/icons/link-round.svg?dataurl"
   import Icon from "@lib/components/Icon.svelte"
   import Link from "@lib/components/Link.svelte"
-  import RoomNameWithImage from "@app/components/RoomNameWithImage.svelte"
+  import RoomName from "@app/components/RoomName.svelte"
   import {PLATFORM_URL} from "@app/env"
   import {isRoomId, splitRoomId} from "@app/groups"
   import {makeRoomPath, makeSpacePath} from "@app/routes"
@@ -50,7 +50,7 @@
 
 <Link {external} {href} class={className}>
   {#if roomReference}
-    <RoomNameWithImage {...roomReference} />
+    #<RoomName {...roomReference} />
   {:else if relayReference}
     <span class="text-primary">{displayRelayUrl(relayReference)}</span>
   {:else}
diff --git a/src/app/components/RoomNameWithImage.svelte b/src/app/components/RoomNameWithImage.svelte
index e5c4ae99..f9b2478b 100644
--- a/src/app/components/RoomNameWithImage.svelte
+++ b/src/app/components/RoomNameWithImage.svelte
@@ -5,14 +5,15 @@
   interface Props {
     h: string
     url: string
+    size?: number
     class?: string
   }
 
-  const {url, h, ...props}: Props = $props()
+  const {url, h, size, ...props}: Props = $props()
 </script>
 
 <div class="inline-flex min-w-0 items-center gap-2 {props.class}">
-  <RoomImage {url} {h} />
+  <RoomImage {url} {h} {size} />
   <div class="min-w-0 overflow-hidden text-ellipsis">
     <RoomName {url} {h} />
   </div>
diff --git a/src/lib/components/base.css b/src/lib/components/base.css
index e4ebadcc..4d321d9e 100644
--- a/src/lib/components/base.css
+++ b/src/lib/components/base.css
@@ -351,7 +351,7 @@ body.keyboard-open .room__compose {
 
 /* link-content (tiptap pill) */
 .link-content {
-  @apply bg-surface text-content max-w-full overflow-hidden px-1 text-ellipsis whitespace-nowrap;
+  @apply bg-surface-more text-content max-w-full overflow-hidden px-1 text-ellipsis whitespace-nowrap;
   border-radius: 3px;
 }