fix(templates): use expression attributes and fix indentation

Convert string-interpolation attributes (value="{ x }") to templ
expression attributes (value={ x }) for IDs, paths, and titles, and
fix indentation in header.templ and progress.templ.
This commit is contained in:
2026-08-08 15:40:15 -04:00
parent acfb298b74
commit 4b152bbe4e
7 changed files with 20 additions and 20 deletions
+1 -1
View File
@@ -78,7 +78,7 @@ templ AdminLibrary(user User, libraries []LibraryData, users []User) {
<select id="user-select" onchange="loadUserVisibility()" class="px-3 py-2 border rounded" style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border)">
<option value="">Select a user...</option>
for _, user := range users {
<option value="{ user.ID }">{ user.Username } ({ user.Email })</option>
<option value={ user.ID }>{ user.Username } ({ user.Email })</option>
}
</select>
</div>
+1 -1
View File
@@ -43,7 +43,7 @@ templ BookDetail(user User, book handlers.MediaDetail, errorMessage string) {
} else {
<img
src="/static/placeholder-book.svg"
alt="{ book.Title }"
alt={ book.Title }
class="w-64 h-96 object-cover rounded-lg shadow-xl"
/>
}
+1 -1
View File
@@ -38,7 +38,7 @@ templ CollectionRules(user User, collection CollectionData) {
<div class="mb-8">
<h2 class="text-2xl font-bold mb-4" style="color: var(--text-primary)">Create New Rule</h2>
<form id="rule-form" @submit="handleCreateRule($event)">
<input type="hidden" id="collection-id" value="{ collection.ID }"/>
<input type="hidden" id="collection-id" value={ collection.ID }/>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
<div>
<label class="block text-sm font-medium mb-2" style="color: var(--text-secondary)">Field</label>
+2 -2
View File
@@ -92,13 +92,13 @@ templ Conflicts(user User, conflicts []handlers.ConflictDetailResponse, total in
</div>
}
for _, conflict := range conflicts {
<div class="conflict-item card p-6 rounded-lg border" data-conflict-id="{ conflict.ID }" style="background-color: var(--bg-secondary); border-color: var(--border); border-left-width: 4px; border-left-style: solid; border-left-color: rgb(245, 158, 11);">
<div class="conflict-item card p-6 rounded-lg border" data-conflict-id={ conflict.ID } style="background-color: var(--bg-secondary); border-color: var(--border); border-left-width: 4px; border-left-style: solid; border-left-color: rgb(245, 158, 11);">
<div class="flex justify-between items-start mb-4">
<div class="flex items-start space-x-4">
<input
type="checkbox"
class="conflict-checkbox w-5 h-5 rounded mt-1"
data-conflict-id="{ conflict.ID }"
data-conflict-id={ conflict.ID }
onchange="updateBulkActions()"
/>
<div>
+3 -3
View File
@@ -1,7 +1,7 @@
package templates
templ Header(user User, currentPath string) {
<nav x-data="header" x-init="initializeSearch(); initializeTheme(); loadWoodPaneling(); updateWoodPanelingIndicators(); restoreLibrarySelection(); initializeScanListener()" class="border-b header-nav" style="border-color: var(--border); background-color: var(--bg-secondary);">
<nav x-data="header" x-init="initializeSearch(); initializeTheme(); loadWoodPaneling(); updateWoodPanelingIndicators(); restoreLibrarySelection(); initializeScanListener()" class="border-b header-nav" style="border-color: var(--border); background-color: var(--bg-secondary);">
<div x-data="{}" x-init="console.log('Alpine is working!', $el)"></div>
<div class="w-full px-4 sm:px-6 lg:px-8">
<div class="flex justify-between items-center h-16">
@@ -274,7 +274,7 @@ templ Header(user User, currentPath string) {
style="background-color: var(--bg-secondary); border: 1px solid var(--border); display: none;"
>
<form hx-post="/api/auth/login" hx-target="#login-result" hx-swap="innerHTML" class="space-y-3">
<input type="hidden" name="redirect" value="{ currentPath }"/>
<input type="hidden" name="redirect" value={ currentPath }/>
<div>
<label class="block text-sm mb-1" style="color: var(--text-secondary)">Email or Username</label>
<input type="text" name="login" class="w-full px-3 py-2 border rounded text-sm" style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border);" required/>
@@ -504,7 +504,7 @@ templ Header(user User, currentPath string) {
} else {
<div class="space-y-3">
<form hx-post="/api/auth/login" hx-target="#login-result-mobile" hx-swap="innerHTML" class="space-y-3">
<input type="hidden" name="redirect" value="{ currentPath }"/>
<input type="hidden" name="redirect" value={ currentPath }/>
<div>
<label class="block text-sm mb-1" style="color: var(--text-secondary)">Email or Username</label>
<input type="text" name="login" class="w-full px-3 py-2 border rounded text-sm" style="background-color: var(--bg-primary); color: var(--text-primary); border-color: var(--border);" required/>
+11 -11
View File
@@ -33,7 +33,7 @@ templ Progress(user User, progressData []handlers.ProgressWithMedia, errorMessag
<div class="flex gap-6">
<div class="flex-shrink-0">
<img
src="{ item.CoverImagePath }"
src={ item.CoverImagePath }
alt="Cover"
class="w-24 h-32 object-cover rounded"
onerror="this.src='/static/placeholder-book.svg'"
@@ -63,18 +63,18 @@ templ Progress(user User, progressData []handlers.ProgressWithMedia, errorMessag
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 text-sm">
<div>
<p style="color: var(--text-secondary)">Current Position</p>
<p style="color: var(--text-primary)">
if item.FormatGroup == "reflowable" {
if item.EstimatedPages > 0 {
{ fmt.Sprintf("Page %d of %d (est.)", item.CurrentPage, item.EstimatedPages) }
<p style="color: var(--text-secondary)">Current Position</p>
<p style="color: var(--text-primary)">
if item.FormatGroup == "reflowable" {
if item.EstimatedPages > 0 {
{ fmt.Sprintf("Page %d of %d (est.)", item.CurrentPage, item.EstimatedPages) }
} else {
{ fmt.Sprintf("%.1f%%", item.ProgressPercentage) }
}
} else {
{ fmt.Sprintf("%.1f%%", item.ProgressPercentage) }
{ fmt.Sprintf("%d / %d", item.CurrentPage, item.TotalPages) }
}
} else {
{ fmt.Sprintf("%d / %d", item.CurrentPage, item.TotalPages) }
}
</p>
</p>
</div>
<div>
<p style="color: var(--text-secondary)">Last Updated</p>
+1 -1
View File
@@ -49,7 +49,7 @@ templ UnlinkedBooks(user User, unlinkedBooks []UnlinkedBookData) {
<div class="card p-6 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="flex gap-6">
<div class="flex items-start pt-2">
<input type="checkbox" class="unlinked-checkbox w-5 h-5" data-progress-id="{ book.ProgressID }" data-title="{ book.TitleFromDevice }" onchange="updateSelectedCount()"/>
<input type="checkbox" class="unlinked-checkbox w-5 h-5" data-progress-id={ book.ProgressID } data-title={ book.TitleFromDevice } onchange="updateSelectedCount()"/>
</div>
<div class="flex-1">
<div class="flex items-center gap-3 mb-4">