fix: PER stacked bar chart styling

IFRCGo · Oct 6, 2023 · 8b68d9d · 8b68d9d
1 parent d5462cc
commit 8b68d9d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/src/components/StackedProgressBar/index.tsx b/src/components/StackedProgressBar/index.tsx
@@ -49,13 +49,15 @@ function StackedProgressBar<VALUE>(props: Props<VALUE>) {
                                 className={styles.value}
                                 value={datum.value}
                             />
-                            <NumberOutput
-                                className={styles.percentage}
-                                value={(100 * datum.value) / total}
-                                prefix="("
-                                suffix="%)"
-                                maximumFractionDigits={0}
-                            />
+                            {(percentage > 10) && (
+                                <NumberOutput
+                                    className={styles.percentage}
+                                    value={(100 * datum.value) / total}
+                                    prefix="("
+                                    suffix="%)"
+                                    maximumFractionDigits={0}
+                                />
+                            )}
                         </div>
                     );
                 })}

diff --git a/src/views/CountryPreparedness/RatingByAreaChart/index.tsx b/src/views/CountryPreparedness/RatingByAreaChart/index.tsx
@@ -23,7 +23,7 @@ function chartPointSelector(chartPoint: ChartPoint) {
 
 const X_AXIS_HEIGHT = 50;
 const Y_AXIS_WIDTH = 90;
-const CHART_OFFSET = 16;
+const CHART_OFFSET = 20;
 
 const chartMargin = {
     left: Y_AXIS_WIDTH + CHART_OFFSET,