diff --git a/_layouts/not_found.html b/_layouts/not_found.html new file mode 100644 index 00000000..16829bb3 --- /dev/null +++ b/_layouts/not_found.html @@ -0,0 +1,37 @@ + + + + + {% include google_analytics.html %} + {% include osc_analytics.html %} + {% include dap.html %} + + + + + + + + {% capture title -%} + {% if page.title %}{{ page.title }} | {{ site.title }}{% else %}{{ site.title }}{% endif -%} + {% endcapture -%} + + {{ title }} + + + {% if page.lead -%} + + + {% endif -%} + + + + + + + + + + {{ content }} + + diff --git a/_pages/404.md b/_pages/404.md new file mode 100644 index 00000000..b28e0a3f --- /dev/null +++ b/_pages/404.md @@ -0,0 +1,33 @@ +--- +layout: not_found +title: This page is no longer available. +permalink: /404.html +sitemap: false +--- + +
+
+
+
+
+ Login.gov logo +
+
+
+

+ The page you are looking for may have moved or is no longer available. +

+

+ Please check the URL. +

+

+ Here are some links that might be helpful: +

+
+ +
+
+
diff --git a/assets/scss/_not_found.scss b/assets/scss/_not_found.scss new file mode 100644 index 00000000..c3cace7c --- /dev/null +++ b/assets/scss/_not_found.scss @@ -0,0 +1,75 @@ +html.not-found { + height: 100%; +} + +body.not-found { + color: #fff; + text-align: center; + height: 100%; + + main { + background-color: #112e51; + } + + a, + a:focus, + a:hover { + color: #fff; + } + + .site-wrapper { + height: 100%; + min-height: 100%; + width: 100%; + display: table; + } + + .site-wrapper-inner { + display: table-cell; + vertical-align: middle; + } + + .cover-container { + margin: auto; + max-width: 600px; + } + + .inner { + padding: 0 30px; + } + + .cover { + padding: 0 20px; + } + + .masthead-brand { + margin-top: 10px; + } + + ul { + padding: 0; + } + + li { + display: inline; + margin: 20px; + } + + h1 { + margin-top: 32px; + margin-bottom: 24px; + } + + @media (min-width: 768px) { + .cover-container { + width: 100%; + } + } + + @media (min-width: 992px) { + .cover-container { + width: 720px; + } + } + } + \ No newline at end of file diff --git a/assets/scss/main.css.scss b/assets/scss/main.css.scss index f98540ba..f6d8d96d 100644 --- a/assets/scss/main.css.scss +++ b/assets/scss/main.css.scss @@ -14,6 +14,7 @@ ); @forward "uswds"; @forward "footer"; +@forward "not_found"; $block-background-color: #fafafa;