fix(charts): add individual padding vars for donut charts (#2068)

patternfly · Jul 16, 2019 · 10fed0d · 10fed0d
1 parent 03cd2e7
commit 10fed0d
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 0 deletions.
diff --git a/src/patternfly/_chart-globals.scss b/src/patternfly/_chart-globals.scss
@@ -170,6 +170,7 @@ $pf-chart-donut--label--subtitle--Fill: $pf-chart-global--Fill--Color--400;
 $pf-chart-donut--label--subtitle--position: "center";
 $pf-chart-donut--pie--Height: 230;
 $pf-chart-donut--pie--angle--Padding: 1;
+$pf-chart-donut--pie--Padding: 8;
 $pf-chart-donut--pie--Width: 230;
 
 // Donut Threshold Chart
@@ -180,14 +181,18 @@ $pf-chart-donut--threshold--warning--Color: $pf-chart-global--warning--Color--20
 $pf-chart-donut--threshold--danger--Color: $pf-chart-global--danger--Color--100;
 $pf-chart-donut--threshold--dynamic--pie--Height: 202;
 $pf-chart-donut--threshold--dynamic--pie--Width: 202;
+$pf-chart-donut--threshold--dynamic--pie--Padding: 8;
 $pf-chart-donut--threshold--static--pie--Height: 230;
 $pf-chart-donut--threshold--static--pie--angle--Padding: 1;
+$pf-chart-donut--threshold--static--pie--Padding: 8;
 $pf-chart-donut--threshold--static--pie--Width: 230;
 
 // Donut Utilization Chart
 $pf-chart-donut--utilization--dynamic--pie--Height: 230;
 $pf-chart-donut--utilization--dynamic--pie--angle--Padding: 1;
+$pf-chart-donut--utilization--dynamic--pie--Padding: 8;
 $pf-chart-donut--utilization--dynamic--pie--Width: 230;
+$pf-chart-donut--utilization--static--pie--Padding: 8;
 
 // Error Bar
 $pf-chart-errorbar--BorderWidth: $pf-chart-global--BorderWidth--lg;

diff --git a/src/patternfly/patternfly-charts.scss b/src/patternfly/patternfly-charts.scss
@@ -172,6 +172,7 @@
   --pf-chart-donut--label--subtitle--position: #{$pf-chart-donut--label--subtitle--position};
   --pf-chart-donut--pie--Height: #{$pf-chart-donut--pie--Height};
   --pf-chart-donut--pie--angle--Padding: #{$pf-chart-donut--pie--angle--Padding};
+  --pf-chart-donut--pie--Padding: #{$pf-chart-donut--pie--Padding};
   --pf-chart-donut--pie--Width: #{$pf-chart-donut--pie--Width};
 
   // Donut Threshold Chart
@@ -181,15 +182,19 @@
   --pf-chart-donut--threshold--warning--Color: #{$pf-chart-donut--threshold--warning--Color};
   --pf-chart-donut--threshold--danger--Color: #{$pf-chart-donut--threshold--danger--Color};
   --pf-chart-donut--threshold--dynamic--pie--Height: #{$pf-chart-donut--threshold--dynamic--pie--Height};
+  --pf-chart-donut--threshold--dynamic--pie--Padding: #{$pf-chart-donut--threshold--dynamic--pie--Padding};
   --pf-chart-donut--threshold--dynamic--pie--Width: #{$pf-chart-donut--threshold--dynamic--pie--Width};
   --pf-chart-donut--threshold--static--pie--Height: #{$pf-chart-donut--threshold--static--pie--Height};
   --pf-chart-donut--threshold--static--pie--angle--Padding: #{$pf-chart-donut--threshold--static--pie--angle--Padding};
+  --pf-chart-donut--threshold--static--pie--Padding: #{$pf-chart-donut--threshold--static--pie--Padding};
   --pf-chart-donut--threshold--static--pie--Width: #{$pf-chart-donut--threshold--static--pie--Width};
 
   // Donut Utilization Chart
   --pf-chart-donut--utilization--dynamic--pie--Height: #{$pf-chart-donut--utilization--dynamic--pie--Height};
   --pf-chart-donut--utilization--dynamic--pie--angle--Padding: #{$pf-chart-donut--utilization--dynamic--pie--angle--Padding};
+  --pf-chart-donut--utilization--dynamic--pie--Padding: #{$pf-chart-donut--utilization--dynamic--pie--Padding};
   --pf-chart-donut--utilization--dynamic--pie--Width: #{$pf-chart-donut--utilization--dynamic--pie--Width};
+  --pf-chart-donut--utilization--static--pie--Padding: #{$pf-chart-donut--utilization--static--pie--Padding};
 
   // Error Bar
   --pf-chart-errorbar--BorderWidth: #{$pf-chart-errorbar--BorderWidth};