From f102553cd5c02a5d05c547c309e05a97255e6f1a Mon Sep 17 00:00:00 2001
From: Artur Borecki <me@pufereq.pl>
Date: Wed, 11 Mar 2026 12:30:17 +0100
Subject: [PATCH] feat(search.html): style search page

---
 search/templates/search/search.html | 30 ++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/search/templates/search/search.html b/search/templates/search/search.html
index 476427f..445730d 100644
--- a/search/templates/search/search.html
+++ b/search/templates/search/search.html
@@ -1,38 +1,38 @@
 {% extends "base.html" %}
-{% load static wagtailcore_tags %}
+{% load static i18n wagtailcore_tags %}
 
 {% block body_class %}template-searchresults{% endblock %}
 
 {% block title %}Search{% endblock %}
 
 {% 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">
-    <input type="text" name="query"{% if search_query %} value="{{ search_query }}"{% endif %}>
-    <input type="submit" value="Search" class="button">
+<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 %} 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="{% trans 'Search' %}" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700 transition">
 </form>
 
 {% if search_results %}
-<ul>
-    {% for result in search_results %}
-    <li>
-        <h4><a href="{% pageurl result %}">{{ result }}</a></h4>
-        {% if result.search_description %}
+<ul class="space-y-6">
+  {% for result in search_results %}
+    <li class="bg-white rounded shadow p-4">
+    <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 %}
         {{ result.search_description }}
-        {% endif %}
+      {% endif %}
     </li>
-    {% endfor %}
+  {% endfor %}
 </ul>
 
 {% 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 %}
 
 {% 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 %}
 {% elif search_query %}
-No results found
+  <div class="text-red-600 font-semibold mt-8">{% trans "No results found" %}</div>
 {% endif %}
 {% endblock %}