From 68f56a011232fcc4232705975e6c208f8940a850 Mon Sep 17 00:00:00 2001
From: JoeJoeflyn <thaitainguyen336@gmail.com>
Date: Fri, 7 Aug 2026 19:25:22 +0700
Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=96=20fix:=20align=20active=20tab=20bo?=
 =?UTF-8?q?rder=20with=20container=20separator=20(#24)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The active tab's border-b-2 floated above the container's border-b due
to wrapper padding (py-1) and missing overlap. Removed py-1, px-2
sm:px-6, and overflow-x-auto from the tab bar wrapper; added -mb-px to
TabButton so the 2px active border overlaps the 1px container border.
---
 src/browser/components/pr-overview.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/browser/components/pr-overview.tsx b/src/browser/components/pr-overview.tsx
index 68b258f..e88dc22 100644
--- a/src/browser/components/pr-overview.tsx
+++ b/src/browser/components/pr-overview.tsx
@@ -1022,9 +1022,9 @@ export const PROverview = memo(function PROverview() {
   return (
     <div className="flex-1 overflow-auto themed-scrollbar bg-background">
       {/* Tabs */}
-      <div className="border-b border-border overflow-x-auto">
-        <div className="max-w-[1280px] mx-auto px-2 sm:px-6">
-          <div className="flex items-center gap-1 py-1">
+      <div className="border-b border-border">
+        <div className="max-w-[1280px] mx-auto">
+          <div className="flex items-center gap-1">
             <TabButton
               active={activeTab === "conversation"}
               onClick={() => setActiveTab("conversation")}
@@ -2045,7 +2045,7 @@ function TabButton({
     <button
       onClick={onClick}
       className={cn(
-        "flex items-center gap-1.5 sm:gap-2 px-2 sm:px-4 py-2 text-sm font-medium border-b-2 transition-colors whitespace-nowrap",
+        "flex items-center gap-1.5 sm:gap-2 px-2 sm:px-4 py-2 -mb-px text-sm font-medium border-b-2 transition-colors whitespace-nowrap",
         active
           ? "border-orange-500 text-foreground"
           : "border-transparent text-muted-foreground hover:text-foreground hover:border-border"