Updated boxes page with links and smaller thumbnails

This commit is contained in:
2025-12-28 23:19:51 +01:00
parent 00861f8945
commit ed44deb5a6

View File

@@ -43,20 +43,21 @@
background-color: #f8f9fa; background-color: #f8f9fa;
} }
.thumbnail { .thumbnail {
width: 200px; width: 50px;
height: 200px; height: 50px;
object-fit: cover; object-fit: cover;
border-radius: 4px; border-radius: 4px;
} }
.no-image { .no-image {
width: 200px; width: 50px;
height: 200px; height: 50px;
background-color: #e0e0e0; background-color: #e0e0e0;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #999; color: #999;
border-radius: 4px; border-radius: 4px;
font-size: 12px;
} }
.back-link { .back-link {
margin-bottom: 20px; margin-bottom: 20px;
@@ -98,14 +99,14 @@
<tr> <tr>
<td> <td>
{% if thing.picture %} {% if thing.picture %}
{% thumbnail thing.picture "200x200" crop="center" as thumb %} {% thumbnail thing.picture "50x50" crop="center" as thumb %}
<img src="{{ thumb.url }}" alt="{{ thing.name }}" class="thumbnail"> <img src="{{ thumb.url }}" alt="{{ thing.name }}" class="thumbnail">
{% endthumbnail %} {% endthumbnail %}
{% else %} {% else %}
<div class="no-image">No image</div> <div class="no-image">No image</div>
{% endif %} {% endif %}
</td> </td>
<td>{{ thing.name }}</td> <td><a href="{% url 'thing_detail' thing.id %}">{{ thing.name }}</a></td>
<td>{{ thing.thing_type.name }}</td> <td>{{ thing.thing_type.name }}</td>
<td>{{ thing.description|default:"-" }}</td> <td>{{ thing.description|default:"-" }}</td>
</tr> </tr>