From e15bdabb4ba903c4d8a663b25e2e2a4b079c4afb Mon Sep 17 00:00:00 2001
From: igorkorenfeld <igor.korenfeld@gsa.gov>
Date: Thu, 19 Jan 2023 14:25:31 -0500
Subject: [PATCH] Adjust spacing and styling of subheaders for ao examples

---
 .../sass/_theme/_uswds-theme-custom-styles.scss     | 13 +++++++++++++
 .../templates/application_authorizing_official.html |  4 ++--
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/registrar/assets/sass/_theme/_uswds-theme-custom-styles.scss b/src/registrar/assets/sass/_theme/_uswds-theme-custom-styles.scss
index 158309f99..9f2247363 100644
--- a/src/registrar/assets/sass/_theme/_uswds-theme-custom-styles.scss
+++ b/src/registrar/assets/sass/_theme/_uswds-theme-custom-styles.scss
@@ -19,6 +19,8 @@ i.e.
 @include u-padding-right('05');
 ----------------------------------------
 */
+// USWDS tokens are a bit too coarse in their letter-spacing steps
+$letter-space--xs: .0125em; 
 
 @use "uswds-core" as *;
 
@@ -41,6 +43,13 @@ i.e.
     margin-top: units(2);
   }
  }
+ 
+.register-form-step h3 {
+  color: color('primary-dark');
+  letter-spacing: $letter-space--xs;
+  margin-top: units(3);
+  margin-bottom: 0;
+}
 
 .register-form-step p {
   @include typeset('sans', 'sm', 5);
@@ -92,6 +101,10 @@ a.breadcrumb__back {
   margin-top: units(2);
 }
 
+.ao_example p {
+  margin-top: units(1);
+}
+
 .review__step__name {
   font-weight: font-weight('semibold');
 }
diff --git a/src/registrar/templates/application_authorizing_official.html b/src/registrar/templates/application_authorizing_official.html
index 5fee4bc4b..5d80457df 100644
--- a/src/registrar/templates/application_authorizing_official.html
+++ b/src/registrar/templates/application_authorizing_official.html
@@ -12,8 +12,8 @@
   <p>Your authorizing official is the person within your organization who can authorize your domain request. This is generally the highest ranking or highest elected official in your organization. Read more about <a href="{% url 'todo' %}">who can serve as an authorizing official</a>.
   </p>
 
-  <div class="ao-example">
-    {% include "includes/ao_example__city.html" %}
+  <div class="ao_example">
+    {% include "includes/ao_example__school-district.html" %}
   </div>
 
   <p>We’ll contact your authorizing official to let them know that you made this request and to double check that they approve it.</p>