feat(search.html): style search page

This commit is contained in:
2026-03-11 12:30:17 +01:00
parent 6665765b83
commit f102553cd5

View File

@@ -1,38 +1,38 @@
{% extends "base.html" %} {% extends "base.html" %}
{% load static wagtailcore_tags %} {% load static i18n wagtailcore_tags %}
{% block body_class %}template-searchresults{% endblock %} {% block body_class %}template-searchresults{% endblock %}
{% block title %}Search{% endblock %} {% block title %}Search{% endblock %}
{% block content %} {% block content %}
<h1>Search</h1> <h1 class="text-3xl font-bold mb-6 text-gray-800">{% trans "Search" %}</h1>
<form action="{% url 'search' %}" method="get"> <form action="{% url 'search' %}" method="get" class="flex flex-col md:flex-row items-center gap-4 mb-8">
<input type="text" name="query"{% if search_query %} value="{{ search_query }}"{% endif %}> <input type="text" name="query"{% if search_query %} value="{{ search_query }}"{% endif %} class="border border-gray-300 rounded px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 w-full md:w-auto">
<input type="submit" value="Search" class="button"> <input type="submit" value="{% trans 'Search' %}" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition">
</form> </form>
{% if search_results %} {% if search_results %}
<ul> <ul class="space-y-6">
{% for result in search_results %} {% for result in search_results %}
<li> <li class="bg-white rounded shadow p-4">
<h4><a href="{% pageurl result %}">{{ result }}</a></h4> <h4 class="text-lg font-semibold mb-2"><a href="{% pageurl result %}" class="text-blue-600 hover:underline">{{ result }}</a></h4>
{% if result.search_description %} {% if result.search_description %}
{{ result.search_description }} {{ result.search_description }}
{% endif %} {% endif %}
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>
{% if search_results.has_previous %} {% if search_results.has_previous %}
<a href="{% url 'search' %}?query={{ search_query|urlencode }}&amp;page={{ search_results.previous_page_number }}">Previous</a> <a href="{% url 'search' %}?query={{ search_query|urlencode }}&amp;page={{ search_results.previous_page_number }}" class="inline-block bg-gray-200 text-gray-700 px-3 py-1 rounded hover:bg-gray-300 mr-2">{% trans "Previous" %}</a>
{% endif %} {% endif %}
{% if search_results.has_next %} {% if search_results.has_next %}
<a href="{% url 'search' %}?query={{ search_query|urlencode }}&amp;page={{ search_results.next_page_number }}">Next</a> <a href="{% url 'search' %}?query={{ search_query|urlencode }}&amp;page={{ search_results.next_page_number }}" class="inline-block bg-gray-200 text-gray-700 px-3 py-1 rounded hover:bg-gray-300">{% trans "Next" %}</a>
{% endif %} {% endif %}
{% elif search_query %} {% elif search_query %}
No results found <div class="text-red-600 font-semibold mt-8">{% trans "No results found" %}</div>
{% endif %} {% endif %}
{% endblock %} {% endblock %}