Display warning level summary. #37

static/cranefly/css/cranefly.css

@@ -978,6 +978,12 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{color:#333;text-decoration:n
 .user-profile .user-details .label{font-size:14px}
 .user-profile .user-list .user-cell{overflow:auto}.user-profile .user-list .user-cell .user-avatar{float:left}.user-profile .user-list .user-cell .user-avatar img{border-radius:3px;width:36px;height:36px}
 .user-profile .user-list .user-cell .user-name:link,.user-profile .user-list .user-cell .user-name:active,.user-profile .user-list .user-cell .user-name:visited,.user-profile .user-list .user-cell .user-name:hover{display:block;margin:0;margin-left:43px;margin-top:9.1px;color:#333;font-size:23.8px}
+.user-profile .warning-level{border:1px solid #555;border-radius:5px;margin-bottom:20px;padding:7px 14px;overflow:auto}.user-profile .warning-level h3,.user-profile .warning-level .lead{margin:0}
+.user-profile .warning-level.warning-active{border-color:#cf402e;color:#cf402e}.user-profile .warning-level.warning-active h3{font-size:21px}
+.user-profile .warning-level.warning-active .lead{font-size:17.5px}
+.user-profile .warning-level.warning-active .warning-expiration{clear:both;margin-top:10px;padding:0;font-size:11.9px}
+.user-profile .warning-level.warning-clean{border-color:#46a546;color:#46a546}.user-profile .warning-level.warning-clean h3{float:left;margin:0;margin-right:14px;padding:2.8px 14px}
+.user-profile .warning-level.warning-clean .lead{float:left;margin:0;padding:7px 0}
 .user-profile .content-list .media{overflow:auto}.user-profile .content-list .media .media-object{border-radius:3px;width:52px;height:52px}
 .user-profile .content-list .media .media-body{margin-left:66px}.user-profile .content-list .media .media-body .post-preview:link,.user-profile .content-list .media .media-body .post-preview:active,.user-profile .content-list .media .media-body .post-preview:visited,.user-profile .content-list .media .media-body .post-preview:hover{display:block;margin-top:7px;color:#333;font-size:16.8px;text-decoration:none}
 .user-profile .content-list .media .media-body .media-footer{margin:0;color:#999;font-size:10.5px;font-weight:normal}.user-profile .content-list .media .media-body .media-footer a{color:#555}

static/cranefly/css/cranefly/profiles.less

@@ -65,7 +65,7 @@
       svg {
         position: relative;
         left: 1px;
-      	height: 40px;
+        height: 40px;
         width: 100%;
       }
     }
@@ -123,6 +123,59 @@
     }
   }
 
+  .warning-level {
+    border: 1px solid @gray;
+    border-radius: @borderRadiusLarge;
+    margin-bottom: @baseLineHeight;
+    padding: (@baseFontSize / 2) @baseFontSize;
+    overflow: auto;
+
+    h3, .lead {
+      margin: 0px;
+    }
+
+    &.warning-active {
+      border-color: @red;
+
+      color: @red;
+
+      h3 {
+        font-size: @fontSizeLarge * 1.2;
+      }
+
+      .lead {
+        font-size: @fontSizeLarge;
+      }
+
+      .warning-expiration {
+        clear: both;
+        margin-top: @baseLineHeight / 2;
+        padding: 0px;
+
+        font-size: @fontSizeSmall;
+      }
+    }
+
+    &.warning-clean {
+      border-color: @green;
+
+      color: @green;
+
+      h3 {
+        float: left;
+        margin: 0px;
+        margin-right: @baseFontSize;
+        padding: (@baseFontSize / 5) @baseFontSize;
+      }
+
+      .lead {
+        float: left;
+        margin: 0px;
+        padding: (@baseFontSize / 2) 0px;
+      }
+    }
+  }
+
   .content-list {
     .media {
       overflow: auto;

templates/cranefly/profiles/warnings.html

@@ -4,6 +4,28 @@
 {% block title %}{{ macros.page_title(_('Warnings'), profile.username) }}{% endblock %}
 
 {% block tab %}
+{% if warning_level %}
+<div class="warning-level warning-active">
+  <h3>{{ warning_level.name }}</h3>
+  {% if warning_level.description %}
+  <p class="lead">{{ warning_level.description }}</p>
+  {% endif %}
+  {% if profile.warning_level_update_on %}
+  <p class="warning-expiration">{% trans expires=format_warning_expiration(profile.warning_level_update_on|reldate) %}This warning level will expire {{ expires }}.{% endtrans %}</p>
+  {% else %}
+  <p class="warning-expiration">{% trans %}This warning level will not expire and will have to be decreased manually by forum team member.{% endtrans %}</p>
+  {% endif %}
+</div>
+{% else %}
+<div class="warning-level warning-clean">
+  {% if user.is_authenticated() and user.pk == profile.pk %}
+  <p class="lead"><i class="icon-ok"></i> {% trans username=profile.username %}{{ username }}, your account has no warning level set. Good job!{% endtrans %}</p>
+  {% else %}
+  <p class="lead"><i class="icon-ok"></i> {% trans username=profile.username %}{{ username }}'s account has no warning level set.{% endtrans %}</p>
+  {% endif %}
+</div>
+{% endif %}
+
 <h2>{% if items_total -%}
     {%- trans count=items_total, total=items_total|intcomma, username=profile.username -%}
     {{ username }} received one warning
@@ -14,16 +36,6 @@
     {% trans username=profile.username %}{{ username }} received no warnings{% endtrans %}
     {%- endif %}</h2>
 
-{% if warning_level %}
-<div class="warning-level">
-  EVULZ!
-</div>
-{% else %}
-<div class="warning-level">
-  NOPE!
-</div>
-{% endif %}
-
 {% if items_total %}
 <div class="content-list user-warnings">
   {% for item in items %}
@@ -35,6 +47,11 @@
 {% endif %}
 {% endblock %}
 
+
+{% macro format_warning_expiration(expires) %}
+<strong>{{ expires }}</strong>
+{% endmacro %}
+
 {% macro pager() -%}
 {% if pagination['total'] > 1 %}
 <div class="pagination">