unify components and layout

This commit is contained in:
Robin Olsen
2026-02-24 15:13:31 +01:00
parent dd92c5741a
commit 38ae7905c1
24 changed files with 802 additions and 963 deletions

View File

@@ -6,47 +6,50 @@ import (
"github.com/LazyBachelor/LazyPM/internal/models"
)
type IssueDetailCardProps struct {
Issue models.Issue
DisplayOwner string
DisplayAssignee string
type IssueDetailProps struct {
Issue *models.Issue
ShowDetailsButton bool
}
templ IssueDetailCard(props IssueDetailCardProps) {
<div class="card bg-base-100 shadow-sm">
<div class="card-body p-4">
<span class="badge badge-ghost badge-sm font-mono">{ props.Issue.ID }</span>
<h2 class="text-lg font-bold mt-2">{ props.Issue.Title }</h2>
<div class="flex gap-2 flex-wrap">
@StatusBadge(props.Issue.Status)
@TypeBadge(props.Issue.IssueType)
@PriorityBadge(props.Issue.Priority)
</div>
if props.Issue.Description != "" {
<div class="mt-4">
<h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3>
<p class="whitespace-pre-wrap text-sm">{ props.Issue.Description }</p>
</div>
}
<div class="divider my-2"></div>
<div class="grid grid-cols-2 gap-2 text-sm">
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Created</span>
<p>{ props.Issue.CreatedAt.Format("Jan 2, 2006") }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Updated</span>
<p>{ props.Issue.UpdatedAt.Format("Jan 2, 2006") }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Created by</span>
<p>{ props.DisplayOwner }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Assignee</span>
<p>{ props.DisplayAssignee }</p>
</div>
</div>
templ IssueDetail(props IssueDetailProps) {
<h2 class="text-2xl font-bold m-2">
<a
class="hover active cursor-pointer"
hx-get={ "/issues/" + props.Issue.ID }
hx-target="main"
hx-swap="innerHTML"
>
{ props.Issue.Title }
</a>
</h2>
<div class="flex gap-2 flex-wrap">
@StatusBadge(props.Issue.Status)
@TypeBadge(props.Issue.IssueType)
@PriorityBadge(props.Issue.Priority)
</div>
if props.Issue.Description != "" {
<div class="mt-4">
<h3 class="text-sm font-semibold opacity-70 mb-1">Description</h3>
<p class="whitespace-pre-wrap text-sm">{ props.Issue.Description }</p>
</div>
}
<div class="divider my-2"></div>
<div class="grid grid-cols-2 gap-2 text-sm">
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Created</span>
<p>{ props.Issue.CreatedAt.Format("Jan 2, 2006") }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Updated</span>
<p>{ props.Issue.UpdatedAt.Format("Jan 2, 2006") }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Created by</span>
<p>{ props.Issue.Actor }</p>
</div>
<div class="bg-base-200 rounded-lg p-2">
<span class="text-xs opacity-70 block">Assignee</span>
<p>{ props.Issue.Assignee }</p>
</div>
</div>
}