From ba3ce4b128a78f769d5d494387a60a1297edcc0c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= <kevin.aberg@gmail.com>
Date: Mon, 12 Apr 2021 16:06:03 +0200
Subject: [PATCH] some button fixes

---
 .../components/settings/ThemeEditor.svelte    |  6 +++---
 .../start/BuilderSettingsButton.svelte        | 21 ++-----------------
 2 files changed, 5 insertions(+), 22 deletions(-)

diff --git a/packages/builder/src/components/settings/ThemeEditor.svelte b/packages/builder/src/components/settings/ThemeEditor.svelte
index 895843b2f7..9cc3698bb4 100644
--- a/packages/builder/src/components/settings/ThemeEditor.svelte
+++ b/packages/builder/src/components/settings/ThemeEditor.svelte
@@ -1,6 +1,6 @@
 <script>
   import { themeStore } from "builderStore"
-  import { Label, Toggle, Button, Slider } from "@budibase/bbui"
+  import { Toggle, Button, Slider } from "@budibase/bbui"
 
   let showAdvanced = false
 </script>
@@ -11,7 +11,7 @@
   </div>
   {#if $themeStore.darkMode && !showAdvanced}
     <div class="button">
-      <Button text on:click={() => (showAdvanced = true)}>Customise</Button>
+      <Button secondary on:click={() => (showAdvanced = true)}>Customise</Button>
     </div>
   {/if}
   {#if $themeStore.darkMode && showAdvanced}
@@ -34,7 +34,7 @@
       max="32"
       showValue />
     <div class="button">
-      <Button text on:click={themeStore.reset}>Reset</Button>
+      <Button secondary on:click={themeStore.reset}>Reset</Button>
     </div>
   {/if}
 </div>
diff --git a/packages/builder/src/components/start/BuilderSettingsButton.svelte b/packages/builder/src/components/start/BuilderSettingsButton.svelte
index b0bf88b596..9bf50ab25e 100644
--- a/packages/builder/src/components/start/BuilderSettingsButton.svelte
+++ b/packages/builder/src/components/start/BuilderSettingsButton.svelte
@@ -6,27 +6,10 @@
 </script>
 
 <div>
-  <Button icon="" text on:click={modal.show}>
-    <i class="ri-settings-3-fill" />
-    <p>Settings</p>
+  <Button overBackground quiet icon="Settings" text on:click={modal.show}>
+    Settings
   </Button>
 </div>
 <Modal bind:this={modal} width="30%">
   <BuilderSettingsModal />
 </Modal>
-
-<style>
-  div i {
-    font-size: 26px;
-    color: var(--grey-7);
-    margin-left: 12px;
-  }
-
-  div p {
-    font-family: var(--font-sans);
-    font-size: var(--font-size-s);
-    color: var(--ink);
-    font-weight: 400;
-    margin: 0 0 0 12px;
-  }
-</style>