fix(index.html): preview not updating when a color is picked

Author: Dun-sin

index.html

@@ -166,14 +166,24 @@ <h1 id="head">Code Magic</h1>
 
           <div class="colors">
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-text-color1" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-text-color1"
+                class="gradient-text-inputs"
+              />
               <span>First Color</span>
             </label>
 
             <div class="preview" id="gradient-text-color-preview"></div>
 
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-text-color2" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-text-color2"
+                class="gradient-text-inputs"
+              />
               <span>Second Color</span>
             </label>
           </div>
@@ -198,14 +208,24 @@ <h1 id="head">Code Magic</h1>
         <div data-content="gradient-border">
           <div class="colors">
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-border-color1" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-border-color1"
+                class="gradient-text-inputs"
+              />
               <span>First Color</span>
             </label>
 
             <div class="preview" id="gradient-border-color-preview"></div>
 
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-border-color2" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-border-color2"
+                class="gradient-text-inputs"
+              />
               <span>Second Color</span>
             </label>
           </div>
@@ -246,14 +266,24 @@ <h1 id="head">Code Magic</h1>
         <div data-content="gradient-background">
           <div class="colors">
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-background-color1" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-background-color1"
+                class="gradient-text-inputs"
+              />
               <span>First Color</span>
             </label>
 
             <div class="preview" id="gradient-background-color-preview"></div>
 
             <label for="color" class="color">
-              <input type="text" data-coloris id="gradient-background-color2" />
+              <input
+                type="text"
+                data-coloris
+                id="gradient-background-color2"
+                class="gradient-text-inputs"
+              />
               <span>Second Color</span>
             </label>
           </div>