section improvements

This commit is contained in:
2025-06-08 17:23:47 +02:00
parent 9fcb9c358b
commit 26cdb90c3a
5 changed files with 63 additions and 24 deletions

View File

@@ -52,6 +52,12 @@
<option value="{{ rate.id }}" {% if selected_growth_rate == rate.id|string %}selected{% endif %}>{{ rate.name }}</option>
{% endfor %}
</select>
<select id="section" name="section" class="rounded-lg border border-gray-300 px-3 py-1 text-sm focus:border-[#6b8f71] focus:ring-[#6b8f71]">
<option value="">All Sections</option>
{% for section in sections %}
<option value="{{ section.id }}" {% if selected_section == section.id|string %}selected{% endif %}>{{ section.name }}</option>
{% endfor %}
</select>
<a href="{{ url_for('home') }}" class="btn-secondary px-4 py-1 text-sm font-semibold ml-2 sm:ml-0">Clear</a>
</form>
</div>
@@ -67,7 +73,7 @@
}
const form = document.getElementById('plant-filter-form');
const searchInput = document.getElementById('search');
const selects = [document.getElementById('climate'), document.getElementById('environment'), document.getElementById('light'), document.getElementById('toxicity'), document.getElementById('size'), document.getElementById('care_difficulty'), document.getElementById('growth_rate')];
const selects = [document.getElementById('climate'), document.getElementById('environment'), document.getElementById('light'), document.getElementById('toxicity'), document.getElementById('size'), document.getElementById('care_difficulty'), document.getElementById('growth_rate'), document.getElementById('section')];
// Auto-submit on select change
selects.forEach(sel => sel.addEventListener('change', () => form.submit()));
@@ -103,7 +109,17 @@
{% endif %}
<div class="w-full flex flex-col gap-2">
<h2 class="text-2xl font-bold mb-1 text-[#4e6b50] group-hover:text-[#3e5637] transition">{{ plant.name }}</h2>
{% if plant.section %}
<div class="text-sm text-[#6b8f71] mb-2">
<i class="fas fa-layer-group mr-1"></i>Section: {{ plant.section.name }}
</div>
{% endif %}
<div class="flex flex-wrap gap-2 mb-1">
<!-- Debug output -->
<div class="hidden">
Debug - Climate: {{ plant.climate }}
Debug - Environment: {{ plant.environment }}
</div>
<span class="tag-tooltip inline-flex items-center px-2 py-0.5 rounded text-[#3e5637] text-xs font-semibold" style="background-color: #d0e7d2;" data-type="climate">
{% if plant.climate_icon %}
<img src="{{ url_for('static', filename='icons/' ~ plant.climate_icon) }}" alt="Climate icon" class="w-4 h-4 mr-1 inline-block align-middle" />