Update tasklist styling

app/helpers/tasklist_helper.rb

@@ -41,7 +41,7 @@ module TasklistHelper
   def subsection_link(subsection, log, current_user)
     if subsection.status(log) != :cannot_start_yet
       next_page_path = next_page_or_check_answers(subsection, log, current_user).to_s
-      govuk_link_to(subsection.label, next_page_path.dasherize, aria: { describedby: subsection.id.dasherize })
+      govuk_link_to(subsection.label, next_page_path.dasherize, class: "govuk-task-list__link", aria: { describedby: subsection.id.dasherize })
     else
       subsection.label
     end
@@ -59,6 +59,10 @@ module TasklistHelper
     end
   end
 
+  def tasklist_link_class(status)
+    status == :cannot_start_yet ? "" : "govuk-task-list__item--with-link"
+  end
+
 private
 
   def breadcrumb_organisation(log)

app/views/logs/_tasklist.html.erb

@@ -8,14 +8,14 @@
       <% if section.description %>
         <p class="govuk-body"><%= section.description.html_safe %></p>
       <% end %>
-      <ul class="app-task-list__items">
+      <ul class="govuk-task-list app-task-list__items">
         <% section.subsections.each do |subsection| %>
           <% if subsection.displayed_in_tasklist?(@log) && (subsection.applicable_questions(@log).count > 0 || !subsection.enabled?(@log)) %>
             <% subsection_status = subsection.status(@log) %>
-            <li class="app-task-list__item">
-              <span class="app-task-list__task-name" id="<%= subsection.id.dasherize %>">
+            <li class="govuk-task-list__item <%= tasklist_link_class(subsection_status) %> app-task-list__item">
+              <div class="govuk-task-list__name-and-hint app-task-list__task-name" id="<%= subsection.id.dasherize %>">
                 <%= subsection_link(subsection, @log, current_user) %>
-              </span>
+              </div>
               <%= status_tag(subsection_status, "app-task-list__tag") %>
             </li>
           <% end %>