From b57ab6eea1a21c396ae589b93d2953c9c07266d0 Mon Sep 17 00:00:00 2001
From: David Kennedy <david.kennedy@associates.cisa.dhs.gov>
Date: Thu, 14 Nov 2024 17:35:40 -0500
Subject: [PATCH] formatting of domain overview, invited domain mgr label

---
 src/registrar/assets/sass/_theme/_forms.scss       | 5 +++--
 src/registrar/assets/sass/_theme/_typography.scss  | 7 +++++++
 src/registrar/templates/includes/summary_item.html | 2 +-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/registrar/assets/sass/_theme/_forms.scss b/src/registrar/assets/sass/_theme/_forms.scss
index 08e35b19f..9158de174 100644
--- a/src/registrar/assets/sass/_theme/_forms.scss
+++ b/src/registrar/assets/sass/_theme/_forms.scss
@@ -1,5 +1,6 @@
 @use "uswds-core" as *;
 @use "cisa_colors" as *;
+@use "typography" as *;
 
 .usa-form .usa-button {
   margin-top: units(3);
@@ -69,9 +70,9 @@ legend.float-left-tablet + button.float-right-tablet {
 }
 
 .read-only-label {
-  font-size: size('body', 'sm');
+  @extend .h4--sm-05;
+  font-weight: bold;
   color: color('primary-dark');
-  margin-bottom: units(0.5);
 }
 
 .read-only-value {
diff --git a/src/registrar/assets/sass/_theme/_typography.scss b/src/registrar/assets/sass/_theme/_typography.scss
index d815ef6dd..466b6f975 100644
--- a/src/registrar/assets/sass/_theme/_typography.scss
+++ b/src/registrar/assets/sass/_theme/_typography.scss
@@ -23,6 +23,13 @@ h2 {
   color: color('primary-darker');
 }
 
+.h4--sm-05 {
+  font-size: size('body', 'sm');
+  font-weight: normal;
+  color: color('primary');
+  margin-bottom: units(0.5);
+}
+
 // Normalize typography in forms
 .usa-form,
 .usa-form fieldset {
diff --git a/src/registrar/templates/includes/summary_item.html b/src/registrar/templates/includes/summary_item.html
index c3b3fdd3f..15cc0f67f 100644
--- a/src/registrar/templates/includes/summary_item.html
+++ b/src/registrar/templates/includes/summary_item.html
@@ -119,7 +119,7 @@
           {% endif %}
         {% endif %}
         {% if value.invitations.all %}
-          <p class="margin-top-1">Invitations</p>
+          <h4 class="h4--sm-05">Invited domain managers</h4>
           <ul class="usa-list usa-list--unstyled margin-top-0">
           {% for item in value.invitations.all %}
             <li>{{ item.email }}</li>