Made threads lists 2-row. #104

static/cranefly/css/cranefly.css

@@ -1021,7 +1021,7 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .forum-map-category.forum-map-category-inverse .header{background-color:#333333;border:1px solid #1a1a1a;}.forum-map-category.forum-map-category-inverse .header h2{color:#eeeeee;text-shadow:0px 1px 0px #000000;}.forum-map-category.forum-map-category-inverse .header h2 small{color:#b3b3b3;text-shadow:none;}
 .forum-map-category.forum-map-category-info .header{background-color:#3c85a3;border:1px solid #2e677e;}.forum-map-category.forum-map-category-info .header h2{color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.forum-map-category.forum-map-category-info .header h2 small{color:#1a3946;text-shadow:none;}
 .watched-threads .thread-last-reply{border-left:none !important;padding-left:0px !important;}
-.watched-threads .thread-options{float:right;overflow:auto;position:relative;bottom:2px;}.watched-threads .thread-options form{display:inline-block;float:left;margin:0px;padding:0px;overflow:auto;}.watched-threads .thread-options form .btn{float:right;padding:3px 5px;padding-bottom:0px;margin-left:16px;}
+.watched-threads .thread-options{float:right;overflow:auto;position:relative;top:8px;}.watched-threads .thread-options form{display:inline-block;float:left;margin:0px;padding:0px;overflow:auto;}.watched-threads .thread-options form .btn{float:right;padding:3px 5px;padding-bottom:0px;margin-left:16px;}
 .user-alerts td{vertical-align:middle;}.user-alerts td.alert-icon .label{background-color:#555555;border:1px solid #2f2f2f;border-radius:3px;padding:4px;padding-top:3px;}.user-alerts td.alert-icon .label i{background-image:url("../img/glyphicons-halflings-white.png");}
 .user-alerts td.alert-icon .label.label-warning{background-color:#cf402e;border:1px solid #902d20;}
 .user-alerts td.alert-message{color:#555555;font-size:16.8px;}.user-alerts td.alert-message a:link,.user-alerts td.alert-message a:visited{color:#333333;font-weight:bold;}
@@ -1085,7 +1085,7 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .forum-threads-list .header .row-fluid .thread-replies{float:left;width:106px;}
 .forum-threads-list .header .row-fluid .thread-last{float:left;}
 .forum-threads-list .header .check-cell label{margin:0px;}
-.forum-threads-list .thread-row{border-bottom:1px solid #d5d5d5;height:24px;overflow:hidden;padding:9.9px 0px;}.forum-threads-list .thread-row .row-fluid>div{min-height:auto;padding:2px 10px;padding-bottom:0px;}
+.forum-threads-list .thread-row{border-bottom:1px solid #d5d5d5;height:38px;overflow:hidden;padding:9.9px 0px;}.forum-threads-list .thread-row .row-fluid>div{min-height:auto;padding:2px 10px;padding-bottom:0px;}
 .forum-threads-list .thread-row.thread-last{border-bottom:none;}.forum-threads-list .thread-row.thread-last>div{padding-bottom:1px;}
 .forum-threads-list .thread-row .thread-icon{background-color:#555555;border:1px solid #3b3b3b;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;display:block;float:left;margin:-2px 0px;margin-left:-1px;padding:1px 4px;}.forum-threads-list .thread-row .thread-icon:hover,.forum-threads-list .thread-row .thread-icon:active{opacity:1;filter:alpha(opacity=100);}
 .forum-threads-list .thread-row .thread-icon i{background-image:url("../img/glyphicons-halflings-white.png");}
@@ -1093,13 +1093,20 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .forum-threads-list .thread-row.thread-new .thread-name{color:#333333 !important;}
 .forum-threads-list .thread-row.threads-list-empty{padding:11px 19px;font-size:17.5px;text-align:center;}
 .forum-threads-list .thread-row .thread-name{margin-left:10px;color:#5e5e5e;font-size:16px;font-weight:bold;}
-.forum-threads-list .thread-row .thread-details,.forum-threads-list .thread-row .thread-last-reply{color:#999999;}.forum-threads-list .thread-row .thread-details a:link,.forum-threads-list .thread-row .thread-last-reply a:link,.forum-threads-list .thread-row .thread-details a:visited,.forum-threads-list .thread-row .thread-last-reply a:visited{color:#333333;}
-.forum-threads-list .thread-row .thread-details{font-size:10.5px;}
-.forum-threads-list .thread-row .thread-flags{float:right;margin:0px;padding:0px;position:relative;right:-26px;}.forum-threads-list .thread-row .thread-flags li{float:left;margin-left:3px;}
-.forum-threads-list .thread-row .thread-activity{border-left:1px dotted #e0e0e0;color:#999999;}.forum-threads-list .thread-row .thread-activity a:link,.forum-threads-list .thread-row .thread-activity a:active,.forum-threads-list .thread-row .thread-activity a:visited,.forum-threads-list .thread-row .thread-activity a:hover{color:#555555;font-weight:bold;}
-.forum-threads-list .thread-row .thread-activity .thread-replies{float:left;margin-right:14px;opacity:0.6;filter:alpha(opacity=60);width:76px;color:#333333;font-size:17.5px;font-weight:bold;text-align:right;}.forum-threads-list .thread-row .thread-activity .thread-replies i{position:relative;top:2px;}
-.forum-threads-list .thread-row .thread-activity .thread-last-reply{border-left:1px dotted #e0e0e0;float:left;padding-left:14px;}.forum-threads-list .thread-row .thread-activity .thread-last-reply .thread-last-avatar img{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;margin:-6px 0px;position:relative;bottom:1px;width:28px;height:28px;}
-.forum-threads-list .thread-row .thread-activity .thread-select{background-color:#f2f2f2;display:block;float:right;margin:-12px -11px;margin-left:0px;width:29px;height:44px;}.forum-threads-list .thread-row .thread-activity .thread-select:hover,.forum-threads-list .thread-row .thread-activity .thread-select:focus,.forum-threads-list .thread-row .thread-activity .thread-select:active{background-color:#0088cc;}
+.forum-threads-list .thread-row .thread-details,.forum-threads-list .thread-row .thread-last-reply{color:#999999;line-height:14px;}.forum-threads-list .thread-row .thread-details a:link,.forum-threads-list .thread-row .thread-last-reply a:link,.forum-threads-list .thread-row .thread-details a:visited,.forum-threads-list .thread-row .thread-last-reply a:visited{color:#333333;}
+.forum-threads-list .thread-row .thread-details{margin-left:34px;font-size:10.5px;}
+.forum-threads-list .thread-row .thread-flags{float:right;margin:0px;position:relative;right:-30px;top:5px;padding:0px;}.forum-threads-list .thread-row .thread-flags li{border:1px solid #555555;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;display:block;float:left;margin-left:3px;padding:1px 4px;}.forum-threads-list .thread-row .thread-flags li.flag-reported{background-color:#f89406;border-color:#c67605;}
+.forum-threads-list .thread-row .thread-flags li.flag-notreviewed{background-color:#7a43b6;border-color:#613591;}
+.forum-threads-list .thread-row .thread-flags li.flag-announcement{background-color:#049cdb;border-color:#0378a9;}
+.forum-threads-list .thread-row .thread-flags li.flag-sticky{background-color:#3c85a3;border-color:#2e677e;}
+.forum-threads-list .thread-row .thread-flags li.flag-deleted{background-color:#333333;border-color:#1a1a1a;}
+.forum-threads-list .thread-row .thread-flags li.flag-closed{background-color:#cf402e;border-color:#a53325;}
+.forum-threads-list .thread-row .thread-flags i{background-image:url("../img/glyphicons-halflings-white.png");}
+.forum-threads-list .thread-row .thread-activity{border-left:1px dotted #e0e0e0;position:relative;bottom:3px;}.forum-threads-list .thread-row .thread-activity .thread-last-avatar{float:left;}.forum-threads-list .thread-row .thread-activity .thread-last-avatar img{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;margin:0px;margin-right:14px;width:40px;height:40px;}
+.forum-threads-list .thread-row .thread-activity .thread-replies{float:left;margin-top:-1px;margin-right:14px;color:#999999;font-size:11.9px;}.forum-threads-list .thread-row .thread-activity .thread-replies .lead{font-size:14px;font-weight:bold;line-height:20px;}
+.forum-threads-list .thread-row .thread-activity .thread-replies a:link,.forum-threads-list .thread-row .thread-activity .thread-replies a:active,.forum-threads-list .thread-row .thread-activity .thread-replies a:visited,.forum-threads-list .thread-row .thread-activity .thread-replies a:hover{color:#555555;}
+.forum-threads-list .thread-row .thread-activity .thread-last-reply{border-left:1px dotted #e0e0e0;padding-left:14px;}
+.forum-threads-list .thread-row .thread-activity .thread-select{background-color:#f2f2f2;display:block;float:right;margin:-12px -11px;margin-left:0px;width:29px;height:60px;}.forum-threads-list .thread-row .thread-activity .thread-select:hover,.forum-threads-list .thread-row .thread-activity .thread-select:focus,.forum-threads-list .thread-row .thread-activity .thread-select:active{background-color:#0088cc;}
 .forum-threads-list .thread-row .thread-activity .thread-select input{margin:0px;position:relative;right:2px;top:16px;}
 .forum-threads-list .threads-actions{background-color:#fbfbfb;border-top:1px solid #d5d5d5;border-radius:0px 0px 2px 2px;overflow:auto;padding:4px;color:#999999;font-size:11.9px;}.forum-threads-list .threads-actions form{margin-bottom:0px;}
 .forum-threads-extra{overflow:auto;}.forum-threads-extra.extra-top{margin-bottom:20px;}

static/cranefly/css/cranefly/forum.less

@@ -342,7 +342,7 @@
 
   .thread-row {
     border-bottom: 1px solid @categoryBorder;
-    height: 24px;
+    height: 38px;
     overflow: hidden;
     padding: (@fontSizeSmall - 2px) 0px;
 
@@ -409,6 +409,7 @@
 
     .thread-details, .thread-last-reply {
       color: @grayLight;
+      line-height: @baseFontSize;
 
       a:link, a:visited {
         color: @textColor;
@@ -416,64 +417,103 @@
     }
 
     .thread-details {
+      margin-left: 34px;
+
       font-size: @fontSizeMini;
     }
 
     .thread-flags {
       float: right;
       margin: 0px;
-      padding: 0px;
       position: relative;
-      right: -26px;
+      right: -30px;
+      top: 5px;
+      padding: 0px;
 
       li {
+        border: 1px solid @gray;
+        .border-radius(@baseBorderRadius);
+        display: block;
         float: left;
         margin-left: 3px;
+        padding: 1px 4px;
+
+        &.flag-reported {
+          background-color: @flagReported;
+          border-color: darken(@flagReported, 10%);
+        }
+
+        &.flag-notreviewed {
+          background-color: @flagReviewed;
+          border-color: darken(@flagReviewed, 10%);
+        }
+
+        &.flag-announcement {
+          background-color: @flagAnnouncement;
+          border-color: darken(@flagAnnouncement, 10%);
+        }
+
+        &.flag-sticky {
+          background-color: @flagSticky;
+          border-color: darken(@flagSticky, 10%);
+        }
+
+        &.flag-deleted {
+          background-color: @flagDeleted;
+          border-color: darken(@flagDeleted, 10%);
+        }
+
+        &.flag-closed {
+          background-color: @flagClosed;
+          border-color: darken(@flagClosed, 10%);
+        }
+      }
+
+      i {
+        background-image: url("@{iconWhiteSpritePath}");
       }
     }
 
     .thread-activity {
       border-left: 1px dotted darken(@categoryBackground, 12%);
+      position: relative;
+      bottom: 3px;
 
-      color: @grayLight;
+      .thread-last-avatar {
+        float: left;
 
-      a:link, a:active, a:visited, a:hover {
-        color: @gray;
-        font-weight: bold;
+        img {
+          .border-radius(@baseBorderRadius);
+          margin: 0px;
+          margin-right: @baseFontSize;
+          width: 40px;
+          height: 40px;
+        }
       }
 
       .thread-replies {
         float: left;
+        margin-top: -1px;
         margin-right: @baseFontSize;
-        .opacity(60);
-        width: 76px;
 
-        color: @textColor;
-        font-size: @fontSizeLarge;
-        font-weight: bold;
-        text-align: right;
+        color: @grayLight;
+        font-size: @fontSizeSmall;
 
-        i {
-          position: relative;
-          top: 2px;
+        .lead {
+          font-size: @baseFontSize;
+          font-weight: bold;
+          line-height: @baseLineHeight;
+        }
+
+        a:link, a:active, a:visited, a:hover {
+          color: @gray;
         }
       }
 
       .thread-last-reply {
         border-left: 1px dotted darken(@categoryBackground, 12%);
-        float: left;
         padding-left: @baseFontSize;
 
-        .thread-last-avatar {
-          img {
-            .border-radius(@baseBorderRadius);
-            margin: -6px 0px;
-            position: relative;
-            bottom: 1px;
-            width: 28px;
-            height: 28px;
-          }
-        }
       }
 
       .thread-select {
@@ -483,7 +523,7 @@
         margin: -12px -11px;
         margin-left: 0px;
         width: 29px;
-        height: 44px;
+        height: 60px;
 
         &:hover, &:focus, &:active {
           background-color: @linkColor;

static/cranefly/css/cranefly/watchedthreads.less

@@ -11,7 +11,7 @@
     float: right;
     overflow: auto;
     position: relative;
-    bottom: 2px;
+    top: 8px;
 
     form {
       display: inline-block;

static/cranefly/css/variables.less

@@ -86,6 +86,15 @@
 @itemNewColor:                      @red;
 @itemMovedColor:                    lighten(@purple, 10%);
 
+// Thread flags colors
+// -------------------------
+@flagReported:                      @orange;
+@flagReviewed:                      @purple;
+@flagAnnouncement:                  @blue;
+@flagSticky:                        @bluePale;
+@flagDeleted:                       @grayDark;
+@flagClosed:                        @red;
+
 // Board index forums list
 // -------------------------
 @categoryBackground:                lighten(@bodyBackground, 5%);

templates/cranefly/macros.html

@@ -53,4 +53,30 @@ itemprop="breadcrumb"
 
 {% macro wrap(item, wrap, extra='') -%}
 <{{ wrap }}{% if extra %} {{ extra|safe }}{% endif %}>{{ item }}</{{ wrap }}>
+{%- endmacro %}
+
+{% macro thread_flags(thread) -%}
+<ul class="unstyled thread-flags">
+  {% if thread.replies_reported %}
+  <li class="flag-reported"><i class="icon-warning-sign tooltip-top" title="{% trans %}This thread has reported replies{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.replies_moderated %}
+  <li class="flag-notreviewed"><i class="icon-question-sign tooltip-top" title="{% trans %}This thread has unreviewed replies{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.weight == 2 %}
+  <li class="flag-announcement"><i class="icon-star tooltip-top" title="{% trans %}This thread is an annoucement{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.weight == 1 %}
+  <li class="flag-sticky"><i class="icon-star-empty tooltip-top" title="{% trans %}This thread is sticky{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.moderated  %}
+  <li class="flag-notreviewed"><i class="icon-eye-close tooltip-top" title="{% trans %}This thread awaits review{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.deleted %}
+  <li class="flag-deleted"><i class="icon-trash tooltip-top" title="{% trans %}This thread is deleted{% endtrans %}"></i></li>
+  {% endif %}
+  {% if thread.closed %}
+  <li class="flag-closed"><i class="icon-lock tooltip-top" title="{% trans %}This thread is closed{% endtrans %}"></i></li>
+  {% endif %}
+</ul>
 {%- endmacro %}

templates/cranefly/new_threads.html

@@ -18,8 +18,7 @@
       <div class="row-fluid">
         <div class="span7">{% trans %}Thread{% endtrans %}</div>
         <div class="span5 thread-activity">
-          <div class="thread-replies">{% trans %}Replies{% endtrans %}</div>
-          <div class="thread-last">{% trans %}Last Reply{% endtrans %}</div>
+          <div class="thread-replies">{% trans %}Activity{% endtrans %}</div>
         </div>
       </div>
     </div>
@@ -34,49 +33,31 @@
           {% endif %}
 
           <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="thread-name">{{ thread.name }}</a>
-          <span class="thread-details">
-            {% trans user=thread_starter(thread), forum=thread_forum(thread) %}by {{ user }} in {{ forum }}{% endtrans %}
-          </span>
 
-          <ul class="unstyled thread-flags">
-            {% if thread.replies_reported %}
-            <li><i class="icon-warning-sign tooltip-top" title="{% trans %}This thread has reported replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.replies_moderated %}
-            <li><i class="icon-question-sign tooltip-top" title="{% trans %}This thread has unreviewed replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 2 %}
-            <li><i class="icon-star tooltip-top" title="{% trans %}This thread is an annoucement{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 1 %}
-            <li><i class="icon-star-empty tooltip-top" title="{% trans %}This thread is sticky{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.moderated  %}
-            <li><i class="icon-eye-close tooltip-top" title="{% trans %}This thread awaits review{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.deleted %}
-            <li><i class="icon-trash tooltip-top" title="{% trans %}This thread is deleted{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.closed %}
-            <li><i class="icon-lock tooltip-top" title="{% trans %}This thread is closed{% endtrans %}"></i></li>
-            {% endif %}
-          </ul>
+          {{ macros.thread_flags(thread) }}
+          
+          <div class="thread-details">
+            {% trans user=thread_starter(thread), forum=thread_forum(thread), start=thread.start|reltimesince|low %}by {{ user }} in {{ forum }} {{ start }}{% endtrans %}
+          </div>
+
         </div>
         <div class="span5 thread-activity">
-          <div class="thread-replies tooltip-top" title="{{ replies(thread.replies) }}">{{ thread.replies|intcomma }} <i class="icon-comment"></i></div>
 
-          <div class="thread-last-reply">
-            {% if settings.avatars_on_threads_list %}
-            <span class="thread-last-avatar">
-              {% if thread.last_poster_id %}
-              <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(30) }}" alt=""></a>
-              {% else %}
-              <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
-              {% endif %}
-            </span>
+          {% if settings.avatars_on_threads_list %}
+          <div class="thread-last-avatar">
+            {% if thread.last_poster_id %}
+            <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(40) }}" alt=""></a>
+            {% else %}
+            <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
             {% endif %}
-            {{ thread_reply(thread) }}, {{ thread.last|reldate|low }}
           </div>
+          {% endif %}
+
+          <div class="thread-replies">
+            <strong class="lead">{{ thread_reply(thread) }}, {{ thread.last|reldate|low }}</strong><br>
+            {{ replies(thread.replies) }}, <span{% if (thread.upvotes-thread.downvotes) > 0 %} class="text-success"{% elif (thread.upvotes-thread.downvotes) < 0 %} class="text-error"{% endif %}><strong>{% if (thread.upvotes-thread.downvotes) > 0 %}+{% elif (thread.upvotes-thread.downvotes) < 0 %}-{% endif %}</strong>{% trans rating=(thread.upvotes-thread.downvotes)|abs|intcomma %}{{ rating }} thread rating{% endtrans %}</span>
+          </div>
+          
         </div>
       </div>
     </div>

templates/cranefly/popular_threads.html

@@ -18,8 +18,7 @@
       <div class="row-fluid">
         <div class="span7">{% trans %}Thread{% endtrans %}</div>
         <div class="span5 thread-activity">
-          <div class="thread-replies">{% trans %}Replies{% endtrans %}</div>
-          <div class="thread-last">{% trans %}Last Reply{% endtrans %}</div>
+          <div class="thread-replies">{% trans %}Activity{% endtrans %}</div>
         </div>
       </div>
     </div>
@@ -33,50 +32,32 @@
           <a href="{% url 'thread_new' thread=thread.pk, slug=thread.slug %}" class="thread-icon thread-icon-new tooltip-top" title="{% trans %}Click to see first unread post{% endtrans %}"><i class="icon-fire"></i></a>
           {% endif %}
 
+          {{ macros.thread_flags(thread) }}
+
           <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="thread-name">{{ thread.name }}</a>
-          <span class="thread-details">
-            {% trans user=thread_starter(thread), forum=thread_forum(thread) %}by {{ user }} in {{ forum }}{% endtrans %}
-          </span>
+          
+          <div class="thread-details">
+            {% trans user=thread_starter(thread), forum=thread_forum(thread), start=thread.start|reltimesince|low %}by {{ user }} in {{ forum }} {{ start }}{% endtrans %}
+          </div>
 
-          <ul class="unstyled thread-flags">
-            {% if thread.replies_reported %}
-            <li><i class="icon-warning-sign tooltip-top" title="{% trans %}This thread has reported replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.replies_moderated %}
-            <li><i class="icon-question-sign tooltip-top" title="{% trans %}This thread has unreviewed replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 2 %}
-            <li><i class="icon-star tooltip-top" title="{% trans %}This thread is an annoucement{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 1 %}
-            <li><i class="icon-star-empty tooltip-top" title="{% trans %}This thread is sticky{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.moderated  %}
-            <li><i class="icon-eye-close tooltip-top" title="{% trans %}This thread awaits review{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.deleted %}
-            <li><i class="icon-trash tooltip-top" title="{% trans %}This thread is deleted{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.closed %}
-            <li><i class="icon-lock tooltip-top" title="{% trans %}This thread is closed{% endtrans %}"></i></li>
-            {% endif %}
-          </ul>
         </div>
         <div class="span5 thread-activity">
-          <div class="thread-replies tooltip-top" title="{{ replies(thread.replies) }}">{{ thread.replies|intcomma }} <i class="icon-comment"></i></div>
 
-          <div class="thread-last-reply">
-            {% if settings.avatars_on_threads_list %}
-            <span class="thread-last-avatar">
-              {% if thread.last_poster_id %}
-              <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(30) }}" alt=""></a>
-              {% else %}
-              <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
-              {% endif %}
-            </span>
+          {% if settings.avatars_on_threads_list %}
+          <div class="thread-last-avatar">
+            {% if thread.last_poster_id %}
+            <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(40) }}" alt=""></a>
+            {% else %}
+            <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
             {% endif %}
-            {{ thread_reply(thread) }}, {{ thread.last|reldate|low }}
           </div>
+          {% endif %}
+
+          <div class="thread-replies">
+            <strong class="lead">{{ thread_reply(thread) }}, {{ thread.last|reldate|low }}</strong><br>
+            {{ replies(thread.replies) }}, <span{% if (thread.upvotes-thread.downvotes) > 0 %} class="text-success"{% elif (thread.upvotes-thread.downvotes) < 0 %} class="text-error"{% endif %}><strong>{% if (thread.upvotes-thread.downvotes) > 0 %}+{% elif (thread.upvotes-thread.downvotes) < 0 %}-{% endif %}</strong>{% trans rating=(thread.upvotes-thread.downvotes)|abs|intcomma %}{{ rating }} thread rating{% endtrans %}</span>
+          </div>
+
         </div>
       </div>
     </div>

templates/cranefly/private_threads/list.html

@@ -39,8 +39,7 @@
       <div class="row-fluid">
         <div class="span7">{% trans %}Thread{% endtrans %}</div>
         <div class="span5 thread-activity">
-          <div class="thread-replies">{% trans %}Replies{% endtrans %}</div>
-          <div class="thread-last">{% trans %}Last Reply{% endtrans %}</div>
+          <div class="thread-replies">{% trans %}Activity{% endtrans %}</div>
           {% if list_form %}
           <div class="pull-right check-cell">
             <label class="checkbox"><input type="checkbox" class="checkbox-master"></label>
@@ -60,53 +59,35 @@
           {% endif %}
 
           <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="thread-name">{{ thread.name }}</a>
-          <span class="thread-details">
+
+          {{ macros.thread_flags(thread) }}
+
+          <div class="thread-details">
             {% trans user=thread_starter(thread), start=thread.start|reldate|low %}by {{ user }}, {{ start }}{% endtrans %}
-          </span>
+          </div>
 
-          <ul class="unstyled thread-flags">
-            {% if thread.replies_reported %}
-            <li><i class="icon-warning-sign tooltip-top" title="{% trans %}This thread has reported replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.replies_moderated %}
-            <li><i class="icon-question-sign tooltip-top" title="{% trans %}This thread has unreviewed replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 2 %}
-            <li><i class="icon-star tooltip-top" title="{% trans %}This thread is an annoucement{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 1 %}
-            <li><i class="icon-star-empty tooltip-top" title="{% trans %}This thread is sticky{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.moderated  %}
-            <li><i class="icon-eye-close tooltip-top" title="{% trans %}This thread awaits review{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.deleted %}
-            <li><i class="icon-trash tooltip-top" title="{% trans %}This thread is deleted{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.closed %}
-            <li><i class="icon-lock tooltip-top" title="{% trans %}This thread is closed{% endtrans %}"></i></li>
-            {% endif %}
-          </ul>
         </div>
         <div class="span5 thread-activity">
-          <div class="thread-replies tooltip-top" title="{{ replies(thread.replies) }}">{{ thread.replies|intcomma }} <i class="icon-comment"></i></div>
-
-          <div class="thread-last-reply">
-            {% if settings.avatars_on_threads_list %}
-            <span class="thread-last-avatar">
-              {% if thread.last_poster_id %}
-              <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(30) }}" alt=""></a>
-              {% else %}
-              <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
-              {% endif %}
-            </span>
+
+          {% if settings.avatars_on_threads_list %}
+          <div class="thread-last-avatar">
+            {% if thread.last_poster_id %}
+            <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(40) }}" alt=""></a>
+            {% else %}
+            <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
             {% endif %}
-            {{ thread_reply(thread) }}, {{ thread.last|reldate|low }}
+          </div>
+          {% endif %}
+
+          <div class="thread-replies">
+            <strong class="lead">{{ thread_reply(thread) }}, {{ thread.last|reldate|low }}</strong><br>
+            {{ replies(thread.replies) }}, <span{% if (thread.upvotes-thread.downvotes) > 0 %} class="text-success"{% elif (thread.upvotes-thread.downvotes) < 0 %} class="text-error"{% endif %}><strong>{% if (thread.upvotes-thread.downvotes) > 0 %}+{% elif (thread.upvotes-thread.downvotes) < 0 %}-{% endif %}</strong>{% trans rating=(thread.upvotes-thread.downvotes)|abs|intcomma %}{{ rating }} thread rating{% endtrans %}</span>
           </div>
 
           {% if list_form %}
           <label class="thread-select checkbox"><input form="threads_form" name="{{ list_form['list_items']['html_name'] }}" type="checkbox" class="checkbox-member" value="{{ thread.pk }}"{% if list_form['list_items']['has_value'] and ('' ~ thread.pk) in list_form['list_items']['value'] %} checked="checked"{% endif %}></label>
           {% endif %}
+
         </div>
       </div>
     </div>

templates/cranefly/threads/list.html

@@ -116,8 +116,7 @@
       <div class="row-fluid">
         <div class="span7">{% trans %}Thread{% endtrans %}</div>
         <div class="span5 thread-activity">
-          <div class="thread-replies">{% trans %}Replies{% endtrans %}</div>
-          <div class="thread-last">{% trans %}Last Reply{% endtrans %}</div>
+          <div class="thread-replies">{% trans %}Activity{% endtrans %}</div>
           {% if user.is_authenticated() and list_form %}
           <div class="pull-right check-cell">
             <label class="checkbox"><input type="checkbox" class="checkbox-master"></label>
@@ -136,49 +135,30 @@
           <a href="{% url 'thread_new' thread=thread.pk, slug=thread.slug %}" class="thread-icon thread-icon-new tooltip-top" title="{% trans %}Click to see first unread post{% endtrans %}"><i class="icon-fire"></i></a>
           {% endif %}
 
+          {{ macros.thread_flags(thread) }}
+          
           <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="thread-name">{{ thread.name }}</a>
-          <span class="thread-details">
+          
+          <div class="thread-details">
             {% trans user=thread_starter(thread), start=thread.start|reldate|low %}by {{ user }}, {{ start }}{% endtrans %}
-          </span>
+          </div>
 
-          <ul class="unstyled thread-flags">
-            {% if thread.replies_reported %}
-            <li><i class="icon-warning-sign tooltip-top" title="{% trans %}This thread has reported replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.replies_moderated %}
-            <li><i class="icon-question-sign tooltip-top" title="{% trans %}This thread has unreviewed replies{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 2 %}
-            <li><i class="icon-star tooltip-top" title="{% trans %}This thread is an annoucement{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.weight == 1 %}
-            <li><i class="icon-star-empty tooltip-top" title="{% trans %}This thread is sticky{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.moderated  %}
-            <li><i class="icon-eye-close tooltip-top" title="{% trans %}This thread awaits review{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.deleted %}
-            <li><i class="icon-trash tooltip-top" title="{% trans %}This thread is deleted{% endtrans %}"></i></li>
-            {% endif %}
-            {% if thread.closed %}
-            <li><i class="icon-lock tooltip-top" title="{% trans %}This thread is closed{% endtrans %}"></i></li>
-            {% endif %}
-          </ul>
         </div>
         <div class="span5 thread-activity">
-          <div class="thread-replies tooltip-top" title="{{ replies(thread.replies) }}">{{ thread.replies|intcomma }} <i class="icon-comment"></i></div>
 
-          <div class="thread-last-reply">
-            {% if settings.avatars_on_threads_list %}
-            <span class="thread-last-avatar">
-              {% if thread.last_poster_id %}
-              <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(30) }}" alt=""></a>
-              {% else %}
-              <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
-              {% endif %}
-            </span>
+          {% if settings.avatars_on_threads_list %}
+          <div class="thread-last-avatar">
+            {% if thread.last_poster_id %}
+            <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(40) }}" alt=""></a>
+            {% else %}
+            <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
             {% endif %}
-            {{ thread_reply(thread) }}, {{ thread.last|reldate|low }}
+          </div>
+          {% endif %}
+
+          <div class="thread-replies">
+            <strong class="lead">{{ thread_reply(thread) }}, {{ thread.last|reldate|low }}</strong><br>
+            {{ replies(thread.replies) }}, <span{% if (thread.upvotes-thread.downvotes) > 0 %} class="text-success"{% elif (thread.upvotes-thread.downvotes) < 0 %} class="text-error"{% endif %}><strong>{% if (thread.upvotes-thread.downvotes) > 0 %}+{% elif (thread.upvotes-thread.downvotes) < 0 %}-{% endif %}</strong>{% trans rating=(thread.upvotes-thread.downvotes)|abs|intcomma %}{{ rating }} thread rating{% endtrans %}</span>
           </div>
 
           {% if user.is_authenticated() and list_form %}

templates/cranefly/watched.html

@@ -30,7 +30,7 @@
       <div class="row-fluid">
         <div class="span7">{% trans %}Thread{% endtrans %}</div>
         <div class="span5 thread-activity">
-          <div class="thread-last">{% trans %}Last Reply{% endtrans %}</div>
+          <div class="thread-replies">{% trans %}Activity{% endtrans %}</div>
         </div>
       </div>
     </div>
@@ -44,23 +44,29 @@
           <a href="{% url 'thread_new' thread=thread.pk, slug=thread.slug %}" class="thread-icon thread-icon-new tooltip-top" title="{% trans %}Click to see first unread post{% endtrans %}"><i class="icon-fire"></i></a>
           {% endif %}
 
+          {{ macros.thread_flags(thread) }}
+
           <a href="{% url 'thread' thread=thread.pk, slug=thread.slug %}" class="thread-name">{{ thread.name }}</a>
-          <span class="thread-details">
-            {% trans user=thread_starter(thread), forum=thread_forum(thread) %}by {{ user }} in {{ forum }}{% endtrans %}
-          </span>
+
+          <div class="thread-details">
+            {% trans user=thread_starter(thread), forum=thread_forum(thread), start=thread.start|reltimesince|low %}by {{ user }} in {{ forum }} {{ start }}{% endtrans %}
+          </div>
+
         </div>
         <div class="span5 thread-activity">
-          <div class="thread-last-reply">
-            {% if settings.avatars_on_threads_list %}
-            <span class="thread-last-avatar">
-              {% if thread.last_poster_id %}
-              <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(30) }}" alt=""></a>
-              {% else %}
-              <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
-              {% endif %}
-            </span>
+          {% if settings.avatars_on_threads_list %}
+          <div class="thread-last-avatar">
+            {% if thread.last_poster_id %}
+            <a href="{% url 'user' user=thread.last_poster.pk, username=thread.last_poster.username_slug %}"><img src="{{ thread.last_poster.get_avatar(40) }}" alt=""></a>
+            {% else %}
+            <img src="{{ macros.avatar_guest(40) }}" alt="" class="user-avatar">
             {% endif %}
-            {{ thread_reply(thread) }}, {{ thread.last|reldate|low }}
+          </div>
+          {% endif %}
+
+          <div class="thread-replies">
+            <strong class="lead">{{ thread_reply(thread) }}, {{ thread.last|reldate|low }}</strong><br>
+            {{ replies(thread.replies) }}, <span{% if (thread.upvotes-thread.downvotes) > 0 %} class="text-success"{% elif (thread.upvotes-thread.downvotes) < 0 %} class="text-error"{% endif %}><strong>{% if (thread.upvotes-thread.downvotes) > 0 %}+{% elif (thread.upvotes-thread.downvotes) < 0 %}-{% endif %}</strong>{% trans rating=(thread.upvotes-thread.downvotes)|abs|intcomma %}{{ rating }} thread rating{% endtrans %}</span>
           </div>
 
           <div class="thread-options">