2 files changed, 9 insertions, 5 deletions
diff --git a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
index aa3f26ab..7faf3af0 100644
--- a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
+++ b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.html
@@ -1 +1,3 @@
-<canvas #piechart [width]="width" [height]="height"></canvas>
+<div class="chart-wrapper">
+    <canvas #piechart [width]="width" [height]="height"></canvas>
+</div>
+\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts
index 248c9aa8..f141f522 100644
--- a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts
+++ b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts
@@ -8,8 +8,8 @@ import {Chart} from 'chart.js';
 })
 export class PieChartComponent implements AfterViewInit {
 
-  @Input()width: number = 600;
-  @Input()height: number = 450;
+  @Input()width?: number;
+  @Input()height?: number;
   
   @ViewChild('piechart') chartRef!: ElementRef;
   constructor() { }
@@ -22,7 +22,7 @@ export class PieChartComponent implements AfterViewInit {
       datasets: [{
         label: "Population (millions)",
         backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850"],
-        data: [2478,5267,734,784,433]
+        data: [2478,5267,734,784,433],
       }]
     },
     options: {
@@ -34,7 +34,9 @@ export class PieChartComponent implements AfterViewInit {
         legend: {
           display: false
                 },
-             }
+             },
+             layout: {
+              padding: 15}
     }
 });