47 lines
1.8 KiB
HTML
47 lines
1.8 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Kitchen Mirror Recipes</title>
|
||
<link rel="stylesheet" href="/MMM-NextcloudCookbook/assets/styles.css">
|
||
</head>
|
||
<body>
|
||
<main>
|
||
<header>
|
||
<div>
|
||
<p class="eyebrow">Kitchen Mirror</p>
|
||
<h1>Recipes</h1>
|
||
</div>
|
||
<div class="header-actions">
|
||
<button id="theme-toggle" class="secondary" type="button"></button>
|
||
<button id="resume" class="secondary" type="button" hidden>Resume last recipe</button>
|
||
<button id="exit" class="secondary" type="button">Exit recipe mode</button>
|
||
</div>
|
||
</header>
|
||
<p id="status" role="status">Loading recipes…</p>
|
||
<div id="portions" class="portions" hidden>
|
||
<button id="fewer-portions" type="button" aria-label="One fewer portion">−</button>
|
||
<span><strong id="portion-count"></strong> portions</span>
|
||
<button id="more-portions" type="button" aria-label="One more portion">+</button>
|
||
</div>
|
||
<article id="active-recipe" class="active-recipe" hidden>
|
||
<h2 id="active-recipe-name"></h2>
|
||
<p id="active-recipe-yield"></p>
|
||
<section>
|
||
<h3>Ingredients</h3>
|
||
<ul id="active-ingredients" class="checklist"></ul>
|
||
</section>
|
||
<section>
|
||
<h3>Instructions</h3>
|
||
<ol id="active-instructions" class="checklist"></ol>
|
||
</section>
|
||
</article>
|
||
<label for="search">Find a recipe</label>
|
||
<input id="search" type="search" autocomplete="off" placeholder="Search recipes">
|
||
<ul id="recipes" aria-live="polite"></ul>
|
||
</main>
|
||
<script src="/MMM-NextcloudCookbook/assets/app.js" defer></script>
|
||
</body>
|
||
</html>
|