Merge pull request #3577 from edx/frances/fix/404-and-500-page-layout

Fix for Studio 404 and 500 page layouts
STUD-864

cms/static/sass/elements/_header.scss

@@ -280,7 +280,8 @@
 // ====================
 
 // CASE: user not signed in
-.not-signedin {
+.not-signedin,
+.view-util {
 
   .wrapper-header {
 

cms/static/sass/views/_account.scss

 // studio - views - sign up/in
 // ====================
 
-.view-signup, .view-signin {
+.view-signup,
+.view-signin,
+.view-util {
 
   .wrapper-content {
     margin: ($baseline*1.5) 0 0 0;

cms/templates/404.html

 <%! from django.utils.translation import ugettext as _ %>
 <%inherit file="base.html" />
 <%block name="title">${_("Page Not Found")}</%block>
+<%block name="bodyclass">view-util util-404</%block>
 
-<%block name="content">
 
+<%block name="content">
 <div class="wrapper-content wrapper">
   <section class="content">
-
-    <h1>${_("Page not found")}</h1>
-    <p>${_('The page that you were looking for was not found.')}
+    <header>
+      <h1 class="title title-1">${_("Page not found")}</h1>
+    </header>
+    <article class="content-primary" role="main">
+      <p>${_('The page that you were looking for was not found.')}
        ${_('Go back to the {homepage} or let us know about any pages that may have been moved at {email}.').format(
             homepage='<a href="/">homepage</a>',
             email=u'<a href="mailto:{address}">{address}</a>'.format(
                 address=settings.TECH_SUPPORT_EMAIL,
             ))}
-    </p>
+      </p>
+    </article>
   </section>
 </div>
-
 </%block>

cms/templates/500.html

 <%! from django.utils.translation import ugettext as _ %>
 <%inherit file="base.html" />
-
 <%block name="title">${_("Studio Server Error")}</%block>
+<%block name="bodyclass">view-util util-500</%block>
 
 <%block name="content">
-
 <div class="wrapper-content wrapper">
   <section class="content">
-    <h1>${_("The <em>Studio</em> servers encountered an error")}</h1>
-    <p>
-      ${_("An error occurred in Studio and the page could not be loaded. Please try again in a few moments.")}
-      ${_("We've logged the error and our staff is currently working to resolve this error as soon as possible.")}
-      ${_('If the problem persists, please email us at {email_link}.').format(
-            email_link=u'<a href="mailto:{email_address}">{email_address}</a>'.format(
-                email_address=settings.TECH_SUPPORT_EMAIL,
-            )
-        )}
-    </p>
+    <header>
+      <h1 class="title title-1">${_("The <em>Studio</em> servers encountered an error")}</h1>
+    </header>
+    <article class="content-primary" role="main">
+      <p>
+        ${_("An error occurred in Studio and the page could not be loaded. Please try again in a few moments.")}
+        ${_("We've logged the error and our staff is currently working to resolve this error as soon as possible.")}
+        ${_('If the problem persists, please email us at {email_link}.').format(
+              email_link=u'<a href="mailto:{email_address}">{email_address}</a>'.format(
+                  email_address=settings.TECH_SUPPORT_EMAIL,
+              )
+          )}
+      </p>
+    </article>
   </section>
 </div>
-
 </%block>