🥗 My Calorie Tracker

Tvoj osobný denník výživy

Denný prehľad

Prijaté kalórie

0 kcal

Denný cieľ: 2200 kcal

Do cieľa zostáva 2200 kcal

Moje denné ciele

Kalorický cieľ (kcal)

Cieľ je orientačný. Uprav si ho podľa svojich potrieb.

🥩 Bielkoviny0 gSúčet za deň

🍞 Sacharidy0 gSúčet za deň

🥑 Tuky0 gSúčet za deň

➕ Pridať jedlo

Vyhľadaj potravinu

Typ jedla

Množstvo (g)

Kalórie / 100 g

Bielkoviny / 100 g

Sacharidy / 100 g

Tuky / 100 g

Hodnoty sa zadávajú na 100 g. Môžeš vybrať ukážkovú potravinu alebo zadať vlastné hodnoty z obalu.

📖 Môj jedálniček

📊 Súhrn dňa

Pridaj jedlo a zobrazí sa tvoj denný súhrn.

Výpočty vychádzajú z údajov, ktoré zadáš. Presnosť závisí od správnosti nutričných hodnôt a množstva.

💾 Údaje a súkromie

Táto úvodná verzia ukladá denník iba do úložiska tohto prehliadača na tomto zariadení. Zatiaľ nemá online synchronizáciu ani zálohovanie. Nezadávaj sem citlivé údaje.

} * { box-sizing: border-box; } body { margin: 0; font-family: Arial, sans-serif; background: var(--light); color: var(--text); } header { background: white; padding: 20px; border-bottom: 1px solid var(--border); } .header-inner, main { max-width: 1100px; margin: auto; } header h1 { margin: 0; font-size: 25px; } header p { color: var(--muted); margin-bottom: 0; } main { padding: 22px 16px 45px; } h2 { font-size: 19px; margin-top: 0; } h3 { font-size: 15px; } .card { background: white; border: 1px solid var(--border); border-radius: 15px; padding: 19px; margin-bottom: 17px; } .top-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 17px; } .calorie-number { font-size: 37px; font-weight: 700; } .muted { color: var(--muted); font-size: 13px; } .progress { height: 11px; background: #e8eee9; border-radius: 20px; overflow: hidden; margin: 15px 0; } .progress div { height: 100%; width: 0; background: var(--green); transition: width .25s; } .macro-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; } .macro { background: #f6f8f6; padding: 12px; border-radius: 10px; } .macro strong { display: block; margin: 8px 0 4px; } label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; } input, select, button { font: inherit; border-radius: 8px; } input, select { width: 100%; padding: 11px; border: 1px solid #d8e1da; background: white; color: var(--text); } button { padding: 11px 15px; border: 0; cursor: pointer; font-weight: 600; } .primary { background: var(--green); color: white; } .secondary { background: #edf3ee; color: var(--text); } .danger { background: #fff0ee; color: #b43c32; } .form-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; align-items: end; } .form-grid .wide { grid-column: span 2; } .form-grid .full { grid-column: 1 / -1; } .meal-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; } .meal-heading h3 { margin: 0; } .food-row { border-top: 1px solid var(--border); padding: 13px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; } .food-row:first-child { border-top: 0; } .food-row p { margin: 5px 0 0; } .food-actions { display: flex; align-items: center; gap: 9px; } .food-kcal { text-align: right; white-space: nowrap; } .empty { color: var(--muted); font-size: 14px; padding: 10px 0; } .section-title { margin: 24px 0 13px; } .small-button { padding: 7px 10px; font-size: 12px; } .note { font-size: 12px; color: var(--muted); line-height: 1.5; } @media(max-width:650px) { .top-grid { grid-template-columns: 1fr; } .form-grid { grid-template-columns: 1fr 1fr; } .form-grid .wide { grid-column: 1 / -1; } .form-grid .full { grid-column: 1 / -1; } header { padding: 17px; } main { padding: 15px 12px 35px; } .card { padding: 15px; } .calorie-number { font-size: 32px; } }