Refactorings and gui improvements

app/views/checklist_entries/_form.html.erb

@@ -3,7 +3,7 @@
   <%= link_to "Abbrechen", checklist_entry.persisted? ? checklist_entry : checklist_entry.checklist, class: "btn btn-outline-secondary float-end", data: { turbo_frame: "checklist_entries" } %>
   <%= form.submit class: "btn btn-secondary float-end me-2" %>
   <%= form.hidden_field :checklist_id %>
-  <%= form.collection_select :check_id, Check.all.order(:external_number), :id, :display_label %>
+  <%= form.collection_select :check_id, Check.all.order(:external_number_1, :external_number_2, :external_number_3), :id, :display_label %>
   <%# form.number_field :position %>
 <% end %>
 </div>

app/views/checklists/_form.html.erb_

@@ -1,5 +0,0 @@
-<%= bootstrap_form_with(model: checklist, data: { controller: "unsaved-changes" }) do |form| %>
-  <%= form.text_field :name %>
-  <%= form.rich_text_area :description_html, rows: 12 %>
-  <%= form.submit %>
-<% end %>

app/views/checklists/_form.html.slim

@@ -1,5 +1,5 @@
 = bootstrap_form_with(model: checklist, data: { controller: "unsaved-changes" }) do |form|
   = form.text_field :name
   = form.rich_text_area :description_html, rows: 12
-  = form.collection_check_boxes :check_ids, Check.all.order(:external_number), :id, :display_label
+  = form.collection_check_boxes :check_ids, Check.all.order(:external_number_1, :external_number_2, :external_number_3), :id, :display_label
   = form.submit

app/views/checks/_form.html.slim

@@ -18,8 +18,17 @@
       .col-md-2
         = form.check_box d, label: t("applicability.#{d}").capitalize
   
-  h2 Richtlinie
-  = form.text_field :external_number
+  h2 Erfolgskriterium
+  .d-flex.justify-content-start
+    div style="width:60px"
+      = form.number_field :external_number_1, hide_label: true
+    div.px-1.mt-3 style="" = "."
+    div style="width:60px"
+      = form.number_field :external_number_2, hide_label: true
+    div.px-1.mt-3 style="" = "."
+    div style="width:60px"
+      = form.number_field :external_number_3, hide_label: true
+
   = form.text_field :external_url
   = form.select :conformity_level, Check.conformity_levels.keys, include_blank: true
   = multilang_form_field(form, :conformity_notice, as: :rich_text_area)

app/views/elements/_element.html.erb

@@ -1,4 +1,5 @@
 <div id="<%= dom_id element %>" class="mb-5">
+  <a id="<%= dom_id(element, :scroll) %>"></a>
   <%= turbo_frame_tag dom_id(element, :frame) do %>
     <div class="d-flex">
       <h2 class="h4">

app/views/elements/_new_success_criterion_button.html.erb

@@ -1,3 +1,3 @@
-<%= link_to "#{tag.i(class: "bi bi-plus-lg")} Neue Checkliste".html_safe, new_from_checklist_element_success_criteria_path(element), class: "btn btn-primary" %>
+<%= link_to "#{tag.i(class: "bi bi-plus-lg")} Checkliste".html_safe, new_from_checklist_element_success_criteria_path(element), class: "btn btn-primary" %>
 
-<%= link_to "#{tag.i(class: "bi bi-plus-lg")} Neues Erfolgskriterium".html_safe, new_element_success_criterion_path(element), class: "btn btn-primary" %>
+<%= link_to "#{tag.i(class: "bi bi-plus-lg")} Erfolgskriterium".html_safe, new_element_success_criterion_path(element), class: "btn btn-secondary" %>

app/views/elements/create.turbo_stream.erb

@@ -1,2 +0,0 @@
-<%= turbo_stream.update "new_element_frame", partial: "pages/new_element_button", locals: { page: @element.page } %>
-<%= turbo_stream.append "element_list", @element %>

app/views/elements/create.turbo_stream.slim

@@ -0,0 +1,5 @@
+= turbo_stream.update "new_element_frame", partial: "pages/new_element_button", locals: { page: @element.page }
+= turbo_stream.append "element_list", @element
+= turbo_stream.append dom_id(@element.page, :page_nav_elements) do 
+  i.bi.bi-boxes.me-1
+  = link_to("#{@element.number} #{@element.title}", "##{dom_id(@element)}", data: { "turbo": false })

app/views/elements/index.html.erb

@@ -5,33 +5,24 @@
     <tr>
       <th><%= Element.human_attribute_name(:id) %></th>
       
-        <th><%= Element.human_attribute_name(:report_id) %></th>
-      
-        <th><%= Element.human_attribute_name(:path) %></th>
+        <th><%= Element.human_attribute_name(:page_id) %></th>
       
         <th><%= Element.human_attribute_name(:title) %></th>
-      
-        <th><%= Element.human_attribute_name(:description_html) %></th>
-      
   </thead>
   <tbody>
     <% @elements.each do |element| %>
       <tr>
         <td><%= link_to(element.id, url_for(element)) %></td>
         
-          <td><%= link_to(element.report_id, url_for(element)) %></td>
-        
-          <td><%= link_to(element.path, url_for(element)) %></td>
+          <td><%= link_to(element.page_id, url_for(element)) %></td>
         
           <td><%= link_to(element.title, url_for(element)) %></td>
         
-          <td><%= link_to(truncate(element.description_html&.to_plain_text), url_for(element)) %></td>
-        
       </tr>
     <% end %>
   </tbody>
 </table>
 
 <div class="action-row">
-  <%= link_to t("scaffold.link_new", model: Element.model_name.human), new_element_path %>
+  <%= link_to t("scaffold.link_new", model: Element.model_name.human), new_page_element_path(@page) %>
 </div>

app/views/layouts/_application.html.erb

@@ -0,0 +1,30 @@
+<!doctype html>
+<html data-bs-theme="<%= cookies[:"modeTheme"] || "light" %>" data-controller="set-theme">
+  <head>
+    <title>a11ydive</title>
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+
+    <%= csrf_meta_tags %>
+    <%= csp_meta_tag %>
+
+    <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
+    <%= javascript_include_tag "application", "data-turbo-track": "reload", type: "module" %>
+  </head>
+
+  <body>
+    <%= render partial: "layouts/navigation" %>
+    <div class="container-fluid">
+      <div class="row">
+        <%= render partial: "layouts/sidebar" %>
+        <main class="col ps-md-2 pt-2 <%= "border-start" if sidebar? %>">
+          <div class="container-fluid">
+            <div id="main-content" data-controller="rich-text-link-targets">
+              <%= yield %>
+            </div>
+          </div>
+        </main>
+      </div>
+    </div>
+    <footer class="container-fluid mt-auto border-top"><%= Rails.configuration.build_version && "Version: #{Rails.configuration.build_version}" %>
+  </body>
+</html>

app/views/layouts/application.html.slim

@@ -13,8 +13,7 @@ html data-bs-theme="#{cookies[:"modeTheme"] || "light"}" data-controller="set-th
       .row
         = render partial: "layouts/sidebar"
         main.col.ps-md-2.pt-2
-          .container-fluid
-            #main-content[data-controller="rich-text-link-targets"]
-              = yield
+          #main-content[data-controller="rich-text-link-targets"]
+            = yield
     footer.container-fluid.mt-auto.border-top
       = Rails.configuration.build_version && "Version: #{Rails.configuration.build_version}"

app/views/pages/_form.html.slim

@@ -1,4 +1,4 @@
-= bootstrap_form_with(model: [:report, page], data: { "turbo-frame": :nav }) do |form|
+= bootstrap_form_with(model: page.persisted? ? page :  [:report, page], data: { "turbo-frame": :_top }) do |form|
   = form.text_field :path
   = form.text_field :url
   = form.submit

app/views/pages/_notes.html.slim

@@ -1,3 +1,4 @@
-= bootstrap_form_with(model: page) do |form|
-  = form.text_area :notes, rows: [(page.notes&.count("\n") || 0) + 1, 10].max, placeholder: "Hier kannst du Notizen speichern. \n\nJeder Pfad hat seine eigenen Notizen.", hide_label: true
-  = form.submit "Speichern"
+.mt-5
+  = bootstrap_form_with(model: page) do |form|
+    = form.text_area :notes, rows: [(page.notes&.count("\n") || 0) + 1, 10].max, placeholder: "Hier kannst du Notizen speichern. \n\nJeder Pfad hat seine eigenen Notizen.", hide_label: true
+    = form.submit "Speichern"

app/views/pages/_page.html.erb

@@ -1,6 +1,6 @@
 <div id="<%= dom_id page %>" class="mb-3">
   <h2>
-    <i class="bi bi-file"></i>
+    <i class="bi bi-file-earmark-check"></i>
     <%= page.position %> <%= page.path %></h2>
     <p>url: <%= page.url %></p>
   <div id="element_list">

app/views/pages/show.html.slim

@@ -1,8 +1,11 @@
 h1
   = t("scaffold.pagetitle_show", model: @page.class.model_name.human)
+
 = render @page
+
 = turbo_frame_tag(dom_id(@page, :notes)) do 
   = render partial: "pages/notes", locals: { page: @page }
+
 .action-row
   = link_to t("scaffold.link_edit", model: @page.model_name.human), edit_page_path(@page)
   = link_to t("scaffold.link_index", model: @page.model_name.human(count: 2)), report_pages_path(@page.report)

app/views/reports/_new_page_button.html.erb

@@ -1 +1 @@
-<%= link_to "#{tag.i(class: "bi bi-plus-lg")} Neuer Pfad".html_safe, new_report_page_path(report), class: "btn btn-primary mb-3" %>
+<%= link_to "#{tag.i(class: "bi bi-plus-lg")}".html_safe, new_report_page_path(report), class: "btn btn-primary" %>

app/views/reports/_page_nav.html.slim

@@ -0,0 +1,26 @@
+div id=dom_id(report, :page_nav)
+  - if report.pages.any?
+    details open=true 
+      summary Struktur
+      nav
+        ul
+          - report.pages.each do |page|
+            - is_current = current_page == page
+            li
+              details open=current_page_displayed(page) class=""
+                summary
+                  i.bi.me-1 class="bi-file-earmark-check#{is_current ? "-fill" : "" }"
+                  - if is_current
+                    =< "#{page.position} #{page.path}" 
+                  - else
+                    =< link_to("#{page.position} #{page.path}", report_path(report, page_id: page.id), class: "#{is_current ? " active text-decoration-underline" : nil  }", data: { "turbo-frame": :_top })
+                ul id=dom_id(page, :page_nav_elements)
+                  - page.elements.each do |element| 
+                    li 
+                      i.bi.bi-boxes.me-1
+                      - if current_page == page
+                        =< link_to("#{element.number} #{element.title}", "##{dom_id(element)}", data: { "turbo": false })
+                      - else 
+                        =< link_to("#{element.number} #{element.title}", report_path(report, page_id: page.id, anchor: dom_id(element)), data: { "turbo": false })
+  = turbo_frame_tag "new_page_frame" do
+    = render partial: "reports/new_page_button", locals: { report: report }

app/views/reports/show.html.slim

@@ -1,33 +1,27 @@
-small.float-end
-  |  Erstellt am 
-  = l(@report.created_at, format: :short)
-  | , zuletzt bearbeitet am 
-  = l(@report.updated_at, format: :short)
+div
+  small.float-end
+    |  Erstellt am 
+    = l(@report.created_at, format: :short)
+    | , zuletzt bearbeitet am 
+    = l(@report.updated_at, format: :short)
 h1
   i.bi.bi-journal-text.me-2
   = @report.name
 - if @report.comment
   .smb-4.lead.mb-3
     = @report.comment
-= turbo_frame_tag "nav" do
-  .row 
-    .col-lg-3.col-md-6.col-sm-12
-      nav.nav.nav-pills.flex-column.mb-3#page_list
-        - @report.pages.each do |page|
-          /= link_to(report_path(@report, page_id: page.id), class: "nav-link#{@current_page&.id == page.id ? " active" : nil  }", data: { "turbo-action": :advance }) do
-            i.bi.bi-file
-            =< "#{page.position} #{page.path}"
-          = link_to(page.path, report_path(@report, page_id: page.id), class: "nav-link#{@current_page&.id == page.id ? " active" : nil  }", data: { "turbo-action": :advance })
-      = turbo_frame_tag "new_page_frame" do
-        = render partial: "reports/new_page_button", locals: { report: @report }
+.row 
+  .col-lg-3.col-md-6.col-sm-12
+    .page_nav.sticky-top
+      = render partial: "reports/page_nav", locals: { report: @report, current_page: @current_page }
       - if @current_page
         = turbo_frame_tag(dom_id(@current_page, :notes)) do 
           = render partial: "pages/notes", locals: { page: @current_page }
-    .col-lg-9.col-md-6.col-sm-12
-      - if @current_page
-          = render @current_page
-      - else 
-        'Gehen Sie weiter, hier gibt es nichts zu sehen.
+  .col-lg-9.col-md-6.col-sm-12
+    - if @current_page
+        = render @current_page
+    - else 
+      'Gehen Sie weiter, hier gibt es nichts zu sehen.
 .action-row
   = link_to report_path(@report, format: :pdf), class: "btn btn-secondary", target: "_blank" do
     i.bi.bi-filetype-pdf

app/views/success_criteria/_form.html.erb

@@ -4,7 +4,7 @@
   
   <div class="collapse show" id="collapseSuccessCriterion_<%= success_criterion.id %>">
     <div class="card-body">
-      <%= bootstrap_form_with(model: success_criterion.persisted? ? success_criterion : [:element, success_criterion]) do |form| %>
+      <%= bootstrap_form_with(model: success_criterion.persisted? ? success_criterion : [:element, success_criterion], data: { controller: "unsaved-changes" }) do |form| %>
         <div class="row">
           <div class="col">
             <div class="btn-group" role="group" aria-label="Resultat">

app/views/success_criteria/new.html.slim

@@ -3,7 +3,7 @@ h1
 = turbo_frame_tag dom_id(@success_criterion.element, "new_success_criterion_frame") do
   .border.border-info.p-3
     = bootstrap_form_with(model: @success_criterion.persisted? ? @success_criterion : [:element, @success_criterion]) do |form|
-      = form.collection_select :check_id, Check.all.order(:external_number), :id, :display_label
+      = form.collection_select :check_id, Check.all.order(:external_number_1, :external_number_2, :external_number_3), :id, :display_label
       = form.submit class: "btn btn-warning"
       = link_to "Abbrechen", @success_criterion.persisted? ? @success_criterion : @success_criterion.element, class: "btn btn-outline-secondary"