42 lines
1.4 KiB
HTML
42 lines
1.4 KiB
HTML
{% extends 'base.html' %}
|
|
{% block content %}
|
|
<section class="hero-grid">
|
|
<article class="card">
|
|
<div class="section-heading">
|
|
<div>
|
|
<p class="section-label">Meal planner</p>
|
|
<h2>Build the week around a few anchor meals</h2>
|
|
</div>
|
|
</div>
|
|
<form id="planner-form" class="stack-form">
|
|
<label>Week start
|
|
<input type="date" id="week-start">
|
|
</label>
|
|
<label>How many dinners?
|
|
<input type="number" id="target-meals" min="3" max="7" value="5">
|
|
</label>
|
|
<label>Anchor ideas
|
|
<textarea id="planner-anchors" rows="5" placeholder="Ground beef potato skillet Chicken rice bowls Pasta bake"></textarea>
|
|
</label>
|
|
<button type="submit">Build the week</button>
|
|
</form>
|
|
</article>
|
|
<article class="card">
|
|
<p class="section-label">What this does</p>
|
|
<h2>Waste-aware planning</h2>
|
|
<p class="muted">The planner looks at approved and queued meals, then tries to pair dishes that reuse overlapping ingredients. That means less waste, less random spending, and fewer half-dead veg rattling in the fridge drawer.</p>
|
|
</article>
|
|
</section>
|
|
|
|
<section class="card">
|
|
<div class="section-heading">
|
|
<div>
|
|
<p class="section-label">Plan output</p>
|
|
<h2>Suggested meal week</h2>
|
|
</div>
|
|
</div>
|
|
<div id="plan-output" class="plan-grid muted">Generate a plan to see the meal lineup.</div>
|
|
</section>
|
|
{% endblock %}
|
|
|