- Removed links to the gov uk stylesheets

- Deleted /stylesheets folder
- Removed sass build from gulpfile
- Changed gov links to usa links
- Changed other govuk styles, like breadcrumbs
- Changed name of uk_components file to us_components
- Fixed a few tests that broke on account of the changes

app/templates/admin_template.html

@@ -14,8 +14,6 @@
   {%- for font in font_paths %}
   <link rel="preload" href="{{ asset_url(font, with_querystring_hash=False) }}" as="font" type="font/woff2" crossorigin>
   {%- endfor %}
-  <link rel="stylesheet" media="screen" href="{{ asset_url('stylesheets/main.css') }}" />
-  <link rel="stylesheet" media="print" href="{{ asset_url('stylesheets/print.css') }}" />
   <link rel="stylesheet" media="screen" href="{{ asset_url('css/styles.css') }}" />
   {% block extra_stylesheets %}
   {% endblock %}
@@ -148,9 +146,9 @@
   
 
   {% if current_service and current_service.research_mode %}
-    {% set meta_suffix = 'Built by the <a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="govuk-footer__link">Technology Transformation Services</a><span id="research-mode" class="research-mode">research mode</span>' %}
+    {% set meta_suffix = 'Built by the <a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="usa-link">Technology Transformation Services</a><span id="research-mode" class="research-mode">research mode</span>' %}
   {% else %}
-    {% set meta_suffix = 'Built by the <a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="govuk-footer__link">Technology Transformation Services</a>' %}
+    {% set meta_suffix = 'Built by the <a href="https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services/tts-solutions" class="usa-link">Technology Transformation Services</a>' %}
   {% endif %}
 
   {{ govukFooter({

app/templates/components/banner.html

@@ -1,5 +1,5 @@
 {% from "components/form.html" import form_wrapper %}
-{% from "components/uk_components/button/macro.njk" import govukButton %}
+{% from "components/us_components/button/macro.njk" import govukButton %}
 
 {% macro banner(body, type=None, with_tick=False, delete_button=None, subhead=None, context=None, action=None, id=None, thing=None) %}
   <div

app/templates/components/big-number.html

@@ -1,6 +1,6 @@
 {% macro big_number(number, label, link=None, currency='', smaller=False, smallest=False) %}
   {% if link %}
-    <a class="usa-link govuk-link--no-visited-state display-block margin-bottom-1" href="{{ link }}">
+    <a class="usa-link display-block margin-bottom-1" href="{{ link }}">
   {% endif %}
       <span class="big-number{% if smaller %}-smaller{% endif %}{% if smallest %}-smallest{% endif %}">
         <span class="big-number-number">
@@ -42,7 +42,7 @@
       <span class="big-number-status{% if danger_zone %}-failing{% endif %}">
         {% if failures %}
           {% if failure_link %}
-            <a class="govuk-link govuk-link--no-visited-state" href="{{ failure_link }}">
+            <a class="usa-link" href="{{ failure_link }}">
               {{ "{:,}".format(failures) }}
               failed – {{ failure_percentage }}%
             </a>

app/templates/components/file-upload.html

@@ -1,4 +1,4 @@
-{% from "components/uk_components/button/macro.njk" import govukButton %}
+{% from "components/us_components/button/macro.njk" import govukButton %}
 
 {% macro file_upload(
   field,
@@ -34,7 +34,7 @@
     </label>
     {% if alternate_link and alternate_link_text %}
       <span class="file-upload-alternate-link">
-        or <a class="govuk-link govuk-link--no-visited-state" href="{{ alternate_link }}">{{ alternate_link_text }}</a>
+        or <a class="usa-link" href="{{ alternate_link }}">{{ alternate_link_text }}</a>
       </span>
     {% endif %}
     <label class="file-upload-filename" for="{{ field.name }}"></label>

app/templates/components/folder-path.html

@@ -40,7 +40,7 @@
   {% if folder_path %}
     <h2 class="heading-medium folder-heading">
       {% if folder_path|length == 1 %}
-        <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.choose_template_to_copy', service_id=current_service_id) }}">Services</a>
+        <a class="usa-link" href="{{ url_for('.choose_template_to_copy', service_id=current_service_id) }}">Services</a>
         {{ folder_path_separator() }}
       {% endif %}
       {% for folder in folder_path %}
@@ -51,15 +51,15 @@
         {% else %}
           {% if folder.id %}
             {% if current_user.has_template_folder_permission(folder) %}
-              <a href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id, from_folder=folder.id) }}" class="govuk-link govuk-link--no-visited-state folder-heading-folder">{{ folder.name }}</a>
+              <a href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id, from_folder=folder.id) }}" class="usa-link folder-heading-folder">{{ folder.name }}</a>
              {% else %}
               <span class="folder-heading-folder">{{ folder.name }}</span>
             {% endif %}
             {% if not loop.last %}{{ folder_path_separator() }}{% endif %}
           {% elif folder.parent_id == None %}
-            <a href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id, from_folder=folder.id) }}" class="govuk-link govuk-link--no-visited-state folder-heading-folder">{{ from_service.name }}</a> {% if not loop.last %}{{ folder_path_separator() }}{% endif %}
+            <a href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id, from_folder=folder.id) }}" class="usa-link folder-heading-folder">{{ from_service.name }}</a> {% if not loop.last %}{{ folder_path_separator() }}{% endif %}
           {% else %}
-            <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id) }}">{{ from_service.name }}</a> {% if not loop.last %}{{ folder_path_separator() }}{% endif %}
+            <a class="usa-link" href="{{ url_for('.choose_template_to_copy', service_id=current_service_id, from_service=from_service.id) }}">{{ from_service.name }}</a> {% if not loop.last %}{{ folder_path_separator() }}{% endif %}
           {% endif %}
         {% endif %}
       {% endfor %}

app/templates/components/list-entry.html

@@ -1,5 +1,5 @@
-{% from "components/uk_components/fieldset/macro.njk" import govukFieldset %}
-{% from "components/uk_components/error-message/macro.njk" import govukErrorMessage %}
+{% from "components/us_components/fieldset/macro.njk" import govukFieldset %}
+{% from "components/us_components/error-message/macro.njk" import govukErrorMessage %}
 
 {% macro list_entry(
   field,

app/templates/components/page-footer.html

@@ -1,4 +1,4 @@
-{% from "components/uk_components/button/macro.njk" import govukButton %}
+{% from "components/us_components/button/macro.njk" import govukButton %}
 
 {% macro page_footer(
   button_text=None,
@@ -32,7 +32,7 @@
     {% endif %}
     {% if delete_link %}
       <span class="page-footer-link {% if not button_text %}page-footer-delete-link-without-button{% endif %}">
-        <a class="govuk-link govuk-link--destructive" href="{{ delete_link }}">{{ delete_link_text }}</a>
+        <a class="usa-link usa-link--destructive" href="{{ delete_link }}">{{ delete_link_text }}</a>
       </span>
     {% endif %}
     {% if secondary_link and secondary_link_text %}

app/templates/components/previous-next-navigation.html

@@ -4,7 +4,7 @@
       <ul class="group">
         {% if previous_page %}
           <li class="previous-page">
-            <a class="govuk-link govuk-link--no-visited-state" href="{{previous_page['url']}}" rel="previous" >
+            <a class="usa-link" href="{{previous_page['url']}}" rel="previous" >
               <span class="pagination-part-title">
                 <svg class="pagination-icon" xmlns="http://www.w3.org/2000/svg" height="13" width="17" viewBox="0 0 17 13">
                   <path fill="currentColor" d="m6.5938-0.0078125-6.7266 6.7266 6.7441 6.4062 1.377-1.449-4.1856-3.9768h12.896v-2h-12.984l4.2931-4.293-1.414-1.414z"/>
@@ -17,7 +17,7 @@
         {% endif %}
         {% if next_page %}
           <li class="next-page">
-            <a class="govuk-link govuk-link--no-visited-state" href="{{next_page['url']}}" rel="next">
+            <a class="usa-link" href="{{next_page['url']}}" rel="next">
               <span class="pagination-part-title">
                 {{next_page['title']}}
                 <svg class="pagination-icon" xmlns="http://www.w3.org/2000/svg" height="13" width="17" viewBox="0 0 17 13">

app/templates/components/service-link.html

@@ -1,6 +1,6 @@
 {% macro service_link(service, endpoint, link_text) %}
   {% if service %}
-    <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for(endpoint, service_id=service.id) }}">{{ link_text }}</a>
+    <a class="usa-link" href="{{ url_for(endpoint, service_id=service.id) }}">{{ link_text }}</a>
   {% else %}
     <b class="govuk-!-font-weight-bold">{{ link_text|capitalize }}</b>
   {% endif %}

app/templates/components/status-box.html

@@ -2,7 +2,7 @@
   <div class="big-number-with-status">
     <div class="big-number-status{% if failing %}-failing{% endif %}">
       {% if url %}
-        <a class="govuk-link govuk-link--no-visited-state" href="{{ url }}">{{ number }} {{ label }}</a>
+        <a class="usa-link" href="{{ url }}">{{ number }} {{ label }}</a>
       {% else %}
         {{ number }} {{ label }}
       {% endif %}

app/templates/components/sub-navigation.html

@@ -24,7 +24,7 @@
 {% macro sub_navigation(
   item_set
 ) %}
-  <nav aria-label="Side navigation," class="margin-top-5">
+  <nav aria-label="Side navigation,">
     <ul class="usa-sidenav" itemtype="http://schema.org/ItemList">
       {% for item in item_set %}
         {% if item.sub_navigation_items %}

app/templates/components/task-list.html

@@ -1,6 +1,6 @@
 {% macro task_list_item(completed, label, link) %}
   <li class="task-list-item">
-    <span aria-describedby="{{ label|id_safe }}"><a class="govuk-link govuk-link--no-visited-state" href="{{ link }}">{{ label }}</a></span>
+    <span aria-describedby="{{ label|id_safe }}"><a class="usa-link" href="{{ link }}">{{ label }}</a></span>
     {% if completed %}
       <strong class="task-list-indicator-completed" id="{{ label|id_safe }}">Completed</strong>
     {% else %}

app/templates/components/textbox.html

@@ -61,7 +61,7 @@
     {% endif %}
     {% if help_link and help_link_text %}
       <p class="textbox-help-link">
-        <a class="govuk-link govuk-link--no-visited-state" href='{{ help_link }}'>{{ help_link_text }}</a>
+        <a class="usa-link" href='{{ help_link }}'>{{ help_link_text }}</a>
       </p>
     {% endif %}
   </div>

app/templates/components/uk_components/skip-link/template.njk

@@ -1,3 +0,0 @@
-<a href="{{ params.href | default('#content') }}" class="govuk-skip-link{%- if params.classes %} {{ params.classes }}{% endif -%}"{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
-  {{- params.html | safe if params.html else params.text -}}
-</a>

app/templates/components/us_components/footer/template.njk

@@ -1,65 +1,3 @@
-{# <footer class="usa-footer usa-footer--big {{ params.classes if params.classes }}" role="contentinfo"
-        {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
-  <div class="grid-container usa-footer__return-to-top">
-    <a href="#">Return to top</a>
-  </div>
-  <div class="govuk-width-container {{ params.containerClasses if params.containerClasses }}">
-    {% if params.navigation %}
-      <div class="govuk-footer__navigation">
-        {% for nav in params.navigation %}
-          <div class="govuk-footer__section">
-            <h2 class="govuk-footer__heading govuk-heading-m">{{ nav.title }}</h2>
-            {% if nav.items %}
-              {% set listClasses %}
-                {% if nav.columns %}
-                  govuk-footer__list--columns-{{ nav.columns }}
-                {% endif %}
-              {% endset %}
-              <ul class="govuk-footer__list {{ listClasses | trim }}">
-                {% for item in nav.items %}
-                  {% if item.href and item.text %}
-                    <li class="govuk-footer__list-item">
-                      <a class="govuk-footer__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
-                        {{ item.text }}
-                      </a>
-                    </li>
-                  {% endif %}
-                {% endfor %}
-              </ul>
-            {% endif %}
-          </div>
-        {% endfor %}
-      </div>
-      <hr class="govuk-footer__section-break">
-    {% endif %}
-    <div class="govuk-footer__meta">
-      <div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
-        {% if params.meta %}
-          <h2 class="usa-sr-only">{{ params.meta.visuallyHiddenTitle | default("Support links") }}</h2>
-          {% if params.meta.items %}
-            <ul class="govuk-footer__inline-list">
-              {% for item in params.meta.items %}
-                <li class="govuk-footer__inline-list-item">
-                  <a class="govuk-footer__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
-                    {{ item.text }}
-                  </a>
-                </li>
-              {% endfor %}
-            </ul>
-          {% endif %}
-          {% if params.meta.text or params.meta.html %}
-            <div class="govuk-footer__meta-custom">
-              {{ params.meta.html | safe if params.meta.html else params.meta.text }}
-            </div>
-          {% endif %}
-        {% endif %}
-        
-      </div>
-    </div>
-  </div>
-</footer>  #}
-
-
 <footer class="usa-footer usa-footer--big">
   {# <div class="grid-container usa-footer__return-to-top">
     <a href="#">Return to top</a>
@@ -98,22 +36,16 @@
           {% endif %} #}
         </div>
       </div>
-      <div class="govuk-footer__meta border-top border-gray-10">
-        <div class="govuk-footer__meta-item govuk-footer__meta-item--grow padding-top-1 margin-bottom-1">
-
+      <div class="padding-y-1">
           {% if params.meta %}
           <h2 class="usa-sr-only">{{ params.meta.visuallyHiddenTitle | default("Support links") }}</h2>
           {% if params.meta.items %}
-          <ul class="govuk-footer__inline-list">
             {% for item in params.meta.items %}
-            <li class="govuk-footer__inline-list-item">
               <a class="govuk-footer__link" href="{{ item.href }}" {% for attribute, value in item.attributes %}
                 {{attribute}}="{{value}}" {% endfor %}>
                 {{ item.text }}
               </a>
-            </li>
             {% endfor %}
-          </ul>
           {% endif %}
           {% if params.meta.text or params.meta.html %}
           <div>
@@ -123,7 +55,6 @@
           {% endif %}
         </div>
       </div>
-      </div>
     </div>
   </div>
 </footer>

app/templates/components/us_components/skip-link/template.njk

@@ -0,0 +1,7 @@
+<a href="{{ params.href | default('#content') }}" class="usa-skipnav{%- if params.classes %} {{ params.classes }}{% endif -%}"{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %}>
+  {{- params.html | safe if params.html else params.text -}}
+</a>
+
+<a class="usa-skipnav " href="#main-content">
+  Skip to main content
+</a>

app/templates/content_template.html

@@ -14,7 +14,7 @@
       <div class="tablet:grid-col-2">
         {{ sub_navigation(navigation_links) }}
       </div>
-      <div class="tablet:grid-col-10 padding-left-4 sub-content">
+      <div class="tablet:grid-col-10 padding-left-4 usa-prose site-prose">
     {% else %}
       <div class="tablet:grid-col-10">
     {% endif %}

app/templates/error/401.html

@@ -4,6 +4,6 @@
   <div class="govuk-grid-row">
     <div class="govuk-grid-column-two-thirds">
     <h1>You’re not authorised to see this page</h1>
-      <p class="govuk-body"><a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.sign_in' )}}">Sign in</a> to Notify.gov and try again.</p>
+      <p class="govuk-body"><a class="usa-link" href="{{ url_for('main.sign_in' )}}">Sign in</a> to Notify.gov and try again.</p>
   </div>
 {% endblock %}

app/templates/error/404.html

@@ -13,7 +13,7 @@
           If you pasted the web address, check you copied the entire address.
         </p>
         <p class="govuk-body">
-          If the web address is correct or you selected a link or button, <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.support') }}">contact us</a>.
+          If the web address is correct or you selected a link or button, <a class="usa-link" href="{{ url_for('main.support') }}">contact us</a>.
         </p>
       </div>
     </div>

app/templates/error/410.html

@@ -13,7 +13,7 @@
           If you pasted the web address, check you copied the entire address.
         </p>
         <p class="govuk-body">
-          If the web address is correct or you selected a link or button, <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('main.support') }}">contact us</a>.
+          If the web address is correct or you selected a link or button, <a class="usa-link" href="{{ url_for('main.support') }}">contact us</a>.
         </p>
       </div>
     </div>

app/templates/error/500.html

@@ -10,10 +10,10 @@
         Try again later.
       </p>
       <!-- <p class="govuk-body">
-        You can check our <a class="govuk-link govuk-link--no-visited-state" href="https://status.notifications.service.gov.uk">system status</a> page to see if there are any known issues.
+        You can check our <a class="usa-link" href="https://status.notifications.service.gov.uk">system status</a> page to see if there are any known issues.
       </p> -->
       <p class="govuk-body">
-        To report a problem, please email <a class="govuk-link govuk-link--no-visited-state" href="mailto:notify-support@gsa.gov">notify-support@gsa.gov</a>.
+        To report a problem, please email <a class="usa-link" href="mailto:notify-support@gsa.gov">notify-support@gsa.gov</a>.
       </p>
     </div>
   </div>

app/templates/forms/fields/checkboxes/template.njk

@@ -1,7 +1,7 @@
-{% from "components/uk_components/error-message/macro.njk" import govukErrorMessage -%}
-{% from "components/uk_components/fieldset/macro.njk" import govukFieldset %}
-{% from "components/uk_components/hint/macro.njk" import govukHint %}
-{% from "components/uk_components/label/macro.njk" import govukLabel %}
+{% from "components/us_components/error-message/macro.njk" import govukErrorMessage -%}
+{% from "components/us_components/fieldset/macro.njk" import govukFieldset %}
+{% from "components/us_components/hint/macro.njk" import govukHint %}
+{% from "components/us_components/label/macro.njk" import govukLabel %}
 
 
 {#- Copied from https://github.com/alphagov/govuk-frontend/blob/v2.13.0/src/components/checkboxes/template.njk

app/templates/main_nav.html

@@ -19,11 +19,11 @@
       <li class="usa-sidenav__item"><a class="{{ main_navigation.is_selected('settings') }}" href="{{ url_for('.service_settings', service_id=current_service.id) }}">Settings</a></li>
     {% endif %}
     {% if current_user.has_permissions('manage_api_keys') %}
-      <!-- <li><a class="govuk-link govuk-link--no-visited-state{{ main_navigation.is_selected('api-integration') }}" href="{{ url_for('.api_integration', service_id=current_service.id) }}">API integration</a></li> -->
+      <!-- <li><a class="usa-link{{ main_navigation.is_selected('api-integration') }}" href="{{ url_for('.api_integration', service_id=current_service.id) }}">API integration</a></li> -->
     {% endif %}
   {% elif current_user.has_permissions(allow_org_user=True) %}
-    <li class="usa-sidenav__item"><a class="govuk-link govuk-link--no-visited-state{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li>
-    <li class="usa-sidenav__item"><a class="govuk-link govuk-link--no-visited-state{{ main_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_users', service_id=current_service.id) }}">Team members</a></li>
+    <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('usage') }}" href="{{ url_for('.usage', service_id=current_service.id) }}">Usage</a></li>
+    <li class="usa-sidenav__item"><a class="usa-link{{ main_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_users', service_id=current_service.id) }}">Team members</a></li>
   {% endif %}
   </ul>
 </nav>

app/templates/main_template.html

@@ -1,6 +1,6 @@
-{% from "./components/uk_components/skip-link/macro.njk" import govukSkipLink -%}
-{% from "./components/uk_components/header/macro.njk" import govukHeader -%}
-{% from "./components/uk_components/footer/macro.njk" import govukFooter -%}
+{% from "./components/us_components/skip-link/macro.njk" import govukSkipLink -%}
+{% from "./components/us_components/header/macro.njk" import govukHeader -%}
+{% from "./components/us_components/footer/macro.njk" import govukFooter -%}
 {# specify absolute url for the static assets folder e.g. http://wwww.domain.com/assets #}
 {%- set assetUrl = assetUrl | default(assetPath) -%}
 <!DOCTYPE html>

app/templates/org_nav.html

@@ -1,11 +1,11 @@
 <nav class="navigation">
   <ul>
-    <li><a class="govuk-link govuk-link--no-visited-state{{ org_navigation.is_selected('dashboard') }}" href="{{ url_for('.organization_dashboard', org_id=current_org.id) }}">Usage</a></li>
-    <li><a class="govuk-link govuk-link--no-visited-state{{ org_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_org_users', org_id=current_org.id) }}">Team members</a></li>
+    <li><a class="usa-link{{ org_navigation.is_selected('dashboard') }}" href="{{ url_for('.organization_dashboard', org_id=current_org.id) }}">Usage</a></li>
+    <li><a class="usa-link{{ org_navigation.is_selected('team-members') }}" href="{{ url_for('.manage_org_users', org_id=current_org.id) }}">Team members</a></li>
     {% if current_user.platform_admin %}
-    <li><a class="govuk-link govuk-link--no-visited-state{{ org_navigation.is_selected('settings') }}" href="{{ url_for('.organization_settings', org_id=current_org.id) }}">Settings</a></li>
-    <li><a class="govuk-link govuk-link--no-visited-state{{ org_navigation.is_selected('trial-services') }}" href="{{ url_for('.organization_trial_mode_services', org_id=current_org.id) }}">Trial mode services</a></li>
-    <li><a class="govuk-link govuk-link--no-visited-state{{ org_navigation.is_selected('billing') }}" href="{{ url_for('.organization_billing', org_id=current_org.id) }}">Billing</a></li>
+    <li><a class="usa-link{{ org_navigation.is_selected('settings') }}" href="{{ url_for('.organization_settings', org_id=current_org.id) }}">Settings</a></li>
+    <li><a class="usa-link{{ org_navigation.is_selected('trial-services') }}" href="{{ url_for('.organization_trial_mode_services', org_id=current_org.id) }}">Trial mode services</a></li>
+    <li><a class="usa-link{{ org_navigation.is_selected('billing') }}" href="{{ url_for('.organization_billing', org_id=current_org.id) }}">Billing</a></li>
     {% endif %}
   </ul>
 </nav>

app/templates/org_template.html

@@ -6,14 +6,14 @@
 
 {% block main %}
   <div class="grid-container">
-    <div class="navigation-service">
+    <div class="navigation-service usa-breadcrumb">
       {% if current_user.platform_admin %}
-        <a href="{{ url_for('.organizations') }}" class="govuk-link govuk-link--no-visited-state navigation-organization-link">Organizations</a>
+        <a href="{{ url_for('.organizations') }}" class="usa-link navigation-organization-link">Organizations</a>
       {% endif %}
-      <div class="navigation-service-name govuk-!-font-weight-bold">
+      <div class="navigation-service govuk-!-font-weight-bold">
         {{ current_org.name }}
       </div>
-      <a href="{{ url_for('main.choose_account') }}" class="govuk-link govuk-link--no-visited-state navigation-service-switch">Switch service</a>
+      <a href="{{ url_for('main.choose_account') }}" class="usa-link navigation-service">Switch service</a>
     </div>
     <div class="govuk-grid-row govuk-!-padding-bottom-12">
       <div class="govuk-grid-column-one-quarter">

app/templates/partials/check/not-allowed-to-send-to.html

@@ -7,6 +7,6 @@
   {%- endif %}
 </h1>
 <p class="govuk-body">
-  In <a class="govuk-link govuk-link--no-visited-state" href="{{ url_for('.trial_mode_new') }}">trial mode</a> you can only
+  In <a class="usa-link" href="{{ url_for('.trial_mode_new') }}">trial mode</a> you can only
   send to yourself and members of your team
 </p>