Merge pull request #717 from bitzesty/letters-of-support

Letters of support - form UI tweaks
bitzesty · Aug 29, 2024 · 9859107 · 9859107
2 parents a263acf + f06a4a6
commit 9859107
Show file tree

Hide file tree

Showing 6 changed files with 7 additions and 13 deletions.
diff --git a/app/assets/javascripts/frontend/custom_questions/support_letters.js.coffee b/app/assets/javascripts/frontend/custom_questions/support_letters.js.coffee
@@ -32,7 +32,8 @@ window.SupportLetters =
 
       textContainer = parent.find('.support-letter-attachment-container')
       textContainer.removeClass('govuk-!-display-none')
-      textContainer.find('.flex').html('<p class="govuk-body">' + filename + '</p>')
+      scanningText = '<p class="govuk-hint">(File uploaded and is being scanned for viruses. Preview available once the scan is complete.)</p>'
+      textContainer.prepend('<div class="support-letter-attachment-filename"><p class="govuk-body">' + filename + '</p>' + scanningText + '</div>')
       hiddenInput = $("<input class='js-support-letter-attachment-id' type='hidden' name='#{$el.attr("name")}' value='#{data.result['id']}' />")
       parent.append(hiddenInput)
       parent.find('.js-support-letter-attachment').addClass('govuk-!-display-none')

diff --git a/app/assets/stylesheets/frontend/views/award_form.scss b/app/assets/stylesheets/frontend/views/award_form.scss
@@ -164,12 +164,6 @@ label > .visible-read-only,
   align-items: start;
   background: $govuk-light-grey;
 
-  .flex {
-    display: flex;
-    justify-content: space-between;
-    align-items: start;
-  }
-
   .js-remove-support-letter-attachment{
     color: $govuk-red;
     word-break: keep-all;

diff --git a/app/views/form/support_letters/_form.html.slim b/app/views/form/support_letters/_form.html.slim
@@ -13,7 +13,7 @@
         = render "qae_form/question_ref", question: question, ref: "C #{idx}.1"
       span[class="govuk-body govuk-!-font-size-24 govuk-!-font-weight-bold govuk-!-display-block"]
         = "Name of the person who wrote the #{first_or_second} letter of support"
-      = ff.input :first_name, label: "First Name:", input_html: { class: "form-control medium" }
+      = ff.input :first_name, label: "First name:", input_html: { class: "form-control medium" }
       = ff.input :last_name, label: "Surname:", input_html: { class: "form-control medium" }
 
       legend.govuk-label aria-label="C #{idx}.2: Relationship to Group"

diff --git a/app/views/layouts/govuk_template.html.erb b/app/views/layouts/govuk_template.html.erb
@@ -31,7 +31,7 @@
 
     <%= stylesheet_pack_tag 'application' %>
 
-    <link rel="shortcut icon" sizes="16x16 32x32 48x48" href="<%= image_url('favicon.ico') %>]" type="image/x-icon">
+    <link rel="shortcut icon" sizes="16x16 32x32 48x48" href="<%= image_url('favicon.ico') %>" type="image/x-icon">
     <link rel="mask-icon" href="<%= image_url('govuk-mask-icon.svg') %>]" color="blue">
     <link rel="apple-touch-icon" sizes="180x180" href="<%= image_url('govuk-apple-touch-icon-180x180.png') %>]">
     <link rel="apple-touch-icon" sizes="167x167" href="<%= image_url('govuk-apple-touch-icon-167x167.png') %>]">

diff --git a/app/views/qae_form/_supporter_fields.html.slim b/app/views/qae_form/_supporter_fields.html.slim
@@ -20,7 +20,7 @@ li.borderless[class=class_names("js-add-example", "js-support-letter-received" =
       ' Name of the person who wrote the #{first_or_second} letter of support
   .govuk-form-group.question-block.question-required
     label.govuk-label for="form[#{question.key}][#{index}][first_name]"
-      ' First Name:
+      ' First name:
     span.govuk-error-message
     input.js-support-letter-field.js-support-letter-first-name.js-trigger-autosave.govuk-input autocomplete="off" class="js-trigger-autosave medium" name="form[#{question.key}][#{index}][first_name]" id="form[#{question.key}][#{index}][first_name]" type="text" value=supporter["first_name"] *possible_read_only_ops(question.step.opts[:id])
   .govuk-form-group.question-block.question-required

diff --git a/app/views/support_letters/_attachment.html.slim b/app/views/support_letters/_attachment.html.slim
@@ -1,9 +1,8 @@
 - file = support_letter_attachments[attachment_id.to_i]
 
 .support-letter-attachment-container class="#{'govuk-!-display-none' unless attachment_id.present?}"
-  .flex
-    .support-letter-attachment-filename class="govuk-!-font-size-19"
-      = render "shared/attachment_with_virus_check_status", item: file, mount_name: :attachment
+  .support-letter-attachment-filename class="govuk-body govuk-!-font-size-19"
+    = render "shared/attachment_with_virus_check_status", item: file, mount_name: :attachment
   button.govuk-link.js-remove-support-letter-attachment class="govuk-!-font-size-19" data-module="govuk-button" type="button"
     | Remove
 input.js-support-letter-attachment-id type="hidden" name="form[#{question.key}][#{index}][letter_of_support]" value=attachment_id *possible_read_only_ops