From 224634437ab7dc79ef3d3cafa31e4b2a26ac2443 Mon Sep 17 00:00:00 2001
From: oppiliappan <me@oppi.li>
Date: Mon, 7 Sep 2026 17:22:09 +0100
Subject: [PATCH] web/pulls: give the PR comment box the standard card
 treatment

It was a bare form with a Textarea jammed into a ButtonGroup (double
bordering against the textarea's own border/focus ring). Wrap it in a
Card and move the submit button to a footer row, matching CommentEditor.
---
 .../repo/pulls/PullReviewCommentForm.svelte   | 36 ++++++++++---------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/web/src/lib/components/repo/pulls/PullReviewCommentForm.svelte b/web/src/lib/components/repo/pulls/PullReviewCommentForm.svelte
index f618e24ed..58751cbf8 100644
--- a/web/src/lib/components/repo/pulls/PullReviewCommentForm.svelte
+++ b/web/src/lib/components/repo/pulls/PullReviewCommentForm.svelte
@@ -3,7 +3,7 @@
 	import SendHorizontal from "$icon/send-horizontal";
 	import { createAction } from "$lib/action.svelte";
 	import Button from "$lib/components/ui/Button.svelte";
-	import ButtonGroup from "$lib/components/ui/ButtonGroup.svelte";
+	import Card from "$lib/components/ui/Card.svelte";
 	import Checkbox from "$lib/components/ui/Checkbox.svelte";
 	import Tag from "$lib/components/ui/Tag.svelte";
 	import ErrorAlert from "$lib/components/ui/Error.svelte";
@@ -50,26 +50,30 @@
 	};
 </script>
 
-<form onsubmit={publish.run} class="space-y-2">
-	<Checkbox bind:checked={pinToCommit}>
-		<span>Comment on <Tag>{short(currentCommit)}</Tag></span>
-	</Checkbox>
-	<ButtonGroup direction={rows > 1 ? "vertical" : "horizontal"} class="w-full">
+<Card padding="small" class="drop-shadow-xs">
+	<form onsubmit={publish.run} class="flex flex-col gap-2">
 		<Textarea
-			class="flex-1"
 			bind:value={draft}
 			{placeholder}
 			disabled={disabled || publish.loading}
 			size="unsized"
+			resizeable
 			{rows}
 			onkeydown={handleKeydown}
 		/>
-		<Button
-			type="submit"
-			icon={publish.loading ? Spinner : SendHorizontal}
-			aria-label="Comment"
-			disabled={disabled || publish.loading || draft.trim() === ""}
-		/>
-	</ButtonGroup>
-	<ErrorAlert label={publish.error} />
-</form>
+		<ErrorAlert label={publish.error} />
+		<div class="flex items-center justify-between gap-2">
+			<Checkbox bind:checked={pinToCommit}>
+				<span class="typography-paragraph-small"
+					>Comment on <Tag>{short(currentCommit)}</Tag></span
+				>
+			</Checkbox>
+			<Button
+				type="submit"
+				icon={publish.loading ? Spinner : SendHorizontal}
+				aria-label="Comment"
+				disabled={disabled || publish.loading || draft.trim() === ""}
+			/>
+		</div>
+	</form>
+</Card>
-- 
2.51.2