From c9bfb899328ad841daa793ec85f966e0c4457033 Mon Sep 17 00:00:00 2001
From: eti <eti@eti.tf>
Date: Thu, 30 Jul 2026 19:00:38 +0200
Subject: [PATCH] web/components: use inset shadow only on raised buttons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

the star button renders both in the repo header, where it is a raised
default button, and inside repo cards, where the card already carries
the elevation — so the caller decides via a prop instead of the
component hardcoding it. the profile rss link is flat for the same
reason.

the repo header fork group follows the design system segmented control:
the leading segment is default + inset shadow, the fork count segment is
ghost.

Signed-off-by: eti <eti@eti.tf>
---
 web/src/lib/components/profile/ProfileCard.svelte  |  7 +------
 web/src/lib/components/repo/RepoCardContent.svelte |  1 +
 web/src/lib/components/repo/RepoHeader.svelte      | 11 ++++++-----
 web/src/lib/components/repo/StarButton.svelte      | 12 ++++++++++--
 4 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/web/src/lib/components/profile/ProfileCard.svelte b/web/src/lib/components/profile/ProfileCard.svelte
index 3c4a578f..8ac6ed9f 100644
--- a/web/src/lib/components/profile/ProfileCard.svelte
+++ b/web/src/lib/components/profile/ProfileCard.svelte
@@ -132,12 +132,7 @@
 							<FollowButton profileDid={identity.did} initialRkey={viewerFollowRkey} />
 						</div>
 					{/if}
-					<Button
-						href={`/${identity.handle}/feed.atom`}
-						variant="default"
-						insetShadow={true}
-						aria-label="RSS feed"
-					>
+					<Button href={`/${identity.handle}/feed.atom`} variant="default" aria-label="RSS feed">
 						<Rss class="size-4" aria-hidden="true" />
 					</Button>
 				</div>
diff --git a/web/src/lib/components/repo/RepoCardContent.svelte b/web/src/lib/components/repo/RepoCardContent.svelte
index 10ec9b0f..80ae9ff9 100644
--- a/web/src/lib/components/repo/RepoCardContent.svelte
+++ b/web/src/lib/components/repo/RepoCardContent.svelte
@@ -42,6 +42,7 @@
 					repoName={repo.name}
 					initialCount={repo.stars}
 					initialRkey={repo.viewerStarRkey}
+					insetShadow={false}
 				/>
 			</div>
 		{/if}
diff --git a/web/src/lib/components/repo/RepoHeader.svelte b/web/src/lib/components/repo/RepoHeader.svelte
index f4a21ef4..c760ef7f 100644
--- a/web/src/lib/components/repo/RepoHeader.svelte
+++ b/web/src/lib/components/repo/RepoHeader.svelte
@@ -81,15 +81,16 @@
 			{/if}
 
 			<ButtonGroup>
-				<Button href={resolve(`${base}/fork` as "/")} variant="default" size="sm" icon={GitFork}>
-					Fork
-				</Button>
 				<Button
-					href={resolve(`${base}/forks` as "/")}
+					href={resolve(`${base}/fork` as "/")}
 					variant="default"
 					size="sm"
-					title="Forked by"
+					insetShadow={true}
+					icon={GitFork}
 				>
+					Fork
+				</Button>
+				<Button href={resolve(`${base}/forks` as "/")} variant="ghost" size="sm" title="Forked by">
 					{counts.forks}
 				</Button>
 			</ButtonGroup>
diff --git a/web/src/lib/components/repo/StarButton.svelte b/web/src/lib/components/repo/StarButton.svelte
index 23216ce4..1b27bf61 100644
--- a/web/src/lib/components/repo/StarButton.svelte
+++ b/web/src/lib/components/repo/StarButton.svelte
@@ -13,9 +13,17 @@
 		repoName: string;
 		initialCount?: number;
 		initialRkey?: string | null;
+		insetShadow?: boolean;
 	}
 
-	let { repoDid, repoOwnerHandle, repoName, initialCount, initialRkey }: Props = $props();
+	let {
+		repoDid,
+		repoOwnerHandle,
+		repoName,
+		initialCount,
+		initialRkey,
+		insetShadow = true
+	}: Props = $props();
 
 	const auth = getAuth();
 	const profileCounts = getProfileCounts();
@@ -66,7 +74,7 @@
 			<Button
 				variant="default"
 				size="sm"
-				insetShadow={true}
+				{insetShadow}
 				class="flex-1"
 				loading={busy}
 				disabled={!relation.known}
-- 
2.51.2