Update food item templates for clarity and styling

Changed table heading in food_items.html to indicate values are per 100g/100ml and applied 'bg-body-tertiary' class to table cells for improved readability. Updated add_food_item.html to use 'form-control-plaintext' for the readonly barcode field for better display consistency.
This commit is contained in:
2025-06-29 09:45:45 +02:00
parent cfff4b15d0
commit 36b189c689
2 changed files with 10 additions and 10 deletions

View File

@@ -6,7 +6,7 @@ Food Nutritional Info
{% block content %}
<div class="container mt-5">
<h1 class="mb-4">Food Nutritional Information (per 100g)</h1>
<h1 class="mb-4">Food Nutritional Information (per 100g/100ml)</h1>
<div class="table-responsive">
<table class="table table-bordered table-hover align-middle">
<thead class="table-dark">
@@ -24,14 +24,14 @@ Food Nutritional Info
<tbody>
{% for food in items %}
<tr>
<td>{{ food.name }}</td>
<td>{{ food.energy_100g }}</td>
<td>{{ food.fats_100g }}</td>
<td>{{ food.saturated_fats_100g }}</td>
<td>{{ food.sugar_100g }}</td>
<td>{{ food.carbs_100g }}</td>
<td>{{ food.protein_100g }}</td>
<td>
<td class="bg-body-tertiary">{{ food.name }}</td>
<td class="bg-body-tertiary">{{ food.energy_100g }}</td>
<td class="bg-body-tertiary">{{ food.fats_100g }}</td>
<td class="bg-body-tertiary">{{ food.saturated_fats_100g }}</td>
<td class="bg-body-tertiary">{{ food.sugar_100g }}</td>
<td class="bg-body-tertiary">{{ food.carbs_100g }}</td>
<td class="bg-body-tertiary">{{ food.protein_100g }}</td>
<td class="bg-body-tertiary">
<form method="POST" action="{{ url_for('admin.delete_food', id=food.id) }}"
onsubmit="return confirm('Are you sure you want to delete this item?');">
<button type="submit" class="btn btn-danger btn-sm">Delete</button>

View File

@@ -6,7 +6,7 @@
<div class="mb-3">
{{ form.barcode.label(class="form-label") }}
{{ form.barcode(class="form-control", readonly=true, style="background-color: #e9ecef; cursor: not-allowed;") }}
{{ form.barcode(class="form-control-plaintext", readonly=true) }}
</div>
<div class="mb-3">