links and details

11 files changed, 94 insertions, 74 deletions

diff --git a/src/locales/de.json b/src/locales/de.json
index a8e6213b..9e83f850 100644
--- a/src/locales/de.json
+++ b/src/locales/de.json
@@ -311,7 +311,9 @@
 		"notes": "Anmerkungen",
 		"pay": "Zahlen",
 		"details": "Einzelheiten",
-		"noMessages": "Sie haben noch keine Nachrichten gesendet oder empfangen"
+		"noMessages": "Sie haben noch keine Nachrichten gesendet oder empfangen",
+		"install": "App installieren",
+		"moreDetails": "Links und Details"
 	},
 	"payments": {
 		"header": "Transaktionen",
diff --git a/src/locales/el.json b/src/locales/el.json
index 86b0ea57..c4a2ba3f 100644
--- a/src/locales/el.json
+++ b/src/locales/el.json
@@ -305,7 +305,9 @@
 		"welcome": "Καλως ΗΡΘΑΤΕ! Το υπόλοιπο του λογαριασμού σας είναι κενό. Μπορείτε να ξεκινήσετε κάνοντας μια κατάθεση ή ζητώντας από κάποιον να σας πληρώσει.",
 		"showBalance": "Εμφάνιση υπολοίπου",
 		"details": "Λεπτομέριες",
-		"noMessages": "Δεν έχετε στείλει ή λάβει ακόμη μηνύματα"
+		"noMessages": "Δεν έχετε στείλει ή λάβει ακόμη μηνύματα",
+		"install": "Εγκαταστήστε την εφαρμογή",
+		"moreDetails": "Σύνδεσμοι και λεπτομέρειες"
 	},
 	"payments": {
 		"amount": "Ποσό",
diff --git a/src/locales/en.json b/src/locales/en.json
index 60ec06dd..944af419 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -155,8 +155,8 @@
 		"subheader": "Latest Updates"
 	},
 	"user": {
-    "install": "Install app",
-		"info": "Info",
+		"install": "Install app",
+		"moreDetails": "Links and details",
 		"noMessages": "You have not sent or received any messages yet",
 		"profilePage": "Profile page",
 		"nostrPubkey": "Nostr pubkey",
diff --git a/src/locales/es.json b/src/locales/es.json
index 0bf78d84..b87c9bdc 100644
--- a/src/locales/es.json
+++ b/src/locales/es.json
@@ -288,7 +288,9 @@
 			"send": "Enviar"
 		},
 		"details": "Detalles",
-		"noMessages": "Aún no has enviado ni recibido ningún mensaje"
+		"noMessages": "Aún no has enviado ni recibido ningún mensaje",
+		"install": "Instalar aplicación",
+		"moreDetails": "Enlaces y detalles"
 	},
 	"payments": {
 		"networkFee": "Tarifa de Red",
diff --git a/src/locales/fa.json b/src/locales/fa.json
index cd8b0ba3..1a8bfa68 100644
--- a/src/locales/fa.json
+++ b/src/locales/fa.json
@@ -288,7 +288,9 @@
 			"send": "ارسال"
 		},
 		"details": "جزئیات",
-		"noMessages": "شما هنوز هیچ پیامی ارسال یا دریافت نکرده اید"
+		"noMessages": "شما هنوز هیچ پیامی ارسال یا دریافت نکرده اید",
+		"install": "برنامه را نصب کنید",
+		"moreDetails": "لینک ها و جزئیات"
 	},
 	"payments": {
 		"networkFee": "هزینه شبکه",
diff --git a/src/locales/fr.json b/src/locales/fr.json
index a365128c..a6a223ea 100644
--- a/src/locales/fr.json
+++ b/src/locales/fr.json
@@ -284,7 +284,9 @@
 		"profilePage": "Page de profil",
 		"nostrPubkey": "Clé publique nostr",
 		"details": "Détails",
-		"noMessages": "Vous n'avez pas encore envoyé ou reçu de messages"
+		"noMessages": "Vous n'avez pas encore envoyé ou reçu de messages",
+		"install": "Installer l'application",
+		"moreDetails": "Liens et détails"
 	},
 	"news": {
 		"header": "Nouvelles",
diff --git a/src/locales/ja.json b/src/locales/ja.json
index b0725305..40fe6174 100644
--- a/src/locales/ja.json
+++ b/src/locales/ja.json
@@ -288,7 +288,9 @@
 			"send": "送信"
 		},
 		"details": "詳細",
-		"noMessages": "まだメッセージを送信または受信していません"
+		"noMessages": "まだメッセージを送信または受信していません",
+		"install": "アプリをインストールする",
+		"moreDetails": "リンクと詳細"
 	},
 	"payments": {
 		"networkFee": "ネットワーク料金",
diff --git a/src/locales/pt.json b/src/locales/pt.json
index fc21a764..14b5e287 100644
--- a/src/locales/pt.json
+++ b/src/locales/pt.json
@@ -309,7 +309,9 @@
 		"profilePage": "Página de perfil",
 		"nostrPubkey": "Nostr pubkey",
 		"details": "Detalhes",
-		"noMessages": "Você ainda não enviou ou recebeu nenhuma mensagem"
+		"noMessages": "Você ainda não enviou ou recebeu nenhuma mensagem",
+		"install": "Instalar aplicativo",
+		"moreDetails": "Links e detalhes"
 	},
 	"payments": {
 		"amount": "Quantidade",
diff --git a/src/locales/ru.json b/src/locales/ru.json
index 5fb2f868..9a40771c 100644
--- a/src/locales/ru.json
+++ b/src/locales/ru.json
@@ -287,7 +287,9 @@
 			"send": "Отправлять"
 		},
 		"details": "Подробности",
-		"noMessages": "Вы еще не отправляли и не получали сообщений"
+		"noMessages": "Вы еще не отправляли и не получали сообщений",
+		"install": "Установить приложение",
+		"moreDetails": "Ссылки и подробности"
 	},
 	"payments": {
 		"networkFee": "Сетевая плата",
diff --git a/src/locales/zh.json b/src/locales/zh.json
index 2a56c780..a4ef49fe 100644
--- a/src/locales/zh.json
+++ b/src/locales/zh.json
@@ -288,7 +288,9 @@
 			"send": "发送"
 		},
 		"details": "细节",
-		"noMessages": "您尚未发送或接收任何消息"
+		"noMessages": "您尚未发送或接收任何消息",
+		"install": "安装应用程序",
+		"moreDetails": "链接和详细信息"
 	},
 	"payments": {
 		"networkFee": "网络费",
diff --git a/src/routes/(app)/[username]/(profile)/+layout.svelte b/src/routes/(app)/[username]/(profile)/+layout.svelte
index 0520f1b8..2822fe80 100644
--- a/src/routes/(app)/[username]/(profile)/+layout.svelte
+++ b/src/routes/(app)/[username]/(profile)/+layout.svelte
@@ -97,6 +97,7 @@
       </div>
     {/if}
 
+    <div>
     <div class="flex justify-center gap-2">
       <a href={`/${subject.pubkey}/follows`}
         ><b>{subject.follows.length}</b>
@@ -108,6 +109,70 @@
       >
     </div>
 
+    <button type="button" on:click={toggleDetails} class="flex text-base text-secondary mx-auto">
+      <div class="mt-1">
+        {$t("user.moreDetails")}
+      </div>
+      <Icon
+        icon="chevron-left"
+        style={`w-6 mr-2 my-auto ${showDetails ? "-rotate-90" : "rotate-180"}`}
+      />
+    </button>
+    </div>
+
+    {#if showDetails}
+      <div class="text-xl space-y-5">
+        <div>
+          <div class="font-bold">{$t("user.profilePage")}</div>
+          <div class="flex gap-4">
+            <div class="break-all grow text-secondary">
+              {profile}
+            </div>
+            <div class="flex mb-auto gap-1">
+              <button class="my-auto" on:click={() => copy(profile)}
+                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
+              >
+              <a href={`/qr/${encodeURIComponent(profile)}`} class="my-auto">
+                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
+              </a>
+            </div>
+          </div>
+        </div>
+        <div>
+          <div class="font-bold">{$t("user.lightningAddress")}</div>
+          <div class="flex gap-4">
+            <div class="break-all grow text-secondary">
+              {lnaddr}
+            </div>
+            <div class="flex mb-auto gap-1">
+              <button class="my-auto" on:click={() => copy(lnaddr)}
+                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
+              >
+              <a href={`/qr/${encodeURIComponent(lnaddr)}`} class="my-auto">
+                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
+              </a>
+            </div>
+          </div>
+        </div>
+        <div>
+          <div class="font-bold">{$t("user.nostrPubkey")}</div>
+          <div class="flex gap-4">
+            <div class="break-all grow text-secondary">
+              {npub}
+            </div>
+            <div class="flex my-auto gap-1">
+              <button class="my-auto" on:click={() => copy(npub)}
+                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
+              >
+              <a href={`/qr/${encodeURIComponent(npub)}`} class="my-auto">
+                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    {/if}
+
     <div class="flex flex-wrap gap-2 w-full text-xl">
       {#if user && user.username !== subject.username && subject.pubkey}
         {#if following}
@@ -168,17 +233,6 @@
         </a>
       {/if}
 
-      {#if user?.username !== subject.username}
-        <button
-          type="button"
-          on:click={toggleDetails}
-          class="rounded-2xl border py-5 px-6 font-bold hover:opacity-80 flex justify-center w-full"
-        >
-          <Icon icon="profile" style="w-8 mr-2" />
-          <div class="mt-1">{$t("user.info")}</div>
-        </button>
-      {/if}
-
       {#if user?.admin && user.username !== subject.username}
         <form class="w-full flex" on:submit|preventDefault={reset}>
           <input placeholder="Password reset" bind:value={password} />
@@ -194,58 +248,6 @@
         </form>
       {/if}
     </div>
-    {#if showDetails}
-      <div class="text-xl space-y-5">
-        <div>
-          <div class="font-bold">{$t("user.profilePage")}</div>
-          <div class="flex gap-4">
-            <div class="break-all grow text-secondary">
-              {profile}
-            </div>
-            <div class="flex mb-auto gap-1">
-              <button class="my-auto" on:click={() => copy(profile)}
-                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
-              >
-              <a href={`/qr/${encodeURIComponent(profile)}`} class="my-auto">
-                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
-              </a>
-            </div>
-          </div>
-        </div>
-        <div>
-          <div class="font-bold">{$t("user.lightningAddress")}</div>
-          <div class="flex gap-4">
-            <div class="break-all grow text-secondary">
-              {lnaddr}
-            </div>
-            <div class="flex mb-auto gap-1">
-              <button class="my-auto" on:click={() => copy(lnaddr)}
-                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
-              >
-              <a href={`/qr/${encodeURIComponent(lnaddr)}`} class="my-auto">
-                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
-              </a>
-            </div>
-          </div>
-        </div>
-        <div>
-          <div class="font-bold">{$t("user.nostrPubkey")}</div>
-          <div class="flex gap-4">
-            <div class="break-all grow text-secondary">
-              {npub}
-            </div>
-            <div class="flex my-auto gap-1">
-              <button class="my-auto" on:click={() => copy(npub)}
-                ><Icon icon="copy" style="max-w-max w-8 min-w-[32px]" /></button
-              >
-              <a href={`/qr/${encodeURIComponent(npub)}`} class="my-auto">
-                <Icon icon="qr" style="invert max-w-max min-w-[32px]" />
-              </a>
-            </div>
-          </div>
-        </div>
-      </div>
-    {/if}
   </div>
 
   <div class="w-full">