Requested gui improvements

2024-11-09 00:43:04 +01:00 · 2024-11-09 00:43:04 +01:00 · d1a4eeea30
commit d1a4eeea30
parent 98a5f96989
16 changed files with 152 additions and 98 deletions
--- a/app/views/success_criteria/_body.html.slim
+++ b/app/views/success_criteria/_body.html.slim
@ -3,45 +3,49 @@
    .row
      .col
        = bootstrap_form_with(model: success_criterion, data: { controller: "autosubmit" }) do |form|
-          span.float-end
-            = success_criterion_edit_button(success_criterion, false)
-          .my-3.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.btn.btn-outline-success for=dom_id(success_criterion, :result_passed) Bestanden 
-            = form.radio_button_without_bootstrap :result, :failed, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_failed)
-            label.btn.btn-outline-danger for=dom_id(success_criterion, :result_failed) Durchgefallen 
-            = form.radio_button_without_bootstrap :result, :not_applicable, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_not_applicable)
-            label.btn.btn-outline-secondary for=dom_id(success_criterion, :result_not_applicable) Nicht anwendbar 
-            /= form.radio_button_without_bootstrap :result, nil, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_not_applicable)
-            /label.btn.btn-outline-secondary for=dom_id(success_criterion, :nil) Reset
-    .row 
-      .col-md-4.col-lg-3 
-        'WCAG/ID
-      .col-md-8.col-lg-9
-        = link_to("#{success_criterion.check.external_number}/#{success_criterion.check.id}", success_criterion.check, data: { turbo_frame: "_top"}, target: :_blank)
-    .row 
-      .col-md-4.col-lg-3 
-        = SuccessCriterion.human_attribute_name(:quick_criterion)
-      .col-md-8.col-lg-9
-        = success_criterion.quick_criterion
-    .row 
-      .col-md-4.col-lg-3 
-        = SuccessCriterion.human_attribute_name(:quick_fail)
-      .col-md-8.col-lg-9
-        = success_criterion.quick_fail
-    .row 
-      .col-md-4.col-lg-3 
-        = SuccessCriterion.human_attribute_name(:quick_fix)
-      .col-md-8.col-lg-9
-        = success_criterion.quick_fix
-    - safe_display(success_criterion.check.test_instructions) do |i|
-      .row
-        .col-md-4.col-lg-3 
-          = SuccessCriterion.human_attribute_name(:test_instructions)
-        .col-md-8.col-lg-9
-          = i
+          .position-relative
+            .position-absolute.top-0.end-0.fw-bold
+              = success_criterion_edit_button(success_criterion, false)
+            .my-3.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.btn.btn-outline-success for=dom_id(success_criterion, :result_passed) Bestanden 
+              = form.radio_button_without_bootstrap :result, :failed, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_failed)
+              label.btn.btn-outline-danger for=dom_id(success_criterion, :result_failed) Durchgefallen 
+              = form.radio_button_without_bootstrap :result, :not_applicable, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_not_applicable)
+              label.btn.btn-outline-secondary for=dom_id(success_criterion, :result_not_applicable) Nicht anwendbar 
+              /= form.radio_button_without_bootstrap :result, nil, class: "btn-check", autocomplete: "off", id: dom_id(success_criterion, :result_not_applicable)
+              /label.btn.btn-outline-secondary for=dom_id(success_criterion, :nil) Reset
    .row 
      .col
-        = bootstrap_form_with(model: success_criterion) do |form|
-          = form.rich_text_area :test_comment
-          = form.submit :speichern
+        - if success_criterion.test_comment?
+          .comment = success_criterion.test_comment
+        - else 
+          = bootstrap_form_with(model: success_criterion) do |form|
+            = form.rich_text_area :test_comment, placeholder: "Test Kommentar", hide_label: true
+            = form.submit "Kommentar speichern", class: "btn btn-secondary float-end"
+
+    .row.mb-4
+      .col-md-4.col-lg-3
+        .text-end.fw-bold WCAG/ID
+      .col-md-8.col-lg-9
+        = link_to("#{success_criterion.check.external_number}/#{success_criterion.check.id}", success_criterion.check, data: { turbo_frame: "_top"}, target: :_blank)
+    .row.mb-4
+      .col-md-4.col-lg-3
+        .text-end.fw-bold = SuccessCriterion.human_attribute_name(:quick_criterion)
+      .col-md-8.col-lg-9
+        = success_criterion.quick_criterion
+    .row.mb-4
+      .col-md-4.col-lg-3
+        .text-end.fw-bold = SuccessCriterion.human_attribute_name(:quick_fail)
+      .col-md-8.col-lg-9
+        = success_criterion.quick_fail
+    .row.mb-4
+      .col-md-4.col-lg-3
+        .text-end.fw-bold = SuccessCriterion.human_attribute_name(:quick_fix)
+      .col-md-8.col-lg-9
+        = success_criterion.quick_fix
+    .row
+      .col-md-4.col-lg-3
+        .text-end.fw-bold   = SuccessCriterion.human_attribute_name(:test_instructions)
+      .col-md-8.col-lg-9
+        = success_criterion.check.test_instructions
--- a/app/views/success_criteria/_header.html.slim
+++ b/app/views/success_criteria/_header.html.slim
@ -1,16 +1,22 @@
 - edit_mode = action_name == "edit"
 summary.d-flex.align-items-start id=dom_id(success_criterion, :header)
  .content.d-flex.align-items-center
-    .result-icon.d-flex.justify-content-center class=[success_criterion_result_color_classes(success_criterion)]
+    .result-icon.d-flex.justify-content-center.mt-1 class=[success_criterion_result_color_classes(success_criterion)]
      span.h1.bi class=[success_criterion_result_icon_classes(success_criterion)]
-    h4
+    h4.mt-2
      = success_criterion.page.position
      | .
      = success_criterion.element.position
      | .
      = success_criterion.position
-      =< success_criterion.title
-  .small.badge.rounded-pill.ms-2.mt-2.sc-level class="sc-level-#{success_criterion.level.to_s.downcase}"
-    = success_criterion.level
-  - if success_criterion.test_comment.present?
-    i.bi.bi-chat.ms-2
+      span.me-2
+        =< success_criterion.title
+      
+      - if success_criterion.test_comment.present?
+        == tag.i(class: "bi bi-chat-fill me-2")
+        
+      = success_criterion_badge(success_criterion.check.external_number, extra_classes: "text-bg-info me-1")
+      
+      = success_criterion_badge(success_criterion.level, extra_classes: "sc-level sc-level-#{success_criterion.level.to_s.downcase} me-1")
+  
+