Forums lists further redesigned

static/cranefly/css/cranefly.css

@@ -949,13 +949,15 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .markdown .md-img .md-img-span .md-img-wrap .md-img-bg .md-img-error{background:url('../img/img_broken.jpg');border-radius:3px;padding:50px 0px;}.markdown .md-img .md-img-span .md-img-wrap .md-img-bg .md-img-error span{background-color:#333333;border-radius:5px;opacity:0.8;filter:alpha(opacity=80);padding:7px 14px;margin:0px auto;color:#ffffff;text-shadow:0px 1px 0px #000000;}
 .markdown .md-img .md-img-span .md-img-wrap .md-img-label{display:block;padding:7px 14px;text-align:center;color:#999999;font-weight:bold;}.markdown .md-img .md-img-span .md-img-wrap .md-img-label:hover,.markdown .md-img .md-img-span .md-img-wrap .md-img-label:active{color:#ffffff;text-decoration:none;}
 .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 #357690;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{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:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;padding:3.966666666666667px 9.9px;color:#333333;font-size:11.9px;font-weight:bold;text-align:left;}.index-category table caption small{margin-left:7px;color:#999999;font-size:11.9px;}
 .index-category table .forum-icon{width:1%;}.index-category table .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.index-category table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
 .index-category table .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
 .index-category table .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.index-category table .forum-main h3 a:link,.index-category table .forum-main h3 a:visited{color:#333333;}
 .index-category table .forum-main .forum-details{float:right;color:#999999;font-weight:bold;}.index-category table .forum-main .forum-details .label{position:relative;bottom:1px;}
 .index-category table .forum-main .forum-description{clear:both;margin:0px;padding:0px;color:#8c8c8c;font-size:11.9px;}
-.index-category.index-category-important caption{background-color:#cf402e;border:1px solid #ba3a29;text-shadow:0px 1px 0px #672017;}
+.index-category.index-category-important caption{background-color:#cf402e;border:1px solid #a53325;color:#ffffff;text-shadow:0px 1px 0px #672017;}.index-category.index-category-important caption small{color:#280c09;text-shadow:none;}
+.index-category.index-category-inverse caption{background-color:#333333;border:1px solid #1a1a1a;color:#eeeeee;text-shadow:0px 1px 0px #000000;}.index-category.index-category-inverse caption small{color:#b3b3b3;text-shadow:none;}
+.index-category.index-category-info caption{background-color:#3c85a3;border:1px solid #2e677e;color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.index-category.index-category-info caption small{color:#1a3946;text-shadow:none;}
 .index-forums-read-all{margin:0px;padding:0px;}.index-forums-read-all .btn-link{margin:0px;opacity:0.5;filter:alpha(opacity=50);padding:0px;color:#333333;font-weight:bold;}.index-forums-read-all .btn-link:active,.index-forums-read-all .btn-link:hover{opacity:0.9;filter:alpha(opacity=90);}
 .index-ranks-list h3{margin:0px;padding:0px;color:#999999;font-size:17.5px;font-weight:bold;}
 .index-ranks-list ul{margin:0px;margin-bottom:20px;padding:0px;}.index-ranks-list ul li{background-color:#eeeeee;border:1px solid #dadada;border-radius:3px;margin:0px;margin-bottom:10.5px;padding:6px;font-weight:bold;}.index-ranks-list ul li img{background-color:#ffffff;border-radius:2px;width:24px;height:24px;}
@@ -976,15 +978,18 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .usercp-avatar-select .usercp-avatar-gallery{margin:0px -14px;overflow:auto;padding-bottom-bottom:14px;}.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form{margin:0px;padding:0px;float:left;}.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar{margin:14px;padding:0px;}.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar,.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:active,.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:hover{opacity:1;filter:alpha(opacity=100);}.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar img,.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:active img,.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:hover img{opacity:1;filter:alpha(opacity=100);}
 .usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:active img,.usercp-avatar-select .usercp-avatar-gallery .usercp-avatar-select-form .usercp-btn-avatar:hover img{border-color:#0088cc;-webkit-box-shadow:0px 0px 3px #0088cc;-moz-box-shadow:0px 0px 3px #0088cc;box-shadow:0px 0px 3px #0088cc;}
 .usercp-avatar-crop .avatar-crop-preview{border-radius:5px;float:left;width:43.75px;height:43.75px;margin-right:14px;overflow:hidden;}
-.forum-map-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;}.forum-map-category table{margin:0px;}.forum-map-category table caption{background-color:#3c85a3;border:1px solid #357690;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;}
+.forum-map-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;}.forum-map-category table{margin:0px;}.forum-map-category table caption{background-color:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;padding:3.966666666666667px 9.9px;color:#333333;font-size:11.9px;font-weight:bold;text-align:left;}.forum-map-category table caption small{margin-left:7px;color:#999999;font-size:11.9px;}
 .forum-map-category table .forum-map-forum h3,.forum-map-category table .forum-map-subforum h3{margin:0px;padding:0px;font-size:14px;line-height:20px;}.forum-map-category table .forum-map-forum h3 a:link,.forum-map-category table .forum-map-subforum h3 a:link,.forum-map-category table .forum-map-forum h3 a:visited,.forum-map-category table .forum-map-subforum h3 a:visited{color:#555555;}
 .forum-map-category table .forum-map-forum h3 a:active,.forum-map-category table .forum-map-subforum h3 a:active,.forum-map-category table .forum-map-forum h3 a:hover,.forum-map-category table .forum-map-subforum h3 a:hover{color:#333333;}
+.forum-map-category table .forum-map-forum .forum-details,.forum-map-category table .forum-map-subforum .forum-details{float:right;margin-top:-21px;color:#999999;font-weight:bold;}
 .forum-map-category table .forum-map-subforum{padding-left:15px;}.forum-map-category table .forum-map-subforum span.tree-t,.forum-map-category table .forum-map-subforum span.tree-l,.forum-map-category table .forum-map-subforum span.tree-s,.forum-map-category table .forum-map-subforum span.tree-i{display:inline-block;height:20px;width:10px;}
-.forum-map-category table .forum-map-subforum span.tree-t{border-left:2px solid #eeeeee;}.forum-map-category table .forum-map-subforum span.tree-t span{border-top:2px solid #eeeeee;display:inline-block;height:1px;width:100%;margin-bottom:3px;}
-.forum-map-category table .forum-map-subforum span.tree-l span{border-left:2px solid #eeeeee;border-bottom:2px solid #eeeeee;display:inline-block;height:10px;width:100%;margin-bottom:3px;}
-.forum-map-category table .forum-map-subforum span.tree-i{border-left:2px solid #eeeeee;position:relative;top:5px;margin-right:4px;}
-.forum-map-category table .forum-map-subforum span.tree-s{width:12px;margin-right:4px;}
-.forum-map-category.forum-map-category-important caption{background-color:#cf402e;border:1px solid #ba3a29;text-shadow:0px 1px 0px #672017;}
+.forum-map-category table .forum-map-subforum span.tree-t{border-left:1px solid #999999;margin-right:2px;}.forum-map-category table .forum-map-subforum span.tree-t span{border-top:1px solid #999999;display:inline-block;height:1px;width:100%;margin-bottom:3px;}
+.forum-map-category table .forum-map-subforum span.tree-l{margin-right:4px;}.forum-map-category table .forum-map-subforum span.tree-l span{border-left:1px solid #999999;border-bottom:1px solid #999999;display:inline-block;height:10px;width:100%;margin-bottom:3px;}
+.forum-map-category table .forum-map-subforum span.tree-i{border-left:1px solid #999999;position:relative;top:5px;margin-top:-5px;margin-right:4px;}
+.forum-map-category table .forum-map-subforum span.tree-s{height:1px;width:12px;margin-right:4px;}
+.forum-map-category.forum-map-category-important caption{background-color:#cf402e;border:1px solid #a53325;color:#ffffff;text-shadow:0px 1px 0px #672017;}.forum-map-category.forum-map-category-important caption small{color:#280c09;text-shadow:none;}
+.forum-map-category.forum-map-category-inverse caption{background-color:#333333;border:1px solid #1a1a1a;color:#eeeeee;text-shadow:0px 1px 0px #000000;}.forum-map-category.forum-map-category-inverse caption small{color:#b3b3b3;text-shadow:none;}
+.forum-map-category.forum-map-category-info caption{background-color:#3c85a3;border:1px solid #2e677e;color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.forum-map-category.forum-map-category-info caption small{color:#1a3946;text-shadow:none;}
 .popular-threads hr{margin:14px 0px;border:none;border-top:1px solid #eeeeee;}
 .popular-threads .popular-thread{overflow:auto;}.popular-threads .popular-thread .popular-thread-warmth{display:block;float:left;margin-top:1px;margin-right:14px;padding:10.5px;color:#ffffff;text-align:center;font-weight:bold;text-shadow:0px 1px 0px #3b3b3b;}.popular-threads .popular-thread .popular-thread-warmth i{background-image:url("../img/glyphicons-halflings-white.png");}
 .popular-threads .popular-thread .popular-thread-warmth.popular-thread-warmth-0{background-color:#cf402e;border:1px solid #a53325;}
@@ -1021,6 +1026,8 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .category-forums-list table .forum-main .forum-details{float:right;color:#999999;font-weight:bold;}.category-forums-list table .forum-main .forum-details .label{position:relative;bottom:1px;}
 .category-forums-list table .forum-main .forum-description{clear:both;margin:0px;padding:0px;color:#8c8c8c;font-size:11.9px;}
 .category-forums-list.category-forums-important{border:1px solid #902d20;-webkit-box-shadow:0px 0px 0px 3px #cf402e;-moz-box-shadow:0px 0px 0px 3px #cf402e;box-shadow:0px 0px 0px 3px #cf402e;}
+.category-forums-list.category-forums-inverse{border:1px solid #333333;-webkit-box-shadow:0px 0px 0px 3px #555555;-moz-box-shadow:0px 0px 0px 3px #555555;box-shadow:0px 0px 0px 3px #555555;}
+.category-forums-list.category-forums-info{border:1px solid #27576b;-webkit-box-shadow:0px 0px 0px 3px #3c85a3;-moz-box-shadow:0px 0px 0px 3px #3c85a3;box-shadow:0px 0px 0px 3px #3c85a3;}
 .profiles-list .user-cell{overflow:auto;}.profiles-list .user-cell .user-avatar{float:left;}.profiles-list .user-cell .user-avatar img{border-radius:3px;width:42px;height:42px;}
 .profiles-list .user-cell .user-details{margin:0px;margin-left:56px;}.profiles-list .user-cell .user-details a:link,.profiles-list .user-cell .user-details a:active,.profiles-list .user-cell .user-details a:visited,.profiles-list .user-cell .user-details a:hover{display:block;margin-top:3px;color:#333333;font-size:19.599999999999998px;font-weight:bold;}
 .profiles-list .user-cell .user-details .user-info{display:block;color:#999999;font-size:10.5px;}
@@ -1034,13 +1041,15 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .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:#333333;font-size:16.8px;text-decoration:none;}
 .user-profile .content-list .media .media-body .media-footer{margin:0px;color:#999999;font-size:10.5px;font-weight:normal;}.user-profile .content-list .media .media-body .media-footer a{color:#555555;}
-.forum-subforums-list{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;}.forum-subforums-list table{margin:0px;}.forum-subforums-list table caption{background-color:#3c85a3;border:1px solid #357690;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;}
+.forum-subforums-list{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;}.forum-subforums-list table{margin:0px;}.forum-subforums-list table caption{background-color:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;padding:3.966666666666667px 9.9px;color:#333333;font-size:11.9px;font-weight:bold;text-align:left;}.forum-subforums-list table caption small{margin-left:7px;color:#999999;font-size:11.9px;}
 .forum-subforums-list table .forum-icon{width:1%;}.forum-subforums-list table .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.forum-subforums-list table .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
 .forum-subforums-list table .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
 .forum-subforums-list table .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.forum-subforums-list table .forum-main h3 a:link,.forum-subforums-list table .forum-main h3 a:visited{color:#333333;}
 .forum-subforums-list table .forum-main .forum-details{float:right;color:#999999;font-weight:bold;}.forum-subforums-list table .forum-main .forum-details .label{position:relative;bottom:1px;}
 .forum-subforums-list table .forum-main .forum-description{clear:both;margin:0px;padding:0px;color:#8c8c8c;font-size:11.9px;}
-.forum-subforums-list.forum-subforums-important caption{background-color:#cf402e;border:1px solid #ba3a29;text-shadow:0px 1px 0px #672017;}
+.forum-subforums-list.forum-subforums-important caption{background-color:#cf402e;border:1px solid #a53325;color:#ffffff;text-shadow:0px 1px 0px #672017;}.forum-subforums-list.forum-subforums-important caption small{color:#280c09;text-shadow:none;}
+.forum-subforums-list.forum-subforums-inverse caption{background-color:#333333;border:1px solid #1a1a1a;color:#eeeeee;text-shadow:0px 1px 0px #000000;}.forum-subforums-list.forum-subforums-inverse caption small{color:#b3b3b3;text-shadow:none;}
+.forum-subforums-list.forum-subforums-info caption{background-color:#3c85a3;border:1px solid #2e677e;color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.forum-subforums-list.forum-subforums-info caption small{color:#1a3946;text-shadow:none;}
 .forum-threads-list{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;}.forum-threads-list table{margin:0px;}.forum-threads-list table th{background-color:#fbfbfb;border-bottom:1px solid #eeeeee;padding:2px 10px;color:#999999;font-size:11.9px;}
 .forum-threads-list table td{vertical-align:middle;}.forum-threads-list table td.threads-list-empty{padding:11px 19px;font-size:17.5px;text-align:center;}
 .forum-threads-list table td .thread-icon:link,.forum-threads-list table td .thread-icon:active,.forum-threads-list table td .thread-icon:visited,.forum-threads-list table td .thread-icon:hover{background-color:#555555;border:1px solid #2f2f2f;border-radius:3px;margin-right:7px;padding:3px 4px;}.forum-threads-list table td .thread-icon:link.thread-new,.forum-threads-list table td .thread-icon:active.thread-new,.forum-threads-list table td .thread-icon:visited.thread-new,.forum-threads-list table td .thread-icon:hover.thread-new{background-color:#cf402e;border:1px solid #902d20;}

static/cranefly/css/cranefly/category.less

@@ -80,4 +80,14 @@
     border: 1px solid darken(@red, 15%);
     .box-shadow(0px 0px 0px 3px @red);
   }
+
+  &.category-forums-inverse {
+    border: 1px solid @grayDark;
+    .box-shadow(0px 0px 0px 3px @gray);
+  }
+
+  &.category-forums-info {
+    border: 1px solid darken(@bluePale, 15%);
+    .box-shadow(0px 0px 0px 3px @bluePale);
+  }
 }

static/cranefly/css/cranefly/forum.less

@@ -14,16 +14,22 @@
 
     caption {
       background-color: @categoryHeader;
-      border: 1px solid darken(@categoryHeader, 5%);
+      border: 1px solid @categoryBorder;
       border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
       margin: -1px;
-      padding: @paddingSmall;
+      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
 
-      color: @white;
+      color: @grayDark;
       font-size: @fontSizeSmall;
       font-weight: bold;
       text-align: left;
-      text-shadow: 0px 1px 0px darken(@categoryHeader, 25%);
+
+      small {
+        margin-left: @baseFontSize / 2;
+
+        color: @grayLight;
+        font-size: @fontSizeSmall;
+      }
     }
     
     .forum-icon {
@@ -88,9 +94,45 @@
   &.forum-subforums-important {
     caption {
       background-color: @red;
-      border: 1px solid darken(@red, 5%);
+      border: 1px solid darken(@red, 10%);
 
+      color: @white;
       text-shadow: 0px 1px 0px darken(@red, 25%);
+
+      small {
+        color: darken(@red, 40%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.forum-subforums-inverse {
+    caption {
+      background-color: @grayDark;
+      border: 1px solid darken(@grayDark, 10%);
+
+      color: @grayLighter;
+      text-shadow: 0px 1px 0px darken(@black, 25%);
+
+      small {
+        color: lighten(@grayLight, 10%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.forum-subforums-info {
+    caption {
+      background-color: @bluePale;
+      border: 1px solid darken(@bluePale, 10%);
+
+      color: @white;
+      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+
+      small {
+        color: darken(@bluePale, 25%);
+        text-shadow: none;
+      }
     }
   }
 }

static/cranefly/css/cranefly/forummap.less

@@ -13,16 +13,22 @@
 
   	caption {
   	  background-color: @categoryHeader;
-      border: 1px solid darken(@categoryHeader, 5%);
+      border: 1px solid @categoryBorder;
       border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
       margin: -1px;
-  	  padding: @paddingSmall;
+      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
 
-      color: @white;
-  	  font-size: @fontSizeSmall;
-  	  font-weight: bold;
-  	  text-align: left;
-      text-shadow: 0px 1px 0px darken(@categoryHeader, 25%);
+      color: @grayDark;
+      font-size: @fontSizeSmall;
+      font-weight: bold;
+      text-align: left;
+
+      small {
+        margin-left: @baseFontSize / 2;
+
+        color: @grayLight;
+        font-size: @fontSizeSmall;
+      }
   	}
     
     .forum-map-forum, .forum-map-subforum {
@@ -41,6 +47,14 @@
 			    color: @textColor;
 			  }
       }
+
+      .forum-details {
+        float: right;
+        margin-top: (@baseLineHeight * -1) - 1px;
+
+        color: @grayLight;
+        font-weight: bold;
+      }
     }
 
     .forum-map-subforum {
@@ -54,10 +68,11 @@
     		}
 
     		&.tree-t {
-    			border-left: 2px solid @grayLighter;
+    			border-left: 1px solid @grayLight;
+          margin-right: 2px;
 
     			span {
-    				border-top: 2px solid @grayLighter;
+    				border-top: 1px solid @grayLight;
     			  display: inline-block;
     				height: 1px;
     				width: 100%;
@@ -66,9 +81,11 @@
     		}
 
     		&.tree-l {
+          margin-right: 4px;
+
     			span {
-    			  border-left: 2px solid @grayLighter;
-    				border-bottom: 2px solid @grayLighter;
+    			  border-left: 1px solid @grayLight;
+    				border-bottom: 1px solid @grayLight;
     			  display: inline-block;
     				height: @baseLineHeight * 0.5;
     				width: 100%;
@@ -77,13 +94,15 @@
     		}
 
     		&.tree-i {
-    			border-left: 2px solid @grayLighter;
+    			border-left: 1px solid @grayLight;
     			position: relative;
     			top: 5px;
+          margin-top: -5px;
     			margin-right: 4px;
     		}
 
     		&.tree-s {
+          height: 1px;
     			width: (@baseLineHeight * 0.5) + 2px;
     			margin-right: 4px;
     		}
@@ -94,9 +113,45 @@
   &.forum-map-category-important {
     caption {
       background-color: @red;
-      border: 1px solid darken(@red, 5%);
+      border: 1px solid darken(@red, 10%);
 
+      color: @white;
       text-shadow: 0px 1px 0px darken(@red, 25%);
+
+      small {
+        color: darken(@red, 40%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.forum-map-category-inverse {
+    caption {
+      background-color: @grayDark;
+      border: 1px solid darken(@grayDark, 10%);
+
+      color: @grayLighter;
+      text-shadow: 0px 1px 0px darken(@black, 25%);
+
+      small {
+        color: lighten(@grayLight, 10%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.forum-map-category-info {
+    caption {
+      background-color: @bluePale;
+      border: 1px solid darken(@bluePale, 10%);
+
+      color: @white;
+      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+
+      small {
+        color: darken(@bluePale, 25%);
+        text-shadow: none;
+      }
     }
   }
 }

static/cranefly/css/cranefly/index.less

@@ -21,16 +21,22 @@
 
   	caption {
   	  background-color: @categoryHeader;
-      border: 1px solid darken(@categoryHeader, 5%);
+      border: 1px solid @categoryBorder;
       border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
       margin: -1px;
-  	  padding: @paddingSmall;
+      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
 
-      color: @white;
+      color: @grayDark;
   	  font-size: @fontSizeSmall;
   	  font-weight: bold;
   	  text-align: left;
-      text-shadow: 0px 1px 0px darken(@categoryHeader, 25%);
+
+      small {
+        margin-left: @baseFontSize / 2;
+
+        color: @grayLight;
+        font-size: @fontSizeSmall;
+      }
   	}
     
     .forum-icon {
@@ -95,9 +101,45 @@
   &.index-category-important {
     caption {
       background-color: @red;
-      border: 1px solid darken(@red, 5%);
+      border: 1px solid darken(@red, 10%);
 
+      color: @white;
       text-shadow: 0px 1px 0px darken(@red, 25%);
+
+      small {
+        color: darken(@red, 40%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.index-category-inverse {
+    caption {
+      background-color: @grayDark;
+      border: 1px solid darken(@grayDark, 10%);
+
+      color: @grayLighter;
+      text-shadow: 0px 1px 0px darken(@black, 25%);
+
+      small {
+        color: lighten(@grayLight, 10%);
+        text-shadow: none;
+      }
+    }
+  }
+
+  &.index-category-info {
+    caption {
+      background-color: @bluePale;
+      border: 1px solid darken(@bluePale, 10%);
+
+      color: @white;
+      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+
+      small {
+        color: darken(@bluePale, 25%);
+        text-shadow: none;
+      }
     }
   }
 }

static/cranefly/css/variables.less

@@ -90,7 +90,7 @@
 // -------------------------
 @categoryBackground:                lighten(@bodyBackground, 5%);
 @categoryBorder:                    darken(@bodyBackground, 15%);
-@categoryHeader:                    @bluePale;
+@categoryHeader:                    @bodyBackground;
 @categoryShadow:                    darken(@bodyBackground, 5%);
 
 @forumIconSize:                     4px;

templates/cranefly/forum_map.html

@@ -52,11 +52,20 @@
     forum-map-subforum
     {%- else -%}
     forum-map-forum
-    {%- endif %}"><h3>{% if depth %}{% if last -%}
+    {%- endif %}">
+    <h3>{% if depth %}{% if last -%}
     {{ draw_tree(branch ~ 'l') }}
     {%- else -%}
     {{ draw_tree(branch ~ 't') }}
-    {%- endif %}{% endif %}<a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3></td>
+    {%- endif %}{% endif %} <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+    <div class="forum-details">
+      {% if forum.type == 'redirect' %}
+      <span class="label{% if forum.redirects_delta < forum.redirects %} label-success{% endif %}">{{ forum.redirects|intcomma }}</span> {% trans %}Clicks{% endtrans %}
+      {% else %}
+      <span class="label{% if forum.posts_delta < forum.posts %} label-success{% endif %}">{{ forum.posts|intcomma }}</span> {% trans %}Posts{% endtrans %}
+      {% endif %}
+    </div>
+</td>
 </tr>
 {% for subforum in forum.subforums %}
   {% if depth %}

templates/cranefly/index.html

@@ -17,7 +17,7 @@
       {% for category in forums_list %}{% if category.subforums %}
       <div class="index-category{% if category.style %} index-category-{{ category.style }}{% endif %}">
         <table class="table">
-          <caption>{{ category.name }}</caption>
+          <caption>{{ category.name }}{% if category.description %} <small>{{ category.description }}</small>{% endif %}</caption>
           <tbody>
             {% for forum in category.subforums %}
             <tr>