Move breadcrumbs to top

This commit is contained in:
2025-06-19 08:56:48 +02:00
parent 4520e9a781
commit 1cde31a023
8 changed files with 62 additions and 34 deletions

View File

@ -3,7 +3,7 @@
{% block page_content %}
<!-- Master-Detail Split View -->
<div class="flex h-[calc(100vh-8rem)] overflow-hidden">
<div class="flex h-[calc(100vh-3.5rem)] overflow-hidden">
<!-- Master Pane -->
<aside id="master-pane"

View File

@ -3,28 +3,6 @@
{% block breadcrumbs %}
<div class="p-4 bg-white block sm:flex items-center justify-between border-b border-gray-200 dark:bg-gray-800 dark:border-gray-700">
<nav class="text-sm text-gray-500" aria-label="Breadcrumb">
<sl-breadcrumb id="breadcrumbs">
<sl-breadcrumb-item>
<sl-icon slot="prefix" name="house"></sl-icon>
<a href="/">Home</a>
</sl-breadcrumb-item>
{% if breadcrumbs %}
{% for label, url in breadcrumbs %}
<sl-breadcrumb-item class="page-breadcrumb">
{% if url %}
<a href="{{url}}">{{label}}</a>
{% else %}
{{ label }}
{% endif %}
</sl-breadcrumb-item>
{% endfor %}
{% endif %}
</sl-breadcrumb>
</nav>
</div>
{% endblock %}
{% block content %}

View File

@ -15,9 +15,27 @@
</button>
<!-- Page title or logo -->
{% if page_title %}
<h1 class="text-xl flex ml-2 md:mr-24 font-semibold text-gray-900 sm:text-2xl dark:text-white">{{page_title}}</h1>
{% endif %}
<nav class="text-sm text-gray-500" aria-label="Breadcrumb">
<sl-breadcrumb id="breadcrumbs">
<sl-breadcrumb-item>
<sl-icon slot="prefix" name="house"></sl-icon>
<a href="/">Home</a>
</sl-breadcrumb-item>
{% if breadcrumbs %}
{% for label, url in breadcrumbs %}
<sl-breadcrumb-item class="page-breadcrumb">
{% if url %}
<a href="{{url}}">{{label}}</a>
{% else %}
{{ label }}
{% endif %}
</sl-breadcrumb-item>
{% endfor %}
{% endif %}
</sl-breadcrumb>
</nav>
</div>
<!-- Right: User menu -->

View File

@ -3,7 +3,7 @@
{% block page_content %}
<div class="h-[calc(100vh-8rem)] bg-gray-100 flex items-center justify-center p-4">
<div class="h-[calc(100vh-3.5rem)] bg-gray-100 flex items-center justify-center p-4">
<div class="w-full max-w-xl p-6 space-y-8 bg-white rounded-lg shadow sm:p-8 dark:bg-gray-800">
<h2 class="text-2xl font-bold text-gray-900 dark:text-white">
Change Password

View File

@ -2,7 +2,7 @@
{% extends "/base/page.html.j2" %}
{% block page_content %}
<div class="h-[calc(100vh-8rem)] bg-gray-100 flex items-center justify-center p-4">
<div class="h-[calc(100vh-3.5rem)] bg-gray-100 flex items-center justify-center p-4">
<div class="text-center xl:max-w-4xl">
<h1 class="mb-3 text-2xl font-bold leading-tight text-gray-900 sm:text-4xl lg:text-5xl dark:text-white">Password Changed</h1>
<p class="mb-5 text-base font-normal text-gray-500 md:text-lg dark:text-gray-400">Your password was changed sucessfully. Next time you log in, use your new password.</p>

View File

@ -1,8 +1,8 @@
{# This is the master block #}
<div class="flowbite-init-target">
<div class="tree-header grid grid-cols-2 place-content-between mb-6">
<h1 class="text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">Client List</h1>
<div class="tree-header grid grid-cols-2 place-content-between mb-2">
<h1 class="text-lg font-semibold text-gray-900 dark:text-white">Client List</h1>
<div class="flex">
<div
class="htmx-indicator mt-2"
@ -32,8 +32,8 @@
</div>
<div class="col-span-full">
<div class="relative">
<div class="border-b border-gray-200 py-2 mb-6">
<label for="default-search" class="mb-2 text-sm font-medium text-gray-900 sr-only dark:text-white">Search</label>
<div class="border-b border-gray-200 py-2">
<label for="default-search" class="mb-2 text-xs font-medium text-gray-900 sr-only dark:text-white">Search</label>
<div class="relative">
<div class="absolute inset-y-0 start-0 flex items-center ps-3 pointer-events-none">
<svg class="w-4 h-4 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20">
@ -44,7 +44,7 @@
type="search"
id="client-search"
name="query"
class="block w-full p-2.5 ps-10 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-gray-900 focus:border-gray-900 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-gray-900 dark:focus:border-gray-900"
class="block w-full p-2.5 ps-10 text-xs text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-gray-900 focus:border-gray-900 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-gray-900 dark:focus:border-gray-900"
placeholder="Search..."
required
hx-post="/clients/query"

View File

@ -33,7 +33,7 @@
{% if pages %}
<div class="mt-4 text-center flex items-center flex-col border-t border-gray-100">
<span class="text-sm text-gray-700 dark:text-gray-400">
Showing <span class="font-semibold text-gray-900 dark:text-white">{{ pages.offset }}</span> to <span class="font-semibold text-gray-900 dark:text-white">{{ pages.total_pages }}</span> of <span class="font-semibold text-gray-900 dark:text-white">{{ results.total_results }}</span> Entries
Showing <span class="font-semibold text-gray-900 dark:text-white">{{ pages.offset + 1 }}</span> to <span class="font-semibold text-gray-900 dark:text-white">{{ pages.limit }}</span> of <span class="font-semibold text-gray-900 dark:text-white">{{ results.total_results }}</span> Entries
</span>
{% include 'clients/partials/pagination.html.j2' %}
</div>