Browse Source

Removed tables from forums lists.#124

Ralfp 12 years ago
parent
commit
2b5831e212

+ 52 - 51
static/cranefly/css/cranefly.css

@@ -968,26 +968,26 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{opacity:0.9;filter:alpha(opa
 .markdown p .emoji,.markdown article p .emoji{width:18px;height:18px;}
 .markdown blockquote p .emoji,.markdown article blockquote p .emoji{width:13.9px;height:13.9px;}
 .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:#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 td{padding:14.75px 9.9px;padding-bottom:15.75px;}
-.index-category table .forum-icon{padding-right:2.95px;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 .dropdown{float:right;right:14px;}.index-category table .forum-main .dropdown .subforum:link,.index-category table .forum-main .dropdown .subforum:visited{color:#999999;font-weight:bold;}
-.index-category table .forum-main .dropdown .subforum:hover,.index-category table .forum-main .dropdown .subforum:active{color:#333333;}
-.index-category table .forum-main .dropdown .dropdown-toggle{padding:4px 8px;opacity:0.6;filter:alpha(opacity=60);color:#333333;font-weight:bold;}.index-category table .forum-main .dropdown .dropdown-toggle:hover,.index-category table .forum-main .dropdown .dropdown-toggle:active,.index-category table .forum-main .dropdown .dropdown-toggle:focus{opacity:1;filter:alpha(opacity=100);text-decoration:none;}
-.index-category table .forum-main .dropdown.open .dropdown-toggle{background-color:#eeeeee;border-radius:3px 3px 0px 0px;opacity:1;filter:alpha(opacity=100);padding-bottom:6px;text-decoration:none;}
-.index-category table .forum-main .dropdown .dropdown-menu{background:none;border:none;box-shadow:none;}.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow{border-radius:3px;-webkit-box-shadow:0px 0px 3px #999999;-moz-box-shadow:0px 0px 3px #999999;box-shadow:0px 0px 3px #999999;width:256px;position:relative;right:0px;top:-4px;}.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul{background-color:#fbfbfb;border-radius:3px;margin:0px;padding:0px;}.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li{margin:0px;padding:0px;list-style:none;}.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a{border-bottom:1px dotted #d5d5d5;display:block;opacity:0.7;filter:alpha(opacity=70);padding:6px 8px;color:#333333;text-decoration:none;}.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:hover,.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:active{opacity:1;filter:alpha(opacity=100);}
-.index-category table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li:last-child a{border-bottom:none;}
-.index-category table .forum-main .forum-details{border-left:1px dotted #e0e0e0;float:right;margin:-10px 0px;margin-top:-8.1px;padding-left:14px;height:35px;width:220px;}.index-category table .forum-main .forum-details .thread-name a:link,.index-category table .forum-main .forum-details .thread-name a:active,.index-category table .forum-main .forum-details .thread-name a:visited,.index-category table .forum-main .forum-details .thread-name a:hover{margin-bottom:1px;color:#333333;font-size:11.9px;font-weight:bold;}
-.index-category table .forum-main .forum-details .muted{font-size:10.5px;line-height:10.5px;}.index-category table .forum-main .forum-details .muted .last-poster,.index-category table .forum-main .forum-details .muted a:link,.index-category table .forum-main .forum-details .muted a:active,.index-category table .forum-main .forum-details .muted a:visited,.index-category table .forum-main .forum-details .muted a:hover{color:#555555;}
-.index-category table .forum-main .forum-details em{position:relative;top:7.5px;color:#999999;}.index-category table .forum-main .forum-details em strong{color:#333333;font-weight:normal;}
-.index-category table .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
-.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
-.index-category table .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
-.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-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 .header{background-color:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;margin-bottom:0px;padding:3.966666666666667px 9.9px;}.index-category .header h2{margin:0px;padding:0px;color:#333333;font-size:11.9px;font-weight:bold;line-height:20px;text-align:left;}.index-category .header h2 small{margin-left:7px;color:#999999;font-size:11.9px;}
+.index-category .forum{border-bottom:1px solid #d5d5d5;height:21px;overflow:visible;padding:14.75px 9.9px;}.index-category .forum.last{border-bottom:none;}
+.index-category .forum .forum-icon{float:left;}.index-category .forum .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.index-category .forum .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
+.index-category .forum .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
+.index-category .forum .forum-main{margin-left:34px;}.index-category .forum .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.index-category .forum .forum-main h3 a:link,.index-category .forum .forum-main h3 a:visited{color:#333333;}
+.index-category .forum .forum-main .dropdown{float:right;right:14px;}.index-category .forum .forum-main .dropdown .subforum:link,.index-category .forum .forum-main .dropdown .subforum:visited{color:#999999;font-weight:bold;}
+.index-category .forum .forum-main .dropdown .subforum:hover,.index-category .forum .forum-main .dropdown .subforum:active{color:#333333;}
+.index-category .forum .forum-main .dropdown .dropdown-toggle{padding:4px 8px;opacity:0.6;filter:alpha(opacity=60);color:#333333;font-weight:bold;}.index-category .forum .forum-main .dropdown .dropdown-toggle:hover,.index-category .forum .forum-main .dropdown .dropdown-toggle:active,.index-category .forum .forum-main .dropdown .dropdown-toggle:focus{opacity:1;filter:alpha(opacity=100);text-decoration:none;}
+.index-category .forum .forum-main .dropdown.open .dropdown-toggle{background-color:#eeeeee;border-radius:3px 3px 0px 0px;opacity:1;filter:alpha(opacity=100);padding-bottom:6px;text-decoration:none;}
+.index-category .forum .forum-main .dropdown .dropdown-menu{background:none;border:none;box-shadow:none;}.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow{border-radius:3px;-webkit-box-shadow:0px 0px 3px #999999;-moz-box-shadow:0px 0px 3px #999999;box-shadow:0px 0px 3px #999999;width:256px;position:relative;right:0px;top:-4px;}.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul{background-color:#fbfbfb;border-radius:3px;margin:0px;padding:0px;}.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li{margin:0px;padding:0px;list-style:none;}.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a{border-bottom:1px dotted #d5d5d5;display:block;opacity:0.7;filter:alpha(opacity=70);padding:6px 8px;color:#333333;text-decoration:none;}.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:hover,.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:active{opacity:1;filter:alpha(opacity=100);}
+.index-category .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li:last-child a{border-bottom:none;}
+.index-category .forum .forum-main .forum-details{border-left:1px dotted #e0e0e0;float:right;margin:-10px 0px;margin-top:-8.1px;padding-left:14px;height:35px;width:220px;}.index-category .forum .forum-main .forum-details .thread-name a:link,.index-category .forum .forum-main .forum-details .thread-name a:active,.index-category .forum .forum-main .forum-details .thread-name a:visited,.index-category .forum .forum-main .forum-details .thread-name a:hover{margin-bottom:1px;color:#333333;font-size:11.9px;font-weight:bold;}
+.index-category .forum .forum-main .forum-details .muted{font-size:10.5px;line-height:10.5px;}.index-category .forum .forum-main .forum-details .muted .last-poster,.index-category .forum .forum-main .forum-details .muted a:link,.index-category .forum .forum-main .forum-details .muted a:active,.index-category .forum .forum-main .forum-details .muted a:visited,.index-category .forum .forum-main .forum-details .muted a:hover{color:#555555;}
+.index-category .forum .forum-main .forum-details em{position:relative;top:7.5px;color:#999999;}.index-category .forum .forum-main .forum-details em strong{color:#333333;font-weight:normal;}
+.index-category .forum .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.index-category .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.index-category .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
+.index-category .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
+.index-category .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
+.index-category.index-category-important .header{background-color:#cf402e;border:1px solid #a53325;}.index-category.index-category-important .header h2{color:#ffffff;text-shadow:0px 1px 0px #672017;}.index-category.index-category-important .header h2 small{color:#280c09;text-shadow:none;}
+.index-category.index-category-inverse .header{background-color:#333333;border:1px solid #1a1a1a;}.index-category.index-category-inverse .header h2{color:#eeeeee;text-shadow:0px 1px 0px #000000;}.index-category.index-category-inverse .header h2 small{color:#b3b3b3;text-shadow:none;}
+.index-category.index-category-info .header{background-color:#3c85a3;border:1px solid #2e677e;}.index-category.index-category-info .header h2{color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.index-category.index-category-info .header h2 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 h3 a:link,.index-ranks-list h3 a:active,.index-ranks-list h3 a:visited,.index-ranks-list h3 a:hover{color:#999999;font-size:17.5px;text-decoration:none;}
 .index-ranks-list ul{background-color:#ffffff;border:1px solid #e2e2e2;border-radius:3px;margin:0px;margin-bottom:20px;padding:0px;}.index-ranks-list ul li{border-bottom:1px dotted #e2e2e2;margin:0px;padding:6px 8px;font-weight:bold;}.index-ranks-list ul li img{background-color:#ffffff;border-radius:2px;width:28px;height:28px;}
@@ -1011,17 +1011,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 .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;}
 .usercp-avatar-crop .avatar-crop-target img{background-color:#ffffff;}
-.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-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: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;}
+.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 .header{background-color:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;margin-bottom:0px;padding:3.966666666666667px 9.9px;}.forum-map-category .header h2{margin:0px;padding:0px;color:#333333;font-size:11.9px;font-weight:bold;line-height:20px;text-align:left;}.forum-map-category .header h2 small{margin-left:7px;color:#999999;font-size:11.9px;}
+.forum-map-category .forum-map-forum,.forum-map-category .forum-map-subforum{border-bottom:1px solid #d5d5d5;overflow:auto;padding:5.95px 9.9px;}.forum-map-category .forum-map-forum h3,.forum-map-category .forum-map-subforum h3{margin:0px;padding:0px;font-size:14px;line-height:20px;}.forum-map-category .forum-map-forum h3 a:link,.forum-map-category .forum-map-subforum h3 a:link,.forum-map-category .forum-map-forum h3 a:visited,.forum-map-category .forum-map-subforum h3 a:visited{color:#555555;}
+.forum-map-category .forum-map-forum h3 a:active,.forum-map-category .forum-map-subforum h3 a:active,.forum-map-category .forum-map-forum h3 a:hover,.forum-map-category .forum-map-subforum h3 a:hover{color:#333333;}
+.forum-map-category .forum-map-subforum{padding-left:15px;}.forum-map-category .forum-map-subforum span.tree-t,.forum-map-category .forum-map-subforum span.tree-l,.forum-map-category .forum-map-subforum span.tree-s,.forum-map-category .forum-map-subforum span.tree-i{display:inline-block;height:20px;width:10px;}
+.forum-map-category .forum-map-subforum span.tree-t{border-left:1px solid #999999;margin-right:2px;}.forum-map-category .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 .forum-map-subforum span.tree-l{margin-right:4px;}.forum-map-category .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 .forum-map-subforum span.tree-i{border-left:1px solid #999999;position:relative;top:5px;margin-top:-5px;margin-right:4px;}
+.forum-map-category .forum-map-subforum span.tree-s{height:1px;width:12px;margin-right:4px;}
+.forum-map-category>div:last-child{border-bottom:none;}
+.forum-map-category.forum-map-category-important .header{background-color:#cf402e;border:1px solid #a53325;}.forum-map-category.forum-map-category-important .header h2{color:#ffffff;text-shadow:0px 1px 0px #672017;}.forum-map-category.forum-map-category-important .header h2 small{color:#280c09;text-shadow:none;}
+.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 table .watched-thread-flags{overflow:auto;}.watched-threads table .watched-thread-flags form{float:right;margin:0px;padding:0px;}.watched-threads table .watched-thread-flags form .btn{float:right;padding:3px 5px;padding-bottom:0px;margin-right:16px;}
 .watched-threads table .thread-replies{color:#999999;text-align:right;}
 .watched-threads table .thread-forum a:link,.watched-threads table .thread-forum a:visited{color:#555555;font-weight:bold;}
@@ -1065,26 +1066,26 @@ 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:#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 td{padding:14.75px 9.9px;padding-bottom:15.75px;}
-.forum-subforums-list table .forum-icon{padding-right:2.95px;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 .dropdown{float:right;right:14px;}.forum-subforums-list table .forum-main .dropdown .subforum:link,.forum-subforums-list table .forum-main .dropdown .subforum:visited{color:#999999;font-weight:bold;}
-.forum-subforums-list table .forum-main .dropdown .subforum:hover,.forum-subforums-list table .forum-main .dropdown .subforum:active{color:#333333;}
-.forum-subforums-list table .forum-main .dropdown .dropdown-toggle{padding:4px 8px;opacity:0.6;filter:alpha(opacity=60);color:#333333;font-weight:bold;}.forum-subforums-list table .forum-main .dropdown .dropdown-toggle:hover,.forum-subforums-list table .forum-main .dropdown .dropdown-toggle:active,.forum-subforums-list table .forum-main .dropdown .dropdown-toggle:focus{opacity:1;filter:alpha(opacity=100);text-decoration:none;}
-.forum-subforums-list table .forum-main .dropdown.open .dropdown-toggle{background-color:#eeeeee;border-radius:3px 3px 0px 0px;opacity:1;filter:alpha(opacity=100);padding-bottom:6px;text-decoration:none;}
-.forum-subforums-list table .forum-main .dropdown .dropdown-menu{background:none;border:none;box-shadow:none;}.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow{border-radius:3px;-webkit-box-shadow:0px 0px 3px #999999;-moz-box-shadow:0px 0px 3px #999999;box-shadow:0px 0px 3px #999999;width:256px;position:relative;right:0px;top:-4px;}.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul{background-color:#fbfbfb;border-radius:3px;margin:0px;padding:0px;}.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li{margin:0px;padding:0px;list-style:none;}.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a{border-bottom:1px dotted #d5d5d5;display:block;opacity:0.7;filter:alpha(opacity=70);padding:6px 8px;color:#333333;text-decoration:none;}.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:hover,.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:active{opacity:1;filter:alpha(opacity=100);}
-.forum-subforums-list table .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li:last-child a{border-bottom:none;}
-.forum-subforums-list table .forum-main .forum-details{border-left:1px dotted #e0e0e0;float:right;margin:-10px 0px;margin-top:-8.1px;padding-left:14px;height:35px;width:220px;}.forum-subforums-list table .forum-main .forum-details .thread-name a:link,.forum-subforums-list table .forum-main .forum-details .thread-name a:active,.forum-subforums-list table .forum-main .forum-details .thread-name a:visited,.forum-subforums-list table .forum-main .forum-details .thread-name a:hover{margin-bottom:1px;color:#333333;font-size:11.9px;font-weight:bold;}
-.forum-subforums-list table .forum-main .forum-details .muted{font-size:10.5px;line-height:10.5px;}.forum-subforums-list table .forum-main .forum-details .muted .last-poster,.forum-subforums-list table .forum-main .forum-details .muted a:link,.forum-subforums-list table .forum-main .forum-details .muted a:active,.forum-subforums-list table .forum-main .forum-details .muted a:visited,.forum-subforums-list table .forum-main .forum-details .muted a:hover{color:#555555;}
-.forum-subforums-list table .forum-main .forum-details em{position:relative;top:7.5px;color:#999999;}.forum-subforums-list table .forum-main .forum-details em strong{color:#333333;font-weight:normal;}
-.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
-.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
-.forum-subforums-list table .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
-.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-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 .header{background-color:#fbfbfb;border:1px solid #d5d5d5;border-radius:2px 2px 0px 0px;margin:-1px;margin-bottom:0px;padding:3.966666666666667px 9.9px;}.forum-subforums-list .header h2{margin:0px;padding:0px;color:#333333;font-size:11.9px;font-weight:bold;line-height:20px;text-align:left;}.forum-subforums-list .header h2 small{margin-left:7px;color:#999999;font-size:11.9px;}
+.forum-subforums-list .forum{border-bottom:1px solid #d5d5d5;height:21px;overflow:visible;padding:14.75px 9.9px;}.forum-subforums-list .forum.last{border-bottom:none;}
+.forum-subforums-list .forum .forum-icon{float:left;}.forum-subforums-list .forum .forum-icon .forum-icon-wrap{background-color:#555555;border:1px solid #3b3b3b;border-radius:3px;padding:3px 4px;}.forum-subforums-list .forum .forum-icon .forum-icon-wrap.forum-icon-new{background-color:#cf402e;border:1px solid #a53325;}
+.forum-subforums-list .forum .forum-icon .forum-icon-wrap.forum-icon-redirect{background-color:#9466c6;border:1px solid #7a43b6;}
+.forum-subforums-list .forum .forum-main{margin-left:34px;}.forum-subforums-list .forum .forum-main h3{float:left;margin:0px;padding:0px;font-size:17.5px;font-weight:normal;line-height:20px;}.forum-subforums-list .forum .forum-main h3 a:link,.forum-subforums-list .forum .forum-main h3 a:visited{color:#333333;}
+.forum-subforums-list .forum .forum-main .dropdown{float:right;right:14px;}.forum-subforums-list .forum .forum-main .dropdown .subforum:link,.forum-subforums-list .forum .forum-main .dropdown .subforum:visited{color:#999999;font-weight:bold;}
+.forum-subforums-list .forum .forum-main .dropdown .subforum:hover,.forum-subforums-list .forum .forum-main .dropdown .subforum:active{color:#333333;}
+.forum-subforums-list .forum .forum-main .dropdown .dropdown-toggle{padding:4px 8px;opacity:0.6;filter:alpha(opacity=60);color:#333333;font-weight:bold;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-toggle:hover,.forum-subforums-list .forum .forum-main .dropdown .dropdown-toggle:active,.forum-subforums-list .forum .forum-main .dropdown .dropdown-toggle:focus{opacity:1;filter:alpha(opacity=100);text-decoration:none;}
+.forum-subforums-list .forum .forum-main .dropdown.open .dropdown-toggle{background-color:#eeeeee;border-radius:3px 3px 0px 0px;opacity:1;filter:alpha(opacity=100);padding-bottom:6px;text-decoration:none;}
+.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu{background:none;border:none;box-shadow:none;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow{border-radius:3px;-webkit-box-shadow:0px 0px 3px #999999;-moz-box-shadow:0px 0px 3px #999999;box-shadow:0px 0px 3px #999999;width:256px;position:relative;right:0px;top:-4px;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul{background-color:#fbfbfb;border-radius:3px;margin:0px;padding:0px;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li{margin:0px;padding:0px;list-style:none;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a{border-bottom:1px dotted #d5d5d5;display:block;opacity:0.7;filter:alpha(opacity=70);padding:6px 8px;color:#333333;text-decoration:none;}.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:hover,.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li a:active{opacity:1;filter:alpha(opacity=100);}
+.forum-subforums-list .forum .forum-main .dropdown .dropdown-menu .dropdown-shadow ul li:last-child a{border-bottom:none;}
+.forum-subforums-list .forum .forum-main .forum-details{border-left:1px dotted #e0e0e0;float:right;margin:-10px 0px;margin-top:-8.1px;padding-left:14px;height:35px;width:220px;}.forum-subforums-list .forum .forum-main .forum-details .thread-name a:link,.forum-subforums-list .forum .forum-main .forum-details .thread-name a:active,.forum-subforums-list .forum .forum-main .forum-details .thread-name a:visited,.forum-subforums-list .forum .forum-main .forum-details .thread-name a:hover{margin-bottom:1px;color:#333333;font-size:11.9px;font-weight:bold;}
+.forum-subforums-list .forum .forum-main .forum-details .muted{font-size:10.5px;line-height:10.5px;}.forum-subforums-list .forum .forum-main .forum-details .muted .last-poster,.forum-subforums-list .forum .forum-main .forum-details .muted a:link,.forum-subforums-list .forum .forum-main .forum-details .muted a:active,.forum-subforums-list .forum .forum-main .forum-details .muted a:visited,.forum-subforums-list .forum .forum-main .forum-details .muted a:hover{color:#555555;}
+.forum-subforums-list .forum .forum-main .forum-details em{position:relative;top:7.5px;color:#999999;}.forum-subforums-list .forum .forum-main .forum-details em strong{color:#333333;font-weight:normal;}
+.forum-subforums-list .forum .forum-main .forum-meta-tooltip .tooltip-inner{max-width:400px;text-align:left;}.forum-subforums-list .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats{color:#999999;font-size:10.5px;}.forum-subforums-list .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats strong{color:#ffffff;}
+.forum-subforums-list .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-stats span{margin-right:14px;}
+.forum-subforums-list .forum .forum-main .forum-meta-tooltip .tooltip-inner .forum-description{clear:both;margin:0px;margin-bottom:7px;padding:0px;color:#eeeeee;font-size:14px;}
+.forum-subforums-list.forum-subforums-important .header{background-color:#cf402e;border:1px solid #a53325;}.forum-subforums-list.forum-subforums-important .header h2{color:#ffffff;text-shadow:0px 1px 0px #672017;}.forum-subforums-list.forum-subforums-important .header h2 small{color:#280c09;text-shadow:none;}
+.forum-subforums-list.forum-subforums-inverse .header{background-color:#333333;border:1px solid #1a1a1a;}.forum-subforums-list.forum-subforums-inverse .header h2{color:#eeeeee;text-shadow:0px 1px 0px #000000;}.forum-subforums-list.forum-subforums-inverse .header h2 small{color:#b3b3b3;text-shadow:none;}
+.forum-subforums-list.forum-subforums-info .header{background-color:#3c85a3;border:1px solid #2e677e;}.forum-subforums-list.forum-subforums-info .header h2{color:#ffffff;text-shadow:0px 1px 0px #1a3946;}.forum-subforums-list.forum-subforums-info .header h2 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;}

+ 50 - 34
static/cranefly/css/cranefly/forum.less

@@ -9,19 +9,22 @@
   .box-shadow(0px 0px 0px 3px @categoryShadow);
   margin-bottom: @baseLineHeight;
 
-  table {
-    margin: 0px;
-
-    caption {
-      background-color: @categoryHeader;
-      border: 1px solid @categoryBorder;
-      border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
-      margin: -1px;
-      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+  .header {
+    background-color: @categoryHeader;
+    border: 1px solid @categoryBorder;
+    border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
+    margin: -1px;
+    margin-bottom: 0px;
+    padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+
+    h2 {
+      margin: 0px;
+      padding: 0px;
 
       color: @grayDark;
       font-size: @fontSizeSmall;
       font-weight: bold;
+      line-height: @baseLineHeight;
       text-align: left;
 
       small {
@@ -31,15 +34,20 @@
         font-size: @fontSizeSmall;
       }
     }
-    
-    td {
-      padding: ((@fontSizeLarge / 2) + 6px) (@fontSizeSmall - 2px);
-      padding-bottom: (@fontSizeLarge / 2) + 7px;
+  }
+
+  .forum {
+    border-bottom: 1px solid @categoryBorder;
+    height: 21px;
+    overflow: visible;
+    padding: ((@fontSizeLarge / 2) + 6px) (@fontSizeSmall - 2px);
+
+    &.last {
+      border-bottom: none;
     }
 
     .forum-icon {
-      padding-right: (@fontSizeSmall / 2) - 3px;
-      width: 1%;
+      float: left;
 
       .forum-icon-wrap {
         background-color: @itemOldColor;
@@ -58,8 +66,10 @@
         }
       }
     }
-    
+
     .forum-main {
+      margin-left: 34px;
+
       h3 {
         float: left;
         margin: 0px;
@@ -233,46 +243,52 @@
   }
 
   &.forum-subforums-important {
-    caption {
+    .header {
       background-color: @red;
       border: 1px solid darken(@red, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@red, 25%);
+      h2 {
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@red, 25%);
 
-      small {
-        color: darken(@red, 40%);
-        text-shadow: none;
+        small {
+          color: darken(@red, 40%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.forum-subforums-inverse {
-    caption {
+    .header {
       background-color: @grayDark;
       border: 1px solid darken(@grayDark, 10%);
 
-      color: @grayLighter;
-      text-shadow: 0px 1px 0px darken(@black, 25%);
+      h2 {
+        color: @grayLighter;
+        text-shadow: 0px 1px 0px darken(@black, 25%);
 
-      small {
-        color: lighten(@grayLight, 10%);
-        text-shadow: none;
+        small {
+          color: lighten(@grayLight, 10%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.forum-subforums-info {
-    caption {
+    .header {
       background-color: @bluePale;
       border: 1px solid darken(@bluePale, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+      h2 {
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@bluePale, 25%);
 
-      small {
-        color: darken(@bluePale, 25%);
-        text-shadow: none;
+        small {
+          color: darken(@bluePale, 25%);
+          text-shadow: none;
+        }
       }
     }
   }

+ 112 - 95
static/cranefly/css/cranefly/forummap.less

@@ -8,19 +8,22 @@
   .box-shadow(0px 0px 0px 3px @categoryShadow);
   margin-bottom: @baseLineHeight;
 
-  table {
-  	margin: 0px;
-
-  	caption {
-  	  background-color: @categoryHeader;
-      border: 1px solid @categoryBorder;
-      border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
-      margin: -1px;
-      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+  .header {
+    background-color: @categoryHeader;
+    border: 1px solid @categoryBorder;
+    border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
+    margin: -1px;
+    margin-bottom: 0px;
+    padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+
+    h2 {
+      margin: 0px;
+      padding: 0px;
 
       color: @grayDark;
       font-size: @fontSizeSmall;
       font-weight: bold;
+      line-height: @baseLineHeight;
       text-align: left;
 
       small {
@@ -29,120 +32,134 @@
         color: @grayLight;
         font-size: @fontSizeSmall;
       }
-  	}
-    
-    .forum-map-forum, .forum-map-subforum {
-      h3 {
-				margin: 0px;
-				padding: 0px;
-
-				font-size: @baseFontSize;
-				line-height: @baseLineHeight;
-
-				a:link, a:visited {
-				  color: @gray;
-				}
-
-	      a:active, a:hover {
-			    color: @textColor;
-			  }
-      }
     }
+  }
+
+  .forum-map-forum, .forum-map-subforum {
+    border-bottom: 1px solid @categoryBorder;
+    overflow: auto;
+    padding: (@fontSizeSmall / 2) (@fontSizeSmall - 2px);
+
+    h3 {
+      margin: 0px;
+      padding: 0px;
+
+      font-size: @baseFontSize;
+      line-height: @baseLineHeight;
+
+      a:link, a:visited {
+        color: @gray;
+      }
 
-    .forum-map-subforum {
-    	padding-left: @baseLineHeight * 0.75;
-
-    	span {
-    		&.tree-t, &.tree-l, &.tree-s, &.tree-i {
-    			display: inline-block;
-    			height: @baseLineHeight;
-    			width: @baseLineHeight * 0.5;
-    		}
-
-    		&.tree-t {
-    			border-left: 1px solid @grayLight;
-          margin-right: 2px;
-
-    			span {
-    				border-top: 1px solid @grayLight;
-    			  display: inline-block;
-    				height: 1px;
-    				width: 100%;
-    				margin-bottom: 3px;
-    			}
-    		}
-
-    		&.tree-l {
-          margin-right: 4px;
-
-    			span {
-    			  border-left: 1px solid @grayLight;
-    				border-bottom: 1px solid @grayLight;
-    			  display: inline-block;
-    				height: @baseLineHeight * 0.5;
-    				width: 100%;
-    				margin-bottom: 3px;
-    			}
-    		}
-
-    		&.tree-i {
-    			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;
-    		}
-    	}
+      a:active, a:hover {
+        color: @textColor;
+      }
     }
   }
 
+  .forum-map-subforum {
+  	padding-left: @baseLineHeight * 0.75;
+
+  	span {
+  		&.tree-t, &.tree-l, &.tree-s, &.tree-i {
+  			display: inline-block;
+  			height: @baseLineHeight;
+  			width: @baseLineHeight * 0.5;
+  		}
+
+  		&.tree-t {
+  			border-left: 1px solid @grayLight;
+        margin-right: 2px;
+
+  			span {
+  				border-top: 1px solid @grayLight;
+  			  display: inline-block;
+  				height: 1px;
+  				width: 100%;
+  				margin-bottom: 3px;
+  			}
+  		}
+
+  		&.tree-l {
+        margin-right: 4px;
+
+  			span {
+  			  border-left: 1px solid @grayLight;
+  				border-bottom: 1px solid @grayLight;
+  			  display: inline-block;
+  				height: @baseLineHeight * 0.5;
+  				width: 100%;
+  				margin-bottom: 3px;
+  			}
+  		}
+
+  		&.tree-i {
+  			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;
+  		}
+  	}
+  }
+
+  &>div:last-child {
+    border-bottom: none;
+  }
+  
   &.forum-map-category-important {
-    caption {
+    .header {
       background-color: @red;
       border: 1px solid darken(@red, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@red, 25%);
+      h2 {
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@red, 25%);
 
-      small {
-        color: darken(@red, 40%);
-        text-shadow: none;
+        small {
+          color: darken(@red, 40%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.forum-map-category-inverse {
-    caption {
+    .header {
       background-color: @grayDark;
       border: 1px solid darken(@grayDark, 10%);
 
-      color: @grayLighter;
-      text-shadow: 0px 1px 0px darken(@black, 25%);
+      h2 {
+        color: @grayLighter;
+        text-shadow: 0px 1px 0px darken(@black, 25%);
 
-      small {
-        color: lighten(@grayLight, 10%);
-        text-shadow: none;
+        small {
+          color: lighten(@grayLight, 10%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.forum-map-category-info {
-    caption {
+    .header {
       background-color: @bluePale;
       border: 1px solid darken(@bluePale, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+      h2 {
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@bluePale, 25%);
 
-      small {
-        color: darken(@bluePale, 25%);
-        text-shadow: none;
+        small {
+          color: darken(@bluePale, 25%);
+          text-shadow: none;
+        }
       }
     }
   }

+ 73 - 56
static/cranefly/css/cranefly/index.less

@@ -16,20 +16,23 @@
   .box-shadow(0px 0px 0px 3px @categoryShadow);
   margin-bottom: @baseLineHeight;
 
-  table {
-  	margin: 0px;
-
-  	caption {
-  	  background-color: @categoryHeader;
-      border: 1px solid @categoryBorder;
-      border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
-      margin: -1px;
-      padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+  .header {
+    background-color: @categoryHeader;
+    border: 1px solid @categoryBorder;
+    border-radius: @borderRadiusSmall @borderRadiusSmall 0px 0px;
+    margin: -1px;
+    margin-bottom: 0px;
+    padding: (@fontSizeSmall / 3) (@fontSizeSmall - 2px);
+
+    h2 {
+      margin: 0px;
+      padding: 0px;
 
       color: @grayDark;
-  	  font-size: @fontSizeSmall;
-  	  font-weight: bold;
-  	  text-align: left;
+      font-size: @fontSizeSmall;
+      font-weight: bold;
+      line-height: @baseLineHeight;
+      text-align: left;
 
       small {
         margin-left: @baseFontSize / 2;
@@ -37,44 +40,51 @@
         color: @grayLight;
         font-size: @fontSizeSmall;
       }
-  	}
-    
-    td {
-      padding: ((@fontSizeLarge / 2) + 6px) (@fontSizeSmall - 2px);
-      padding-bottom: (@fontSizeLarge / 2) + 7px;
+    }
+  }
+
+  .forum {
+    border-bottom: 1px solid @categoryBorder;
+    height: 21px;
+    overflow: visible;
+    padding: ((@fontSizeLarge / 2) + 6px) (@fontSizeSmall - 2px);
+
+    &.last {
+      border-bottom: none;
     }
 
     .forum-icon {
-      padding-right: (@fontSizeSmall / 2) - 3px;
-      width: 1%;
+      float: left;
 
       .forum-icon-wrap {
-      	background-color: @itemOldColor;
-      	border: 1px solid darken(@itemOldColor, 10%);
-    		border-radius: @baseBorderRadius;
-    		padding: (@forumIconSize - 1px) @forumIconSize;
-
-    		&.forum-icon-new {
-  	      background-color: @itemNewColor;
-  	      border: 1px solid darken(@itemNewColor, 10%);
-    		}
-
-    		&.forum-icon-redirect {
-  	      background-color: @itemMovedColor;
-  	      border: 1px solid darken(@itemMovedColor, 10%);
-    		}
+        background-color: @itemOldColor;
+        border: 1px solid darken(@itemOldColor, 10%);
+        border-radius: @baseBorderRadius;
+        padding: (@forumIconSize - 1px) @forumIconSize;
+
+        &.forum-icon-new {
+          background-color: @itemNewColor;
+          border: 1px solid darken(@itemNewColor, 10%);
+        }
+
+        &.forum-icon-redirect {
+          background-color: @itemMovedColor;
+          border: 1px solid darken(@itemMovedColor, 10%);
+        }
       }
     }
-    
+
     .forum-main {
+      margin-left: 34px;
+
       h3 {
         float: left;
-    		margin: 0px;
-    		padding: 0px;
+        margin: 0px;
+        padding: 0px;
 
-    		font-size: @fontSizeLarge;
+        font-size: @fontSizeLarge;
         font-weight: normal;
-    		line-height: @baseLineHeight;
+        line-height: @baseLineHeight;
 
         a:link, a:visited {
           color: @textColor;
@@ -240,46 +250,53 @@
   }
 
   &.index-category-important {
-    caption {
+    .header {
       background-color: @red;
       border: 1px solid darken(@red, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@red, 25%);
+      h2 {
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@red, 25%);
 
-      small {
-        color: darken(@red, 40%);
-        text-shadow: none;
+        small {
+          color: darken(@red, 40%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.index-category-inverse {
-    caption {
+    .header {
       background-color: @grayDark;
       border: 1px solid darken(@grayDark, 10%);
 
-      color: @grayLighter;
-      text-shadow: 0px 1px 0px darken(@black, 25%);
+      h2 {
+        color: @grayLighter;
+        text-shadow: 0px 1px 0px darken(@black, 25%);
 
-      small {
-        color: lighten(@grayLight, 10%);
-        text-shadow: none;
+        small {
+          color: lighten(@grayLight, 10%);
+          text-shadow: none;
+        }
       }
     }
   }
 
   &.index-category-info {
-    caption {
+    .header{
       background-color: @bluePale;
       border: 1px solid darken(@bluePale, 10%);
 
-      color: @white;
-      text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+      h2 {
 
-      small {
-        color: darken(@bluePale, 25%);
-        text-shadow: none;
+        color: @white;
+        text-shadow: 0px 1px 0px darken(@bluePale, 25%);
+
+        small {
+          color: darken(@bluePale, 25%);
+          text-shadow: none;
+        }
       }
     }
   }

+ 60 - 62
templates/cranefly/category.html

@@ -27,70 +27,68 @@
   {% endif %}
   {% if category.subforums %}
   <div id="subforums" class="category-forums-list{% if category.style %} category-forums-{{ category.style }}{% endif %}">
-    <table class="table">
-      <tbody>
-        {% for forum in category.subforums %}
-        <tr>
-          <td class="forum-icon"><span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-          <td id="forum-{{ forum.id }}" class="forum-main">
-            <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
-            {% if forum.show_details %}
-            <div class="forum-details">
-              {% if forum.type != 'redirect' %}
-              {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
-              {% if forum.last_thread_id -%}
-              <div class="thread-name">
-                <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}"{% if forum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ forum.last_thread_name }}"{% endif %}>{{ forum.last_thread_name|short_string(34) }}</a>
-              </div>
-              <div class="muted">{% if forum.last_poster_id %}<a href="{% url 'user' user=forum.last_poster_id, username=forum.last_poster_slug %}" class="last-poster">{{ forum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ forum.last_poster_name }}</span>{% endif %} - {{ forum.last_thread_date|reltimesince }}</div>
-              {%- else -%}
-              <em>{% trans %}This forum is empty{% endtrans %}</em>
-              {%- endif %}
-              {%- else -%}
-              <em>{% trans %}This forum is protected{% endtrans %}</em>
-              {%- endif %}
-              {%- else -%}
-              <div class="thread-name">
-                <a href="{% url 'redirect' slug=forum.slug, forum=forum.id %}">{{ forum.redirect_domain() }}</a>
-              </div>
-              <div class="muted">{% trans count=forum.redirects, clicks=macros.wrap(forum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
-              {%- endif %}
+    {% for forum in category.subforums %}
+    <div class="forum{% if loop.last %} last{% endif %}">
+      <div class="forum-icon">
+        <span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span>
+      </div>
+      <div id="forum-{{ forum.id }}" class="forum-main">
+        <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+        {% if forum.show_details %}
+        <div class="forum-details">
+          {% if forum.type != 'redirect' %}
+          {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
+          {% if forum.last_thread_id -%}
+          <div class="thread-name">
+            <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}"{% if forum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ forum.last_thread_name }}"{% endif %}>{{ forum.last_thread_name|short_string(34) }}</a>
+          </div>
+          <div class="muted">{% if forum.last_poster_id %}<a href="{% url 'user' user=forum.last_poster_id, username=forum.last_poster_slug %}" class="last-poster">{{ forum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ forum.last_poster_name }}</span>{% endif %} - {{ forum.last_thread_date|reltimesince }}</div>
+          {%- else -%}
+          <em>{% trans %}This forum is empty{% endtrans %}</em>
+          {%- endif %}
+          {%- else -%}
+          <em>{% trans %}This forum is protected{% endtrans %}</em>
+          {%- endif %}
+          {%- else -%}
+          <div class="thread-name">
+            <a href="{% url 'redirect' slug=forum.slug, forum=forum.id %}">{{ forum.redirect_domain() }}</a>
+          </div>
+          <div class="muted">{% trans count=forum.redirects, clicks=macros.wrap(forum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
+          {%- endif %}
+        </div>
+        {% endif %}
+        {% if forum.subforums %}
+        <div class="dropdown">
+          {% if forum.subforums|length > 1 %}
+          <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subforums{% endtrans %}</a>
+          <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+            <div class="dropdown-shadow">
+              <ul>
+                {% for subforum in forum.subforums %}
+                <li><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subforum.name }}</a></li>
+                {% endfor %}
+              </ul>
             </div>
+          </div>
+          {% else %}
+          <a href="{{ forum.subforums[0].type|url(slug=forum.subforums[0].slug, forum=forum.subforums[0].id) }}" class="subforum tooltip-top" title="{% trans forum=forum.subforums[0].name %}Go to the {{ forum }} subforum{% endtrans %}">{{ forum.subforums[0].name|short_string(16) }}</a>
+          {% endif %}
+        </div>
+        {% endif%}
+        <div class="hide forum-meta">
+          {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+          <div class="forum-stats">
+            {% if forum.type != 'redirect' %}
+            <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
+            {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
+            {% else %}
+            {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
             {% endif %}
-            {% if forum.subforums %}
-            <div class="dropdown">
-              {% if forum.subforums|length > 1 %}
-              <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subforums{% endtrans %}</a>
-              <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                <div class="dropdown-shadow">
-                  <ul>
-                    {% for subforum in forum.subforums %}
-                    <li><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subforum.name }}</a></li>
-                    {% endfor %}
-                  </ul>
-                </div>
-              </div>
-              {% else %}
-              <a href="{{ forum.subforums[0].type|url(slug=forum.subforums[0].slug, forum=forum.subforums[0].id) }}" class="subforum tooltip-top" title="{% trans forum=forum.subforums[0].name %}Go to the {{ forum }} subforum{% endtrans %}">{{ forum.subforums[0].name }}</a>
-              {% endif %}
-            </div>
-            {% endif%}
-            <div class="hide forum-meta">
-              {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
-              <div class="forum-stats">
-                {% if forum.type != 'redirect' %}
-                <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
-                {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
-                {% else %}
-                {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
-                {% endif %}
-              </div>
-            </div>
-          </td>
-        </tr>
-        {% endfor %}
-      </tbody>
-    </table>
+          </div>
+        </div>
+      </div>
+    </div>
+    {% endfor %}
   </div>
   {% else %}
   <p class="lead">{% trans %}Looks like there are no forums to display in this category.{% endtrans %}</p>

+ 17 - 21
templates/cranefly/forum_map.html

@@ -34,20 +34,17 @@
 
 {% macro draw_category(category) %}
 <div class="forum-map-category{% if category.style %} forum-map-category-{{ category.style }}{% endif %}">
-  <table class="table">
-    <caption>{{ category.name }}</caption>
-    <tbody>
-      {% for forum in category.subforums%}
-      {{ draw_forum(forum) }}
-      {% endfor %}
-    </tbody>
-  </table>
+  <div class="header">
+    <h2>{{ category.name }}</h2>
+  </div>
+  {% for forum in category.subforums%}
+  {{ draw_forum(forum) }}
+  {% endfor %}
 </div>
 {% endmacro %}
 
 {% macro draw_forum(forum, depth=0, branch='', last=false) %}
-<tr>
-  <td class="{% if depth -%}
+  <div class="{% if depth -%}
     forum-map-subforum
     {%- else -%}
     forum-map-forum
@@ -57,19 +54,18 @@
     {%- else -%}
     {{ draw_tree(branch ~ 't') }}
     {%- endif %}{% endif %} <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
-</td>
-</tr>
-{% for subforum in forum.subforums %}
-  {% if depth %}
-    {% if last %}
-    {{ draw_forum(subforum, (depth + 1), (branch ~ 's'), loop.last) }}
+  </div>
+  {% for subforum in forum.subforums %}
+    {% if depth %}
+      {% if last %}
+      {{ draw_forum(subforum, (depth + 1), (branch ~ 's'), loop.last) }}
+      {% else %}
+      {{ draw_forum(subforum, (depth + 1), (branch ~ 'i'), loop.last) }}
+      {% endif %}
     {% else %}
-    {{ draw_forum(subforum, (depth + 1), (branch ~ 'i'), loop.last) }}
+    {{ draw_forum(subforum, (depth + 1), '', loop.last) }}
     {% endif %}
-  {% else %}
-  {{ draw_forum(subforum, (depth + 1), '', loop.last) }}
-  {% endif %}
-{% endfor %}
+  {% endfor %}
 {% endmacro %}
 
 {% macro draw_tree(branch) %}

+ 64 - 64
templates/cranefly/index.html

@@ -14,71 +14,71 @@
 
       {% for category in forums_list %}{% if category.subforums %}
       <div id="{{ category.slug }}" class="index-category{% if category.style %} index-category-{{ category.style }}{% endif %}">
-        <table class="table">
-          <caption>{{ category.name }}{% if category.description %} <small>{{ category.description }}</small>{% endif %}</caption>
-          <tbody>
-            {% for forum in category.subforums %}
-            <tr>
-              <td class="forum-icon"><span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-              <td id="forum-{{ forum.id }}" class="forum-main">
-                <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
-                {% if forum.show_details %}
-                <div class="forum-details">
-                  {% if forum.type != 'redirect' %}
-                  {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
-                  {% if forum.last_thread_id -%}
-                  <div class="thread-name">
-                    <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}"{% if forum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ forum.last_thread_name }}"{% endif %}>{{ forum.last_thread_name|short_string(34) }}</a>
-                  </div>
-                  <div class="muted">{% if forum.last_poster_id %}<a href="{% url 'user' user=forum.last_poster_id, username=forum.last_poster_slug %}" class="last-poster">{{ forum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ forum.last_poster_name }}</span>{% endif %} - {{ forum.last_thread_date|reltimesince }}</div>
-                  {%- else -%}
-                  <em>{% trans %}This forum is empty{% endtrans %}</em>
-                  {%- endif %}
-                  {%- else -%}
-                  <em>{% trans %}This forum is protected{% endtrans %}</em>
-                  {%- endif %}
-                  {%- else -%}
-                  <div class="thread-name">
-                    <a href="{% url 'redirect' slug=forum.slug, forum=forum.id %}">{{ forum.redirect_domain() }}</a>
-                  </div>
-                  <div class="muted">{% trans count=forum.redirects, clicks=macros.wrap(forum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
-                  {%- endif %}
+        <div class="header">
+          <h2>{{ category.name }}{% if category.description %} <small>{{ category.description }}</small>{% endif %}</h2>
+        </div>
+        {% for forum in category.subforums %}
+        <div class="forum{% if loop.last %} last{% endif %}">
+          <div class="forum-icon">
+            <span class="forum-icon-wrap{% if forum.type == 'redirect' %} forum-icon-redirect{% elif not forum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if forum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span>
+          </div>
+          <div id="forum-{{ forum.id }}" class="forum-main">
+            <h3 class="forum-title{% if not forum.is_read %} forum-title-new{% endif %}"><a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}">{{ forum.name }}</a></h3>
+            {% if forum.show_details %}
+            <div class="forum-details">
+              {% if forum.type != 'redirect' %}
+              {% if acl.forums.can_browse(forum) and (acl.threads.can_read_threads(forum) == 2 or (acl.threads.can_read_threads(forum) == 1 and forum.last_poster_id == user.pk)) %}
+              {% if forum.last_thread_id -%}
+              <div class="thread-name">
+                <a href="{% url 'thread_new' thread=forum.last_thread_id, slug=forum.last_thread_slug %}"{% if forum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ forum.last_thread_name }}"{% endif %}>{{ forum.last_thread_name|short_string(34) }}</a>
+              </div>
+              <div class="muted">{% if forum.last_poster_id %}<a href="{% url 'user' user=forum.last_poster_id, username=forum.last_poster_slug %}" class="last-poster">{{ forum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ forum.last_poster_name }}</span>{% endif %} - {{ forum.last_thread_date|reltimesince }}</div>
+              {%- else -%}
+              <em>{% trans %}This forum is empty{% endtrans %}</em>
+              {%- endif %}
+              {%- else -%}
+              <em>{% trans %}This forum is protected{% endtrans %}</em>
+              {%- endif %}
+              {%- else -%}
+              <div class="thread-name">
+                <a href="{% url 'redirect' slug=forum.slug, forum=forum.id %}">{{ forum.redirect_domain() }}</a>
+              </div>
+              <div class="muted">{% trans count=forum.redirects, clicks=macros.wrap(forum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
+              {%- endif %}
+            </div>
+            {% endif %}
+            {% if forum.subforums %}
+            <div class="dropdown">
+              {% if forum.subforums|length > 1 %}
+              <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subforums{% endtrans %}</a>
+              <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+                <div class="dropdown-shadow">
+                  <ul>
+                    {% for subforum in forum.subforums %}
+                    <li><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subforum.name }}</a></li>
+                    {% endfor %}
+                  </ul>
                 </div>
+              </div>
+              {% else %}
+              <a href="{{ forum.subforums[0].type|url(slug=forum.subforums[0].slug, forum=forum.subforums[0].id) }}" class="subforum tooltip-top" title="{% trans forum=forum.subforums[0].name %}Go to the {{ forum }} subforum{% endtrans %}">{{ forum.subforums[0].name|short_string(16) }}</a>
+              {% endif %}
+            </div>
+            {% endif%}
+            <div class="hide forum-meta">
+              {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
+              <div class="forum-stats">
+                {% if forum.type != 'redirect' %}
+                <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
+                {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
+                {% else %}
+                {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
                 {% endif %}
-                {% if forum.subforums %}
-                <div class="dropdown">
-                  {% if forum.subforums|length > 1 %}
-                  <a href="{{ forum.type|url(slug=forum.slug, forum=forum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subforums{% endtrans %}</a>
-                  <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                    <div class="dropdown-shadow">
-                      <ul>
-                        {% for subforum in forum.subforums %}
-                        <li><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subforum.name }}</a></li>
-                        {% endfor %}
-                      </ul>
-                    </div>
-                  </div>
-                  {% else %}
-                  <a href="{{ forum.subforums[0].type|url(slug=forum.subforums[0].slug, forum=forum.subforums[0].id) }}" class="subforum tooltip-top" title="{% trans forum=forum.subforums[0].name %}Go to the {{ forum }} subforum{% endtrans %}">{{ forum.subforums[0].name|short_string(16) }}</a>
-                  {% endif %}
-                </div>
-                {% endif%}
-                <div class="hide forum-meta">
-                  {% if forum.description %}<p class="forum-description">{{ forum.description }}</p>{% endif %}
-                  <div class="forum-stats">
-                    {% if forum.type != 'redirect' %}
-                    <span>{% trans %}Posts{% endtrans %}: <strong>{{ forum.posts|intcomma }}</strong></span>
-                    {% trans %}Threads{% endtrans %}: <strong>{{ forum.threads|intcomma }}</strong>
-                    {% else %}
-                    {% trans %}Clicks{% endtrans %}: <strong>{{ forum.redirects|intcomma }}</strong>
-                    {% endif %}
-                  </div>
-                </div>
-              </td>
-            </tr>
-            {% endfor %}
-          </tbody>
-        </table>
+              </div>
+            </div>
+          </div>
+        </div>
+        {% endfor %}
       </div>
       {% endif %}{% endfor %}
 
@@ -113,7 +113,7 @@
 
     {% if popular_threads %}
     <div class="index-popular-threads">
-      <h3>{% trans %}Popular Threads{% endtrans %}</h3>
+      <h4>{% trans %}Popular Threads{% endtrans %}</h4>
       <ul class="unstyled">
         {% for thread in popular_threads %}
         <li>

+ 63 - 63
templates/cranefly/threads/list.html

@@ -30,71 +30,71 @@
 
   {% if forum.subforums %}
   <div id="subforums" class="forum-subforums-list{% if forum.style %} forum-subforums-{{ forum.style }}{% endif %}">
-    <table class="table">
-      <caption>{% trans %}Child forums{% endtrans %}</caption>
-      <tbody>
-        {% for subforum in forum.subforums %}
-        <tr>
-          <td class="forum-icon"><span class="forum-icon-wrap{% if subforum.type == 'redirect' %} forum-icon-redirect{% elif not subforum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span></td>
-          <td id="forum-{{ subforum.id }}" class="forum-main">
-            <h3 class="forum-title{% if not subforum.is_read %} forum-title-new{% endif %}"><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}">{{ subforum.name }}</a></h3>
-            {% if subforum.show_details %}
-            <div class="forum-details">
-              {% if subforum.type != 'redirect' %}
-              {% if acl.forums.can_browse(subforum) and (acl.threads.can_read_threads(subforum) == 2 or (acl.threads.can_read_threads(subforum) == 1 and subforum.last_poster_id == user.pk)) %}
-              {% if subforum.last_thread_id -%}
-              <div class="thread-name">
-                <a href="{% url 'thread_new' thread=subforum.last_thread_id, slug=subforum.last_thread_slug %}"{% if subforum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ subforum.last_thread_name }}"{% endif %}>{{ subforum.last_thread_name|short_string(34) }}</a>
-              </div>
-              <div class="muted">{% if subforum.last_poster_id %}<a href="{% url 'user' user=subforum.last_poster_id, username=subforum.last_poster_slug %}" class="last-poster">{{ subforum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ subforum.last_poster_name }}</span>{% endif %} - {{ subforum.last_thread_date|reltimesince }}</div>
-              {%- else -%}
-              <em>{% trans %}This forum is empty{% endtrans %}</em>
-              {%- endif %}
-              {%- else -%}
-              <em>{% trans %}This forum is protected{% endtrans %}</em>
-              {%- endif %}
-              {%- else -%}
-              <div class="thread-name">
-                <a href="{% url 'redirect' slug=forum.slug, forum=forum.id %}">{{ forum.redirect_domain() }}</a>
-              </div>
-              <div class="muted">{% trans count=forum.redirects, clicks=macros.wrap(forum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
-              {%- endif %}
+    <div class="header">
+      <h2>{% trans %}Child forums{% endtrans %}</h2>
+    </div>
+    {% for subforum in forum.subforums %}
+    <div class="forum{% if loop.last %} last{% endif %}">
+      <div class="forum-icon">
+        <span class="forum-icon-wrap{% if subforum.type == 'redirect' %} forum-icon-redirect{% elif not subforum.is_read %} forum-icon-new{% endif %}"><i class="icon-{% if subforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %} icon-white"></i></span>
+      </div>
+      <div id="forum-{{ subforum.id }}" class="forum-main">
+        <h3 class="forum-title{% if not subforum.is_read %} forum-title-new{% endif %}"><a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}">{{ subforum.name }}</a></h3>
+        {% if subforum.show_details %}
+        <div class="forum-details">
+          {% if subforum.type != 'redirect' %}
+          {% if acl.forums.can_browse(subforum) and (acl.threads.can_read_threads(subforum) == 2 or (acl.threads.can_read_threads(subforum) == 1 and subforum.last_poster_id == user.pk)) %}
+          {% if subforum.last_thread_id -%}
+          <div class="thread-name">
+            <a href="{% url 'thread_new' thread=subforum.last_thread_id, slug=subforum.last_thread_slug %}"{% if subforum.last_thread_name|length > 34 %} class="tooltip-top" title="{{ subforum.last_thread_name }}"{% endif %}>{{ subforum.last_thread_name|short_string(34) }}</a>
+          </div>
+          <div class="muted">{% if subforum.last_poster_id %}<a href="{% url 'user' user=subforum.last_poster_id, username=subforum.last_poster_slug %}" class="last-poster">{{ subforum.last_poster_name }}</a>{% else %}<span class="last-poster">{{ subforum.last_poster_name }}</span>{% endif %} - {{ subforum.last_thread_date|reltimesince }}</div>
+          {%- else -%}
+          <em>{% trans %}This forum is empty{% endtrans %}</em>
+          {%- endif %}
+          {%- else -%}
+          <em>{% trans %}This forum is protected{% endtrans %}</em>
+          {%- endif %}
+          {%- else -%}
+          <div class="thread-name">
+            <a href="{% url 'redirect' slug=subforum.slug, forum=subforum.id %}">{{ subforum.redirect_domain() }}</a>
+          </div>
+          <div class="muted">{% trans count=subforum.redirects, clicks=macros.wrap(subforum.redirects|intcomma, 'span', 'class="last-poster"') %}{{ clicks }} click{% pluralize %}{{ clicks }} clicks{% endtrans %}</div>
+          {%- endif %}
+        </div>
+        {% endif %}
+        {% if subforum.subforums %}
+        <div class="dropdown">
+          {% if subforum.subforums|length > 1 %}
+          <a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subsubforums{% endtrans %}</a>
+          <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+            <div class="dropdown-shadow">
+              <ul>
+                {% for subsubforum in subforum.subforums %}
+                <li><a href="{{ subsubforum.type|url(slug=subsubforum.slug, forum=subsubforum.id) }}"><i class="icon-{% if subsubforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subsubforum.name }}</a></li>
+                {% endfor %}
+              </ul>
             </div>
+          </div>
+          {% else %}
+          <a href="{{ subforum.subforums[0].type|url(slug=subforum.subforums[0].slug, forum=subforum.subforums[0].id) }}" class="subsubforum tooltip-top" title="{% trans subforum=subforum.subforums[0].name %}Go to the {{ subforum }} subsubforum{% endtrans %}">{{ subforum.subforums[0].name|short_string(16) }}</a>
+          {% endif %}
+        </div>
+        {% endif%}
+        <div class="hide forum-meta">
+          {% if subforum.description %}<p class="forum-description">{{ subforum.description }}</p>{% endif %}
+          <div class="forum-stats">
+            {% if subforum.type != 'redirect' %}
+            <span>{% trans %}Posts{% endtrans %}: <strong>{{ subforum.posts|intcomma }}</strong></span>
+            {% trans %}Threads{% endtrans %}: <strong>{{ subforum.threads|intcomma }}</strong>
+            {% else %}
+            {% trans %}Clicks{% endtrans %}: <strong>{{ subforum.redirects|intcomma }}</strong>
             {% endif %}
-            {% if subforum.subforums %}
-            <div class="dropdown">
-              {% if forum.subforums|length > 1 %}
-              <a href="{{ subforum.type|url(slug=subforum.slug, forum=subforum.id) }}#subforums" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-chevron-down"></i> {% trans %}Subforums{% endtrans %}</a>
-              <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-                <div class="dropdown-shadow">
-                  <ul>
-                    {% for subsubforum in subforum.subforums %}
-                    <li><a href="{{ subsubforum.type|url(slug=subsubforum.slug, forum=subsubforum.id) }}"><i class="icon-{% if subsubforum.type == 'redirect' %}circle-arrow-right{% else %}comment{% endif %}"></i> {{ subsubforum.name }}</a></li>
-                    {% endfor %}
-                  </ul>
-                </div>
-              </div>
-              {% else %}
-              <a href="{{ forum.subforums[0].type|url(slug=forum.subforums[0].slug, forum=forum.subforums[0].id) }}" class="subforum tooltip-top" title="{% trans forum=forum.subforums[0].name %}Go to the {{ forum }} subforum{% endtrans %}">{{ forum.subforums[0].name }}</a>
-              {% endif %}
-            </div>
-            {% endif%}
-            <div class="hide forum-meta">
-              {% if subforum.description %}<p class="forum-description">{{ subforum.description }}</p>{% endif %}
-              <div class="forum-stats">
-                {% if subforum.type != 'redirect' %}
-                <span>{% trans %}Posts{% endtrans %}: <strong>{{ subforum.posts|intcomma }}</strong></span>
-                {% trans %}Threads{% endtrans %}: <strong>{{ subforum.threads|intcomma }}</strong>
-                {% else %}
-                {% trans %}Clicks{% endtrans %}: <strong>{{ subforum.redirects|intcomma }}</strong>
-                {% endif %}
-              </div>
-            </div>
-          </td>
-        </tr>
-        {% endfor %}
-      </tbody>
-    </table>
+          </div>
+        </div>
+      </div>
+    </div>
+    {% endfor %}
   </div>
   {% endif %}