From 9c575f36b5699300cdd7d4ee902dd4e484490e1e Mon Sep 17 00:00:00 2001
From: tomolld <tomoki2757@gmail.com>
Date: Sat, 23 Nov 2024 17:51:51 +0900
Subject: [PATCH 1/2] Improve layout and add edit button for user-owned
 translations

---
 .../components/ContentWithTranslations.tsx    | 55 ++++++++++---------
 .../routes/$userName+/page+/$slug+/index.tsx  |  2 +-
 2 files changed, 30 insertions(+), 27 deletions(-)

diff --git a/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx b/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
index ea403486..63981ed8 100644
--- a/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
+++ b/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
@@ -57,20 +57,35 @@ export function ContentWithTranslations({
 		);
 	return (
 		<>
-			<h1 className="!mb-5">
-				{sourceTitleWithTranslations && (
-					<SourceTextAndTranslationSection
-						sourceTextWithTranslations={sourceTitleWithTranslations}
-						isPublished={pageWithTranslations.page.isPublished}
-						elements={sourceTitleWithTranslations.sourceText.text}
-						sourceLanguage={pageWithTranslations.page.sourceLanguage}
-						targetLanguage={targetLanguage}
-						onOpenAddAndVoteTranslations={handleOpenAddAndVoteTranslations}
-						showOriginal={true}
-						showTranslation={true}
-					/>
-				)}
-			</h1>
+			<div className="flex items-center justify-between">
+
+				<h1 className="!mb-5">
+					{sourceTitleWithTranslations && (
+						<SourceTextAndTranslationSection
+							sourceTextWithTranslations={sourceTitleWithTranslations}
+							isPublished={pageWithTranslations.page.isPublished}
+							elements={sourceTitleWithTranslations.sourceText.text}
+							sourceLanguage={pageWithTranslations.page.sourceLanguage}
+							targetLanguage={targetLanguage}
+							onOpenAddAndVoteTranslations={handleOpenAddAndVoteTranslations}
+							showOriginal={true}
+							showTranslation={true}
+						/>
+					)}
+				</h1>
+				{pageWithTranslations.user.userName === currentUserName &&
+					currentUserName && (
+						<div className="ml-auto">
+							<Button asChild variant="ghost">
+								<Link
+									to={`/${currentUserName}/page/${pageWithTranslations.page.slug}/edit`}
+								>
+									<SquarePen className="w-5 h-5" />
+								</Link>
+							</Button>
+						</div>
+					)}
+			</div>
 			<TranslateButton
 				pageId={pageWithTranslations.page.id}
 				userAITranslationInfo={userAITranslationInfo}
@@ -96,18 +111,6 @@ export function ContentWithTranslations({
 						</span>
 					</div>
 				</Link>
-				{pageWithTranslations.user.userName === currentUserName &&
-					currentUserName && (
-						<div className="ml-auto">
-							<Button asChild variant="ghost">
-								<Link
-									to={`/${currentUserName}/page/${pageWithTranslations.page.slug}/edit`}
-								>
-									<SquarePen className="w-5 h-5" />
-								</Link>
-							</Button>
-						</div>
-					)}
 			</div>
 			{!isHydrated ? (
 				<div className="w-full h-full flex items-center justify-center">
diff --git a/web/app/routes/$userName+/page+/$slug+/index.tsx b/web/app/routes/$userName+/page+/$slug+/index.tsx
index 64cf36dc..90ea065f 100644
--- a/web/app/routes/$userName+/page+/$slug+/index.tsx
+++ b/web/app/routes/$userName+/page+/$slug+/index.tsx
@@ -219,7 +219,7 @@ export default function Page() {
 					showOriginal={showOriginal}
 					showTranslation={showTranslation}
 				/>
-				<div className="flex flex-wrap gap-2">
+				<div className="flex flex-wrap gap-2 pb-4">
 					{pageWithTranslations.tagPages.map((tagPage) => (
 						<div
 							key={tagPage.tag.id}

From aea01b61244da026d89d5447df3aa254e3b9ddac Mon Sep 17 00:00:00 2001
From: tomolld <tomoki2757@gmail.com>
Date: Sat, 23 Nov 2024 17:51:58 +0900
Subject: [PATCH 2/2] f

---
 .../page+/$slug+/components/ContentWithTranslations.tsx          | 1 -
 1 file changed, 1 deletion(-)

diff --git a/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx b/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
index 63981ed8..bee0943e 100644
--- a/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
+++ b/web/app/routes/$userName+/page+/$slug+/components/ContentWithTranslations.tsx
@@ -58,7 +58,6 @@ export function ContentWithTranslations({
 	return (
 		<>
 			<div className="flex items-center justify-between">
-
 				<h1 className="!mb-5">
 					{sourceTitleWithTranslations && (
 						<SourceTextAndTranslationSection