From 7969808b6c239a9d7f81ef066bb7a3f45e063416 Mon Sep 17 00:00:00 2001
From: Andreas Greimel <andreas@mintgarden.io>
Date: Thu, 30 Jun 2022 16:31:45 +0200
Subject: [PATCH] Add percent sign to royalty percentage input

---
 src/pages/Minting.vue | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/pages/Minting.vue b/src/pages/Minting.vue
index b01fd80..a888f94 100644
--- a/src/pages/Minting.vue
+++ b/src/pages/Minting.vue
@@ -266,7 +266,12 @@ const getProgressWidth = () => {
 
             <div>
               <label for="name" class="block text-sm font-medium text-gray-700"> Royalty percentage </label>
-              <div class="mt-1">
+              <div class="relative mt-1">
+                <div
+                  class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none sm:text-sm border-gray-300 text-gray-500"
+                >
+                  %
+                </div>
                 <input
                   type="number"
                   step="any"
@@ -275,7 +280,7 @@ const getProgressWidth = () => {
                   id="royaltyPercentage"
                   min="0"
                   max="100"
-                  class="shadow-sm focus:ring-emerald-500 focus:border-emerald-500 block w-full rounded-md sm:text-sm border-gray-300"
+                  class="pl-10 shadow-sm focus:ring-emerald-500 focus:border-emerald-500 block w-full rounded-md sm:text-sm border-gray-300"
                 />
               </div>
             </div>