Merge pull request #2154 from GSA/2119-clean-up-best-practices-folder…

…s-and-components

2119 clean up best practices folders and components

app/assets/sass/uswds/_uswds-theme-custom-styles.scss

@@ -676,28 +676,28 @@ details form {
    margin-top: 0;
 }
 
-ol.best-practices-list {
+ol.guides-list {
    counter-reset: item;
    list-style-type: none;
    padding-left: 0;
 }
 
-ol.best-practices-list.set-two {
+ol.guides-list.set-two {
    counter-reset: item 6;
 }
 
-ol.best-practices-list.set-three {
+ol.guides-list.set-three {
    counter-reset: item 10;
 }
 
-ol.best-practices-list li {
+ol.guides-list li {
    counter-increment: item;
    margin-bottom: 15px;
    position: relative;
    padding-left: 40px;
 }
 
-ol.best-practices-list li::before {
+ol.guides-list li::before {
    content: counter(item);
    background-color: #005ea2;
    color: white;
@@ -713,11 +713,11 @@ ol.best-practices-list li::before {
    top: 0;
 }
 
-li.best-practices {
+li.guides {
    padding-bottom: 50px;
 }
 
-div.best-practices {
+div.guides {
    height: 400px
 }
 
@@ -820,7 +820,7 @@ $do-dont-top-bar-width: 1;
 }
 
 @media (max-width: 758px) {
-   .best-practices-flex-container {
+   .guides-flex-container {
       flex-direction: column;
    }
 }

app/main/views/index.py

@@ -25,7 +25,7 @@
 # Hook to check for feature flags
 @main.before_request
 def check_feature_flags():
-    if request.path.startswith("/guides/best-practices") and not current_app.config.get(
+    if request.path.startswith("/guides") and not current_app.config.get(
         "FEATURE_BEST_PRACTICES_ENABLED", False
     ):
         abort(404)
@@ -207,61 +207,61 @@ def trial_mode_new():
 @user_is_logged_in
 def best_practices():
     return render_template(
-        "views/best-practices/best-practices.html",
+        "views/guides/best-practices.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/clear-goals")
+@main.route("/guides/clear-goals")
 @user_is_logged_in
 def clear_goals():
     return render_template(
-        "views/best-practices/clear-goals.html",
+        "views/guides/clear-goals.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/rules-and-regulations")
+@main.route("/guides/rules-and-regulations")
 @user_is_logged_in
 def rules_and_regulations():
     return render_template(
-        "views/best-practices/rules-and-regulations.html",
+        "views/guides/rules-and-regulations.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/establish-trust")
+@main.route("/guides/establish-trust")
 @user_is_logged_in
 def establish_trust():
     return render_template(
-        "views/best-practices/establish-trust.html",
+        "views/guides/establish-trust.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/write-for-action")
+@main.route("/guides/write-for-action")
 @user_is_logged_in
 def write_for_action():
     return render_template(
-        "views/best-practices/write-for-action.html",
+        "views/guides/write-for-action.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/multiple-languages")
+@main.route("/guides/multiple-languages")
 @user_is_logged_in
 def multiple_languages():
     return render_template(
-        "views/best-practices/multiple-languages.html",
+        "views/guides/multiple-languages.html",
         navigation_links=best_practices_nav(),
     )
 
 
-@main.route("/guides/best-practices/benchmark-performance")
+@main.route("/guides/benchmark-performance")
 @user_is_logged_in
 def benchmark_performance():
     return render_template(
-        "views/best-practices/benchmark-performance.html",
+        "views/guides/benchmark-performance.html",
         navigation_links=best_practices_nav(),
     )
 

app/templates/components/best-practices/nav_breadcrumb.html → app/templates/components/nav_breadcrumb.html

@@ -1,8 +1,12 @@
+{% macro breadcrumb(title, parent_menu_title, url) %}
 <nav class="navigation-service usa-breadcrumb padding-top-0">
   <ol class="usa-breadcrumb__list">
     <li class="usa-breadcrumb__list-item">
-      <span class="usa-breadcrumb__label"><a href="{{ url_for('.best_practices') }}"
-          class="usa-link navigation-organization-link">Best Practices</a></span>
+      <span class="usa-breadcrumb__label">
+        <a href="{{ url_for(url) }}" class="usa-link navigation-organization-link">
+          {{ parent_menu_title }}
+        </a>
+      </span>
     </li>
     {% if title %}
     <li class="usa-breadcrumb__list-item">
@@ -11,3 +15,4 @@
     {% endif %}
   </ol>
 </nav>
+{% endmacro %}

app/templates/views/about/about.html

@@ -7,7 +7,6 @@
 {% endblock %}
 
 {% block content_column_content %}
-<!-- {% with title=page_title %}{% include "components/best-practices/nav_breadcrumb.html" %}{% endwith %} -->
 <section class="usa-prose">
   <h1>{{page_title}}</h1>
   <p>Notify.gov is a text messaging service built by and for the government. We help agencies communicate more

app/templates/views/about/security.html

@@ -1,4 +1,5 @@
 {% extends "base.html" %}
+{% import "components/nav_breadcrumb.html" as breadcrumbs %}
 
 {% set page_title = "Security" %}
 
@@ -7,7 +8,8 @@
 {% endblock %}
 
 {% block content_column_content %}
-<!-- {% with title=page_title %}{% include "components/best-practices/nav_breadcrumb.html" %}{% endwith %} -->
+{{ breadcrumbs.breadcrumb(page_title, "About", "main.about_notify") }}
+
 <section class="usa-prose">
   <h1>{{page_title}}</h1>
   <p class="font-sans-lg text-base">Notify.gov is built for the needs of government agencies with fundamental system

app/templates/views/about/why-text-messaging.html

@@ -1,13 +1,14 @@
 {% extends "base.html" %}
+{% import "components/nav_breadcrumb.html" as breadcrumbs %}
+
 {% set page_title = "Why text messaging" %}
 
 {% block per_page_title %}
 {{page_title}}
 {% endblock %}
 
 {% block content_column_content %}
-<!-- {% with title=page_title, parent_title="About", url="main.why_text_messaging" %}{% include
-"components/best-practices/nav_breadcrumb.html" %}{% endwith %} -->
+{{ breadcrumbs.breadcrumb(page_title, "About", "main.about_notify") }}
 
 <section class="usa-prose">
   <h1>{{page_title}}</h1>

app/templates/views/best-practices/benchmark-performance.html → app/templates/views/guides/benchmark-performance.html

@@ -1,4 +1,5 @@
 {% extends "base.html" %}
+{% import "components/nav_breadcrumb.html" as breadcrumbs %}
 
 {% set page_title = "Measuring performance with benchmarking" %}
 
@@ -7,7 +8,8 @@
 {% endblock %}
 
 {% block content_column_content %}
-{% with title=page_title %}{% include "components/best-practices/nav_breadcrumb.html" %}{% endwith %}
+{{ breadcrumbs.breadcrumb(page_title, "Guides", "main.best_practices") }}
+
 <section class="usa-prose">
   <h1>{{page_title}}</h1>
   <p class="font-sans-lg text-base">Learn how effective your texting program can be.</p>
@@ -19,7 +21,7 @@ <h1>{{page_title}}</h1>
   </p>
   <h2>What other texting studies have found</h2>
   <p>
-    When the <a
+    When the <a class="use-link usa-link--external"
       href="https://www.cbpp.org/research/food-assistance/targeted-text-message-outreach-can-increase-wic-enrollment-pilots-show"
       target="_blank">Center on Budget and Policy Priorities</a> studied WIC, they found key learnings about the
     quantity of messages delivered, how people engage with messages, and how they take action.
@@ -78,7 +80,8 @@ <h3 class="padding-left-5">Appointment requests</h3>
   </div>
 
   <p>
-    The <a href="https://codeforamerica.org/resources/texting-playbook/" target="_blank">Code for America’s Texting
+    The <a class="use-link usa-link--external" href="https://codeforamerica.org/resources/texting-playbook/"
+      target="_blank">Code for America’s Texting
       Playbook</a>
     reported specific learnings around appointment reminders, completing
     document submission, and maintenance reminders.

app/templates/views/best-practices/best-practices.html → app/templates/views/guides/best-practices.html

@@ -1,11 +1,12 @@
 {% extends "base.html" %}
 
+{% set page_title = "Best Practices" %}
+
 {% block per_page_title %}
-Best Practices
+{{page_title}}
 {% endblock %}
 
 {% block content_column_content %}
-
 <section class="usa-prose">
   <h1>Best Practices</h1>
   <p class="font-sans-lg text-base">For texting the public</p>
@@ -23,41 +24,41 @@ <h2 class="padding-bottom-2">
   "svg_src": "goal",
   "card_heading": "Establish clear goals",
   "p_text": "Start with a singular purpose. Make explicit what you want to achieve.",
-  "link": "/guides/best-practices/clear-goals"
+  "link": "/guides/clear-goals"
   },
   {
   "svg_src": "compliant",
   "card_heading": "Follow rules & regulations",
   "p_text": "Understand what is required when texting the public.",
-  "link": "/guides/best-practices/rules-and-regulations"
+  "link": "/guides/rules-and-regulations"
   },
   {
   "svg_src": "trust",
   "card_heading": "Establish trust",
   "p_text": "Help your audience anticipate and welcome your texts.",
-  "link": "/guides/best-practices/establish-trust"
+  "link": "/guides/establish-trust"
   },
   {
   "svg_src": "runner",
   "card_heading": "Write texts that provoke action",
   "p_text": "Help your audience know what to do with the information you send.",
-  "link": "/guides/best-practices/write-for-action"
+  "link": "/guides/write-for-action"
   },
   {
   "svg_src": "language",
   "card_heading": "Send texts in multiple languages",
   "p_text": "What to know as you plan translated texts.",
-  "link": "/guides/best-practices/multiple-languages"
+  "link": "/guides/multiple-languages"
   },
   {
   "svg_src": "chart",
   "card_heading": "Measure performance with benchmarking",
   "p_text": "Learn how effective your texting program can be.",
-  "link": "/guides/best-practices/benchmark-performance"
+  "link": "/guides/benchmark-performance"
   }
   ] %}
 
-  {% with card_contents=card_contents %}{% include "components/best-practices/cards.html" %}{%
+  {% with card_contents=card_contents %}{% include "components/guides/cards.html" %}{%
   endwith %}
 
 </section>

app/templates/views/best-practices/clear-goals.html → app/templates/views/guides/clear-goals.html

@@ -1,4 +1,5 @@
 {% extends "base.html" %}
+{% import "components/nav_breadcrumb.html" as breadcrumbs %}
 
 {% set page_title = "Establish clear goals" %}
 
@@ -7,7 +8,8 @@
 {% endblock %}
 
 {% block content_column_content %}
-{% with title=page_title %}{% include "components/best-practices/nav_breadcrumb.html" %}{% endwith %}
+{{ breadcrumbs.breadcrumb(page_title, "Guides", "main.best_practices") }}
+
 <section class="usa-prose">
   <h1>{{page_title}}</h1>
   <p class="font-sans-lg text-base">Start with a singular purpose. Make explicit what you want to achieve.</p>
@@ -160,7 +162,7 @@ <h2>Use a hypothesis framework to plan your campaign</h2>
   </div>
   <p>
     Review your drafted hypothesis with your team to make sure everyone is aligned on your desired goals. A clear and
-    concise hypothesis can help you decide how to <a href="../best-practices/write-for-action">write text message
+    concise hypothesis can help you decide how to <a href="../guides/write-for-action">write text message
       content
       that provokes action</a>.
   </p>