update 404 page styles to use current DS styles (#902)

department-of-veterans-affairs · Jan 17, 2024 · abca87b · abca87b
1 parent 9cc7194
commit abca87b
Showing 1 changed file with 36 additions and 16 deletions.
diff --git a/pages/404.md b/pages/404.md
@@ -15,26 +15,46 @@ majorlinks:
 permalink: false
 private: true
 ---
-<div class="main maintenance-page" role="main">
+<div class="main maintenance-page vads-u-padding-top--4" role="main">
   <div class="primary">
-      <div class="row">
-        <div class="text-center usa-content">
-          <h3>Sorry — we can’t find that page</h3>
-          <p>
-            Try the search box or one of the common questions below.
-          </p>
-          <div class="feature va-flex va-flex--ctr">
-            <form accept-charset="UTF-8" action="/search/" id="search_form" class="full-width" method="get">
-              <div class="va-flex va-flex--top va-flex--jctr">
-                <label for="mobile-query">Search:</label>
-                <input autocomplete="off" class="usagov-search-autocomplete full-width" id="mobile-query" name="query" type="text" />
-                <input type="submit" value="Search">
-              </div>
-            </form>
-          </div>
+    <div class="row">
+      <div class="usa-content vads-u-text-align--center vads-u-margin-x--auto">
+        <h3>Sorry — we can’t find that page</h3>
+        <p>Try the search box or one of the common questions below.</p>
+        <div class="feature vads-u-display--flex vads-u-align-items--center">
+          <form
+            accept-charset="UTF-8"
+            action="/search/"
+            id="search_form"
+            class="full-width search-form-bottom-margin"
+            method="get"
+          >
+            <div
+              class="vads-u-display--flex vads-u-align-items--flex-start vads-u-justify-content--center"
+              style="height:5.7rem;"
+            >
+              <label for="mobile-query" class="sr-only">
+                Search:
+              </label>
+              <input
+                autocomplete="off"
+                class="usagov-search-autocomplete full-width vads-u-height--full vads-u-margin--0 vads-u-max-width--100"
+                id="mobile-query"
+                name="query"
+                type="text"
+              />
+              <input
+                type="submit"
+                value="Search"
+                style="borderRadius: 0 3px 3px 0;"
+                class="vads-u-height--full vads-u-margin--0"
+              />
+            </div>
+          </form>
         </div>
       </div>
     </div>
+  </div>
 </div>
 {% include "src/site/includes/common-and-popular.html" %}