From ffafc16430d80210aa8e31b339bfaa907388d5fa Mon Sep 17 00:00:00 2001
From: Jonathan Bobel <jbobel@flexion.us>
Date: Mon, 14 Aug 2023 15:02:07 -0400
Subject: [PATCH] Fixed a few broken styles in the template search

---
 .../sass/uswds/_uswds-theme-custom-styles.scss   | 16 +++++++++-------
 .../views/templates/_template_list.html          |  2 +-
 app/templates/views/templates/choose-reply.html  |  4 ++--
 app/templates/views/templates/copy.html          |  2 +-
 4 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
index 368d4d22d..1d2a1a670 100644
--- a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
+++ b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
@@ -149,16 +149,12 @@ td.table-empty-message {
    margin: 0 units(0.5);
 }
 
-.usa-template-list-template {
+.usa-template-list-template, .template-list-template {
    background: url(../img/material-icons/description.svg) no-repeat;
    padding-left: units(4);
    display: inline-flex; 
 }
 
-.template-list-item-hint {
-   padding-left: units(4);
-}
-
 .js-enabled .live-search {
    display: flex;
    margin-bottom: units(2);
@@ -191,7 +187,8 @@ td.table-empty-message {
 
 .sticky-template-form {
    margin: 0;
-   padding: 0;
+   border: 1px solid color("gray-cool-10");
+   padding: units(2);
    &:focus {
       outline-offset: units(1);
    }
@@ -282,7 +279,12 @@ td.table-empty-message {
    max-height: 500px;
    overflow-y: auto;
    padding-left: units(1);
-   margin: units(2) 0; 
+   margin: units(2) 0 units(5);
+   ul {
+      padding: 0; 
+      margin: 0; 
+      list-style: none; 
+   } 
 }
 
 // Tabs
diff --git a/app/templates/views/templates/_template_list.html b/app/templates/views/templates/_template_list.html
index 40f8a8bf1..71b135d18 100644
--- a/app/templates/views/templates/_template_list.html
+++ b/app/templates/views/templates/_template_list.html
@@ -21,7 +21,7 @@
     {% endif %}
   </p>
 {% else %}
-  <nav id="template-list" class="{{ 'govuk-!-margin-top-1' if (not show_template_nav and not show_search_box) else 'govuk-!-margin-top-6' }}">
+  <nav id="template-list">
     {% set checkboxes_data = [] %}
 
     {% if not current_user.has_permissions('manage_templates') %}
diff --git a/app/templates/views/templates/choose-reply.html b/app/templates/views/templates/choose-reply.html
index fd5524651..9e3f3d8db 100644
--- a/app/templates/views/templates/choose-reply.html
+++ b/app/templates/views/templates/choose-reply.html
@@ -51,11 +51,11 @@
               <span class="live-search-relevant">{{ item.name }}</span>
             </a>
           {% else %}
-            <a class="usa-link template-list-template" href="{{ url_for('.conversation_reply_with_template', service_id=current_service.id, template_id=item.id, notification_id=notification_id) }}">
+            <a class="usa-link usa-template-list-template" href="{{ url_for('.conversation_reply_with_template', service_id=current_service.id, template_id=item.id, notification_id=notification_id) }}">
               <span class="live-search-relevant">{{ item.name }}</span>
             </a>
           {% endif %}
-          <p class="template-list-item-hint govuk-hint">
+          <p class="template-list-item-hint usa-hint usa-checkbox__label-description">
             {{ item.hint }}
           </p>
         </li>
diff --git a/app/templates/views/templates/copy.html b/app/templates/views/templates/copy.html
index 757a804b5..8296c7693 100644
--- a/app/templates/views/templates/copy.html
+++ b/app/templates/views/templates/copy.html
@@ -51,7 +51,7 @@
                 <span class="live-search-relevant">{{ item.name }}</span>
               </a>
             {% endif %}
-            <p class="template-list-item-hint govuk-hint">
+            <p class="template-list-item-hint usa-hint usa-checkbox__label-description">
               {{ item.hint }}
             </p>
           </li>