Stuff i guess ?

This commit is contained in:
Lars Behrends
2025-10-31 00:24:17 +01:00
parent db0fd4e728
commit 04140786a7
40 changed files with 5411 additions and 525 deletions

View File

@@ -112,26 +112,57 @@
</form>
<!-- View mode switcher -->
<div class="btn-group" role="group">
<div class="btn-group me-2" role="group">
{% for mode in view_modes %}
<a
href="?view={{ mode }}{% if search %}&search={{ search }}{% endif %}{% if pagination.per_page != 24 %}&per_page={{ pagination.per_page }}{% endif %}{% for genre in filters.genres %}&genres[]={{ genre }}{% endfor %}{% for director in filters.directors %}&directors[]={{ director }}{% endfor %}"
href="?view={{ mode }}&sort={{ sort }}{% if search %}&search={{ search }}{% endif %}{% if pagination.per_page != 24 %}&per_page={{ pagination.per_page }}{% endif %}{% for genre in filters.genres %}&genres[]={{ genre }}{% endfor %}{% for director in filters.directors %}&directors[]={{ director }}{% endfor %}"
class="btn btn-outline-secondary {{ view_mode == mode ? 'active' : '' }}"
title="{{ mode|title }} View"
>
{% if mode == 'grid' %}
<svg class="me-1" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"/>
</svg>
{% endif %}
{% if mode == 'list' %}
<svg class="me-1" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h16M4 18h16"/>
</svg>
{% endif %}
{{ mode|title }}
{% if mode == 'covers' %}
<svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/>
</svg>
{% endif %}
<span class="d-none d-sm-inline ms-1">{{ mode|title }}</span>
</a>
{% endfor %}
</div>
<!-- Sort dropdown -->
<div class="dropdown">
<button class="btn btn-outline-secondary dropdown-toggle" type="button" id="sortDropdown" data-bs-toggle="dropdown" aria-expanded="false">
<svg class="me-1" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 4h13M3 8h9m-9 4h6m4 0l4-4m0 0l4 4m-4-4v12"/>
</svg>
<span class="d-none d-sm-inline">Sort</span>
</button>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="sortDropdown">
{% for key, label in sort_options %}
<li>
<a class="dropdown-item {% if sort == key %}active{% endif %}"
href="?sort={{ key }}&view={{ view_mode }}{% if search %}&search={{ search }}{% endif %}{% if pagination.per_page != 24 %}&per_page={{ pagination.per_page }}{% endif %}{% for genre in filters.genres %}&genres[]={{ genre }}{% endfor %}{% for director in filters.directors %}&directors[]={{ director }}{% endfor %}">
{{ label }}
{% if sort == key %}
<svg class="float-end mt-1" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
<path d="M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5zM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5z"/>
</svg>
{% endif %}
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
@@ -219,8 +250,22 @@
{% elseif view_mode == 'covers' %}
<!-- Cover grid view -->
<div class="items">
<div class="row g-3">
{% for movie in movies %}
<figure class="item" style="padding:0px">
<a href="{{ path_for('movies.show', {'id': movie.id}) }}" class="text-decoration-none">
<img src="/images/{{ movie.poster_url }}" />
<figcaption>{{ movie.title }}</figcaption>
</a>
</figure>
<!--
<div class="col-6 col-sm-4 col-md-3 col-lg-2">
<div class="card h-100">
{% if movie.poster_url %}
@@ -245,7 +290,7 @@
{% endif %}
</div>
</div>
</div>
</div>-->
{% endfor %}
</div>
@@ -367,6 +412,50 @@
</div>
<style>
/* Sort dropdown styles */
.dropdown-menu {
min-width: 250px;
max-height: 400px;
overflow-y: auto;
}
.dropdown-item {
padding: 0.5rem 1.25rem;
white-space: normal;
line-height: 1.4;
}
.dropdown-item svg {
margin-top: 0.15rem;
}
/* Make sure the dropdown works on mobile */
@media (max-width: 575.98px) {
.dropdown-menu {
position: fixed !important;
top: auto !important;
left: 1rem !important;
right: 1rem !important;
width: auto !important;
margin-top: 0.5rem;
max-height: 70vh;
transform: none !important;
}
.dropdown-menu-end {
right: 1rem !important;
left: 1rem !important;
}
}
/* View mode buttons */
.btn-group .btn {
display: flex;
align-items: center;
justify-content: center;
padding: 0.375rem 0.75rem;
}
/* Custom styles for Select2 integration */
.select2-container {
z-index: 1050; /* Ensure Select2 dropdown appears above other elements */