Changes

src/registrar/public/sass/_theme/_base.scss

@@ -0,0 +1,141 @@
+@use "uswds-core" as *;
+
+/* Styles for making visible to screen reader / AT users only. */
+.sr-only {
+  @include sr-only;
+}
+
+.clear-both {
+  clear: both;
+}
+ 
+* {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+ 
+body {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
+ 
+#wrapper {
+  flex-grow: 1;
+  padding-top: units(3);
+  padding-bottom: units(6) * 2 ; //Workaround because USWDS units jump from 10 to 15
+}
+
+#wrapper.dashboard {
+  background-color: color('primary-lightest');
+  padding-top: units(5);
+}
+ 
+.usa-logo {
+  @include at-media(desktop) {
+    margin-top: units(2);
+  }
+}
+ 
+.usa-logo__text {
+  @include typeset('sans', 'xl', 2);
+  color: color('primary-darker');
+}
+
+.usa-nav__primary {
+  margin-top:units(1);
+}
+
+.section--outlined {
+  background-color: color('white');
+  border: 1px solid color('base-lighter');
+  border-radius: 4px;
+  padding: 0 units(2) units(3);
+  margin-top: units(3);
+
+  h2 {
+    color: color('primary-dark');
+    margin-top: units(2);
+    margin-bottom: units(2);
+  }
+
+  p {
+    margin-bottom: 0;
+  }
+
+  @include at-media(mobile-lg) {
+    margin-top: units(5);
+
+    h2 {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.break-word {
+  word-break: break-word;
+}
+
+.dotgov-status-box {
+  background-color: color('primary-lightest'); 
+  border-color: color('accent-cool-lighter');
+}
+
+.dotgov-status-box--action-need {
+  background-color: color('warning-lighter'); 
+  border-color: color('warning');
+}
+
+footer {
+  border-top: 1px solid color('primary-darker');
+}
+
+.usa-footer__secondary-section {
+  background-color: color('primary-lightest');
+}
+
+.usa-footer__secondary-section a {
+  color: color('primary');
+}
+
+.usa-identifier__logo {
+  height: units(7);
+}
+
+abbr[title] {
+  // workaround for underlining abbr element
+  border-bottom: none;
+  text-decoration: none;
+}
+
+@include at-media(tablet) {
+  .float-right-tablet {
+      float: right;
+  }
+  .float-left-tablet {
+     float: left;
+  }
+}
+
+@include at-media(desktop) {
+  .float-right-desktop {
+     float: right;
+  }
+  .float-left-desktop {
+     float: left;
+  }
+}
+
+.flex-end {
+  align-items: flex-end;
+}
+
+.usa-tooltip__body {
+  min-width: 320px;
+}
+
+// USWDS has weird interactions with SVGs regarding tooltips,
+// and other components. In this event, we need to disable pointer interactions.
+.disable-pointer-events {
+  pointer-events: none;
+}

src/registrar/templates/home.html

@@ -49,7 +49,6 @@
           <td data-sort-value="{{ domain.expiration_date|date:"U" }}" data-label="Expires">{{ domain.expiration_date|date }}</td>
           <td data-label="Status">
             <span class="usa-tooltip no-click-outline cursor-help"
-            data-position="top"
             aria-ignore="true"
             focusable="false">
               {# UNKNOWN domains would not have an expiration date and thus would show 'Expired' #}