[FIX] Use individual relative stat percentage, not 255

main.ts

@@ -127,8 +127,8 @@ function renderPokemonIndex(pokemons: Array<Pokemon>): string {
     .join('\n'); 
     const getStatBar = (value: number, maxValue: number) => {
       const percentage = Math.round((value / maxValue) * 100);
-      const greenThreshold = 35;
-      const yellowThreshold = 20;
+      const greenThreshold = 100 / (6 - 1);  // 6: because there are 6 stats
+      const yellowThreshold = 100 / (6 + 1); // +-1: to move a bit more/less from 6
 
       let backgroundColor;
       if (percentage >= greenThreshold) {
@@ -147,13 +147,13 @@ function renderPokemonIndex(pokemons: Array<Pokemon>): string {
         </div>
       `;
     };
-
+    const total_stats = pokemon.stats.reduce((a, b) => a + b)
     const statsTableRows = pokemon.stats
       .map(stat => `
         <tr>
           <td class="attribute abilities-text">${(stat.name === 'hp') ? 'HP': stat.name.charAt(0).toUpperCase() + stat.name.slice(1)}:</td>
           <td class="value abilities-text">${stat.value}</td>
-          <td class="value abilities-bar">${getStatBar(stat.value, 255)}</td>
+          <td class="value abilities-bar">${getStatBar(stat.value, total_stats)}</td>
         </tr>`)
       .join('\n');