From 1d93ada275e25619fd6a5d0832986d9fad72590a Mon Sep 17 00:00:00 2001
From: chahinebrini <chahinebrini@gmail.com>
Date: Thu, 14 May 2026 01:02:56 +0200
Subject: [PATCH] =?UTF-8?q?fix(mail):=20revert=20marginBottom=20hack=20?=
 =?UTF-8?q?=E2=80=94=20layout=20was=20breaking=20out=20of=20card?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Mein letzter marginBottom:-28 Versuch hat den Donut-Wrapper Layout-Width
durcheinandergebracht — Donut ragte links aus der Card. Zurück zum
clean Layout ohne negative Margin. Kleine vertikale Asymmetrie zwischen
Donut-Center-Number und Legend-Mitte bleibt akzeptiert.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../components/mail/MailDistributionChart.tsx | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/apps/rebreak-native/components/mail/MailDistributionChart.tsx b/apps/rebreak-native/components/mail/MailDistributionChart.tsx
index 911d117..8b93a68 100644
--- a/apps/rebreak-native/components/mail/MailDistributionChart.tsx
+++ b/apps/rebreak-native/components/mail/MailDistributionChart.tsx
@@ -106,19 +106,12 @@ export function MailDistributionChart({ data, hero, totalBlocked, isLegend }: Pr
             gap: 20,
           }}
         >
-          {/* Donut-Box ist visuell asymmetrisch (Bogen oben, Center-Number bei
-              ~70% der Box-Höhe). Negativer marginBottom zieht die effektive
-              Box hoch sodass alignItems:center die Legend gegenüber der
-              visuellen Donut-Mitte (Center-Number) zentriert statt gegen die
-              SVG-Bounding-Box-Mitte. */}
-          <View style={{ marginBottom: -28 }}>
-            <HalfDonut
-              segments={segments}
-              centerValue={centerValue}
-              centerLabel={centerLabel}
-              width={DONUT_WIDTH}
-            />
-          </View>
+          <HalfDonut
+            segments={segments}
+            centerValue={centerValue}
+            centerLabel={centerLabel}
+            width={DONUT_WIDTH}
+          />
           <View style={{ gap: 6, flex: 1, minWidth: 0 }}>
             {slices.map((slice) => (
               <LegendRow key={slice.label} slice={slice} colors={colors} />