122 lines
4.4 KiB
PHP
122 lines
4.4 KiB
PHP
<?php
|
|
the_header(
|
|
'Submit a Recipe',
|
|
'Share your culinary creations with the world! Fill out the form below to submit your recipe for review and publication.',
|
|
'submit-recipe-body',
|
|
[
|
|
|
|
['keywords', 'recipe, submit, share, cooking, culinary'],
|
|
]
|
|
);
|
|
?>
|
|
<link rel="stylesheet" href="<?php echo ASSETS_PATH . '/css/single-submit.css' ?>">
|
|
|
|
<div class="container">
|
|
<div class="submit-recipe">
|
|
<h1 class="title">Submit a Recipe</h1>
|
|
</div>
|
|
<?php
|
|
if(isset($context['success_message']))
|
|
the_alert($context['success_message'], 'success');
|
|
|
|
if(isset($context['error_message']))
|
|
the_alert($context['error_message'], 'warning');
|
|
?>
|
|
|
|
<form class="single-submit-form" method="post" enctype="multipart/form-data">
|
|
<label for="title-input">Title</label><span>*</span>
|
|
<div class="input">
|
|
<input type="text" id="title-input" name="title" placeholder="Enter the recipe title" required>
|
|
</div>
|
|
<label for="description-input">Description</label><span>*</span>
|
|
<div class="input">
|
|
<textarea id="description-input" name="description" placeholder="Describe your recipe in detail"
|
|
required></textarea>
|
|
</div>
|
|
|
|
<label for="ingredients-input">Ingredients</label><span>*</span>
|
|
|
|
<table class="ingredients-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Count</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="ing-table-rows">
|
|
|
|
</tbody>
|
|
<tfoot>
|
|
<tr>
|
|
<td>
|
|
<div id="search-ingredient">
|
|
<input type="text" placeholder="Search ingredients...">
|
|
|
|
<div class="custom-select-dropdown" hidden>
|
|
<div class="dropdown-item hover-anim">Vegetable Oil</div>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
<td>
|
|
<button type="button" id="add-ingredient-btn" class="btn btn-primary hover-anim add-ingredient-btn">Create new</button>
|
|
</td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
|
|
<label for="image-input">Image</label><span>*</span>
|
|
<div class="input-file">
|
|
<input type="file" id="image-input" name="image" accept="image/*" required>
|
|
</div>
|
|
|
|
<label for="time-input">Estimated Time (minutes)</label><span>*</span>
|
|
<div class="input">
|
|
<input type="number" id="time-input" name="est-time" placeholder="Enter the recipe estimated time" required>
|
|
</div>
|
|
|
|
<label for="price-input">Estimated Price ($)</label><span>*</span>
|
|
<div class="input">
|
|
<input type="number" id="price-input" name="est-price" placeholder="Enter the recipe estimated price"
|
|
required>
|
|
</div>
|
|
<label for="category-select">Category</label><span>*</span>
|
|
<div class="input-select">
|
|
|
|
<select id="category-select" name="category" required>
|
|
<option value="">Select a category</option>
|
|
<?php foreach ($context['category_options'] as $category): ?>
|
|
<option value="<?php echo $category[0]; ?>">
|
|
<?php echo $category[1]; ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
|
|
</select>
|
|
|
|
|
|
</div>
|
|
<button type="submit" class="btn btn-primary hover-anim">Submit Recipe</button>
|
|
|
|
</form>
|
|
|
|
<div id="overlay" class="hidden"></div>
|
|
<div class="ing-modal hidden" id="ingredient-modal">
|
|
<div id="new-ingredient">
|
|
<label for="ing-name-input">Ingredient Name</label><span>*</span>
|
|
<div class="input">
|
|
<input type="text" id="ing-name-input" name="title" placeholder="Enter the ingredient name"
|
|
required>
|
|
</div>
|
|
<label for="unit-input">Unit of measure</label><span>*</span>
|
|
<div class="input">
|
|
<input type="text" id="ing-unit-input" name="title" placeholder="Enter the unit of measure"
|
|
required>
|
|
</div>
|
|
<button type="button" id="new-ingredient-submit" class="btn btn-primary hover-anim">Add new ingredient</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<?php the_footer(array(
|
|
ASSETS_PATH . '/js/single-submit.js',
|
|
)); ?>
|