From 0f70c8177618d1ff2c311efd127f9899e1f65829 Mon Sep 17 00:00:00 2001
From: Unsloth <michaelhan@Michaels-MacBook-Pro.local>
Date: Wed, 29 Jul 2026 01:33:56 -0700
Subject: [PATCH] Studio: align the three Agents column headers

The Coding agent header carries a padded docs link, so it measured
taller than the plain labels beside it and pushed its select down.
Pin every column header to the same height.
---
 .../src/features/settings/tabs/agents-tab.tsx | 32 +++++++++++--------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/studio/frontend/src/features/settings/tabs/agents-tab.tsx b/studio/frontend/src/features/settings/tabs/agents-tab.tsx
index c4c464d62a..a8ef07234b 100644
--- a/studio/frontend/src/features/settings/tabs/agents-tab.tsx
+++ b/studio/frontend/src/features/settings/tabs/agents-tab.tsx
@@ -1119,7 +1119,9 @@ export function AgentsTab() {
         <div className="@container">
           <div className="grid grid-cols-1 items-start gap-3 @[34rem]:grid-cols-[minmax(0,0.8fr)_minmax(0,1fr)_minmax(9rem,0.5fr)]">
             <div className="flex min-w-0 flex-col gap-1.5">
-              <div className="flex items-center justify-between gap-3">
+              {/* Fixed height on every column header, so the padded docs link
+                  here cannot push this control below the other two. */}
+              <div className="flex h-5 items-center justify-between gap-3">
                 <span
                   data-settings-label={t("settings.agents.agent")}
                   className="text-xs font-medium text-foreground"
@@ -1198,12 +1200,14 @@ export function AgentsTab() {
             </div>
 
             <div className="flex min-w-0 flex-col gap-1.5">
-              <span
-                data-settings-label={t("settings.agents.model")}
-                className="text-xs font-medium text-foreground"
-              >
-                {t("settings.agents.model")}
-              </span>
+              <div className="flex h-5 items-center">
+                <span
+                  data-settings-label={t("settings.agents.model")}
+                  className="text-xs font-medium text-foreground"
+                >
+                  {t("settings.agents.model")}
+                </span>
+              </div>
               <Popover
                 open={modelPickerOpen}
                 onOpenChange={(open) => {
@@ -1289,12 +1293,14 @@ export function AgentsTab() {
             </div>
 
             <div className="flex min-w-0 flex-col gap-1.5">
-              <span
-                data-settings-label={t("settings.agents.quantization")}
-                className="text-xs font-medium text-foreground"
-              >
-                {t("settings.agents.quantization")}
-              </span>
+              <div className="flex h-5 items-center">
+                <span
+                  data-settings-label={t("settings.agents.quantization")}
+                  className="text-xs font-medium text-foreground"
+                >
+                  {t("settings.agents.quantization")}
+                </span>
+              </div>
               <Select
                 value={selectedVariant ?? undefined}
                 onValueChange={(variant) => {