fix color bug during animation

src/app/app.component.html

@@ -56,7 +56,7 @@ <h2 class="subtitle">
 </div>
 
 <div *ngIf="data">
-  
+
   <div class="uk-margin-small-top tabs is-toggle is-toggle-rounded is-centered">
     <ul>
       <li class="is-active">
@@ -67,8 +67,10 @@ <h2 class="subtitle">
       </li>
     </ul>
   </div>
-
-  <textarea class="uk-textarea" rows="10" cols="60">{{fileText}}</textarea>
+
+  <div class="uk-padding-small">
+    <textarea class="uk-textarea uk-box-shadow-large uk-border-rounded" rows="10" cols="60">{{fileText}}</textarea>
+  </div>
 
 </div>
 

src/index.html

@@ -26,7 +26,7 @@
       <div class="content has-text-centered">
         <p>
           <strong>JSONtoChart</strong> by <a href="https://github.com/mohitkyadav" target="_blank">Mohit K. Yadav</a>. The source code is licensed
-          <a href="http://opensource.org/licenses/mit-license.php" target="_blank">MIT</a>. Code hosted on 
+          <a href="http://opensource.org/licenses/mit-license.php" target="_blank">MIT</a>. Code hosted on
           <a href="https://github.com/mohitkyadav/JsonToChart" target="_blank">
             <span class="icon is-medium">
               <span class="fa-stack fa-lg">
@@ -40,3 +40,8 @@
   </div>
 </body>
 </html>
+<style>
+.ws-orange-grad {
+  background: linear-gradient(to right, rgba(251, 248, 157, 0.68) 0%, rgba(218, 131, 47, 0.55) 100%)
+}
+</style>

src/styles.css

@@ -1,3 +0,0 @@
-.ws-orange-grad {
-  background: linear-gradient(to right, rgba(251, 248, 157, 0.68) 0%, rgba(218, 131, 47, 0.55) 100%)
-}