| 1 | <!DOCTYPE html>
|
|---|
| 2 | <html xmlns:th="http://www.thymeleaf.org">
|
|---|
| 3 | <head>
|
|---|
| 4 | <meta charset="UTF-8">
|
|---|
| 5 | <title>Add Ingredient</title>
|
|---|
| 6 |
|
|---|
| 7 | <!-- Add Bootstrap CSS link -->
|
|---|
| 8 | <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
|
|---|
| 9 | </head>
|
|---|
| 10 | <body>
|
|---|
| 11 | <div th:replace="appBar"></div>
|
|---|
| 12 |
|
|---|
| 13 | <div class="container mt-4"> <!-- Add Bootstrap container class for spacing -->
|
|---|
| 14 |
|
|---|
| 15 | <h2>Add Ingredient</h2>
|
|---|
| 16 |
|
|---|
| 17 | <form th:action="@{/ingredients/addIngredient}" method="post" class="needs-validation" novalidate>
|
|---|
| 18 | <div class="form-group">
|
|---|
| 19 | <label for="name">Name:</label>
|
|---|
| 20 | <input type="text" class="form-control" id="name" name="name" required>
|
|---|
| 21 | <div class="invalid-feedback">Please enter a name.</div>
|
|---|
| 22 | </div>
|
|---|
| 23 |
|
|---|
| 24 | <div class="form-group">
|
|---|
| 25 | <label for="calories">Calories per 100g:</label>
|
|---|
| 26 | <input type="number" class="form-control" id="calories" name="calories" required>
|
|---|
| 27 | <div class="invalid-feedback">Please enter calories.</div>
|
|---|
| 28 | </div>
|
|---|
| 29 |
|
|---|
| 30 | <div class="form-group">
|
|---|
| 31 | <label for="protein">Protein per 100g:</label>
|
|---|
| 32 | <input type="number" class="form-control" id="protein" name="protein" required>
|
|---|
| 33 | <div class="invalid-feedback">Please enter protein.</div>
|
|---|
| 34 | </div>
|
|---|
| 35 |
|
|---|
| 36 | <div class="form-group">
|
|---|
| 37 | <label for="carbs">Carbs per 100g:</label>
|
|---|
| 38 | <input type="number" class="form-control" id="carbs" name="carbs" required>
|
|---|
| 39 | <div class="invalid-feedback">Please enter carbs.</div>
|
|---|
| 40 | </div>
|
|---|
| 41 |
|
|---|
| 42 | <div class="form-group">
|
|---|
| 43 | <label for="fats">Fats per 100g:</label>
|
|---|
| 44 | <input type="number" class="form-control" id="fats" name="fats" required>
|
|---|
| 45 | <div class="invalid-feedback">Please enter fats.</div>
|
|---|
| 46 | </div>
|
|---|
| 47 |
|
|---|
| 48 | <button type="submit" class="btn btn-primary">Add Ingredient</button>
|
|---|
| 49 | </form>
|
|---|
| 50 |
|
|---|
| 51 | </div>
|
|---|
| 52 |
|
|---|
| 53 | <!-- Add Bootstrap JS and Popper.js for certain Bootstrap features -->
|
|---|
| 54 | <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
|
|---|
| 55 | <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
|
|---|
| 56 | <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
|
|---|
| 57 |
|
|---|
| 58 | </body>
|
|---|
| 59 | </html>
|
|---|
