feat(bridge-ui): hide input arrows and focus ring (#439)

taikoxyz · Dec 15, 2022 · 2269cc5 · 2269cc5
1 parent 2fa40e0
commit 2269cc5
Showing 1 changed file with 11 additions and 1 deletion.
diff --git a/packages/bridge-ui/src/components/form/BridgeForm.svelte b/packages/bridge-ui/src/components/form/BridgeForm.svelte
@@ -182,7 +182,7 @@
       placeholder="0.01"
       min="0"
       on:input={updateAmount}
-      class="input input-primary bg-dark-4 input-md md:input-lg w-full"
+      class="input input-primary bg-dark-4 input-md md:input-lg w-full focus:ring-0"
       name="amount"
     />
     <SelectToken />
@@ -210,3 +210,13 @@
     {$_("home.approve")}
   </button>
 {/if}
+
+<style>
+  /* hide number input arrows */
+  input[type="number"]::-webkit-outer-spin-button,
+  input[type="number"]::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+    margin: 0;
+    -moz-appearance: textfield !important;
+  }
+</style>