style console error resolution

masa-finance · Mar 7, 2023 · 5da944c · 5da944c
1 parent 3c29461
commit 5da944c
Showing 1 changed file with 17 additions and 8 deletions.
diff --git a/src/components/masa-interface/pages/create-soulname/create-soulname.tsx b/src/components/masa-interface/pages/create-soulname/create-soulname.tsx
@@ -191,18 +191,27 @@ export const InterfaceCreateSoulname = (): JSX.Element => {
             )}
           </p>
           {soulname !== '' && soulname.length >= 1 ? (
-            <p
-              className="available-indicator"
-              style={{ color: isAvailable ? '#728a74e6' : '#964f4fe6' }}
-            >
+            <>
               {loadingIsAvailable ? (
-                <Spinner color="black" size={12} />
+                <div className="available-indicator">
+                  <Spinner color="black" size={12} />
+                </div>
               ) : isAvailable ? (
-                'Available'
+                <p
+                  className="available-indicator"
+                  style={{ color: '#728a74e6' }}
+                >
+                  Available
+                </p>
               ) : (
-                'Unavailable'
+                <p
+                  className="available-indicator"
+                  style={{ color: '#964f4fe6' }}
+                >
+                  Unavailable
+                </p>
               )}
-            </p>
+            </>
           ) : null}
         </div>