Change header and footer to closer match to get.gov, alignment adjustment

src/registrar/assets/sass/_theme/_uswds-theme-custom-styles.scss

@@ -35,6 +35,19 @@ $letter-space--xs: .0125em;
   -moz-osx-font-smoothing: grayscale;
 }
 
+.usa-logo {
+  margin-top: units(2);
+}
+
+.usa-logo__text {
+  @include typeset('sans', 'xl', 2);
+  color: color('primary-darker');
+}
+
+.usa-nav__primary {
+  margin-top: units(1);
+}
+
  h1 {
   @include typeset('sans', '2xl', 2);
   margin: 0 0 units(2);
@@ -47,6 +60,11 @@ $letter-space--xs: .0125em;
   margin: units(4) 0 units(1);
  }
 
+.register-form-step > h1 {
+  //align to top of sidebar on first page of the form
+  margin-top: units(-1);
+}
+
  //Tighter spacing when H2 is immediatly after H1
 .register-form-step .usa-fieldset:first-of-type h2:first-of-type,
 .register-form-step h1 + h2 {
@@ -78,11 +96,6 @@ $letter-space--xs: .0125em;
 {
   @include typeset('sans', 'sm', 5);
   max-width: measure(5);
-
-  //TODO: Revisit
-  // &:last-of-type {
-  //   margin-bottom: 0;
-  // }
 }
 
 .register-form-step a {
@@ -282,17 +295,12 @@ section.dashboard {
 }
 
 
-main {
-  ////Workaround because USWDS units jump from 10 to 15
-  //padding-bottom: units(10) + units(2);
-  //padding-top: units(5);
-}
-
 #wrapper {
   padding-top: units(3);
   padding-bottom: units(6) * 2 ; //Workaround because USWDS units jump from 10 to 15
 }
 
+
 footer {
   border-top: 1px solid color('primary-darker');
 }

src/registrar/templates/base.html

@@ -129,11 +129,7 @@
         {% block logo %}
         <div class="usa-logo" id="extended-logo">
            <a href="{% url 'home' %}">
-           <img
+           <strong class="usa-logo__text" >.gov </strong>
-                src="{% static 'img/dottedgov-round.svg' %}"
-                alt="Home"
-                width="48px"
-              />
            </a>
         </div>
         {% endblock %}

src/registrar/templates/includes/footer.html

@@ -16,7 +16,7 @@
                 class="usa-footer__logo-img"
                 src="{% static 'img/dottedgov-round.svg' %}"
                 alt="dot gov registrar logo"
-                width="64px"
+                width="56px"
               />
             </div>
           </div>