From daf447361f911acf19a0f0489039244695945218 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 22 Oct 2018 13:11:29 -0700
Subject: WIP: spinner

---
 packages/instant/src/components/ui/spinner.tsx | 30 ++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 packages/instant/src/components/ui/spinner.tsx

(limited to 'packages/instant/src/components/ui/spinner.tsx')

diff --git a/packages/instant/src/components/ui/spinner.tsx b/packages/instant/src/components/ui/spinner.tsx
new file mode 100644
index 000000000..e5d2808f3
--- /dev/null
+++ b/packages/instant/src/components/ui/spinner.tsx
@@ -0,0 +1,30 @@
+import * as React from 'react';
+
+import { FullRotation } from '../animations/full_rotation';
+
+export interface SpinnerProps {
+    width: number;
+    height: number;
+}
+export const Spinner: React.StatelessComponent<SpinnerProps> = props => {
+    return (
+        <FullRotation>
+            <svg
+                width={props.width}
+                height={props.height}
+                viewBox="0 0 34 34"
+                fill="none"
+                xmlns="http://www.w3.org/2000/svg"
+            >
+                <circle cx="17" cy="17" r="15" stroke="white" stroke-opacity="0.2" stroke-width="4" />
+                <path
+                    d="M17 32C25.2843 32 32 25.2843 32 17C32 8.71573 25.2843 2 17 2"
+                    stroke="white"
+                    stroke-width="4"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                />
+            </svg>
+        </FullRotation>
+    );
+};
-- 
cgit 


From d52a04e725afce3c2d563bcc52bd3273002af318 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 22 Oct 2018 13:18:37 -0700
Subject: Spinner no longer wobbly

---
 packages/instant/src/components/ui/spinner.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

(limited to 'packages/instant/src/components/ui/spinner.tsx')

diff --git a/packages/instant/src/components/ui/spinner.tsx b/packages/instant/src/components/ui/spinner.tsx
index e5d2808f3..7abf24256 100644
--- a/packages/instant/src/components/ui/spinner.tsx
+++ b/packages/instant/src/components/ui/spinner.tsx
@@ -3,15 +3,15 @@ import * as React from 'react';
 import { FullRotation } from '../animations/full_rotation';
 
 export interface SpinnerProps {
-    width: number;
-    height: number;
+    pxWidth: number;
+    pxHeight: number;
 }
 export const Spinner: React.StatelessComponent<SpinnerProps> = props => {
     return (
-        <FullRotation>
+        <FullRotation width={`${props.pxWidth}px`} height={`${props.pxHeight}px`}>
             <svg
-                width={props.width}
-                height={props.height}
+                width={props.pxWidth}
+                height={props.pxHeight}
                 viewBox="0 0 34 34"
                 fill="none"
                 xmlns="http://www.w3.org/2000/svg"
-- 
cgit 


From 071f9a5a73eef54b657adce66d938ee444bd1d72 Mon Sep 17 00:00:00 2001
From: Steve Klebanoff <steve.klebanoff@gmail.com>
Date: Mon, 22 Oct 2018 14:28:02 -0700
Subject: Spinner: change prop names and fix svg props

---
 packages/instant/src/components/ui/spinner.tsx | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

(limited to 'packages/instant/src/components/ui/spinner.tsx')

diff --git a/packages/instant/src/components/ui/spinner.tsx b/packages/instant/src/components/ui/spinner.tsx
index 7abf24256..28ebc2598 100644
--- a/packages/instant/src/components/ui/spinner.tsx
+++ b/packages/instant/src/components/ui/spinner.tsx
@@ -3,26 +3,26 @@ import * as React from 'react';
 import { FullRotation } from '../animations/full_rotation';
 
 export interface SpinnerProps {
-    pxWidth: number;
-    pxHeight: number;
+    widthPx: number;
+    heightPx: number;
 }
 export const Spinner: React.StatelessComponent<SpinnerProps> = props => {
     return (
-        <FullRotation width={`${props.pxWidth}px`} height={`${props.pxHeight}px`}>
+        <FullRotation width={`${props.widthPx}px`} height={`${props.heightPx}px`}>
             <svg
-                width={props.pxWidth}
-                height={props.pxHeight}
+                width={props.widthPx}
+                height={props.heightPx}
                 viewBox="0 0 34 34"
                 fill="none"
                 xmlns="http://www.w3.org/2000/svg"
             >
-                <circle cx="17" cy="17" r="15" stroke="white" stroke-opacity="0.2" stroke-width="4" />
+                <circle cx="17" cy="17" r="15" stroke="white" strokeOpacity="0.2" strokeWidth="4" />
                 <path
                     d="M17 32C25.2843 32 32 25.2843 32 17C32 8.71573 25.2843 2 17 2"
                     stroke="white"
-                    stroke-width="4"
-                    stroke-linecap="round"
-                    stroke-linejoin="round"
+                    strokeWidth="4"
+                    strokeLinecap="round"
+                    strokeLinejoin="round"
                 />
             </svg>
         </FullRotation>
-- 
cgit 

