added component for MacroBadge,

used MacroBadge.vue in Day Meal, Meal View and Ingrediens View

doc/prompt.txt

@@ -45,4 +45,58 @@ dopln kluce pre UI texty pre preklad, pre kluce pouzivaj anglictinu, dopln potom
 na zobrazeni app/ingredients sprav aby formular pre pridanie novej suroviny sa zobrazil az ked kliknem na tlacitko Nova surovina, a po uspesnom ulozeni ten formular pre pridanie novej suroviny skry, nezabudni vynulovat udaje vo formulari po ulozeni
 
 ----- 2026-02-14 08:08:33 -----------------------------------------------------
-dopln jemnejší UX flow (toasty, confirm modaly pri delete, loading/error states per card)
+dopln jemnejší UX flow (toasty, confirm modaly pri delete, loading/error states per card)
+
+----- 2026-02-14 12:44:33 -----------------------------------------------------
+v zozname surovin app/ingredients sa zobrazuju len bielkoviny, sacharidy a tuky, pridaj tam aj vlakninu,
+
+zaroven to chcem farebne rozlisit, urob to ako farebny stitok, ze bielkoviny budu modre, sacharidy oranzove, tuky cervene (mierne tlmena) a vlaknina tmavsia zelena
+
+podobne farebne to rozlis aj na denndom prehlade app/today v sucte dna a tiez tam pridaj vlakninu
+
+v zozname jedalnickov app/meals je pri kazdom len pocet kalorii, pridaj tam tiez sumar makrozivin (bielkoviny, sacharidy, tuky a vlaknina)
+
+GPT upravil takto:
+Rozšír UI aplikácie Nutrio nasledovne:
+
+1) Ingredients list (route: /app/ingredients)
+- Aktuálne sa zobrazujú len bielkoviny, sacharidy a tuky.
+- Pridaj zobrazenie vlákniny (fiber_g_100).
+- Makrá zobraz ako malé farebné štítky (badge), nie ako obyčajný text.
+
+Farby štítkov:
+- Bielkoviny (protein) → modrá #3B82F6
+- Sacharidy (carbs) → oranžová #F59E0B
+- Tuky (fat) → tlmená červená #EF4444
+- Vláknina (fiber) → tmavšia zelená #10B981
+
+Štýl badge:
+- malé zaoblené pill tvary
+- jemné svetlé pozadie (napr. 10–15% opacity farby)
+- text farba plná farba
+- formát: B 12g / S 24g / T 5g / V 6g
+
+2) Today page (route: /app/today)
+- V dennom súčte pridaj vlákninu.
+- Makrá zobraz rovnakým farebným štýlom ako v ingredients.
+- Kalórie nech ostanú neutrálne (tmavá šedá), vizuálne dominantné veľkosťou písma, nie farbou.
+
+Layout:
+- hore veľké číslo kcal
+- pod tým horizontálne makrá ako farebné štítky
+
+3) Meals list (route: /app/meals)
+- Aktuálne sa zobrazuje len počet kalórií.
+- Pridaj aj súhrn makier (protein, carbs, fat, fiber).
+- Zobraz ich rovnakým badge systémom pre konzistentnosť.
+- Kcal nech je oddelené (napr. nad makrami alebo výraznejšie písmo).
+
+4) Konzistentnosť:
+- Použi jeden spoločný komponent napr. <MacroBadge />
+- Nepoužívaj sýte plné farebné pozadia.
+- Použi minimalistický SaaS štýl.
+- Farby makier musia byť identické naprieč celou aplikáciou.
+- Nepridávaj nové knižnice.
+
+Výsledok:
+Čistý, konzistentný, moderný vzhľad bez prehnaných farieb.