some more improvements

src/lib/MainWrapper.svelte

@@ -6,9 +6,8 @@
   import type { PokemonDBData, PokemonData } from "src/model/PokemonData";
   import type { ItemData, ItemEffect } from "../model/ItemData";
   $: {
-    if (myValue > 0 && myValue !== currentValue) {
+    if (myValue > 0) {
       invoke("search", { index: myValue }).then((r: PokemonDBData) => {
-        currentValue = myValue;
         pokemonData = {
           id: r.id,
           name: r.name,
@@ -53,7 +52,6 @@
           speed_buff: 0,
         };
         pokemonDataArray[index] = pokemonData;
-        console.log(currentValue);
         myValue = undefined;
       });
     }
@@ -61,19 +59,23 @@
       types: pokemonData ? pokemonData.types : [],
       terastype: pokemonData ? pokemonData.terastype : [0],
       hp: hp_final,
-      atk: atk_final,
-      def: def_final,
-      spatk: spatk_final,
-      spdef: spdef_final,
-      spd: spd_final,
-      item: pokemonData? pokemonData.item : 0,
+      attack: atk_final,
+      defense: def_final,
+      special_attack: spatk_final,
+      special_defense: spdef_final,
+      speed: spd_final,
+      attack_buff: pokemonData ? pokemonData.attack_buff : 0,
+      defense_buff: pokemonData ? pokemonData.defense_buff : 0,
+      special_attack_buff: pokemonData ? pokemonData.special_attack_buff : 0,
+      special_defense_buff: pokemonData ? pokemonData.special_defense_buff : 0,
+      speed_buff: pokemonData ? pokemonData.speed_buff : 0,
+      item: pokemonData ? pokemonData.item : 0,
     };
   }
   export let attackId: number | undefined;
   export let items: ItemData[];
   let myValue;
   let index = 0;
-  let currentValue = 0;
   let pokemonData: PokemonData | undefined;
   let pokemonDataArray: PokemonData[] = [];
   let hp_final = 0;
@@ -86,11 +88,16 @@
     types: [],
     terastype: [0],
     hp: 0,
-    atk: 0,
-    def: 0,
-    spatk: 0,
-    spdef: 0,
-    spd: 0,
+    attack: 0,
+    defense: 0,
+    special_attack: 0,
+    special_defense: 0,
+    speed: 0,
+    attack_buff: 0,
+    defense_buff: 0,
+    special_attack_buff: 0,
+    special_defense_buff: 0,
+    speed_buff: 0,
     item: 0,
   };
   async function getItems(keyword) {
@@ -134,6 +141,7 @@
                   pokemonData = pokemonDataArray[i];
                 }}
               >
+                <span class="active-arrow">➤</span>
                 {#if pokemonDataArray[i]}
                   <img
                     src={`data:image/png;base64,${pokemonDataArray[i].thumbnail}`}
@@ -149,9 +157,17 @@
           </tr>
         {/each}
       </table>
-      <div>
-        <button>Save</button> <button>Load</button><br />
-        <button on:click={() => {pokemonData = undefined; pokemonDataArray = []; index = 0; myValue = undefined;}}>Clear</button>
+      <div class="save-load-clear-group">
+        <button>Save</button>
+        <button>Load</button><br />
+        <button
+          on:click={() => {
+            pokemonData = undefined;
+            pokemonDataArray = [];
+            index = 0;
+            myValue = undefined;
+          }}>Clear</button
+        >
       </div>
     </div>
     <div class="display-data">
@@ -171,6 +187,10 @@
 </div>
 
 <style>
+  .save-load-clear-group {
+    margin: 15px 0;
+    line-height: 40px;
+  }
   .row-display {
     height: 759px;
     display: flex;
@@ -182,6 +202,13 @@
     width: 200px;
     border-right: 2px solid white;
   }
+  .active-arrow {
+    display: none;
+  }
+  .active > .active-arrow {
+    display: block;
+    margin-right: 5px;
+  }
   .display-data {
     width: 800px;
     height: 759px;
@@ -209,22 +236,22 @@
   }
   .odd {
     color: white;
-    background-color: #f5453d;
+    background-color: #f7bbb8;
   }
   .odd:hover {
     color: white;
-    background-color: #f7bbb8;
-    transition: background-color .5s ease;
+    background-color: #f5453d;
+    transition: background-color 0.5s ease;
     cursor: pointer;
   }
   .even {
     color: white;
-    background-color: #3d3094;
+    background-color: #b6b4ff;
   }
   .even:hover {
     color: white;
-    background-color: #b6b4ff;
-    transition: background-color .5s ease;
+    background-color: #3d3094;
+    transition: background-color 0.5s ease;
     cursor: pointer;
   }
 </style>