arthur/xtablo-source
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Packages Wiki Activity Actions 5

fix(19): move edit+trash to same line as status pill

Browse source 
Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Arthur Belleville 2026-05-17 22:21:49 +02:00
parent 7864c39872
commit 90d43f98bc
No known key found for this signature in database
1 changed files with 25 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
backend/templates/tablos.templ
View file

@ -125,8 +125,8 @@ templ TabloProjectCard(card TabloCardView, csrfToken string) {
>
<!-- Card view (default: visible in grid layout) -->
<div class="bg-white rounded-xl p-5 border border-[#EAECF0] hover:shadow-md transition-shadow cursor-pointer project-card flex flex-col gap-3">
<!-- Row 1: icon + title + status pill -->
<div class="flex items-center gap-3">
<!-- Row 1: icon + title + status pill + edit + delete -->
<div class="flex items-center gap-2">
if card.Tablo.Color.Valid && card.Tablo.Color.String != "" {
<div class="w-8 h-8 rounded-lg flex items-center justify-center shrink-0" style={ "background-color: " + card.Tablo.Color.String }>
<span class="text-white font-bold text-sm">
@ -144,12 +144,34 @@ templ TabloProjectCard(card TabloCardView, csrfToken string) {
</span>
</div>
}
<h3 class="text-sm font-semibold text-gray-900 flex-1 line-clamp-1">{ card.Tablo.Title }</h3>
<h3 class="text-sm font-semibold text-gray-900 flex-1 line-clamp-1 min-w-0">{ card.Tablo.Title }</h3>
if card.Tablo.Status == "archived" {
<span class="shrink-0 px-2 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-600 border border-gray-200">Archivé</span>
} else {
<span class="shrink-0 px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-600 border border-green-200">Actif</span>
}
<a
href={ templ.SafeURL("/tablos/" + card.Tablo.ID.String()) }
class="shrink-0 inline-flex items-center justify-center w-7 h-7 rounded-md text-gray-400 hover:text-blue-600 hover:bg-blue-50 transition-colors"
aria-label="Edit tablo"
onclick="event.stopPropagation()"
>
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-3.5 h-3.5" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>
</a>
<div class="tablo-delete-zone shrink-0">
@ui.IconButton(ui.IconButtonProps{
Label: "Delete tablo",
Icon: "trash",
Variant: ui.IconButtonVariantDanger,
Tone: ui.IconButtonToneGhost,
Type: "button",
Attrs: templ.Attributes{
"hx-get": "/tablos/" + card.Tablo.ID.String() + "/delete-confirm",
"hx-target": "closest .tablo-delete-zone",
"hx-swap": "outerHTML",
},
})
</div>
</div>
<!-- Row 2: creation date -->
<div class="flex items-center gap-1.5 text-xs text-gray-500">
@ -166,31 +188,6 @@ templ TabloProjectCard(card TabloCardView, csrfToken string) {
<div class="bg-purple-500 h-1.5 rounded-full project-card-progress-bar" style={ "width: " + strconv.Itoa(card.Progress) + "%" }></div>
</div>
</div>
<!-- Row 4: edit + delete -->
<div class="flex items-center gap-1 pt-1 border-t border-gray-100">
<a
href={ templ.SafeURL("/tablos/" + card.Tablo.ID.String()) }
class="inline-flex items-center justify-center w-7 h-7 rounded-md text-gray-400 hover:text-blue-600 hover:bg-blue-50 transition-colors"
aria-label="Edit tablo"
onclick="event.stopPropagation()"
>
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-3.5 h-3.5" aria-hidden="true"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>
</a>
<div class="tablo-delete-zone">
@ui.IconButton(ui.IconButtonProps{
Label: "Delete tablo",
Icon: "trash",
Variant: ui.IconButtonVariantDanger,
Tone: ui.IconButtonToneGhost,
Type: "button",
Attrs: templ.Attributes{
"hx-get": "/tablos/" + card.Tablo.ID.String() + "/delete-confirm",
"hx-target": "closest .tablo-delete-zone",
"hx-swap": "outerHTML",
},
})
</div>
</div>
</div>
<!-- List row (hidden by default, shown when data-view="list") -->
<div class="tablo-list-row" onclick="event.stopPropagation()">