From 8140d1895447dec0ccc8729e66f27bcf5cc3f370 Mon Sep 17 00:00:00 2001
From: EdwinKato <katedwin88@gmail.com>
Date: Mon, 22 Jul 2024 11:00:20 +0300
Subject: [PATCH] Fix width of budgeting progress bar

---
 .../ProgressBar/BudgetingProgressBar.tsx           | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/front/app/containers/ProjectsShowPage/timeline/VotingResults/ProgressBar/BudgetingProgressBar.tsx b/front/app/containers/ProjectsShowPage/timeline/VotingResults/ProgressBar/BudgetingProgressBar.tsx
index 327e774df0ba..35b4c9362ad3 100644
--- a/front/app/containers/ProjectsShowPage/timeline/VotingResults/ProgressBar/BudgetingProgressBar.tsx
+++ b/front/app/containers/ProjectsShowPage/timeline/VotingResults/ProgressBar/BudgetingProgressBar.tsx
@@ -1,5 +1,7 @@
 import React from 'react';
 
+import { Box } from '@citizenlab/cl2-component-library';
+
 import { IIdeaData } from 'api/ideas/types';
 import { IPhase } from 'api/phases/types';
 
@@ -25,11 +27,13 @@ const BudgetingProgressBar = ({ phase, idea }: Props) => {
   );
 
   return (
-    <ProgressBarWrapper votesPercentage={basketsPercentage} tooltip={tooltip}>
-      {`${basketsPercentage}% (${formatMessage(messages.numberOfPicks, {
-        baskets: totalBasketsIdeaIsIn,
-      })})`}
-    </ProgressBarWrapper>
+    <Box w="100%">
+      <ProgressBarWrapper votesPercentage={basketsPercentage} tooltip={tooltip}>
+        {`${basketsPercentage}% (${formatMessage(messages.numberOfPicks, {
+          baskets: totalBasketsIdeaIsIn,
+        })})`}
+      </ProgressBarWrapper>
+    </Box>
   );
 };