From ac6c7301c7e943fbf57e976208e601109673a07b Mon Sep 17 00:00:00 2001
From: Matt Mo <matt@montoyatech.com>
Date: Wed, 20 Oct 2021 10:06:53 -0700
Subject: [PATCH] Added ability to center or not center the
 mt-circular-progress.

---
 circular-progress.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/circular-progress.js b/circular-progress.js
index 918a4f8..e1af870 100644
--- a/circular-progress.js
+++ b/circular-progress.js
@@ -19,7 +19,6 @@ class CircularProgress extends IgniteElement {
         }
 
         mt-circular-progress > div > svg {
-            position: absolute;
             z-index: 1;
             animation: rotator 2s linear infinite;
         }
@@ -61,7 +60,8 @@ class CircularProgress extends IgniteElement {
             loading: true,
             size: "4em",
             strokeWidth: "3.6",
-            stroke: "#4285F4"
+            stroke: "#4285F4",
+            center: true
         };
     }
 
@@ -72,8 +72,9 @@ class CircularProgress extends IgniteElement {
                     .attribute("viewBox", "22 22 44 44")
                     .style("width", this.size)
                     .style("height", this.size)
-                    .style("left", this.size, null, size => `calc(50% - (${size} / 2))`)
-                    .style("top", this.size, null, size => `calc(50% - (${size} / 2))`)
+                    .style("left", [this.size, this.center], null, (size, center) => center ? `calc(50% - (${size} / 2))` : null)
+                    .style("top", [this.size, this.center], null, (size, center) => center ? `calc(50% - (${size} / 2))` : null)
+                    .style("position", this.center, true, center => center ? "absolute" : "relative")
                     .show(this.loading)
                     .child(
                         new circle()