From 0b094605894ad7d6194edefad914909094dd3e5d Mon Sep 17 00:00:00 2001
From: Marco Roth <marco.roth@intergga.ch>
Date: Mon, 16 Mar 2026 22:38:19 +0100
Subject: [PATCH] Address HTML markup issues reported by Herb

---
 app/views/books/_form.html.erb  | 35 +++++++++++++++++----------------
 app/views/books/edit.html.erb   |  2 +-
 app/views/books/new.html.erb    |  2 +-
 app/views/books/show.html.erb   |  4 ++--
 app/views/pages/new.html.erb    |  2 +-
 app/views/pictures/new.html.erb |  2 +-
 app/views/sections/new.html.erb |  2 +-
 7 files changed, 25 insertions(+), 24 deletions(-)

diff --git a/app/views/books/_form.html.erb b/app/views/books/_form.html.erb
index 67780639..2654e4dc 100644
--- a/app/views/books/_form.html.erb
+++ b/app/views/books/_form.html.erb
@@ -4,7 +4,7 @@
       <fieldset class="flex flex-column unpad margin-block-end borderless justify-space-between">
         <legend class="for-screen-reader">Cover color</legend>
 
-        <% Book.themes.keys.each do | theme | %>
+        <% Book.themes.keys.each do |theme| %>
           <label class="btn btn--circle txt-small" style="--btn-background: var(--theme-color--<%= theme -%>)" >
             <%= form.radio_button :theme, theme %>
             <%= image_tag "check.svg", aria: { hidden: "true" }, size: 24, class: "checked" %>
@@ -12,6 +12,7 @@
           </label>
         <% end %>
       </fieldset>
+
       <%= tag.div class: "flex flex-column", data: { controller: "upload-preview", upload_preview_default_image_value: asset_url("empty-cover.png") } do %>
         <label class="align-center center gap position-relative margin-block-end">
           <% unless book.cover.attached? %>
@@ -39,23 +40,23 @@
           <% end %>
         <% end %>
       <% end %>
-    <% end %>
+    </div>
+  <% end %>
 
-    <div class="flex flex-column gap full-width">
-      <div class="flex align-center gap txt-medium">
-        <%= translation_button(:book_title) %>
-        <h1 class="txt-xx-large margin-none full-width">
-          <%= form.text_field :title, required: true, autofocus: true, class: "input", placeholder: "Book title", autocomplete: "off" %>
-        </h1>
-      </div>
-      <div class="flex align-center gap txt-medium">
-        <%= translation_button(:book_subtitle) %>
-        <small class="txt-normal txt-large txt-tight-lines full-width"><%= form.text_area :subtitle, class: "input", placeholder: "Subtitle", autocomplete: "off" %></small>
-      </div>
-      <div class="flex align-center gap txt-medium">
-        <%= translation_button(:book_author) %>
-        <small class="txt-normal txt-large txt-tight-lines full-width"><%= form.text_field :author, class: "input", placeholder: "Author", autocomplete: "off" %></small>
-      </div>
+  <div class="flex flex-column gap full-width">
+    <div class="flex align-center gap txt-medium">
+      <%= translation_button(:book_title) %>
+      <h1 class="txt-xx-large margin-none full-width">
+        <%= form.text_field :title, required: true, autofocus: true, class: "input", placeholder: "Book title", autocomplete: "off" %>
+      </h1>
+    </div>
+    <div class="flex align-center gap txt-medium">
+      <%= translation_button(:book_subtitle) %>
+      <small class="txt-normal txt-large txt-tight-lines full-width"><%= form.text_area :subtitle, class: "input", placeholder: "Subtitle", autocomplete: "off" %></small>
+    </div>
+    <div class="flex align-center gap txt-medium">
+      <%= translation_button(:book_author) %>
+      <small class="txt-normal txt-large txt-tight-lines full-width"><%= form.text_field :author, class: "input", placeholder: "Author", autocomplete: "off" %></small>
     </div>
   </div>
 
diff --git a/app/views/books/edit.html.erb b/app/views/books/edit.html.erb
index dcb2a532..f5975d66 100644
--- a/app/views/books/edit.html.erb
+++ b/app/views/books/edit.html.erb
@@ -18,7 +18,7 @@
       <%= image_tag "trash.svg", aria: { hidden: true }, size: 24 %>
       <span class="for-screen-reader">Delete <%= @book.title %></span>
     <% end %>
-    <button type="submit" form="book-editor", class="new-book-btn btn btn--reversed center txt-medium--responsive" aria-label="Save changes" title="Save changes">
+    <button type="submit" form="book-editor" class="new-book-btn btn btn--reversed center txt-medium--responsive" aria-label="Save changes" title="Save changes">
       <%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
     </button>
   </nav>
diff --git a/app/views/books/new.html.erb b/app/views/books/new.html.erb
index 2987c8e9..5b165536 100644
--- a/app/views/books/new.html.erb
+++ b/app/views/books/new.html.erb
@@ -13,7 +13,7 @@
 
 <% content_for :footer do %>
   <nav class="new-book-btn flex justify-center pad">
-    <button type="submit" form="book-editor", class="btn btn--reversed txt-medium--responsive" aria-label="Create book" title="Create book">
+    <button type="submit" form="book-editor" class="btn btn--reversed txt-medium--responsive" aria-label="Create book" title="Create book">
       <%= image_tag "arrow-right.svg", aria: { hidden: true }, size: 24 %>
     </button>
   </nav>
diff --git a/app/views/books/show.html.erb b/app/views/books/show.html.erb
index b90644d1..3b243d1f 100644
--- a/app/views/books/show.html.erb
+++ b/app/views/books/show.html.erb
@@ -59,7 +59,7 @@
       <% else %>
         <span class="book__cover-wrapper">
           <%= image_tag "empty-cover.png", alt: "Book cover", class: "book__cover margin-block-none center" %>
-          <span class="book__title overflow-line-clamp pad txt-align-start txt-tight-lines"" style="--lines: 6" aria-hidden="true"><%= @book.title %></span>
+          <span class="book__title overflow-line-clamp pad txt-align-start txt-tight-lines" style="--lines: 6" aria-hidden="true"><%= @book.title %></span>
         </span>
       <% end %>
 
@@ -69,7 +69,7 @@
         <% end %>
       <% end %>
 
-      <span data-controller="edit-mode" data-edit-mode-editing-class="edit-mode" />
+      <span data-controller="edit-mode" data-edit-mode-editing-class="edit-mode"></span>
     </div>
   </aside>
 
diff --git a/app/views/pages/new.html.erb b/app/views/pages/new.html.erb
index 0973a0b4..00c140d6 100644
--- a/app/views/pages/new.html.erb
+++ b/app/views/pages/new.html.erb
@@ -7,7 +7,7 @@
       <span class="for-screen-reader">Cancel</span>
     <% end %>
 
-    <button type="submit" form="leafable-editor", class="btn flex-item-justify-end">
+    <button type="submit" form="leafable-editor" class="btn flex-item-justify-end">
       <%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
       <span class="for-screen-reader">Save</span>
     </button>
diff --git a/app/views/pictures/new.html.erb b/app/views/pictures/new.html.erb
index e4fdd2a3..264df476 100644
--- a/app/views/pictures/new.html.erb
+++ b/app/views/pictures/new.html.erb
@@ -7,7 +7,7 @@
       <span class="for-screen-reader">Cancel</span>
     <% end %>
 
-    <button type="submit" form="leafable-editor", class="btn flex-item-justify-end">
+    <button type="submit" form="leafable-editor" class="btn flex-item-justify-end">
       <%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
       <span class="for-screen-reader">Save</span>
     </button>
diff --git a/app/views/sections/new.html.erb b/app/views/sections/new.html.erb
index 0472e851..7b530396 100644
--- a/app/views/sections/new.html.erb
+++ b/app/views/sections/new.html.erb
@@ -7,7 +7,7 @@
       <span class="for-screen-reader">Cancel</span>
     <% end %>
 
-    <button type="submit" form="leafable-editor", class="btn flex-item-justify-end">
+    <button type="submit" form="leafable-editor" class="btn flex-item-justify-end">
       <%= image_tag "check.svg", aria: { hidden: true }, size: 24 %>
       <span class="for-screen-reader">Save</span>
     </button>