improved formatting

This commit is contained in:
2025-11-07 09:41:32 -08:00
parent 5467c1dedb
commit 1ad8c988de

View File

@@ -2,7 +2,7 @@
{% block content %} {% block content %}
<div class="h-[80vh] flex flex-col m-4"> <div class="h-[80vh] flex flex-col m-4">
<h1 class="text-xl font-semibold mb-4">Projects for {{ case_email }}</h1> <h1 class="text-xl font-semibold mb-4">Projects for {{ case_email }}</h1>
<div class="m-4 w-full flex-grow overflow-scroll rounded-2xl overflow-hidden"> <div class=" w-full flex-grow overflow-scroll rounded-2xl overflow-hidden">
<table class="w-full whitespace-nowrap shadow-md border border-slate-200"> <table class="w-full whitespace-nowrap shadow-md border border-slate-200">
<thead class="bg-gradient-to-r from-blue-600 to-blue-700 text-left text-sm sticky top-0 z-10 border-b border-blue-800 text-white font-medium"> <thead class="bg-gradient-to-r from-blue-600 to-blue-700 text-left text-sm sticky top-0 z-10 border-b border-blue-800 text-white font-medium">
<tr> <tr>
@@ -21,8 +21,8 @@
<th class="px-4 py-3">Secondary Paralegal</th> <th class="px-4 py-3">Secondary Paralegal</th>
<th class="px-4 py-3">Documents</th> <th class="px-4 py-3">Documents</th>
<th class="px-4 py-3">Matter Stage</th> <th class="px-4 py-3">Matter Stage</th>
<th class="px-4 py-3">Completed Tasks</th> <th class="px-4 py-3 w-[400px] ">Completed Tasks</th>
<th class="px-4 py-3">Pending Tasks</th> <th class="px-4 py-3 w-[400px]">Pending Tasks</th>
<th class="px-4 py-3">Notice Service Date</th> <th class="px-4 py-3">Notice Service Date</th>
<th class="px-4 py-3">Notice Expir. Date</th> <th class="px-4 py-3">Notice Expir. Date</th>
<th class="px-4 py-3">Date Case Filed</th> <th class="px-4 py-3">Date Case Filed</th>
@@ -84,14 +84,25 @@
<a href="{{ r.documents_url }}">Documents</a> <a href="{{ r.documents_url }}">Documents</a>
{% endif %}</td> {% endif %}</td>
<td class="px-4 py-3 text-sm text-slate-800"> {{ r.phase_name }}</td> <td class="px-4 py-3 text-sm text-slate-800"> {{ r.phase_name }}</td>
<td class="px-4 py-3 text-sm align-top" x-data="{ showCompletedModal: false}"> <td class="px-4 py-3 text-sm align-top w-[400px] whitespace-normal" x-data="{ showCompletedModal: false}">
{% if r.completed_tasks %} {% if r.completed_tasks %}
<div> <div>
<ul class="list-disc list-inside align-top"> <table class="w-full text-xs">
{% for x in r.completed_tasks[:2] %} <thead>
<li>{{ x.description }} - {{ x.completed }}</li> <tr>
{% endfor %} <th class="text-left pb-1">Task</th>
</ul> <th class="text-right pb-1">Completed</th>
</tr>
</thead>
<tbody>
{% for x in r.completed_tasks[:2] %}
<tr>
<td class="py-1 pr-2 break-words">{{ x.description }}</td>
<td class="py-1 text-right whitespace-nowrap">{{ x.completed }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% if r.completed_tasks|length > 2 %} {% if r.completed_tasks|length > 2 %}
<button @click="showCompletedModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button> <button @click="showCompletedModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button>
{% endif %} {% endif %}
@@ -110,23 +121,43 @@
</svg> </svg>
</button> </button>
</div> </div>
<ul class="list-disc list-inside"> <table class="w-full">
{% for x in r.completed_tasks %} <thead>
<li>{{ x.description }} - {{ x.completed }}</li> <tr class="border-b">
{% endfor %} <th class="text-left pb-2">Task Description</th>
</ul> <th class="text-right pb-2">Completed Date</th>
</tr>
</thead>
<tbody>
{% for x in r.completed_tasks %}
<tr class="border-b border-slate-200">
<td class="py-2 break-words">{{ x.description }}</td>
<td class="py-2 text-right whitespace-nowrap">{{ x.completed }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div> </div>
</div> </div>
{% endif %} {% endif %}
</td> </td>
<td class="px-4 py-3 text-sm min-w-[500px] align-top" x-data="{ showPendingModal: false }"> <td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px] min-w-[400px]" x-data="{ showPendingModal: false }">
{% if r.pending_tasks %} {% if r.pending_tasks %}
<div> <div>
<ul class="list-disc list-inside align-top"> <table class="w-full text-xs">
{% for x in r.pending_tasks[:2] %} <thead>
<li>{{ x.description }}</li> <tr>
{% endfor %} <th class="text-left pb-1">Task</th>
</ul> </tr>
</thead>
<tbody>
{% for x in r.pending_tasks[:2] %}
<tr>
<td class="py-1 break-words">{{ x.description }}</td>
</tr>
{% endfor %}
</tbody>
</table>
{% if r.pending_tasks|length > 2 %} {% if r.pending_tasks|length > 2 %}
<button @click="showPendingModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button> <button @click="showPendingModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button>
{% endif %} {% endif %}
@@ -145,11 +176,20 @@
</svg> </svg>
</button> </button>
</div> </div>
<ul class="list-disc list-inside"> <table class="w-full">
{% for x in r.pending_tasks %} <thead>
<li>{{ x.description }}</li> <tr class="border-b">
{% endfor %} <th class="text-left pb-2">Task Description</th>
</ul> </tr>
</thead>
<tbody>
{% for x in r.pending_tasks %}
<tr class="border-b border-slate-200">
<td class="py-2 break-words">{{ x.description }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div> </div>
</div> </div>
{% endif %} {% endif %}