Merge pull request #158 from springload/fix/404-basic-styling

Basic 404 page styling

cdhweb/static_src/global/pages/error-page.scss

@@ -0,0 +1,8 @@
+.error-page__content {
+  // big space because page has no hero area
+  margin-block: 120px;
+}
+
+.error-page__blurb {
+  margin-block-start: 20px;
+}

cdhweb/static_src/styles.scss

@@ -34,6 +34,7 @@
 @import './global/pages/search.scss';
 @import './global/pages/projects-landing.scss';
 @import './global/pages/project-page.scss';
+@import './global/pages/error-page.scss';
 
 // Spacing between each type of typographic element.
 @import './global/rich-text';

templates/404.html

@@ -5,7 +5,3 @@
 
 {% block error-code %}{{ error_code|default:'404' }}{% endblock %}
 {% block message %}{{ message|default:"We can’t seem to find the page you’re looking for." }}{% endblock %}
-
-{% block error-image %}
-    <img src="{% static 'img/cdh-logo-assets/CDH_logo_notfound.svg' %}" alt="CDH logo with text faded and the words can't find it overlaid">
-{% endblock %}

templates/error_base.html

@@ -4,12 +4,10 @@
 {% block page-title %}Error{% endblock %}
 
 {% block main %}
-<article class="error-page">
-    <h1>{% block error-code %}{% endblock %}</h1>
-    <p>{% block message %}{% endblock %}</p>
-    {% block error-image %}
-    <img src="{% static 'img/cdh-logo-assets/CDH_logo_warped.svg' %}" alt="warped version of CDH logo">
-    {% endblock %}
-</article>
-
+<div class="content-width grid-standard page-layout page-layout--without-sidenav error-page__content">
+    <div class="page-layout__main-content">
+        <h1>Error {% block error-code %}{% endblock %}</h1>
+        <p class="error-page__blurb">{% block message %}{% endblock %}</p>
+    </div>
+</div>
 {% endblock %}