From ae5c65b0a09bc60b899d102abb9cb3b3e58004d4 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Wed, 22 Jul 2020 08:29:15 +0200
Subject: [PATCH] Adjust spinner sizing

---
 packages/react-components/src/Spinner.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/react-components/src/Spinner.tsx b/packages/react-components/src/Spinner.tsx
index ea8b607385..3118ebe679 100644
--- a/packages/react-components/src/Spinner.tsx
+++ b/packages/react-components/src/Spinner.tsx
@@ -21,7 +21,7 @@ function Spinner ({ className = '', label, variant = 'app' }: Props): React.Reac
   return (
     <div className={`${className} ui--Spinner ${variant}`}>
       <img
-        className={`ui--Spinner--img${variant === 'app' ? ' ui--highlight--bg' : ''}`}
+        className={`ui--Spinner--img${variant === 'push' ? '' : ' ui--highlight--bg'}`}
         src={spinnerSrc as unknown as string}
       />
       {isApp && <div className='text'>{label || t('Retrieving data')}</div>}
@@ -37,9 +37,16 @@ export default React.memo(styled(Spinner)`
   .ui--Spinner--img {
     border-radius: 2.5rem;
     height: 2.5rem;
+    opacity: 0.75;
     width: 2.5rem;
   }
 
+  &.mini .ui--Spinner--img {
+    border-radius: 1.75rem;
+    height: 1.75rem;
+    width: 1.75rem;
+  }
+
   .text {
     color: inherit !important;
     margin: 0 auto 1.5rem auto;