From 4a42115051e44d1b73500f6f8f87d1df7bfb03d3 Mon Sep 17 00:00:00 2001
From: Fabio Wakim Trentini <trentas@gmail.com>
Date: Thu, 11 Jun 2026 15:54:09 -0300
Subject: [PATCH] style(dashboard): thicker bars on Cycle Time charts to match
 Stabilization

The two "by Repo" Cycle Time charts (% PRs merged within 1 day, cycle
time distribution) used 16px (h-4) CSS bars, looking visibly thinner than
the Recharts-based Stabilization Distribution chart (auto-sized in a
fixed 200px container, ~24px bars). Bump both bars to h-6 (24px) and the
row gap to space-y-2 for a consistent look and feel across the dashboard.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../src/app/[tenant]/dashboard/sections/CycleTime.tsx     | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/platform/src/app/[tenant]/dashboard/sections/CycleTime.tsx b/platform/src/app/[tenant]/dashboard/sections/CycleTime.tsx
index 5a39b5a..f58596d 100644
--- a/platform/src/app/[tenant]/dashboard/sections/CycleTime.tsx
+++ b/platform/src/app/[tenant]/dashboard/sections/CycleTime.tsx
@@ -124,7 +124,7 @@ interface Row {
 function RankingChart({ rows }: { rows: Row[] }) {
   const { t } = useTranslation();
   return (
-    <div className="space-y-1.5">
+    <div className="space-y-2">
       {rows.map((row) => (
         <div
           key={row.name}
@@ -136,7 +136,7 @@ function RankingChart({ rows }: { rows: Row[] }) {
           >
             {row.name}
           </span>
-          <div className="h-4 overflow-hidden rounded-sm bg-muted">
+          <div className="h-6 overflow-hidden rounded-sm bg-muted">
             <div
               className={cn("h-full rounded-sm", rampClass(row.pctWithin24h))}
               style={{ width: `${Math.max(2, row.pctWithin24h * 100)}%` }}
@@ -156,7 +156,7 @@ function RankingChart({ rows }: { rows: Row[] }) {
 
 function DistributionChart({ rows }: { rows: Row[] }) {
   return (
-    <div className="space-y-1.5">
+    <div className="space-y-2">
       {rows.map((row) => {
         const total =
           row.buckets.same_day +
@@ -177,7 +177,7 @@ function DistributionChart({ rows }: { rows: Row[] }) {
             >
               {row.name}
             </span>
-            <div className="flex h-4 w-full overflow-hidden rounded-sm bg-muted">
+            <div className="flex h-6 w-full overflow-hidden rounded-sm bg-muted">
               {row.buckets.same_day > 0 && (
                 <span
                   className="h-full bg-bucket-same-day"