From ce4ecedf7e1e12ac1c8440e2a7a0e3190e41f538 Mon Sep 17 00:00:00 2001
From: Jon Staab <jstaab@protonmail.com>
Date: Tue, 18 Aug 2026 14:44:43 -0700
Subject: [PATCH] De-emphasize link meta

---
 src/app/components/PinForm.svelte | 83 ++++++++++++++++---------------
 1 file changed, 44 insertions(+), 39 deletions(-)

diff --git a/src/app/components/PinForm.svelte b/src/app/components/PinForm.svelte
index 1ae65e64..4896b363 100644
--- a/src/app/components/PinForm.svelte
+++ b/src/app/components/PinForm.svelte
@@ -9,6 +9,7 @@
 
 <script lang="ts">
   import {writable} from "svelte/store"
+  import {slide} from "@lib/transition"
   import AltArrowLeft from "@assets/icons/alt-arrow-left.svg?dataurl"
   import GallerySend from "@assets/icons/gallery-send.svg?dataurl"
   import Spinner from "@lib/components/Spinner.svelte"
@@ -83,45 +84,6 @@
       <ModalTitle>{heading}</ModalTitle>
       <ModalSubtitle>on <RelayName {url} class="text-primary" /></ModalSubtitle>
     </ModalHeader>
-    <Field>
-      {#snippet label()}
-        Title
-      {/snippet}
-      {#snippet input()}
-        <input bind:value={title} class="input w-full" placeholder="Optional title" />
-      {/snippet}
-    </Field>
-    <Field>
-      {#snippet label()}
-        Description
-      {/snippet}
-      {#snippet input()}
-        <div class="relative z-feature flex gap-2">
-          <div class="input-editor grow overflow-hidden">
-            <EditorContent {editor} />
-          </div>
-          <Button
-            data-tip="Add an image"
-            class="button button-neutral button-input tip"
-            onclick={selectFiles}
-            disabled={loading}>
-            {#if $uploading}
-              <Spinner size="xs" />
-            {:else}
-              <Icon icon={GallerySend} />
-            {/if}
-          </Button>
-        </div>
-      {/snippet}
-    </Field>
-    <Field>
-      {#snippet label()}
-        Topics
-      {/snippet}
-      {#snippet input()}
-        <StringMultiInput bind:value={topics} placeholder="Add a topic..." />
-      {/snippet}
-    </Field>
     <Field>
       {#snippet label()}
         Link
@@ -133,6 +95,49 @@
         <input bind:value class="input w-full" placeholder="URL or nevent..." />
       {/snippet}
     </Field>
+    {#if value.trim()}
+      <div transition:slide class="card card-sm flex flex-col gap-4 opacity-75">
+        <Field>
+          {#snippet label()}
+            Title
+          {/snippet}
+          {#snippet input()}
+            <input bind:value={title} class="input w-full" placeholder="Optional title" />
+          {/snippet}
+        </Field>
+        <Field>
+          {#snippet label()}
+            Description
+          {/snippet}
+          {#snippet input()}
+            <div class="relative z-feature flex gap-2">
+              <div class="input-editor grow overflow-hidden">
+                <EditorContent {editor} />
+              </div>
+              <Button
+                data-tip="Add an image"
+                class="button button-neutral button-input tip"
+                onclick={selectFiles}
+                disabled={loading}>
+                {#if $uploading}
+                  <Spinner size="xs" />
+                {:else}
+                  <Icon icon={GallerySend} />
+                {/if}
+              </Button>
+            </div>
+          {/snippet}
+        </Field>
+        <Field>
+          {#snippet label()}
+            Topics
+          {/snippet}
+          {#snippet input()}
+            <StringMultiInput bind:value={topics} placeholder="Add a topic..." />
+          {/snippet}
+        </Field>
+      </div>
+    {/if}
   </ModalBody>
   <ModalFooter>
     <Button class="button button-link" onclick={back}>