From 6513eab608976a48c7a04a6078e555457a6e7ba1 Mon Sep 17 00:00:00 2001
From: Romein van Buren <romein@vburen.nl>
Date: Tue, 30 May 2023 19:40:12 +0200
Subject: [PATCH] Reamed `btn-sm` class to `button-small`

---
 frontend/src/components/datepicker.svelte              |  2 +-
 frontend/src/components/forminput.svelte               | 10 +++++-----
 frontend/src/components/grid-items.svelte              |  2 +-
 frontend/src/components/tabbar.svelte                  |  4 ++--
 .../organisms/connection/collection/aggregate.svelte   |  2 +-
 .../src/organisms/connection/collection/insert.svelte  |  2 +-
 frontend/src/styles/style.css                          |  8 ++++----
 7 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/frontend/src/components/datepicker.svelte b/frontend/src/components/datepicker.svelte
index 879cfdd..0cde0f1 100644
--- a/frontend/src/components/datepicker.svelte
+++ b/frontend/src/components/datepicker.svelte
@@ -112,7 +112,7 @@
                 <button
                   on:click={() => setValueToDate(day)}
                   type="button"
-                  class="btn-sm"
+                  class="button-small"
                   class:active={isSameDay(value, day)}
                   class:notinmonth={day.getMonth() !== month}
                 >{day.getDate()}</button>
diff --git a/frontend/src/components/forminput.svelte b/frontend/src/components/forminput.svelte
index 48f2ff2..a3f7193 100644
--- a/frontend/src/components/forminput.svelte
+++ b/frontend/src/components/forminput.svelte
@@ -94,22 +94,22 @@
   <div class="actions">
     {#if type === 'objectid'}
       {#if objectIdInput?.disabled}
-        <button class="btn-sm" type="button" title="Edit object id" on:click={editObjectId}>
+        <button class="button-small" type="button" title="Edit object id" on:click={editObjectId}>
           <Icon name="edit" />
         </button>
       {/if}
-      <button class="btn-sm" type="button" title="Generate random object id" on:click={generateObjectId}>
+      <button class="button-small" type="button" title="Generate random object id" on:click={generateObjectId}>
         <Icon name="reload" />
       </button>
     {:else if type === 'date'}
-      <button class="btn-sm" type="button" title="Edit date" on:click={() => showDatepicker = true}>
+      <button class="button-small" type="button" title="Edit date" on:click={() => showDatepicker = true}>
         <Icon name="edit" />
       </button>
-      <button class="btn-sm" type="button" title="Set date to now" on:click={() => value = new Date()}>
+      <button class="button-small" type="button" title="Set date to now" on:click={() => value = new Date()}>
         <Icon name="o" />
       </button>
     {/if}
-    <button class="btn-sm" type="button" title="Reset field to default value" on:click={() => value = undefined}>
+    <button class="button-small" type="button" title="Reset field to default value" on:click={() => value = undefined}>
       <Icon name="trash" />
     </button>
   </div>
diff --git a/frontend/src/components/grid-items.svelte b/frontend/src/components/grid-items.svelte
index 06760eb..1cbe8f2 100644
--- a/frontend/src/components/grid-items.svelte
+++ b/frontend/src/components/grid-items.svelte
@@ -173,7 +173,7 @@
 
     {#if canRemoveItems}
       <td class="has-button">
-        <button class="btn-sm" type="button" on:click|stopPropagation={() => removeItem(index, item[key])} on:dblclick|stopPropagation>
+        <button class="button-small" type="button" on:click|stopPropagation={() => removeItem(index, item[key])} on:dblclick|stopPropagation>
           <Icon name="x" />
         </button>
       </td>
diff --git a/frontend/src/components/tabbar.svelte b/frontend/src/components/tabbar.svelte
index efdec28..19a6ea5 100644
--- a/frontend/src/components/tabbar.svelte
+++ b/frontend/src/components/tabbar.svelte
@@ -23,7 +23,7 @@
           {tab.title}
         </button>
         {#if tab.closable}
-          <button class="btn-sm" on:click={() => dispatch('closeTab', tab.key)}>
+          <button class="button-small" on:click={() => dispatch('closeTab', tab.key)}>
             <Icon name="x" />
           </button>
         {/if}
@@ -89,7 +89,7 @@
     cursor: not-allowed;
   }
 
-  .btn-sm {
+  .button-small {
     position: absolute;
     right: 7px;
     top: 7px;
diff --git a/frontend/src/organisms/connection/collection/aggregate.svelte b/frontend/src/organisms/connection/collection/aggregate.svelte
index 044af8d..e23cdb4 100644
--- a/frontend/src/organisms/connection/collection/aggregate.svelte
+++ b/frontend/src/organisms/connection/collection/aggregate.svelte
@@ -83,7 +83,7 @@
       </Details>
     {/each}
 
-    <button class="btn-sm" type="button" on:click={addStage}>
+    <button class="button-small" type="button" on:click={addStage}>
       <Icon name="+" /> Add stage
     </button>
   </div>
diff --git a/frontend/src/organisms/connection/collection/insert.svelte b/frontend/src/organisms/connection/collection/insert.svelte
index 6030104..c9086c8 100644
--- a/frontend/src/organisms/connection/collection/insert.svelte
+++ b/frontend/src/organisms/connection/collection/insert.svelte
@@ -162,7 +162,7 @@
     {/if}
 
     {#if collection.viewKey !== 'list'}
-      <button class="btn-sm" type="button" on:click={addRow}>
+      <button class="button-small" type="button" on:click={addRow}>
         <Icon name="+" /> Add item
       </button>
     {/if}
diff --git a/frontend/src/styles/style.css b/frontend/src/styles/style.css
index 7f53835..0de986f 100644
--- a/frontend/src/styles/style.css
+++ b/frontend/src/styles/style.css
@@ -100,17 +100,17 @@ select:disabled {
   cursor: not-allowed;
 }
 
-.btn-sm {
+.button-small {
   padding: 3px;
   border-radius: 2px;
 }
-.btn-sm:hover {
+.button-small:hover {
   background-color: rgba(0, 0, 0, 0.1);
 }
-.btn-sm:active {
+.button-small:active {
   background-color: rgba(0, 0, 0, 0.2);
 }
-.btn-sm svg {
+.button-small svg {
   width: 13px;
   height: 13px;
   vertical-align: bottom;