Merge pull request #23753 from sftim/20200908_tidy_404_page

Tidy 404 Not Found error page

Author: k8s-ci-robot

assets/scss/_custom.scss

@@ -53,6 +53,14 @@ section {
   }
 }
 
+body.td-404 main .error-details {
+  max-width: 1100px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 4em;
+  margin-bottom: 0;
+}
+
 /* HEADER */
 
 .td-navbar {

i18n/en.toml

@@ -63,6 +63,9 @@ other = "Latest version"
 [docs_version_other_heading]
 other = "Older versions"
 
+[error_404_were_you_looking_for]
+other = "Were you looking for:"
+
 [examples_heading]
 other = "Examples"
 

layouts/404.html

@@ -1,29 +1,14 @@
 {{ define "main" }}
 {{ partial "handle-version-switch-404.html" . }}
-<div class="container-404">
-    <h4>
-        Perhaps you were looking for:
-    </h4>
-
-    <br />
-    <br />
-
-    <ul>
-        <li>
-            <a href="/docs">
-                The Kubernetes documentation
-            </a>
-        </li>
-        <li>
-            <a href="/blog">
-                The Kubernetes blog
-            </a>
-        </li>
-        <li>
-            <a href="/community">
-                The Kubernetes community
-            </a>
-        </li>
+<section id="error-404" class="error-details">
+    <p>
+    {{ T "error_404_were_you_looking_for" }}
+    </p>
+    <ul id="error-sections">
+        {{ $sections := slice "docs" "blog" "training" "partners" "community" "case-studies" }}
+        {{ range $sections }}
+        {{ with site.GetPage "section" . }}<li><a href="{{ .RelPermalink }}" data-proofer-ignore>{{ .Title }}</a></li>{{ end }}
+        {{ end }}
     </ul>
-</div>
+</section>
 {{ end }}