From 70347722fa1f959a5b224ed43b6b64bf289f36cf Mon Sep 17 00:00:00 2001
From: ivarlovlie <git@ivarlovlie.no>
Date: Sun, 2 Oct 2022 17:35:06 +0800
Subject: feat/refactor: Initial surroundings for (app) and normalise icon
 names

---
 apps/kit/src/lib/components/button.svelte | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

(limited to 'apps/kit/src/lib/components/button.svelte')

diff --git a/apps/kit/src/lib/components/button.svelte b/apps/kit/src/lib/components/button.svelte
index 323c7ad..d345b37 100644
--- a/apps/kit/src/lib/components/button.svelte
+++ b/apps/kit/src/lib/components/button.svelte
@@ -4,7 +4,7 @@
 </script>
 
 <script lang="ts">
-    import { Spinner } from "./icons";
+    import { SpinnerIcon } from "./icons";
 
     export let kind = "primary" as ButtonKind;
     export let size = "md" as ButtonSize;
@@ -54,18 +54,15 @@
 
     $: switch (kind) {
         case "secondary":
-            kindClasses =
-                "border-transparent text-teal-800 bg-teal-100 hover:bg-teal-200 focus:ring-teal-500";
+            kindClasses = "border-transparent text-teal-800 bg-teal-100 hover:bg-teal-200 focus:ring-teal-500";
             spinnerTextClasses = "teal-800";
             break;
         case "primary":
-            kindClasses =
-                "border-transparent text-teal-900 bg-teal-300 hover:bg-teal-400 focus:ring-teal-500";
+            kindClasses = "border-transparent text-teal-900 bg-teal-300 hover:bg-teal-400 focus:ring-teal-500";
             spinnerTextClasses = "text-teal-900";
             break;
         case "white":
-            kindClasses =
-                "border-gray-300 text-gray-700 bg-white hover:bg-gray-50 focus:ring-gray-400";
+            kindClasses = "border-gray-300 text-gray-700 bg-white hover:bg-gray-50 focus:ring-gray-400";
             spinnerTextClasses = "text-gray-700";
             break;
     }
@@ -76,14 +73,12 @@
         {...shared_props}
         {href}
         on:click
-        class="{sizeClasses} {kindClasses} {loading
-            ? 'disabled:'
-            : ''} {$$restProps.class ?? ''} {fullWidth
+        class="{sizeClasses} {kindClasses} {loading ? 'disabled:' : ''} {$$restProps.class ?? ''} {fullWidth
             ? 'w-full justify-center'
             : ''} inline-flex items-center border font-medium rounded shadow-sm focus:outline-none focus:ring-2"
     >
         {#if loading}
-            <Spinner class={spinnerTextClasses + " " + spinnerMarginClasses} />
+            <SpinnerIcon class={spinnerTextClasses + " " + spinnerMarginClasses} />
         {/if}
         {text}
     </a>
@@ -95,7 +90,7 @@
             : ''} inline-flex items-center border font-medium rounded shadow-sm focus:outline-none focus:ring-2"
     >
         {#if loading}
-            <Spinner class={spinnerTextClasses + " " + spinnerMarginClasses} />
+            <SpinnerIcon class={spinnerTextClasses + " " + spinnerMarginClasses} />
         {/if}
         {text}
     </button>
-- 
cgit v1.3