45 lines
1.1 KiB
HTML
45 lines
1.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Recipe List</title>
|
|
<link rel="stylesheet" href="styles.css" />
|
|
</head>
|
|
<body>
|
|
<main class="container">
|
|
<h1>Recipe List</h1>
|
|
|
|
<section class="panel">
|
|
<h2>Add Recipe</h2>
|
|
<form id="recipe-form">
|
|
<label>
|
|
Name
|
|
<input id="name" name="name" required />
|
|
</label>
|
|
|
|
<label>
|
|
Ingredients (one per line)
|
|
<textarea id="ingredients" name="ingredients" rows="6" required></textarea>
|
|
</label>
|
|
|
|
<label>
|
|
Cooking Instructions
|
|
<textarea id="instructions" name="instructions" rows="8" required></textarea>
|
|
</label>
|
|
|
|
<button type="submit">Save Recipe</button>
|
|
</form>
|
|
</section>
|
|
|
|
<section class="panel">
|
|
<h2>Recipes</h2>
|
|
<p id="status" class="status"></p>
|
|
<div id="recipes" class="recipes"></div>
|
|
</section>
|
|
</main>
|
|
|
|
<script src="app.js"></script>
|
|
</body>
|
|
</html>
|