lukas
/
timetracker
1
0
Fork 0
Code Issues 18 Pull Requests 3 Actions Packages Projects 1 Releases 20 Wiki Activity

Major redesign #73

Merged
lukas merged 45 commits from manage-purchases into main 2024-09-02 15:47:44 +00:00
Conversation 1 Commits 45 Files Changed 56 +64 -88
3 changed files with 64 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 992622e8d1 - Show all commits

21
games/purchaseviews.py
View File

@ -15,15 +15,24 @@ from games.views import dateformat
@login_required @login_required
def list_purchases(request: HttpRequest) -> HttpResponse: def list_purchases(request: HttpRequest) -> HttpResponse:
context: dict[Any, Any] = {} context: dict[Any, Any] = {}
paginator = Paginator(Purchase.objects.order_by("-date_purchased"), 10)
page_number = request.GET.get("page", 1) page_number = request.GET.get("page", 1)
page_obj = paginator.get_page(page_number) limit = request.GET.get("limit", 10)
purchases = page_obj.object_list purchases = Purchase.objects.order_by("-date_purchased")
page_obj = None
if int(limit) != 0:
paginator = Paginator(Purchase.objects.order_by("-date_purchased"), limit)
page_obj = paginator.get_page(page_number)
purchases = page_obj.object_list
context = { context = {
"title": "Manage purchases", "title": "Manage purchases",
"page_obj": page_obj, "page_obj": page_obj or None,
"elided_page_range": page_obj.paginator.get_elided_page_range( "elided_page_range": (
page_number, on_each_side=1, on_ends=1 page_obj.paginator.get_elided_page_range(
page_number, on_each_side=1, on_ends=1
)
if page_obj
else None
), ),
"data": { "data": {
"columns": [ "columns": [

63
games/static/base.css
View File

@ -1511,6 +1511,10 @@ input:checked + .toggle-bg {
max-width: 20rem; max-width: 20rem;
} }
.max-w-screen-2xl {
max-width: 1536px;
}
.max-w-screen-lg { .max-w-screen-lg {
max-width: 1024px; max-width: 1024px;
} }
@ -1523,18 +1527,6 @@ input:checked + .toggle-bg {
max-width: 20rem; max-width: 20rem;
} }
.max-w-screen-sm {
max-width: 640px;
}
.max-w-screen-xl {
max-width: 1280px;
}
.max-w-screen-2xl {
max-width: 1536px;
}
.flex-1 { .flex-1 {
flex: 1 1 0%; flex: 1 1 0%;
} }
@ -1615,10 +1607,6 @@ input:checked + .toggle-bg {
grid-template-columns: repeat(7, minmax(0, 1fr)); grid-template-columns: repeat(7, minmax(0, 1fr));
} }
.flex-row {
flex-direction: row;
}
.flex-col { .flex-col {
flex-direction: column; flex-direction: column;
} }
@ -1703,10 +1691,6 @@ input:checked + .toggle-bg {
white-space: nowrap; white-space: nowrap;
} }
.overflow-ellipsis {
text-overflow: ellipsis;
}
.text-ellipsis { .text-ellipsis {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
@ -1857,10 +1841,6 @@ input:checked + .toggle-bg {
padding: 1rem; padding: 1rem;
} }
.p-6 {
padding: 1.5rem;
}
.px-2 { .px-2 {
padding-left: 0.5rem; padding-left: 0.5rem;
padding-right: 0.5rem; padding-right: 0.5rem;
@ -1911,10 +1891,6 @@ input:checked + .toggle-bg {
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.pb-16 {
padding-bottom: 4rem;
}
.pl-3 { .pl-3 {
padding-left: 0.75rem; padding-left: 0.75rem;
} }
@ -1931,18 +1907,10 @@ input:checked + .toggle-bg {
padding-top: 0.5rem; padding-top: 0.5rem;
} }
.pt-4 {
padding-top: 1rem;
}
.pt-8 { .pt-8 {
padding-top: 2rem; padding-top: 2rem;
} }
.pb-4 {
padding-bottom: 1rem;
}
.text-left { .text-left {
text-align: left; text-align: left;
} }
@ -2455,14 +2423,6 @@ textarea:disabled:is(.dark *) {
} }
} */ } */
.last\:border-b:last-child {
border-bottom-width: 1px;
}
.last\:border-b-0:last-child {
border-bottom-width: 0px;
}
.odd\:bg-white:nth-child(odd) { .odd\:bg-white:nth-child(odd) {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@ -2776,6 +2736,11 @@ textarea:disabled:is(.dark *) {
color: rgb(107 114 128 / var(--tw-text-opacity)); color: rgb(107 114 128 / var(--tw-text-opacity));
} }
.dark\:text-gray-600:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity));
}
.dark\:text-slate-400:is(.dark *) { .dark\:text-slate-400:is(.dark *) {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgb(148 163 184 / var(--tw-text-opacity)); color: rgb(148 163 184 / var(--tw-text-opacity));
@ -2796,11 +2761,6 @@ textarea:disabled:is(.dark *) {
color: rgb(255 255 255 / var(--tw-text-opacity)); color: rgb(255 255 255 / var(--tw-text-opacity));
} }
.dark\:text-gray-600:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(75 85 99 / var(--tw-text-opacity));
}
.odd\:dark\:bg-gray-900:is(.dark *):nth-child(odd) { .odd\:dark\:bg-gray-900:is(.dark *):nth-child(odd) {
--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(17 24 39 / var(--tw-bg-opacity)); background-color: rgb(17 24 39 / var(--tw-bg-opacity));
@ -2876,6 +2836,11 @@ textarea:disabled:is(.dark *) {
--tw-ring-color: rgb(63 131 248 / var(--tw-ring-opacity)); --tw-ring-color: rgb(63 131 248 / var(--tw-ring-opacity));
} }
.dark\:focus\:ring-gray-700:focus:is(.dark *) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
}
.dark\:focus\:ring-green-500:focus:is(.dark *) { .dark\:focus\:ring-green-500:focus:is(.dark *) {
--tw-ring-opacity: 1; --tw-ring-opacity: 1;
--tw-ring-color: rgb(14 159 110 / var(--tw-ring-opacity)); --tw-ring-color: rgb(14 159 110 / var(--tw-ring-opacity));

68
games/templates/components/simple_table.html
View File

@ -12,37 +12,39 @@
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
<nav class="flex items-center flex-column flex-wrap md:flex-row justify-between px-6 py-4" {% if page_obj %}
aria-label="Table navigation"> <nav class="flex items-center flex-column flex-wrap md:flex-row justify-between px-6 py-4"
<span class="text-sm font-normal text-gray-500 dark:text-gray-400 mb-4 md:mb-0 block w-full md:inline md:w-auto">Showing <span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.start_index }}</span>—<span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.end_index }}</span> of <span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.paginator.count }}</span></span> aria-label="Table navigation">
<ul class="inline-flex -space-x-px rtl:space-x-reverse text-sm h-8"> <span class="text-sm font-normal text-gray-500 dark:text-gray-400 mb-4 md:mb-0 block w-full md:inline md:w-auto">Showing <span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.start_index }}</span>—<span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.end_index }}</span> of <span class="font-semibold text-gray-900 dark:text-white">{{ page_obj.paginator.count }}</span></span>
<li> <ul class="inline-flex -space-x-px rtl:space-x-reverse text-sm h-8">
{% if page_obj.has_previous %} <li>
<a href="?page={{ page_obj.previous_page_number }}" {% if page_obj.has_previous %}
class="flex items-center justify-center px-3 h-8 ms-0 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Previous</a> <a href="?page={{ page_obj.previous_page_number }}"
{% else %} class="flex items-center justify-center px-3 h-8 ms-0 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Previous</a>
<a aria-current="page" {% else %}
class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">Previous</a> <a aria-current="page"
{% endif %} class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-s-lg dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">Previous</a>
{% for page in elided_page_range %} {% endif %}
<li> {% for page in elided_page_range %}
{% if page != page_obj.number %} <li>
<a href="?page={{ page }}" {% if page != page_obj.number %}
class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{{ page }}</a> <a href="?page={{ page }}"
{% else %} class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">{{ page }}</a>
<a aria-current="page" {% else %}
class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">{{ page }}</a> <a aria-current="page"
{% endif %} class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">{{ page }}</a>
</li> {% endif %}
{% endfor %} </li>
{% if page_obj.has_next %} {% endfor %}
<a href="?page={{ page_obj.next_page_number }}" {% if page_obj.has_next %}
class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next</a> <a href="?page={{ page_obj.next_page_number }}"
{% else %} class="flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg hover:bg-gray-100 hover:text-gray-700 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white">Next</a>
<a aria-current="page" {% else %}
class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">Next</a> <a aria-current="page"
{% endif %} class="cursor-not-allowed flex items-center justify-center px-3 h-8 leading-tight text-gray-500 bg-white border border-gray-300 rounded-e-lg dark:bg-gray-900 dark:border-gray-700 dark:text-gray-600">Next</a>
</li> {% endif %}
</ul> </li>
</nav> </ul>
</nav>
{% endif %}
</div> </div>