This commit is contained in:
2025-05-22 21:22:15 +02:00
parent 3d57f842f9
commit 97cb9c8703
156 changed files with 1205 additions and 6603 deletions

View File

@@ -99,7 +99,16 @@
<textarea name="description" id="description" rows="6" required
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"></textarea>
</div>
<button type="submit" class="w-full btn-main text-lg font-semibold">Add Plant</button>
<div class="md:col-span-2">
<label for="care_guide" class="block text-sm font-medium text-gray-700">Care Guide</label>
<textarea name="care_guide" id="care_guide" rows="6"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500"></textarea>
</div>
<div class="flex justify-center mt-8">
<button type="submit" class="px-8 py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors">
Save Plant
</button>
</div>
</form>
</div>
</div>

View File

@@ -9,12 +9,12 @@
<button id="show-add-plant" class="btn-main px-6 py-2 font-semibold">Add Plant</button>
</div>
<div id="add-plant-form-card" class="hidden mb-8">
<div class="bg-gray-50 rounded-lg shadow p-6 max-w-2xl mx-auto">
<div class="bg-gray-50 rounded-lg shadow p-6 max-w-2xl mx-auto" style="overflow:visible;">
<div class="flex justify-between items-center mb-4">
<h3 class="text-xl font-bold">Add New Plant</h3>
<button type="button" id="close-add-plant" class="text-gray-500 hover:text-red-500 text-2xl font-bold leading-none">&times;</button>
</div>
<form id="add-plant-form" method="POST" enctype="multipart/form-data" class="space-y-4">
<form id="add-plant-form" method="POST" action="{{ url_for('new_plant') }}" enctype="multipart/form-data" class="space-y-4 pb-16">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div>
<label for="name" class="block text-sm font-medium text-gray-700">Name</label>
@@ -47,48 +47,48 @@
</select>
</div>
<div>
<label for="light" class="block text-sm font-medium text-gray-700">Light</label>
<select name="light" id="light" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select light</option>
<option value="Full Sun">Full Sun</option>
<option value="Partial Shade">Partial Shade</option>
<option value="Low Light">Low Light</option>
<label for="light_id" class="block text-sm font-medium text-gray-700">Light</label>
<select name="light_id" id="light_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select light requirement</option>
{% for light in lights %}
<option value="{{ light.id }}">{{ light.name }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="toxicity" class="block text-sm font-medium text-gray-700">Toxicity</label>
<select name="toxicity" id="toxicity" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select toxicity</option>
<option value="Pet Safe">Pet Safe</option>
<option value="Toxic to Pets">Toxic to Pets</option>
<option value="Unknown">Unknown</option>
<label for="toxicity_id" class="block text-sm font-medium text-gray-700">Toxicity</label>
<select name="toxicity_id" id="toxicity_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select toxicity level</option>
{% for toxicity in toxicities %}
<option value="{{ toxicity.id }}">{{ toxicity.name }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="size" class="block text-sm font-medium text-gray-700">Size</label>
<select name="size" id="size" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select size</option>
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<label for="size_id" class="block text-sm font-medium text-gray-700">Size</label>
<select name="size_id" id="size_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select size category</option>
{% for size in sizes %}
<option value="{{ size.id }}">{{ size.name }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="care_difficulty" class="block text-sm font-medium text-gray-700">Care Difficulty</label>
<select name="care_difficulty" id="care_difficulty" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select difficulty</option>
<option value="Easy">Easy</option>
<option value="Moderate">Moderate</option>
<option value="Hard">Hard</option>
<label for="care_difficulty_id" class="block text-sm font-medium text-gray-700">Care Difficulty</label>
<select name="care_difficulty_id" id="care_difficulty_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select difficulty level</option>
{% for difficulty in difficulties %}
<option value="{{ difficulty.id }}">{{ difficulty.name }}</option>
{% endfor %}
</select>
</div>
<div>
<label for="growth_rate" class="block text-sm font-medium text-gray-700">Growth Rate</label>
<select name="growth_rate" id="growth_rate" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<label for="growth_rate_id" class="block text-sm font-medium text-gray-700">Growth Rate</label>
<select name="growth_rate_id" id="growth_rate_id" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500">
<option value="">Select growth rate</option>
<option value="Fast">Fast</option>
<option value="Moderate">Moderate</option>
<option value="Slow">Slow</option>
{% for rate in growth_rates %}
<option value="{{ rate.id }}">{{ rate.name }}</option>
{% endfor %}
</select>
</div>
<div class="md:col-span-2">
@@ -109,11 +109,15 @@
</div>
<div class="md:col-span-2">
<label for="care_guide" class="block text-sm font-medium text-gray-700">Care Guide</label>
<div id="quill-care-guide" class="bg-white rounded border border-gray-300" style="min-height: 120px;"></div>
<div id="quill-care-guide" class="bg-white rounded border border-gray-300 mb-8" style="min-height: 120px;"></div>
<textarea name="care_guide" id="care_guide" style="display:none;"></textarea>
</div>
</div>
<button type="submit" class="w-full btn-main text-lg font-semibold">Add Plant</button>
<div class="flex justify-center">
<button type="submit" class="btn-main text-lg font-semibold px-8 py-3" style="margin-top: 85px;">
Add Plant
</button>
</div>
</form>
</div>
</div>
@@ -166,5 +170,12 @@ var quill = new Quill('#quill-care-guide', { theme: 'snow' });
document.getElementById('add-plant-form').onsubmit = function() {
document.getElementById('care_guide').value = quill.root.innerHTML;
};
// Auto-open the add plant form if ?add=1 is in the URL
if (window.location.search.includes('add=1')) {
document.getElementById('add-plant-form-card').classList.remove('hidden');
setTimeout(() => {
document.getElementById('add-plant-form-card').scrollIntoView({behavior: 'smooth'});
}, 100);
}
</script>
{% endblock %}