Gui improvements and ideas

.gitignore

@@ -39,3 +39,4 @@
 
 /node_modules
 /.irbrc_history
+.~lock*

Dockerfile

@@ -1,14 +1,19 @@
-FROM ruby:3.3
-
-LABEL maintainer='david@hohl.cloud'
-
 ARG NAME=app
 ARG UID=1000
 ARG GID=1000
 ARG APP_PORT=3000
-
 ARG INSTALL_DIR=/${NAME}
 
+FROM ruby:3.3 AS development
+
+ARG NAME
+ARG UID
+ARG GID
+ARG APP_PORT
+ARG INSTALL_DIR
+
+LABEL maintainer='david@hohl.cloud'
+
 WORKDIR ${INSTALL_DIR}
 
 ENV GEM_HOME=${INSTALL_DIR}/.bundle
@@ -49,14 +54,74 @@ RUN \
   gem update --system && \
   bundle config set app_config ${GEM_HOME}
 
-USER ${NAME}
+FROM development AS builder
 
-EXPOSE ${APP_PORT}
+COPY Gemfile Gemfile.lock package.json yarn.lock ./
+
+RUN bundle install && yarn install
+
+FROM builder AS assets
+
+COPY . .
+
+COPY --from=builder /app/.bundle /app/.bundle
+COPY --from=builder /app/node_modules /app/node_modules
+
+RUN RAILS_ENV=production SECRET_KEY_BASE_DUMMY=1 rails assets:precompile
+
+FROM ruby:3.3.0-slim AS production
+
+ARG NAME
+ARG UID
+ARG GID
+ARG APP_PORT
+ARG INSTALL_DIR
+
+WORKDIR ${INSTALL_DIR}
+
+ENV \
+  LANG=C.UTF-8 \
+  INSTALL_DIR=${INSTALL_DIR} \
+  RAILS_ENV=production \
+  TZ=Europe/Zurich \
+  PATH=${INSTALL_DIR}/bin:$GEM_HOME/bin:$GEM_HOME/gems/bin:$PATH
+
+ENV GEM_HOME=${INSTALL_DIR}/.bundle
+
+RUN \
+  ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && \
+  echo $TZ > /etc/timezone && \
+  addgroup --gid ${GID} ${NAME} && \
+  adduser \
+    --gecos GECOS \
+    --home /home/${NAME} \
+    --uid ${UID} \
+    --gid ${GID} \
+    --disabled-password \
+    --disabled-login \
+    --shell /bin/bash \
+    ${NAME} && \
+  apt-get update -yqq && \
+  apt-get install -yqq --no-install-recommends \
+    sqlite3 libvips && \
+  apt-get clean && \
+  rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* && \
+  truncate -s 0 /var/log/*log && \
+  gem update --system && \
+  bundle config set app_config ${GEM_HOME}
+
+EXPOSE 3000
 
 ENTRYPOINT [ "bin/entrypoint" ]
 
-ENV SERVER_PORT=$APP_PORT
+COPY . .
 
+COPY --from=builder /app/.bundle /app/.bundle
+COPY --from=assets /app/public/assets /app/public/assets
+
+RUN chown -R app:app /app/tmp /app/log /app/storage
+
+USER app
 # Using variables in command list is not possible:
 # https://stackoverflow.com/questions/40454470/how-can-i-use-a-variable-inside-a-dockerfile-cmd
-CMD rails server --binding 0.0.0.0 --no-daemon --port $SERVER_PORT
+CMD [ "rails", "server", "--binding", "0.0.0.0", "--no-daemon", "--port" , "3000" ]

Gemfile

@@ -48,8 +48,11 @@ gem 'bootsnap', require: false
 
 # Use Active Storage variants [https://guides.rubyonrails.org/active_storage_overview.html#transforming-images]
 gem 'bootstrap_form'
+gem 'caxlsx'
+gem 'caxlsx_rails'
 gem 'image_processing', '~> 1.2'
 gem 'prawn-rails'
+gem 'sablon'
 
 group :development, :test do
   # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem

Gemfile.lock

@@ -96,6 +96,14 @@ GEM
       rack-test (>= 0.6.3)
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
+    caxlsx (4.1.0)
+      htmlentities (~> 4.3, >= 4.3.4)
+      marcel (~> 1.0)
+      nokogiri (~> 1.10, >= 1.10.4)
+      rubyzip (>= 1.3.0, < 3)
+    caxlsx_rails (0.6.4)
+      actionpack (>= 3.1)
+      caxlsx (>= 3.0)
     concurrent-ruby (1.3.3)
     connection_pool (2.4.1)
     crass (1.0.6)
@@ -115,6 +123,7 @@ GEM
     ffi (1.17.0-x86_64-linux-gnu)
     globalid (1.2.1)
       activesupport (>= 6.1)
+    htmlentities (4.3.4)
     i18n (1.14.5)
       concurrent-ruby (~> 1.0)
     image_processing (1.12.2)
@@ -270,6 +279,9 @@ GEM
     ruby-vips (2.2.1)
       ffi (~> 1.12)
     rubyzip (2.3.2)
+    sablon (0.4.1)
+      nokogiri (>= 1.8.5)
+      rubyzip (>= 1.3.0)
     selenium-webdriver (4.22.0)
       base64 (~> 0.2)
       logger (~> 1.4)
@@ -331,6 +343,8 @@ DEPENDENCIES
   bootsnap
   bootstrap_form
   capybara
+  caxlsx
+  caxlsx_rails
   cssbundling-rails
   debug
   image_processing (~> 1.2)
@@ -344,6 +358,7 @@ DEPENDENCIES
   rubocop-rails
   ruby-lsp
   ruby-lsp-rails
+  sablon
   selenium-webdriver
   sprockets-rails
   sqlite3 (~> 1.4)

app/assets/stylesheets/actiontext.css

@@ -1,65 +0,0 @@
-/*
- * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
- * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
- * inclusion directly in any other asset bundle and remove this file.
- *
- *= require trix
-*/
-
-/*
- * We need to override trix.css’s image gallery styles to accommodate the
- * <action-text-attachment> element we wrap around attachments. Otherwise,
- * images in galleries will be squished by the max-width: 33%; rule.
-*/
-.trix-content .attachment-gallery > action-text-attachment,
-.trix-content .attachment-gallery > .attachment {
-  flex: 1 0 33%;
-  padding: 0 0.5em;
-  max-width: 33%;
-}
-
-.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
-.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
-.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
-  flex-basis: 50%;
-  max-width: 50%;
-}
-
-.trix-content action-text-attachment .attachment {
-  padding: 0 !important;
-  max-width: 100% !important;
-}
-
-
-/* Fix trix dark mode */
-.trix-button-row {
-  .trix-button-group {
-      border: var(--bs-border-width) solid var(--bs-border-color);
-
-      .trix-button {
-          border: 0;
-          padding: var(--bs-padding)
-      }
-  }
-}
-
-[data-bs-theme=dark] {
-  .trix-button-row {
-      .trix-button-group {
-          .trix-button {
-              background-color: transparent;
-              filter: invert(100%);
-          }
-      }
-  }
-}
-/* end fix trix dark mode */
-
-.trix-content {
-  pre {
-    background-color: var(--bs-secondary-bg) !important;
-    color: var(--bs-secondary-color) !important;
-    border: var(--bs-border-width) solid var(--bs-border-color) !important;
-    border-radius: var(--bs-border-radius) !important;
-  }
-}

app/assets/stylesheets/application.bootstrap.scss

@@ -24,11 +24,97 @@ $font-family-sans-serif:
   // Emoji fonts
   "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
 
+$enable-rounded: false;
+
 @import 'bootstrap/scss/bootstrap';
 @import 'bootstrap-icons/font/bootstrap-icons';
-@import "rails_bootstrap_forms.css";
 
-@import './actiontext.css';
-@import 'trix.css';
+.rails-bootstrap-forms-date-select select,
+.rails-bootstrap-forms-time-select select,
+.rails-bootstrap-forms-datetime-select select {
+  display: inline-block;
+  width: auto;
+}
 
-@import "./layout.scss";
+.rails-bootstrap-forms-error-summary {
+  margin-top: 10px;
+}
+
+
+@import "trix/dist/trix";
+
+/*
+ * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
+ * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
+ * inclusion directly in any other asset bundle and remove this file.
+ *
+ *= require trix
+*/
+
+/*
+ * We need to override trix.css’s image gallery styles to accommodate the
+ * <action-text-attachment> element we wrap around attachments. Otherwise,
+ * images in galleries will be squished by the max-width: 33%; rule.
+*/
+.trix-content .attachment-gallery > action-text-attachment,
+.trix-content .attachment-gallery > .attachment {
+  flex: 1 0 33%;
+  padding: 0 0.5em;
+  max-width: 33%;
+}
+
+.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
+.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
+  flex-basis: 50%;
+  max-width: 50%;
+}
+
+.trix-content action-text-attachment .attachment {
+  padding: 0 !important;
+  max-width: 100% !important;
+}
+
+
+/* Fix trix dark mode */
+.trix-button-row {
+  .trix-button-group {
+      border: var(--bs-border-width) solid var(--bs-border-color);
+
+      .trix-button {
+          border: 0;
+          padding: var(--bs-padding)
+      }
+  }
+}
+
+[data-bs-theme=dark] {
+  .trix-button-row {
+      .trix-button-group {
+          .trix-button {
+              background-color: transparent !important;
+              filter: invert(100%) !important;
+          }
+      }
+  }
+}
+/* end fix trix dark mode */
+
+.trix-content {
+  pre {
+    background-color: var(--bs-secondary-bg) !important;
+    color: var(--bs-secondary-color) !important;
+    border: var(--bs-border-width) solid var(--bs-border-color) !important;
+    border-radius: 0 !important;
+  }
+
+}
+
+/* trix-editor.trix-content {
+  min-height: 350px;
+  overflow-y: auto;
+} */
+
+
+
+@import "./layout";

app/assets/stylesheets/layout.scss

@@ -42,3 +42,15 @@
 //   border-radius: var(--bs-border-radius);
 //   padding: var(--bs-padding);
 // }
+
+.hover-row:hover {
+  background-color: var(--bs-tertiary-bg);
+}
+
+.comment {
+  @extend .alert;
+  @extend .alert-warning;
+
+  border: 0;
+  border-left: 4px solid var(--bs-warning);
+}

app/controllers/checklist_entries_controller.rb

@@ -24,7 +24,7 @@ class ChecklistEntriesController < ApplicationController
     @checklist_entry = ChecklistEntry.new(checklist_entry_params)
 
     if @checklist_entry.save
-      redirect_to @checklist_entry, notice: 'Checklist entry was successfully created.'
+      redirect_to @checklist_entry.checklist, notice: 'Checklist entry was successfully created.'
     else
       render :new, status: :unprocessable_entity
     end
@@ -33,7 +33,8 @@ class ChecklistEntriesController < ApplicationController
   # PATCH/PUT /checklist_entries/1
   def update
     if @checklist_entry.update(checklist_entry_params)
-      redirect_to @checklist_entry, notice: 'Checklist entry was successfully updated.', status: :see_other
+      redirect_to @checklist_entry.checklist, notice: 'Checklist entry was successfully updated.',
+                                              status: :see_other
     else
       render :edit, status: :unprocessable_entity
     end
@@ -42,8 +43,13 @@ class ChecklistEntriesController < ApplicationController
   # DELETE /checklist_entries/1
   def destroy
     @checklist_entry.destroy!
+    respond_to do |format|
+      format.html do
         redirect_to checklist_entries_url, notice: 'Checklist entry was successfully destroyed.', status: :see_other
       end
+      format.turbo_stream
+    end
+  end
 
   private
 

app/controllers/checklists_controller.rb

@@ -24,7 +24,7 @@ class ChecklistsController < ApplicationController
     @checklist = Checklist.new(checklist_params)
 
     if @checklist.save
-      redirect_to @checklist, notice: 'Checklist was successfully created.'
+      redirect_to [:edit, @checklist], notice: 'Checklist was successfully created.'
     else
       render :new, status: :unprocessable_entity
     end

app/controllers/reports_controller.rb

@@ -8,6 +8,29 @@ class ReportsController < ApplicationController
 
   # GET /reports/1
   def show
+    respond_to do |format|
+      format.html
+      format.pdf
+      format.xlsx do
+        response.headers['Content-Disposition'] = %(attachment; filename="#{filename(@report, extension: 'xlsx')}")
+        render
+      end
+      format.docx do
+        template = Sablon.template(Rails.root.join('lib/templates/docx/report.docx'))
+        context = {
+          person: OpenStruct.new(first_name: @report.name),
+          skills: [],
+          education: [],
+          career: [],
+          referees: []
+        }
+
+        template.render_to_file(Rails.root.join('tmp/output.docx'), context)
+        send_file Rails.root.join('tmp/output.docx'),
+                  filename: filename(@report, extension: 'docx'),
+                  type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
+      end
+    end
   end
 
   # GET /reports/new
@@ -60,4 +83,8 @@ class ReportsController < ApplicationController
   def report_params
     params.require(:report).permit(:name, :comment_html)
   end
+
+  def filename(report, extension: 'html')
+    "#{report.name}-#{Time.current.strftime('%Y%m%d%H%M')}.#{extension}"
+  end
 end

app/helpers/success_criteria_helper.rb

@@ -1,2 +1,13 @@
 module SuccessCriteriaHelper
+  def success_criterion_result_icon_classes(sc)
+    if sc.passed?
+      'bi bi-check text-success'
+    elsif sc.failed?
+      'bi bi-exclamation-lg text-danger'
+    elsif sc.not_applicable?
+      'bi bi-dash text-muted'
+    else
+      'bi bi-question text-warning'
+    end
+  end
 end

app/javascript/controllers/autosubmit_controller.js

@@ -0,0 +1,8 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="autosubmit"
+export default class extends Controller {
+  connect() {
+    this.element.addEventListener('change', event => event.target.form.requestSubmit());
+  }
+}

app/javascript/controllers/collapse_chevron_toggler_controller.js

@@ -0,0 +1,32 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="collapse-chevron-toggler"
+export default class extends Controller {
+  static targets = [ "icon" ];
+  collapsible = null;
+
+  connect() {
+    this.collapsible = window.document.getElementById(this.element.getAttribute('href').substring(1));
+    this.setIcon();
+    
+    this.collapsible.addEventListener('hide.bs.collapse', e => this.toggle())
+    this.collapsible.addEventListener('show.bs.collapse', e => this.toggle())
+  }
+
+  setIcon(reverted = false) {
+    console.log('setIcon', this.collapsible)
+    if(this.collapsible.classList.contains('show')) {
+      this.iconTarget.classList.remove('bi-chevron-down')
+      this.iconTarget.classList.add('bi-chevron-up')
+    } else {
+      this.iconTarget.classList.remove('bi-chevron-up')
+      this.iconTarget.classList.add('bi-chevron-down')
+    }
+  }
+
+  toggle() {
+    console.log('toggle', this.collapsible)
+    this.iconTarget.classList.toggle('bi-chevron-down');
+    this.iconTarget.classList.toggle('bi-chevron-up');
+  }
+}

app/javascript/controllers/index.js

@@ -4,6 +4,12 @@
 
 import { application } from "./application"
 
+import AutosubmitController from "./autosubmit_controller"
+application.register("autosubmit", AutosubmitController)
+
+import CollapseChevronTogglerController from "./collapse_chevron_toggler_controller"
+application.register("collapse-chevron-toggler", CollapseChevronTogglerController)
+
 import HelloController from "./hello_controller"
 application.register("hello", HelloController)
 

app/models/check.rb

@@ -1,4 +1,6 @@
 class Check < ApplicationRecord
+  include RichTextTargetBlank
+
   enum :level, %i[A AA AAA]
 
   has_rich_text :success_criterion_html

app/models/checklist.rb

@@ -5,4 +5,6 @@ class Checklist < ApplicationRecord
   has_rich_text :description_html
 
   accepts_nested_attributes_for :checklist_entries, reject_if: :all_blank, allow_destroy: true
+
+  delegate :empty?, to: :checklist_entries
 end

app/models/checklist_entry.rb

@@ -1,4 +1,18 @@
 class ChecklistEntry < ApplicationRecord
   belongs_to :checklist
   belongs_to :check
+
+  before_validation :set_position
+  after_validation :normalize_positions
+
+  def set_position
+    self.position ||= checklist.checklist_entries.maximum(:position).to_i + 1
+  end
+
+  def normalize_positions
+    checklist.checklist_entries.where.not(id:).find_by(position:)&.update_attribute(:position, position_was)
+    # checklist.checklist_entries.order(:position).each_with_index do |entry, index|
+    #   entry.update_column(:position, index + 1) if entry.position != index + 1
+    # end
+  end
 end

app/models/concerns/rich_text_target_blank.rb

@@ -0,0 +1,20 @@
+module RichTextTargetBlank
+  extend ActiveSupport::Concern
+
+  class_methods do
+    # Override has_rich_text to include target="_blank" functionality
+    def has_rich_text(name)
+      super # Call the original has_rich_text to set up the rich text association
+
+      # Define the before_save callback to modify the links
+      before_save do
+        rich_text_attribute = send(name)
+        if rich_text_attribute.present?
+          doc = Nokogiri::HTML::DocumentFragment.parse(rich_text_attribute.body.to_html)
+          doc.css('a').each { |a| a['target'] ||= '_blank' }
+          rich_text_attribute.body = doc.to_html
+        end
+      end
+    end
+  end
+end

app/models/element.rb

@@ -3,6 +3,8 @@ class Element < ApplicationRecord
 
   has_rich_text :description_html
 
-  belongs_to :report
+  belongs_to :report, touch: true
   has_many :success_criteria, dependent: :destroy
+
+  validates :path, :title, presence: true
 end

app/models/report.rb

@@ -1,5 +1,7 @@
 class Report < ApplicationRecord
+  has_rich_text :comment_html
+
   has_many :elements, dependent: :destroy
 
-  has_rich_text :comment_html
+  validates :name, presence: true
 end

app/models/success_criterion.rb

@@ -1,8 +1,9 @@
 class SuccessCriterion < ApplicationRecord
   enum :result, %i[passed failed not_applicable]
+  enum :level, %i[A AA AAA]
 
   has_rich_text :comment_html
   has_rich_text :description_html
 
-  belongs_to :element
+  belongs_to :element, touch: true
 end

app/views/checklist_entries/_checklist_entry.html.erb

@@ -1,8 +1,10 @@
-<div id="<%= dom_id checklist_entry %>">
-  <p>
+<div id="<%= dom_id checklist_entry %>" class="row hover-row py-1 p-1">
+  <div class="col">
+    <%= button_to tag.i(class: "bi bi-arrow-down"), checklist_entry_path(checklist_entry), method: :patch, class: "btn btn-link p-0 float-start", data: { turbo_frame: "checklist_entries" }, params: { checklist_entry: { position: checklist_entry.position + 1 }} %>
+    <%= button_to tag.i(class: "bi bi-arrow-up"), checklist_entry_path(checklist_entry), method: :patch, class: "btn btn-link p-0 pe-3 float-start", data: { turbo_frame: "checklist_entries" }, params: { checklist_entry: { position: checklist_entry.position - 1 }} %>
     <%= button_to tag.i(class: "bi bi-trash"), checklist_entry_path(checklist_entry), method: :delete, class: "btn btn-link p-0 ps-3 float-end" %>
-    <%= link_to "edit", edit_checklist_entry_path(checklist_entry), class: "float-end" %>
-    <%= checklist_entry.position %>
+    <%= link_to tag.i(class: "bi bi-pencil"), edit_checklist_entry_path(checklist_entry), class: "float-end" %>
+    <%# checklist_entry.position %>
     <%= link_to(checklist_entry.check.name, checklist_entry.check, data: { turbo_frame: "_top" }) %>
-  </p>
+  </div>
 </div>

app/views/checklist_entries/_form.html.erb

@@ -1,6 +1,7 @@
 <%= bootstrap_form_with(model: checklist_entry, layout: :horizontal) do |form| %>
+  <%= 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(:name), :id, :name %>
-  <%= form.number_field :position %>
-  <%= form.submit %>
+  <%# form.number_field :position %>
 <% end %>

app/views/checklist_entries/destroy.turbo_stream.erb

@@ -0,0 +1 @@
+<%= turbo_stream.remove dom_id(@checklist_entry) %>

app/views/checklist_entries/edit.html.erb

@@ -2,7 +2,7 @@
 
 <%= turbo_frame_tag dom_id(@checklist_entry, :frame) do %>
   <%= render "form", checklist_entry: @checklist_entry %>
-  <%= link_to "cancel", @checklist_entry %>
+  
 <% end %>
 
 <div class="action-row">

app/views/checklist_entries/index.html.erb

@@ -1,32 +1,12 @@
 <h1><%= t("scaffold.pagetitle_index", model: ChecklistEntry.model_name.human(count: 2)) %></h1>
 
-<table class="table table-striped">
-  <thead>
-    <tr>
-      <th><%= ChecklistEntry.human_attribute_name(:id) %></th>
-      
-        <th><%= ChecklistEntry.human_attribute_name(:checklist_id) %></th>
-      
-        <th><%= ChecklistEntry.human_attribute_name(:check_id) %></th>
-      
-        <th><%= ChecklistEntry.human_attribute_name(:position) %></th>
-      
-  </thead>
-  <tbody>
-    <% @checklist_entries.each do |checklist_entry| %>
-      <tr>
-        <td><%= link_to(checklist_entry.id, url_for(checklist_entry)) %></td>
-        
-          <td><%= link_to(checklist_entry.checklist_id, url_for(checklist_entry)) %></td>
-        
-          <td><%= link_to(checklist_entry.check_id, url_for(checklist_entry)) %></td>
-        
-          <td><%= link_to(checklist_entry.position, url_for(checklist_entry)) %></td>
-        
-      </tr>
+<%= turbo_frame_tag "checklist_entries" do %>
+  <% @checklist_entries.each do |entry| %>
+    <%= turbo_frame_tag dom_id(entry, :frame) do %>
+      <%= render entry %>
+    <% end %>
+  <% end %>
 <% end %>
-  </tbody>
-</table>
 
 <div class="action-row">
   <%= link_to t("scaffold.link_new", model: ChecklistEntry.model_name.human), new_checklist_entry_path %>

app/views/checklist_entries/new.html.erb

@@ -1,7 +1,8 @@
 <h1><%= t("scaffold.pagetitle_new", model: ChecklistEntry.model_name.human) %></h1>
 
-<%= turbo_frame_tag "new_checklist_entry" do %> 
+<%= turbo_frame_tag "checklist_entries" do %> 
   <%= render "form", checklist_entry: @checklist_entry %>
+  <%= render @checklist_entry.checklist.checklist_entries.reject { _1 == @checklist_entry } %>
 <% end %>
 
 <div class="action-row">

app/views/checklists/_checklist.html.erb

@@ -1,28 +1,3 @@
 <div id="<%= dom_id checklist %>">
-  <p>
-    <strong>Code:</strong>
-    <%= checklist.code %>
-  </p>
-
-  <p>
-    <strong>Name:</strong>
-    <%= checklist.name %>
-  </p>
-
-  <p>
-    <strong>Description (formatted):</strong>
   <%= checklist.description_html %>
-  </p>
-
-  <p>
-    <strong>Checks</strong>
-    <ul>
-    <% checklist.checklist_entries.each do |entry| %>
-    <li>
-      <%= entry.position %> <%= entry.check.name %>
-      </li>
-    <% end %>
-    </ul>
-  </p>
-
 </div>

app/views/checklists/_form.html.erb

@@ -1,6 +1,6 @@
 <%= bootstrap_form_with(model: checklist) do |form| %>
-  <%= form.text_field :code %>
+  <%# form.text_field :code %>
   <%= form.text_field :name %>
-  <%= form.rich_text_area :description_html %>
+  <%= form.rich_text_area :description_html, rows: 12 %>
   <%= form.submit %>
 <% end %>

app/views/checklists/edit.html.erb

@@ -1,24 +1,7 @@
 <h1><%= t("scaffold.pagetitle_edit", model: Checklist.model_name.human) %></h1>
 
 
-<div class="row">
-  <div class="col">
 <%= render "form", checklist: @checklist %>
-  </div>
-  <div class="col">
-    <h2>Checks</h2>
-    <div class="mb-2">
-      <%= turbo_frame_tag "new_checklist_entry" do %>
-        <%= link_to tag.i(class: "bi bi-plus"), new_checklist_entry_path(checklist_id: @checklist.id), class: "btn btn-primary", data: { turbo_frame: "new_checklist_entry"} %>
-      <% end %>
-    </div>
-    <% @checklist.checklist_entries.each do |entry| %>
-      <%= turbo_frame_tag dom_id(entry, :frame) do %>
-        <%= render entry %>
-      <% end %>
-    <% end %>
-  </div>
-</div>
 
 <div class="action-row">
   <%= link_to t("scaffold.link_show", model: Checklist.model_name.human), @checklist %>

app/views/checklists/index.html.erb

@@ -5,8 +5,6 @@
     <tr>
       <th><%= Checklist.human_attribute_name(:id) %></th>
       
-        <th><%= Checklist.human_attribute_name(:code) %></th>
-      
         <th><%= Checklist.human_attribute_name(:name) %></th>
       
         <th><%= Checklist.human_attribute_name(:description_html) %></th>
@@ -17,8 +15,6 @@
       <tr>
         <td><%= link_to(checklist.id, url_for(checklist)) %></td>
         
-          <td><%= link_to(checklist.code, url_for(checklist)) %></td>
-        
           <td><%= link_to(checklist.name, url_for(checklist)) %></td>
         
           <td><%= link_to(truncate(strip_tags(checklist.description_html.to_s)), url_for(checklist)) %></td>

app/views/checklists/new.html.erb

@@ -2,6 +2,12 @@
 
 <%= render "form", checklist: @checklist %>
 
+  <% @checklist.checklist_entries.each do |entry| %>
+    <%= turbo_frame_tag dom_id(entry, :frame) do %>
+      <%= render entry %>
+    <% end %>
+  <% end %>
+
 <div class="action-row">
   <%= link_to t("scaffold.link_index", model: Checklist.model_name.human(count: 2)), checklists_path %>
 </div>

app/views/checklists/show.html.erb

@@ -1,9 +1,29 @@
-<h1><%= t("scaffold.pagetitle_show", model: @checklist.class.model_name.human) %></h1>
+<h1><i class="bi bi-card-checklist me-2"></i><%= "#{@checklist.name}" %></h1>
 
+<div class="row">
+  <div class="col col-md-12">
     <%= render @checklist %>
-<pre>Dashboard
-  is
-  sidebar</pre>
+  </div>
+  <div class="col col-md-12">
+    <div class="mt-3">
+      <%= link_to tag.i(class: "bi bi-plus-lg"), new_checklist_entry_path(checklist_id: @checklist.id), class: "btn btn-primary float-end", data: { turbo_frame: "checklist_entries"  } %>
+      <h2>Checks</h2>
+    </div>
+    <div class="mb-2">
+      <%= turbo_frame_tag "new_checklist_entry" do %>
+      <% end %>
+    </div>
+    <%= turbo_frame_tag "checklist_entries" do %>
+      <% @checklist.checklist_entries.each do |entry| %>
+        <%= turbo_frame_tag dom_id(entry, :frame) do %>
+          <%= render entry %>
+        <% end %>
+      <% end %>
+      <%= tag.i "Es sind (noch) keine Checks definiert." if @checklist.empty? %>
+    <% end %>
+  </div>
+</div>
+
 <div class="action-row">
   <%= link_to t("scaffold.link_edit", model: @checklist.model_name.human), edit_checklist_path(@checklist) %>
   <%= link_to t("scaffold.link_index", model: @checklist.model_name.human(count: 2)), checklists_path %>

app/views/elements/_element.html.erb

@@ -1,16 +1,32 @@
-<div id="<%= dom_id element %>" class="mt-3">
-  <h2><i class="bi bi-card-checklist me-2"></i>
-    <%= element.title %></h2>
-  <p>
-    <strong>Path:</strong>
+<div id="<%= dom_id element %>" class="mt-4 border-top pt-3">
+  <%= turbo_frame_tag dom_id(element, :frame) do %>
+    <div class="d-flex">
+      <h2 class="h3">
+          <i class="bi bi-card-checklist">
+          </i>
+        <%= element.title %>
+        <div class="badge text-bg-secondary">
         <%= element.path %>
-  </p>
+      </div>
+    </h2>
+        <%= link_to [:edit, element], class: "btn btn-link text-secondary" do %>
+        <i class="bi bi-pencil">
+          </i>
+        <% end %>
+      </div>
+    <div class="">
       
       <%= element.description_html %>
+    </div>
+
+  <% end %>
 
   <% element.success_criteria.each do |sc| %>
     <%= turbo_frame_tag(dom_id(sc, :frame)) do %>
       <%= render sc %>
     <% end %>
   <% end %>
+  <% if element.success_criteria.none? %>
+    <p><i>Es sind (noch) keine Erfolgskriterien definiert.</i></p>
+  <% end %>
 </div>

app/views/elements/_form.html.erb

@@ -1,8 +1,15 @@
-<%= bootstrap_form_with(model: element, data: { turbo_frame: "_top"}) do |form| %>
+<%= bootstrap_form_with(model: element) do |form| %>
   <%= form.hidden_field :report_id %>
-  <%= form.collection_select(:checklist_id, Checklist.all, :id, :name) %>
+  <div class="row">
+    <div class="col">
       <%= form.text_field :path %>
+    </div>
+    <div class="col">
+      <%= form.collection_select(:checklist_id, Checklist.all, :id, :name) %>
+    </div>
+  </div>
   <%= form.text_field :title %>
   <%= form.rich_text_area :description_html %>
-  <%= form.submit %>
+  <%= form.submit class: "btn btn-warning" %>
+  <%= link_to("Abbrechen", element.report, class: "btn btn-outline-secondary") %>
 <% end %>

app/views/elements/edit.html.erb

@@ -1,6 +1,18 @@
 <h1><%= t("scaffold.pagetitle_edit", model: Element.model_name.human) %></h1>
 
+<%= turbo_frame_tag dom_id(@element, :frame) do %>
+  <div>
+    <div class="d-flex">
+    <h2 class="h3">
+      <i class="bi bi-card-checklist">
+          </i>
+      <%= @element.title %>
+    </h2>
+      <%= link_to(tag.i(class: "bi bi-pencil"), @element, class: "btn btn-link text-warning") %>
+    </div>
   <%= render "form", element: @element %>
+  </div>
+<% end %>
 
 <div class="action-row">
   <%= link_to t("scaffold.link_show", model: Element.model_name.human), @element %>

app/views/elements/new.html.erb

@@ -1,8 +1,10 @@
 <h1><%= t("scaffold.pagetitle_new", model: Element.model_name.human) %></h1>
 
 <%= turbo_frame_tag "new_element_frame" do %>
-  <h2><i class="bi bi-plus"></i>Element hinzufügen</h2>
+  <div class="border border-info p-3">
+    <h2><i class="bi bi-card-checklist me-2"></i>Neues Element</h2>
     <%= render "form", element: @element %>
+  </div>
 <% end %>
 
 <div class="action-row">

app/views/layouts/_navigation.html.erb

@@ -1,5 +1,5 @@
 <nav class="navbar navbar-expand-lg bg-body-tertiary">
-  <div class="container-fluid">
+  <div class="container">
     <a class="navbar-brand" href="<%= root_path %>">A11yist</a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
       <span class="navbar-toggler-icon"></span>

app/views/layouts/application.html.erb

@@ -15,7 +15,7 @@
     <%= render partial: "layouts/sidebar" %>
     <%= render partial: "layouts/navigation" %>
     <%= render partial: "layouts/flash" %>
-    <main class="p-3">  
+    <main class="mt-3 container">  
       <%= yield %>
     </main>
   </body>

app/views/reports/index.html.erb

@@ -8,7 +8,8 @@
         <th><%= Report.human_attribute_name(:name) %></th>
       
         <th><%= Report.human_attribute_name(:comment_html) %></th>
-      
+        <th></th>
+        <th></th>
   </thead>
   <tbody>
     <% @reports.each do |report| %>
@@ -18,7 +19,8 @@
           <td><%= link_to(report.name, url_for(report)) %></td>
         
           <td><%= link_to(truncate(strip_tags(report.comment)), url_for(report)) if report.comment %></td>
-        
+          <td><%= l(report.created_at, format: :short) %></td>
+          <td><%= l(report.updated_at, format: :short) %></td>
       </tr>
     <% end %>
   </tbody>

app/views/reports/show.html.erb

@@ -1,11 +1,18 @@
-<div class="container">
   <h1><i class="bi bi-journal-text me-2"></i><%= @report.name %></h1>
+  <p class="small">
+    Erstellt am <%= l(@report.created_at, format: :short) %>,
+    zuletzt bearbeitet am <%= l(@report.updated_at, format: :short) %>
+  </p>
 
+  <% if @report.comment_html %>
+    <div class="mt-2 mb-4 lead">
     <%= @report.comment_html %>
+    </div>
+  <% end %>
 
-  <div class="my-5">
+  <div class="border-top pt-3">
     <%= turbo_frame_tag "new_element_frame" do %>
-      <%= link_to "#{tag.i(class: "bi bi-plus-lg")} Element".html_safe, new_element_path(report_id: @report.id), class: "btn btn-primary" %>
+      <%= link_to "#{tag.i(class: "bi bi-plus-lg")} Neues Element".html_safe, new_element_path(report_id: @report.id), class: "btn btn-primary" %>
     <% end %>
   </div>
 
@@ -17,8 +24,16 @@
 
 
   <div class="action-row">
+    <%= link_to report_path(@report, format: :pdf), class: "btn btn-primary", target: "_blank" do %>
+      <i class="bi bi-filetype-pdf"></i> PDF
+    <% end %>
+    <%= link_to report_path(@report, format: :docx), class: "btn btn-primary", target: "_blank" do %>
+      <i class="bi bi-filetype-docx"></i> DOCX
+    <% end %>
+    <%= link_to report_path(@report, format: :xlsx), class: "btn btn-primary", target: "_blank" do %>
+      <i class="bi bi-filetype-xlsx"></i> XLSX
+    <% end %>
     <%= link_to t("scaffold.link_edit", model: @report.model_name.human), edit_report_path(@report) %>
     <%= link_to t("scaffold.link_index", model: @report.model_name.human(count: 2)), reports_path %>
     <%= button_to t("scaffold.link_destroy", model: @report.model_name.human), @report, method: :delete, class: "btn btn-outline-danger" %>
   </div>
-</div>

app/views/reports/show.xlsx.axlsx

@@ -0,0 +1,10 @@
+wb = xlsx_package.workbook
+wb.add_worksheet(name: "Erfolgskriterien") do |sheet|
+  sheet.add_row SuccessCriterion.column_names
+
+  @report.elements.each do |element|
+    element.success_criteria.each do |sc|
+      sheet.add_row sc.attributes.values
+    end
+  end
+end

app/views/success_criteria/_form.html.erb

@@ -1,18 +1,40 @@
 
 <div id="<%= dom_id success_criterion %>" class="card mt-3">
-  <div class="card-header">
-    <h3><i class="bi bi-check2 me-2"></i><%= success_criterion.title %></h3>
-    <%= link_to "cancel", success_criterion %>
-  </div>
+  <%== render partial: "success_criteria/header", locals: { success_criterion: success_criterion } %>
+  
+  <div class="collapse show" id="collapseSuccessCriterion_<%= success_criterion.id %>">
     <div class="card-body">
       <%= bootstrap_form_with(model: success_criterion) do |form| %>
+        <div class="row">
+          <div class="col">
+            <div class="btn-group" role="group" aria-label="Resultat">
+              <%= form.radio_button_without_bootstrap :result, :passed, class: "btn-check", autocomplete: "off" %>
+              <label class="btn btn-outline-success" for="success_criterion_result_passed">
+                Bestanden
+              </label>
+              <%= form.radio_button_without_bootstrap :result, :failed, class: "btn-check", autocomplete: "off" %>
+              <label class="btn btn-outline-danger" for="success_criterion_result_failed">
+                Durchgefallen
+              </label>
+              <%= form.radio_button_without_bootstrap :result, :not_applicable, class: "btn-check", autocomplete: "off" %>
+              <label class="btn btn-outline-secondary" for="success_criterion_result_not_applicable">
+                Nicht anwendbar
+              </label>
+            </div>
+            <%# form.collection_select :result, SuccessCriterion.results.map{ |k, v| [k, t("activerecord.attributes.success_criterion.results/#{k}")] }, :first, :second, include_blank: true, hide_label: true %>
+            <%# form.select :category, SuccessCriterion.categories.keys  %>
+          </div>
+          <div class="col">
+            <%= form.select :level, SuccessCriterion.levels.keys, hide_label: true %>
+          </div>
+        </div>
+        <%= form.rich_text_area :comment_html %>
         <%= form.text_field :title %>
         <%= form.rich_text_area :description_html %>
-      <%= form.number_field :level %>
-      <%= form.select :result, SuccessCriterion.results.keys, include_blank: true %>
-      <%= form.rich_text_area :comment_html %>
-      <%= form.submit %>
+        <%= form.submit class: "btn btn-warning" %>
+        <%= link_to "Abbrechen", success_criterion, class: "btn btn-outline-secondary" %>
       <% end %>
     </div>
+  </div>
   <%# <%= link_to "edit", url_for([:edit, success_criterion]) %>
 </div>

app/views/success_criteria/_header.html.erb

@@ -0,0 +1,37 @@
+<% edit_mode = action_name == "edit" %>
+<div class="card-header d-flex">
+  <h3 
+    class="h4"
+    data-bs-toggle="collapse"
+    href="#collapseSuccessCriterion_<%= success_criterion.id %>" 
+    role="button" 
+    aria-expanded="false" 
+    aria-controls="collapseSuccessCriterion_<%= success_criterion.id %>"
+    style="cursor: pointer">
+    <i class="bi <%= success_criterion_result_icon_classes(success_criterion) %>"></i>
+    <%= success_criterion.title %> 
+    <span class="badge rounded-pill text-bg-secondary">
+      <%= success_criterion.level %>
+    </span>
+    <% if success_criterion.comment_html.present? %>
+      <i class="bi bi-chat"></i>
+    <% end %>
+    <% if false && action_name == "edit" %>
+      <a href="#">
+      <i class="bi bi-pencil text-warning"></i>
+    <% end %>
+  </h3>
+      <%= link_to tag.i(class: "bi bi-#{edit_mode ? "pencil" : "pencil"}"), edit_mode ? success_criterion : [:edit, success_criterion], class: "btn btn-#{edit_mode ? "link text-warning" : "link text-secondary"}" %>
+    <div class="flex-fill d-flex justify-content-end">
+      <button class="btn btn-link text-body"
+        data-controller="collapse-chevron-toggler"
+        data-bs-toggle="collapse"
+        href="#collapseSuccessCriterion_<%= success_criterion.id %>" 
+        role="button" 
+        aria-expanded="false" 
+        aria-controls="collapseSuccessCriterion_<%= success_criterion.id %>"
+      >
+      <i class="bi bi-chevron-down" data-collapse-chevron-toggler-target="icon"></i>
+      </button>
+    </div>
+</div>

app/views/success_criteria/_success_criterion.html.erb

@@ -1,19 +1,35 @@
+<% expanded = false unless defined?(expanded) %>
 <div id="<%= dom_id success_criterion %>" class="card mt-3">
-  <div class="card-header">
-    <h3><i class="bi bi-check2 me-2"></i><%= success_criterion.title %></h3>
-    <%= link_to "edit", [:edit, success_criterion]%>
-  </div>
+  <%== render partial: "success_criteria/header", locals: {success_criterion: success_criterion } %>
+  
+  <div class="collapse<%= " show" if expanded %>" id="collapseSuccessCriterion_<%= success_criterion.id %>">
     <div class="card-body">
+      <%= bootstrap_form_with(model: success_criterion, data: { controller: "autosubmit" }) do |form| %>
+        <div class="row mb-3">
+          <div class="col">
+            <div class="btn-group" role="group" aria-label="Resultat">
+              <%= form.radio_button_without_bootstrap :result, :passed, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_passed) %>
+              <label class="btn btn-outline-success" for="<%= dom_id(success_criterion, :result_passed) %>">
+                Bestanden
+              </label>
+              <%= form.radio_button_without_bootstrap :result, :failed, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_failed)  %>
+              <label class="btn btn-outline-danger" for="<%= dom_id(success_criterion, :result_failed) %>">
+                Durchgefallen
+              </label>
+              <%= form.radio_button_without_bootstrap :result, :not_applicable, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_not_applicable)  %>
+              <label class="btn btn-outline-secondary" for="<%= dom_id(success_criterion, :result_not_applicable) %>">
+                Nicht anwendbar
+              </label>
+            </div>
+            <%# form.collection_select :result, SuccessCriterion.results.map{ |k, v| [k, t("activerecord.attributes.success_criterion.results/#{k}")] }, :first, :second, include_blank: true, hide_label: true %>
+            <%# form.select :category, SuccessCriterion.categories.keys  %>
+          </div>
+        </div>
+      <% end %>
       <%= success_criterion.description_html %>
-    <p class="mt-3">
-      <strong>Level</strong>: <%= success_criterion.level %>
-    </p>
-    <p>
-      <strong>Resultat</strong>: <%= success_criterion.result %>
-    </p>
       <% if success_criterion.comment_html.present? %>
-      <h4 class="mt-3">Kommentar</h4>
-      <%= success_criterion.comment_html %>
+        <div class="comment mt-3"><%= success_criterion.comment_html %></div>
       <% end %>
     </div>
   </div>
+</div>

app/views/success_criteria/show.html.erb

@@ -1,7 +1,7 @@
 <h1><%= t("scaffold.pagetitle_show", model: @success_criterion.class.model_name.human) %></h1>
 
 <%= turbo_frame_tag(dom_id(@success_criterion, :frame)) do %>
-  <% render @success_criterion %>
+  <% render partial: "success_criteria/success_criterion", locals: { success_criterion: @success_criterion, expanded: true } %>
 <% end %>
 
 <div class="action-row">

bin/entrypoint

@@ -1,13 +1,15 @@
 #!/bin/bash
 set -e
 
-
-# Make the if statement match any invocation of the "rails server" command
-if [[ "${1}" == *rails ]] && ([ "${2}" == "server" ] || [ "${2}" == "s" ]); then
+echo "1: ${1}"
+echo "2: ${2}"
 if [ -f tmp/pids/server.pid ]; then
   rm tmp/pids/server.pid
 fi
 
+# Make the if statement match any invocation of the "rails server" command
+if [[ "${1}" == *rails ]] && ([ "${2}" == "server" ] || [ "${2}" == "s" ]); then
+
   if [ ! -f /app/no_migrate ] && [ ! -v NO_MIGRATE ]; then
     echo "+ preparing database..."
     ./bin/rails db:prepare

config/application.rb

@@ -33,7 +33,7 @@ module A11yist
     # These settings can be overridden in specific environments using the files
     # in config/environments, which are processed later.
     #
-    # config.time_zone = "Central Time (US & Canada)"
+    config.time_zone = "Europe/Zurich"
     # config.eager_load_paths << Rails.root.join("extras")
   end
 end

config/environments/production.rb

@@ -92,6 +92,8 @@ Rails.application.configure do
   #   "example.com",     # Allow requests from example.com
   #   /.*\.example\.com/ # Allow requests from subdomains like `www.example.com`
   # ]
+  config.hosts = ENV.fetch('APP_HOSTS', '').split(',')
   # Skip DNS rebinding protection for the default health check endpoint.
   # config.host_authorization = { exclude: ->(request) { request.path == "/up" } }
+  config.active_record.sqlite3_production_warning=false
 end

config/initializers/action_text.rb

@@ -0,0 +1,18 @@
+ActionText::ContentHelper.allowed_attributes ||= []
+ActionText::ContentHelper.allowed_attributes += [
+  "target", # We set target="_blank" on external links
+  "abbr",
+  "alt",
+  "cite",
+  "class",
+  "datetime",
+  "height",
+  "href",
+  "lang",
+  "name",
+  "src",
+  "title",
+  "width",
+  "xml:lang",
+]
+ActionText::ContentHelper.allowed_attributes += ActionText::Attachment::ATTRIBUTES

config/initializers/assets.rb

@@ -10,4 +10,4 @@ Rails.application.config.assets.paths << Rails.root.join('node_modules/bootstrap
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in the app/assets
 # folder are already added.
-# Rails.application.config.assets.precompile += %w( admin.js admin.css )
+Rails.application.config.assets.precompile += %w( actiontext.css )

config/initializers/mime_types.rb

@@ -0,0 +1,2 @@
+# Add this line to config/initializers/mime_types.rb in your Rails application
+Mime::Type.register "application/vnd.openxmlformats-officedocument.wordprocessingml.document", :docx

config/locales/activerecord.yml

@@ -1,18 +1,42 @@
 de-CH:
   activerecord:
     attributes:
+      success_criterion:
+        title: Titel
+        description_html: Richtline
+        comment_html: Testkommentar
+        level: Stufe
+        result: Testergebnis
+        results/passed: Bestanden
+        results/failed: Nicht bestanden
+        results/not_applicable: Nicht anwendbar
       check:
         id: ID
         level: Stufe
         position: Position
         success_criterion_html: Erfolgskriterium
+      element:
+        id: ID
+        title: Beschreibung
+        description_html: Details
+        path: Pfad
+        checklists: Checkliste
+      report:
+        name: Bezeichnung
+        comment_html: Projektbeschreibung
     models:
       check:
         one: Check
         other: Checks
+      checklist_entry:
+        one: Check
+        other: Checks
       checklist:
         one: Checkliste
         other: Checklisten
       report:
         one: Prüfbericht
         other: Prüfberichte
+      success_criterion:
+        one: Erfolgskriterium
+        other: Erfolgskriterien