Update style

This commit is contained in:
2024-10-17 16:49:12 +11:00
parent 413095627f
commit 134b368e21
4 changed files with 179 additions and 55 deletions
+85 -51
View File
@@ -2,60 +2,94 @@
{% load i18n %}
{% block content %}
<h1 class="text-2xl font-bold mb-4">{% trans "Advanced Search" %}</h1>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<h1 class="text-3xl font-bold text-gray-900 mb-6">{% trans "Advanced Search" %}</h1>
<form action="{% url 'search' %}" method="get" class="mb-6">
<div class="flex">
<input type="text" name="q" value="{{ query }}" class="flex-grow p-2 border rounded-l-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="{% trans 'Enter search query' %}">
<button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded-r-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500">
{% trans "Search" %}
</button>
</div>
</form>
{% if query %}
<p class="mb-4">{% trans "Search results for" %}: {{ query }}</p>
{% if links %}
<ul class="space-y-4">
{% for link in links %}
<li class="bg-white shadow rounded-lg p-4">
<div class="flex justify-between items-center">
<a href="{{ link.original_url }}" class="text-blue-600 hover:underline">{{ link.alias }}</a>
<div>
<a href="{% url 'link_detail' link.pk %}" class="text-sm text-gray-600 hover:underline mr-2">{% trans "Details" %}</a>
<a href="{% url 'link_update' link.pk %}" class="text-sm text-gray-600 hover:underline">{% trans "Edit" %}</a>
</div>
</div>
<p class="text-sm text-gray-500 mt-1">{{ link.original_url }}</p>
</li>
{% endfor %}
</ul>
{% if is_paginated %}
<div class="mt-4">
<span class="step-links">
{% if page_obj.has_previous %}
<a href="?q={{ query }}&page=1">&laquo; first</a>
<a href="?q={{ query }}&page={{ page_obj.previous_page_number }}">previous</a>
{% endif %}
<span class="current">
Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
</span>
{% if page_obj.has_next %}
<a href="?q={{ query }}&page={{ page_obj.next_page_number }}">next</a>
<a href="?q={{ query }}&page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
{% endif %}
</span>
<form action="{% url 'search' %}" method="get" class="mb-8">
<div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4">
<div class="flex-grow">
<input type="text" name="q" value="{{ query }}"
class="w-full px-4 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500"
placeholder="{% trans 'Enter search query' %}">
</div>
<button type="submit"
class="w-full sm:w-auto px-6 py-2 bg-blue-600 text-white font-medium rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
{% trans "Search" %}
</button>
</div>
{% endif %}
</form>
{% if query %}
<h2 class="text-2xl font-semibold text-gray-800 mb-4">{% trans "Search results for" %}: {{ query }}</h2>
{% if links %}
<div class="bg-white shadow overflow-hidden sm:rounded-md">
<ul class="divide-y divide-gray-200">
{% for link in links %}
<li>
<div class="px-4 py-4 sm:px-6 hover:bg-gray-50">
<div class="flex items-center justify-between">
<a href="{{ link.original_url }}" class="text-lg font-medium text-blue-600 hover:text-blue-800 truncate">{{ link.alias }}</a>
<div class="ml-2 flex-shrink-0 flex">
<a href="{% url 'link_detail' link.pk %}" class="mr-2 font-medium text-blue-600 hover:text-blue-800">{% trans "Details" %}</a>
<a href="{% url 'link_update' link.pk %}" class="font-medium text-indigo-600 hover:text-indigo-800">{% trans "Edit" %}</a>
</div>
</div>
<div class="mt-2 sm:flex sm:justify-between">
<div class="sm:flex">
<p class="flex items-center text-sm text-gray-500">
<svg class="flex-shrink-0 mr-1.5 h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5zm-5 5a2 2 0 012.828 0 1 1 0 101.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5a2 2 0 11-2.828-2.828l3-3z" clip-rule="evenodd" />
</svg>
{{ link.original_url }}
</p>
</div>
<div class="mt-2 flex items-center text-sm text-gray-500 sm:mt-0">
<svg class="flex-shrink-0 mr-1.5 h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-12a1 1 0 10-2 0v4a1 1 0 00.293.707l2.828 2.829a1 1 0 101.415-1.415L11 9.586V6z" clip-rule="evenodd" />
</svg>
{{ link.created_at|date:"Y-m-d H:i" }}
</div>
</div>
</div>
</li>
{% endfor %}
</ul>
</div>
{% if is_paginated %}
<nav class="bg-white px-4 py-3 flex items-center justify-between border-t border-gray-200 sm:px-6 mt-4" aria-label="Pagination">
<div class="hidden sm:block">
<p class="text-sm text-gray-700">
{% trans "Showing" %}
<span class="font-medium">{{ page_obj.start_index }}</span>
{% trans "to" %}
<span class="font-medium">{{ page_obj.end_index }}</span>
{% trans "of" %}
<span class="font-medium">{{ paginator.count }}</span>
{% trans "results" %}
</p>
</div>
<div class="flex-1 flex justify-between sm:justify-end">
{% if page_obj.has_previous %}
<a href="?q={{ query }}&page={{ page_obj.previous_page_number }}" class="relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
{% trans "Previous" %}
</a>
{% endif %}
{% if page_obj.has_next %}
<a href="?q={{ query }}&page={{ page_obj.next_page_number }}" class="ml-3 relative inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
{% trans "Next" %}
</a>
{% endif %}
</div>
</nav>
{% endif %}
{% else %}
<p class="text-gray-600">{% trans "No results found." %}</p>
{% endif %}
{% else %}
<p>{% trans "No results found." %}</p>
<p class="text-gray-600">{% trans "Enter a search query to find links." %}</p>
{% endif %}
{% else %}
<p>{% trans "Enter a search query to find links." %}</p>
{% endif %}
</div>
{% endblock %}
Binary file not shown.
+6 -4
View File
@@ -1568,8 +1568,10 @@ msgstr ""
#: links/models.py:10 links/templates/links/link_detail.html:13
#: links/templates/links/link_form.html:22
#, fuzzy
#| msgid "GoLinks"
msgid "Link"
msgstr "URL链接"
msgstr "GoLinks"
#: links/models.py:11 links/templates/links/link_detail.html:17
#: links/templates/links/link_form.html:25
@@ -1700,7 +1702,7 @@ msgstr "链接类型用于重定向到外部URL。当您想为长URL创建一个
msgid ""
"Custom type allows you to create a link with custom HTML content. Use this "
"when you want to display a message or custom content instead of redirecting."
msgstr "自定义类型允许您创建带有自定义 HTML 内容的链接。当您想要显示消息或自定义内容而不是重定向时,请使用此选项。"
msgstr ""
#: links/templates/links/link_form.html:77
#, fuzzy
@@ -1761,7 +1763,7 @@ msgstr "高级搜索"
#: links/templates/links/search.html:9
msgid "Enter search query"
msgstr ""
msgstr "请输入关键词"
#: links/templates/links/search.html:11
msgid "Search"
@@ -1779,7 +1781,7 @@ msgstr "未找到结果。"
#: links/templates/links/search.html:59
msgid "Enter a search query to find links."
msgstr ""
msgstr "请输入搜索查询以查找链接。"
#: links/templates/links/tools.html:8 templates/base.html:72
msgid "Tools"
+88
View File
@@ -738,6 +738,14 @@ video {
margin-top: 2rem;
}
.ml-3 {
margin-left: 0.75rem;
}
.mr-1\.5 {
margin-right: 0.375rem;
}
.block {
display: block;
}
@@ -774,6 +782,10 @@ video {
height: 100vh;
}
.h-5 {
height: 1.25rem;
}
.w-4 {
width: 1rem;
}
@@ -786,6 +798,10 @@ video {
width: 100%;
}
.w-5 {
width: 1.25rem;
}
.min-w-full {
min-width: 100%;
}
@@ -814,6 +830,18 @@ video {
max-width: 20rem;
}
.max-w-7xl {
max-width: 80rem;
}
.flex-1 {
flex: 1 1 0%;
}
.flex-shrink-0 {
flex-shrink: 0;
}
.flex-grow {
flex-grow: 1;
}
@@ -1171,6 +1199,11 @@ video {
padding-bottom: 1.25rem;
}
.py-8 {
padding-top: 2rem;
padding-bottom: 2rem;
}
.pr-3 {
padding-right: 0.75rem;
}
@@ -1217,6 +1250,11 @@ video {
line-height: 1rem;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.font-bold {
font-weight: 700;
}
@@ -1451,6 +1489,11 @@ video {
background-color: rgb(185 28 28 / var(--tw-bg-opacity));
}
.hover\:bg-gray-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.hover\:text-blue-700:hover {
--tw-text-opacity: 1;
color: rgb(29 78 216 / var(--tw-text-opacity));
@@ -1486,6 +1529,16 @@ video {
color: rgb(127 29 29 / var(--tw-text-opacity));
}
.hover\:text-blue-800:hover {
--tw-text-opacity: 1;
color: rgb(30 64 175 / var(--tw-text-opacity));
}
.hover\:text-indigo-800:hover {
--tw-text-opacity: 1;
color: rgb(55 48 163 / var(--tw-text-opacity));
}
.hover\:underline:hover {
text-decoration-line: underline;
}
@@ -1504,6 +1557,11 @@ video {
border-color: transparent;
}
.focus\:border-blue-500:focus {
--tw-border-opacity: 1;
border-color: rgb(59 130 246 / var(--tw-border-opacity));
}
.focus\:outline-none:focus {
outline: 2px solid transparent;
outline-offset: 2px;
@@ -1563,10 +1621,22 @@ video {
grid-column: span 2 / span 2;
}
.sm\:mt-0 {
margin-top: 0px;
}
.sm\:block {
display: block;
}
.sm\:inline {
display: inline;
}
.sm\:flex {
display: flex;
}
.sm\:table-cell {
display: table-cell;
}
@@ -1591,6 +1661,14 @@ video {
align-items: center;
}
.sm\:justify-end {
justify-content: flex-end;
}
.sm\:justify-between {
justify-content: space-between;
}
.sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
@@ -1603,6 +1681,16 @@ video {
margin-bottom: calc(0px * var(--tw-space-y-reverse));
}
.sm\:space-x-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-x-reverse: 0;
margin-right: calc(1rem * var(--tw-space-x-reverse));
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.sm\:rounded-md {
border-radius: 0.375rem;
}
.sm\:p-6 {
padding: 1.5rem;
}