Ver código fonte

[core] Restyle HTTP error pages

Enrico Berti 10 anos atrás
pai
commit
69f24323a0

+ 39 - 0
desktop/core/src/desktop/static/desktop/css/httperrors.css

@@ -0,0 +1,39 @@
+/*
+ Licensed to Cloudera, Inc. under one
+ or more contributor license agreements.  See the NOTICE file
+ distributed with this work for additional information
+ regarding copyright ownership.  Cloudera, Inc. licenses this file
+ to you under the Apache License, Version 2.0 (the
+ "License"); you may not use this file except in compliance
+ with the License.  You may obtain a copy of the License at
+
+     http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+
+body {
+  background-color: #EEE;
+  padding-top: 100px;
+}
+
+.error-code {
+  margin: 0;
+  padding-bottom: 30px;
+  color: #CCC;
+  text-align: center;
+  font-weight: 200;
+  font-size: 150px;
+  line-height: 150px;
+}
+
+.error-box {
+  padding: 20px 35px 20px;
+  margin-bottom: 50px;
+  background: #fff;
+  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
+}

+ 18 - 12
desktop/core/src/desktop/templates/403.mako

@@ -18,20 +18,26 @@
 from django.utils.translation import ugettext as _
 from desktop.views import commonheader, commonfooter
 %>
-${ commonheader(_('Access Forbidden'), "", user) | n,unicode }
+${ commonheader(_('403 - Access forbidden'), "", user) | n,unicode }
 
-  <div class="container-fluid">
-    <div class="row-fluid">
-      <div class="span12 well">
-        <div class="hero-unit">
-          <h1>${_('Access Forbidden (403)')}</h1>
-          <br>
-          <p>${_("Sorry, you don't have permissions to access the page, or your session has expired.")}</p>
-          <br>
-          <p><a class="btn" onclick="history.back()">${ _('Go Back') }</a></p>
-        </div>
-      </div>
+<link rel="stylesheet" href="${ static('desktop/css/httperrors.css') }">
+
+<div class="container-fluid">
+  <div class="row-fluid">
+    <div class="span12 center">
+      <div class="error-code">403</div>
     </div>
   </div>
+  <div class="row-fluid">
+    <div class="span6 offset3 center error-box">
+      <h1>${_('Access forbidden.')}</h1>
+
+      <p>${_("Sorry, you don't have permissions to access the page, or your session has expired.")}</p>
+      <br/>
+      <a href="/home">${ _('Go to My documents') }</a>
+    </div>
+  </div>
+</div>
+
 
 ${ commonfooter(messages) | n,unicode }

+ 18 - 12
desktop/core/src/desktop/templates/403_csrf.mako

@@ -18,20 +18,26 @@
 from django.utils.translation import ugettext as _
 from desktop.views import commonheader, commonfooter
 %>
-${ commonheader(_('CSRF Error'), "", user) | n,unicode }
+${ commonheader(_('403 - CSRF error'), "", user) | n,unicode }
 
-  <div class="container-fluid">
-    <div class="row-fluid">
-      <div class="span12 well">
-        <div class="hero-unit">
-          <h1>${_('CSRF Error (403)')}</h1>
-          <br>
-          <p>${_("Sorry, your session is invalid or has expired. Please go back, refresh the page, and try your submission again.")}</p>
-          <br>
-          <p><a class="btn" onclick="history.back()">${ _('Go Back') }</a></p>
-        </div>
-      </div>
+<link rel="stylesheet" href="${ static('desktop/css/httperrors.css') }">
+
+<div class="container-fluid">
+  <div class="row-fluid">
+    <div class="span12 center">
+      <div class="error-code">403</div>
     </div>
   </div>
+  <div class="row-fluid">
+    <div class="span6 offset3 center error-box">
+      <h1>${_('CSRF error.')}</h1>
+
+      <p>${_("Sorry, your session is invalid or has expired. Please go back, refresh the page, and try your submission again.")}</p>
+      <br/>
+      <a class="pointer" onclick="history.back()">${ _('Go back') }</a>
+    </div>
+  </div>
+</div>
+
 
 ${ commonfooter(messages) | n,unicode }

+ 17 - 9
desktop/core/src/desktop/templates/404.mako

@@ -17,17 +17,25 @@
 from desktop.views import commonheader, commonfooter
 from django.utils.translation import ugettext as _
 %>
-${ commonheader(_('Not Found'), "", user) | n,unicode }
+${ commonheader(_('404 - Page not found'), "", user) | n,unicode }
 
-  <div class="container-fluid">
-    <div class="row-fluid">
-      <div class="span12 well">
-        <div class="hero-unit">
-          <h1>${_('Page not found.')}</h1>
-          <p>${_("We're sorry, but the requested page could not be found:")} <code>${uri}</code></p>
-        </div>
-      </div>
+<link rel="stylesheet" href="${ static('desktop/css/httperrors.css') }">
+
+<div class="container-fluid">
+  <div class="row-fluid">
+    <div class="span12 center">
+      <div class="error-code">404</div>
+    </div>
+  </div>
+  <div class="row-fluid">
+    <div class="span6 offset3 center error-box">
+      <h1>${_('Page not found.')}</h1>
+
+      <p>${_("We're sorry, but the requested page could not be found:")} <code>${uri}</code></p>
+      <br/>
+      <a href="/home">${ _('Go to My documents') }</a>
     </div>
   </div>
+</div>
 
 ${ commonfooter(messages) | n,unicode }

+ 60 - 49
desktop/core/src/desktop/templates/500.mako

@@ -20,59 +20,70 @@ from desktop.views import commonheader, commonfooter
 from django.utils.translation import ugettext as _
 %>
 
-${ commonheader(_('Error'), "", user) | n,unicode }
+${ commonheader(_('500 - Server error'), "", user) | n,unicode }
 
- <div class="container-fluid">
-    <div class="row-fluid">
-      <div class="span12 well">
-        <div class="hero-unit">
-          <h1>${_('Server Error (500)')}</h1>
-          <p>${_("Sorry, there's been an error. An email was sent to your administrators. Thank you for your patience.")}</p>
-          <div class="details">
-          % if traceback:
-            <a href="javascript:toggleDisplay('#traceback');" title="${ _('See the stacktrace') }"><i class="fa fa-share"></i> ${_('More Info')}</a>
-            % if user.is_superuser:
-              &nbsp;
-              <a href="/logs" target="_new" title="${ _('View server logs') }"><i class="fa fa-tasks"></i> ${_('View Logs')}</a>
-            % endif
-            <br />
-            <br />
-            <div id="traceback" class="hide">
-              <table class="table table-striped" style="background: white; border: 1px solid #DDDDDD;">
-                <thead>
-                  <tr>
-                    <td>${_("File Name")}</td>
-                    <td>${_("Line Number")}</td>
-                  <td>${_("Function Name")}</td>
-                  </tr>
-                </thead>
-                <tbody>
-                  % for (file_name, line_number, function_name, text) in traceback:
-                    <tr>
-                      <td>${smart_unicode(file_name) or ""}</td>
-                      <td>${smart_unicode(line_number) or ""}</td>
-                      <td>${smart_unicode(function_name) or ""}</td>
-                    </tr>
-                  % endfor
-                </tbody>
-              </table>
-            </div>
-          % else:
-            % if user.is_superuser:
-              <a href="/logs" target="_new" title="${ _('View server logs') }"><i class="fa fa-tasks"></i> ${_('View Logs')}</a>
-            % endif
-          % endif
-          </div>
-        </div>
-      </div>
+
+<link rel="stylesheet" href="${ static('desktop/css/httperrors.css') }">
+
+<div class="container-fluid">
+  <div class="row-fluid">
+    <div class="span12 center">
+      <div class="error-code">500</div>
     </div>
   </div>
+  <div class="row-fluid">
+    <div class="
+    % if traceback:
+    span8 offset2
+    % else:
+    span6 offset3
+    % endif
+    center error-box">
+      <h1>${_('Server error.')}</h1>
+
+      <p>${_("Sorry, there's been an error. An email was sent to your administrators. Thank you for your patience.")}</p>
+      <br/>
 
+      % if traceback:
+        <a href="javascript:toggleDisplay('#traceback');" title="${ _('See the stacktrace') }">${_('More info...')}</a>
+        % if user.is_superuser:
+          &nbsp;|&nbsp;
+          <a href="/logs" target="_new" title="${ _('View server logs') }">${_('View logs')}</a>
+        % endif
+        <div id="traceback" class="hide">
+          <table class="table table-striped table-condensed margin-top-30" style="background: white; border: 1px solid #DDDDDD;">
+            <thead>
+              <tr>
+                <td>${_("File Name")}</td>
+                <td>${_("Line Number")}</td>
+              <td>${_("Function Name")}</td>
+              </tr>
+            </thead>
+            <tbody>
+              % for (file_name, line_number, function_name, text) in traceback:
+                <tr>
+                  <td>${smart_unicode(file_name) or ""}</td>
+                  <td>${smart_unicode(line_number) or ""}</td>
+                  <td>${smart_unicode(function_name) or ""}</td>
+                </tr>
+              % endfor
+            </tbody>
+          </table>
+        </div>
+      % else:
+        % if user.is_superuser:
+          <a href="/logs" target="_blank" title="${ _('View server logs') }">${_('View logs')}</a>
+        % endif
+      % endif
+
+    </div>
+  </div>
+</div>
 
-  <script type="text/javascript">
-    function toggleDisplay(selector) {
-      $(selector).slideToggle(500);
-    }
-  </script>
+<script type="text/javascript">
+  function toggleDisplay(selector) {
+    $(selector).slideToggle(500);
+  }
+</script>
 
 ${ commonfooter(messages) | n,unicode }