From 84022507dd5d5a03aedb986f0ff28c81a3bcaeec Mon Sep 17 00:00:00 2001
From: Adam Soltys <asoltys@gmail.com>
Date: Tue, 7 Nov 2023 13:09:52 -0800
Subject: profile details

---
 .../(app)/[username]/(profile)/+layout.svelte      | 25 +++++++++++---------
 .../[username]/settings/[...tab]/_account.svelte   | 27 +---------------------
 2 files changed, 15 insertions(+), 37 deletions(-)

(limited to 'src/routes/(app)')

diff --git a/src/routes/(app)/[username]/(profile)/+layout.svelte b/src/routes/(app)/[username]/(profile)/+layout.svelte
index b000891e..35c316bb 100644
--- a/src/routes/(app)/[username]/(profile)/+layout.svelte
+++ b/src/routes/(app)/[username]/(profile)/+layout.svelte
@@ -60,7 +60,7 @@
 
 <div class="container mx-auto w-full px-4 mb-4 flex flex-wrap lg:flex-nowrap space-y-5">
 	<div class="hidden lg:block lg:w-[300px]" />
-	<div class="lg:w-[300px] lg:absolute space-y-5 left-20 mx-auto">
+	<div class="lg:w-[300px] lg:absolute space-y-5 left-20 mx-auto max-w-md">
 		<div
 			class="flex text-3xl font-bold text-center mx-auto justify-center gap-2"
 			on:click={toggleDetails}
@@ -71,45 +71,48 @@
 
 		{#if showDetails}
 			<div>
+        <div class="font-bold">{$t('user.profilePage')}</div>
 				<div class="flex gap-2">
 					<div class="break-all grow text-secondary text-lg">
-						{npub}
+						{profile}
 					</div>
 					<div class="flex mb-auto gap-1">
-						<button class="my-auto hover:opacity-40" on:click={() => copy(npub)}
+						<button class="my-auto opacity-60 hover:opacity-100" on:click={() => copy(profile)}
 							><Icon icon="copy" style="max-w-max min-w-[32px]" /></button
 						>
-						<a href={`/qr/${encodeURIComponent(npub)}`} class="my-auto hover:opacity-40">
+						<a href={`/qr/${encodeURIComponent(profile)}`} class="my-auto opacity-60 hover:opacity-100">
 							<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-2">
 					<div class="break-all grow text-secondary text-lg">
 						{lnaddr}
 					</div>
 					<div class="flex mb-auto gap-1">
-						<button class="my-auto hover:opacity-40" on:click={() => copy(lnaddr)}
+						<button class="my-auto opacity-60 hover:opacity-100" on:click={() => copy(lnaddr)}
 							><Icon icon="copy" style="max-w-max min-w-[32px]" /></button
 						>
-						<a href={`/qr/${encodeURIComponent(lnaddr)}`} class="my-auto hover:opacity-40">
+						<a href={`/qr/${encodeURIComponent(lnaddr)}`} class="my-auto opacity-60 hover:opacity-100">
 							<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-2">
 					<div class="break-all grow text-secondary text-lg">
-						{profile}
+						{npub}
 					</div>
-					<div class="flex mb-auto gap-1">
-						<button class="my-auto hover:opacity-40" on:click={() => copy(profile)}
-							><Icon icon="copy" style="max-w-max min-w-[32px] hover:opacity-40" /></button
+					<div class="flex my-auto gap-1">
+						<button class="my-auto opacity-60 hover:opacity-100" on:click={() => copy(npub)}
+							><Icon icon="copy" style="max-w-max min-w-[32px]" /></button
 						>
-						<a href={`/qr/${encodeURIComponent(profile)}`} class="my-auto hover:opacity-40">
+						<a href={`/qr/${encodeURIComponent(npub)}`} class="my-auto opacity-60 hover:opacity-100">
 							<Icon icon="qr" style="invert max-w-max min-w-[32px]" />
 						</a>
 					</div>
diff --git a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
index 47c4c4c6..26c327c0 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
@@ -74,33 +74,8 @@
 			type="text"
 			name="username"
 			bind:value={user.username}
-			class="border-r-0 rounded-r-none w-auto min-w-0 pr-1 grow"
+			class="w-auto min-w-0 pr-1 grow"
 		/>
-		<div class="text-gray-600 p-4 my-auto bg-gray-100 border border-r-0 pl-1">
-			@{$page.url.host}
-		</div>
-		<div class="text-gray-600 border-l-0 bg-gray-100 rounded-r-2xl p-4 my-auto border w-16">
-			<a href={`/qr/${encodeURIComponent(addr)}`}>
-				<Icon icon="qr" style="invert" />
-			</a>
-		</div>
-	</div>
-
-	<div class="flex mb-2">
-		<div class="text-gray-600 rounded-l-2xl p-4 my-auto border bg-gray-100 pr-1">
-			{$page.url.host}/
-		</div>
-		<input
-			type="text"
-			name="username"
-			bind:value={user.username}
-			class="grow border-l-0 rounded-l-none border-r-0 rounded-r-none w-auto pl-1 min-w-0"
-		/>
-		<div class="text-gray-600 rounded-r-2xl p-4 my-auto border bg-gray-100 w-16">
-			<a href={`/qr/${encodeURIComponent(full)}`}>
-				<Icon icon="qr" style="invert" />
-			</a>
-		</div>
 	</div>
 </div>
 
-- 
cgit v1.2.3