Error pages updated

static/cranefly/css/cranefly.css

@@ -875,6 +875,11 @@ footer .breadcrumb li.active{color:#555555;}
 .messages-list .alert-info{text-shadow:0px 1px 0px #0b516e;}
 .messages-list .alert-success{text-shadow:0px 1px 0px #2e572e;}
 .messages-list .alert-error{text-shadow:0px 1px 0px #742c23;}
+.error-page{text-align:center;}.error-page .error-color{color:#cf402e;}
+.error-page .error-ban-reason{border:1px solid #cf402e;border-radius:3px;background-color:#fbeeed;background-image:repeating-linear-gradient(45deg, transparent, transparent 5px, #fdf6f5 5px, #fdf6f5 10px);-webkit-box-shadow:0px 0px 0px 3px #e38b80;-moz-box-shadow:0px 0px 0px 3px #e38b80;box-shadow:0px 0px 0px 3px #e38b80;padding:11px 19px;text-align:left;}.error-page .error-ban-reason :last-child{margin-bottom:0px;padding-bottom:0px;}
+.error-page .error-ban-expires{color:#cf402e;font-weight:bold;}
+.error-page .error-protips{margin-top:40px;}.error-page .error-protips a:link,.error-page .error-protips a:visited{background-color:#333333;border:1px solid #000000;border-radius:5px;margin:2px 10px;opacity:0.7;filter:alpha(opacity=70);padding:11px 19px;color:#ffffff;font-weight:bold;text-decoration:none;}
+.error-page .error-protips a:hover,.error-page .error-protips a:active{opacity:1;filter:alpha(opacity=100);}
 .index-sidebar{position:relative;bottom:9px;}
 .index-category{background-color:#ffffff;border:1px solid #d5d5d5;border-radius:2px;-webkit-box-shadow:0px 0px 0px 3px #eeeeee;-moz-box-shadow:0px 0px 0px 3px #eeeeee;box-shadow:0px 0px 0px 3px #eeeeee;margin-bottom:20px;}.index-category table{margin:0px;}.index-category table caption{background-color:#3c85a3;border:1px solid #357691;border-radius:2px 2px 0px 0px;margin:-1px;padding:2px 10px;color:#ffffff;font-size:11.9px;font-weight:bold;text-align:left;text-shadow:0px 1px 0px #1a3946;}
 .index-category table .forum-icon{width:1%;}.index-category table .forum-icon .forum-icon-wrap{background-color:#8c8c8c;border:1px solid #737373;border-radius:3px;padding:3px 4px;}.index-category table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#0088cc;border:1px solid #006699;}

static/cranefly/css/cranefly.less

@@ -69,6 +69,7 @@
 @import "cranefly/navbar.less";
 @import "cranefly/breadcrumbs.less";
 @import "cranefly/messages.less";
+@import "cranefly/error.less";
 @import "cranefly/index.less";
 
 // Keep ranks last for easy overrides!

static/cranefly/css/cranefly/error.less

@@ -0,0 +1,52 @@
+// Error pages
+// -------------------------
+
+.error-page {
+	text-align: center;
+
+	.error-color {
+		color: @red;
+	}
+
+	.error-ban-reason {
+		border: 1px solid @red;
+		border-radius: @baseBorderRadius;
+		background-color: lighten(@red, 46%);
+		background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, lighten(@red, 48%) 5px, lighten(@red, 48%) 10px);
+		.box-shadow(0px 0px 0px 3px lighten(@red, 20%));
+		padding: @paddingLarge;
+
+		text-align: left;
+
+		:last-child {
+			margin-bottom: 0px;
+			padding-bottom: 0px;
+		}
+	}
+
+	.error-ban-expires {
+		color: @red;
+		font-weight: bold;
+	}
+
+	.error-protips {
+		margin-top: (@baseLineHeight * 2);
+
+		a:link, a:visited {
+			background-color: @textColor;
+			border: 1px solid @black;
+			border-radius: @borderRadiusLarge;
+			margin: @paddingSmall;
+			.opacity(70);
+			padding: @paddingLarge;
+
+			color: @white;
+			font-weight: bold;
+			text-decoration: none;
+		}
+
+		a:hover, a:active {
+			.opacity(100);
+		}
+	}
+}

templates/cranefly/error403.html

@@ -1,24 +1,25 @@
 {% extends "cranefly/layout.html" %}
 {% load i18n %}
 {% load url from future %}
+{% import "cranefly/macros.html" as macros with context %}
 
-{% block title %}{% trans %}Permission denied{% endtrans %} | {{ settings.board_name }}{% endblock %}
+{% block title %}{{ macros.page_title(title=_('Error')) }}{% endblock %}
       
 {% block content %}
 <div class="row">
-  <div class="span8 offset2 side-bar">
+  <div class="span6 offset3 error-page">
     <div class="page-header">
-      <h1>{% trans %}Permission denied{% endtrans %} <small>{% trans %}Error 403{% endtrans %}</small></h1>
+      <h1><span class="error-color">403</span> {% trans %}Permission Denied{% endtrans %}</h1>
     </div>
     {% if message %}
     <p class="lead">{{ message }}</p>
     {% else %}
     <p class="lead">{% trans %}You dont have permission to see this page.{% endtrans %}</p>
     {% endif %}
-    <ul class="unstyled">
-      <li><i class="icon-arrow-left"></i> <a href="#" class="go-back">{% trans %}Return to previous page{% endtrans %}</a></li>
-      <li><i class="icon-home"></i> <a href="{% url 'index' %}">{% trans %}Return to board index{% endtrans %}</a></li>
-    </ul>
+    <div class="error-protips">
+      <a href="#" class="go-back"><i class="icon-arrow-left icon-white"></i> {% trans %}Return to previous page{% endtrans %}</a>
+      <a href="{% url 'index' %}"><i class="icon-home icon-white"></i> {% trans %}Return to board index{% endtrans %}</a>
+    </div>
   </div>
 </div>
 {% endblock %}

templates/cranefly/error403_banned.html

@@ -3,35 +3,40 @@
 {% load url from future %}
 {% import "cranefly/macros.html" as macros with context %}
 
-{% block title %}{{ macros.page_title(title=_('You are banned')) }}{% endblock %}
+{% block title %}{{ macros.page_title(title=_('Error')) }}{% endblock %}
       
 {% block content %}
 <div class="row">
-  <div class="span8 offset2 side-bar">
+  <div class="span6 offset3 error-page">
     <div class="page-header">
-      <h1>{% trans %}You are banned{% endtrans %}</h1>
+      <h1><span class="error-color">403</span> {% trans %}You Are Banned{% endtrans %}</h1>
     </div>
     {% if banned_user %}
-    {% if ban.reason_user %}
-    <p class="lead">{% trans username=banned_user.username %}{{ username }}, your account has been banned for following reason:{% endtrans %}</p>
-    {{ ban.reason_user|markdown|safe }}
+      {% if ban.reason_user %}
+      <p class="lead">{% trans username=banned_user.username %}{{ username }}, your account has been banned for following reason:{% endtrans %}</p>
+      {% else %}
+      <p class="lead">{% trans username=banned_user.username %}{{ username }}, your account has been banned.{% endtrans %}</p>
+      {% endif %}
     {% else %}
-    <p class="lead">{% trans username=banned_user.username %}{{ username }}, your account has been banned.{% endtrans %}</p>
+      {% if ban.reason_user %}
+      <p class="lead">{% trans %}Guest, your IP Address has been banned from accessing this page for following reason:{% endtrans %}</p>
+      {% else %}
+      <p class="lead">{% trans %}Guest, your IP Address has been banned from accessing this page.{% endtrans %}</p>
+      {% endif %}
     {% endif %}
-    {% else %}
     {% if ban.reason_user %}
-    <p class="lead">{% trans %}Guest, your IP Address has been banned from accessing this page for following reason:{% endtrans %}</p>
-    {{ ban.reason_user|markdown|safe }}
-    {% else %}
-    <p class="lead">{% trans %}Guest, your IP Address has been banned from accessing this page.{% endtrans %}</p>
-    {% endif %}
-    {% endif %}
-    {% if ban.expires %}
-    <p>{% trans ban_expires=ban.expires|date %}Your ban will expire on {{ ban_expires }}{% endtrans %}</p>
+    <div class="error-ban-reason">
+      {{ ban.reason_user|markdown|safe }}
+      {% if ban.expires %}
+      <p class="error-ban-expires">{% trans ban_expires=ban.expires|date %}Your ban will expire on {{ ban_expires }}{% endtrans %}</p>
+      {% endif %}
+    </div>
+    {% elif ban.expires %}
+    <p class="error-ban-expires">{% trans ban_expires=ban.expires|date %}Your ban will expire on {{ ban_expires }}{% endtrans %}</p>
     {% endif %}
-    <ul class="unstyled">
-      <li><i class="icon-home"></i> <a href="{% url 'index' %}">{% trans %}Return to board index{% endtrans %}</a></li>
-    </ul>
+    <div class="error-protips">
+      <a href="{% url 'index' %}"><i class="icon-home icon-white"></i> {% trans %}Return to board index{% endtrans %}</a>
+    </div>
   </div>
 </div>
 {% endblock %}

templates/cranefly/error404.html

@@ -1,24 +1,25 @@
 {% extends "cranefly/layout.html" %}
 {% load i18n %}
 {% load url from future %}
+{% import "cranefly/macros.html" as macros with context %}
 
-{% block title %}{% trans %}Page not found{% endtrans %} | {{ settings.board_name }}{% endblock %}
+{% block title %}{{ macros.page_title(title=_('Error')) }}{% endblock %}
       
 {% block content %}
 <div class="row">
-  <div class="span8 offset2 side-bar">
+  <div class="span6 offset3 error-page">
     <div class="page-header">
-      <h1>{% trans %}Page not found{% endtrans %} <small>{% trans %}Error 404{% endtrans %}</small></h1>
+      <h1><span class="error-color">404</span> {% trans %}Page Not Found{% endtrans %}</h1>
     </div>
     {% if message %}
     <p class="lead">{{ message }}</p>
     {% else %}
     <p class="lead">{% trans %}The page you are looking for could not be found.{% endtrans %}</p>
     {% endif %}
-    <ul class="unstyled">
-      <li><i class="icon-arrow-left"></i> <a href="#" class="go-back">{% trans %}Return to previous page{% endtrans %}</a></li>
-      <li><i class="icon-home"></i> <a href="{% url 'index' %}">{% trans %}Return to board index{% endtrans %}</a></li>
-    </ul>
+    <div class="error-protips">
+      <a href="#" class="go-back"><i class="icon-arrow-left icon-white"></i> {% trans %}Return to previous page{% endtrans %}</a>
+      <a href="{% url 'index' %}"><i class="icon-home icon-white"></i> {% trans %}Return to board index{% endtrans %}</a>
+    </div>
   </div>
 </div>
 {% endblock %}