Skip to content

Commit 474c5b1

Browse files
mnietonamnietona
authored
Improve search results layout and archived courses visibility (#371)
1 parent ff49125 commit 474c5b1

1 file changed

Lines changed: 48 additions & 31 deletions

File tree

‎search/templates/search/course_list.html‎

Lines changed: 48 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,54 @@
1-
<div class="pr-2" style="overflow-x: scroll">
2-
{% if simplified %}
3-
<li class="disabled dropdown-item text-danger">
4-
Ce résultat de recherche est simplifié parce que PostgreSQL
5-
n'est pas disponible.
6-
</li>
7-
{% endif %}
8-
{% for course in course_list %}
9-
<li class="dropdown-item">
10-
<a title="{{ course.name }}"
11-
href="{% url 'catalog:course_show' course.slug %}"
12-
class="text-reset text-decoration-none d-inline-block w-100 d-flex align-items-center gap-2"
13-
>
1+
{% if simplified %}
2+
<li class="px-2 pb-2">
3+
<div class="alert alert-danger mb-0 py-2 px-3 small rounded-3 d-flex align-items-start gap-2 border-0 bg-danger bg-opacity-10 text-danger">
4+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-exclamation-triangle-fill flex-shrink-0 mt-1" viewBox="0 0 16 16">
5+
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
6+
</svg>
7+
<span>Recherche simplifiée : PostgreSQL n'est pas disponible.</span>
8+
</div>
9+
</li>
10+
{% endif %}
11+
12+
{% for course in course_list %}
13+
<li>
14+
<a title="{{ course.name }}"
15+
href="{% url 'catalog:course_show' course.slug %}"
16+
class="dropdown-item d-flex align-items-center gap-3 py-2 px-3 rounded-3 mb-1 transition-all {% if course.is_archive %}opacity-75{% endif %}"
17+
style="white-space: normal;"
18+
>
19+
<div class="flex-shrink-0 d-flex align-items-center justify-content-center text-muted pe-1">
1420
{% if course.is_archive %}
15-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
16-
class="bi bi-archive" viewBox="0 0 16 16">
17-
<path
18-
d="M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
21+
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-archive" viewBox="0 0 16 16">
22+
<path d="M0 2a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1v7.5a2.5 2.5 0 0 1-2.5 2.5h-9A2.5 2.5 0 0 1 1 12.5V5a1 1 0 0 1-1-1V2zm2 3v7.5A1.5 1.5 0 0 0 3.5 14h9a1.5 1.5 0 0 0 1.5-1.5V5H2zm13-3H1v2h14V2zM5 7.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5z"/>
1923
</svg>
2024
{% else %}
21-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
22-
class="bi bi-folder" viewBox="0 0 16 16">
23-
<path
24-
d="M.54 3.87.5 3a2 2 0 0 1 2-2h3.672a2 2 0 0 1 1.414.586l.828.828A2 2 0 0 0 9.828 3h3.982a2 2 0 0 1 1.992 2.181l-.637 7A2 2 0 0 1 13.174 14H2.826a2 2 0 0 1-1.991-1.819l-.637-7a1.99 1.99 0 0 1 .342-1.31zM2.19 4a1 1 0 0 0-.996 1.09l.637 7a1 1 0 0 0 .995.91h10.348a1 1 0 0 0 .995-.91l.637-7A1 1 0 0 0 13.81 4H2.19zm4.69-1.707A1 1 0 0 0 6.172 2H2.5a1 1 0 0 0-1 .981l.006.139C1.72 3.042 1.95 3 2.19 3h5.396l-.707-.707z"/>
25+
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-book" viewBox="0 0 16 16">
26+
<path d="M1 2.828c.885-.37 2.154-.769 3.388-.893 1.33-.134 2.458.063 3.112.752v9.746c-.935-.53-2.12-.603-3.213-.493-1.18.12-2.37.461-3.287.811V2.828zm7.5-.141c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.815 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.815 8.985.936 8 1.783z"/>
2527
</svg>
2628
{% endif %}
27-
<span class="text-muted">{{ course.slug|upper }}</span>
28-
<span class="hover-underline">{{ course.name }}</span>
29-
</a>
30-
</li>
31-
{% empty %}
32-
<li class="disabled dropdown-item">
33-
Aucun résultat
34-
</li>
29+
</div>
3530

36-
{% endfor %}
37-
</div>
31+
<div class="d-flex flex-column overflow-hidden flex-grow-1">
32+
<span class="fw-bold text-dark lh-sm" style="font-size: 0.9rem;">
33+
{{ course.slug|upper }}
34+
{% if course.is_archive %}
35+
<span class="text-muted fw-normal fst-italic ms-1" style="font-size: 0.75rem;">(Archivé)</span>
36+
{% endif %}
37+
</span>
38+
<span class="text-muted text-truncate w-100" style="font-size: 0.8rem;">
39+
{{ course.name }}
40+
</span>
41+
</div>
42+
</a>
43+
</li>
44+
{% empty %}
45+
<li>
46+
<div class="text-center py-4 px-3 text-muted">
47+
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-search mb-2 opacity-50" viewBox="0 0 16 16">
48+
<path d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z"/>
49+
</svg>
50+
<div class="fw-medium">Aucun cours trouvé</div>
51+
<small>Essaie avec d'autres mots-clés.</small>
52+
</div>
53+
</li>
54+
{% endfor %}

0 commit comments

Comments
 (0)