Some extra styling tweaks. #208

static/cranefly/css/cranefly.css

@@ -813,6 +813,7 @@ textarea{resize:vertical}
 .btn.btn-icon{padding-left:0 !important;padding-right:0 !important;width:32px;text-align:center}.btn.btn-icon i{margin:0}
 a.btn-link:hover,a.btn-link:active,a.btn-link:focus{color:#333;text-decoration:none}
 .pagination{margin:0;padding:0}.pagination .count{margin-right:10.5px;padding:4px 0;color:#999}
+.pagination .separator{margin-left:14px;margin-right:10.5px;padding:4px 0;color:#555;font-weight:bold}
 .pagination ul{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.pagination ul li{float:left;margin:0;margin-right:4.666666666666667px;padding:0}.pagination ul li a:link,.pagination ul li a:visited{background-color:#fff;border:1px solid #f0f0f0;border-radius:3px;padding:3px 7px;color:#999}.pagination ul li a:link i,.pagination ul li a:visited i{display:inline-block;width:12px;text-align:center}
 .pagination ul li a:active,.pagination ul li a:hover{border:1px solid #999;color:#555}
 .editor{background-color:#fff;border:1px solid #e6e6e6;border-radius:3px;margin-bottom:20px}.editor .editor-error{padding:10.5px;padding-bottom:0;margin-bottom:-10.5px}.editor .editor-error .help-block{color:#cf402e;font-weight:bold}
@@ -1012,7 +1013,7 @@ a.btn-link:hover,a.btn-link:active,a.btn-link:focus{color:#333;text-decoration:n
 .forum-threads-list .threads-actions{background-color:#fbfbfb;border-top:1px solid #d5d5d5;border-radius:0 0 2px 2px;overflow:auto;padding:4px;color:#999;font-size:11.9px}.forum-threads-list .threads-actions form{margin-bottom:0}
 .forum-threads-extra{overflow:auto}.forum-threads-extra.extra-top{margin-bottom:20px}
 .forum-threads-extra .threads-signin-message{float:right}.forum-threads-extra .threads-signin-message a:link,.forum-threads-extra .threads-signin-message a:visited{color:#333}
-.form-prefix{margin:0;padding:0}.form-prefix .btn{background-color:#d4d4d4;border-color:#a2a2a2;opacity:.9;filter:alpha(opacity=90);color:#555;text-shadow:none}.form-prefix .btn.btn-active{background-color:#555;border-color:#222;color:#fff;text-shadow:0 1px 1px #222}
+.form-prefix{margin:0;padding:0}.form-prefix .btn{background-color:#d4d4d4;border-color:#a2a2a2;opacity:.9;filter:alpha(opacity=90);outline:none;color:#555;text-shadow:none}.form-prefix .btn.btn-active{background-color:#555;border-color:#222;color:#fff;text-shadow:0 1px 1px #222}
 .form-prefix .btn.btn-cancel{background-color:#fff;border-color:#b3b3b3}.form-prefix .btn.btn-cancel:hover,.form-prefix .btn.btn-cancel:active{background-color:#555;border-color:#222;color:#fff;text-shadow:0 1px 1px #222}
 .form-prefix .btn.btn-success,.form-prefix .btn.btn-success:hover,.form-prefix .btn.btn-success:active{background-color:#cdeacd;border-color:#86cb86;color:#46a546}
 .form-prefix .btn.btn-success.btn-active{background-color:#46a546;border-color:#285d28;color:#fff;text-shadow:0 1px 1px #285d28}

static/cranefly/css/cranefly/forum.less

@@ -612,6 +612,7 @@
     background-color: lighten(@gray, 50%);
     border-color: lighten(@gray, 30%);
     .opacity(90);
+    outline: none;
 
     color: @gray;
     text-shadow: none;

static/cranefly/css/cranefly/pagination.less

@@ -11,6 +11,15 @@
     color: @grayLight;
   }
 
+  .separator {
+    margin-left: @baseFontSize;
+    margin-right: @baseFontSize * 0.75;
+    padding: 4px 0px;
+
+    color: @gray;
+    font-weight: bold;
+  }
+
   ul {
     .box-shadow(none);
 
@@ -29,10 +38,10 @@
         color: @grayLight;
 
         i {
-        	display: inline-block;
-        	width: @baseFontSize - 2px;
+          display: inline-block;
+          width: @baseFontSize - 2px;
 
-        	text-align: center;
+          text-align: center;
         }
       }
 

templates/cranefly/threads/list.html

@@ -105,7 +105,7 @@
   {% endif %}
 
   <div class="forum-threads-extra extra-top">
-    {{ pager() }}
+    {{ pager(True) }}
     {% if user.is_authenticated() and acl.threads.can_start_threads(forum) %}
     <a href="{{ url('thread_start', forum=forum.pk, slug=forum.slug) }}" class="btn btn-inverse pull-right"><i class="icon-plus"></i> {% trans %}New Thread{% endtrans %}</a>
     {% endif %}
@@ -284,7 +284,7 @@
 <strong{% if delta < number %} class="stat-increment"{% endif %}>{{ number|intcomma }}</strong>
 {%- endmacro %}
 
-{% macro pager() %}
+{% macro pager(first=False) %}
 {% if pagination['total'] > 0 %}
 <div class="pagination pull-left">
   <ul>
@@ -292,13 +292,17 @@
     {%- if pagination['prev'] > 1 %}<li><a href="{{ url('forum', slug=forum.slug, forum=forum.id) }}" class="tooltip-top" title="{% trans %}First Page{% endtrans %}"><i class="icon-chevron-left"></i> {% trans %}First{% endtrans %}</a></li>{% endif -%}
     {%- if pagination['prev'] > 0 %}<li><a href="{%- if pagination['prev'] > 1 %}{{ url('forum', slug=forum.slug, forum=forum.id, page=pagination['prev']) }}{% else %}{{ url('forum', slug=forum.slug, forum=forum.id) }}{% endif %}" class="tooltip-top" title="{% trans %}Newest Threads{% endtrans %}"><i class="icon-chevron-left"></i></a></li>{% endif -%}
     {%- if pagination['next'] > 0 %}<li><a href="{{ url('forum', slug=forum.slug, forum=forum.id, page=pagination['next']) }}" class="tooltip-top" title="{% trans %}Older Threads{% endtrans %}"><i class="icon-chevron-right"></i></a></li>{% endif -%}
+    {% if first%}
+    {% if prefixes %}
+    <li class="separator">{% trans %}Show Threads:{% endtrans %}</li>
+    {% endif %}
     {% if prefixes and active_prefix %}
     <li>
       <form class="form-prefix" action="{{ url('forum_switch_prefix', slug=forum.slug, forum=forum.id) }}" method="POST">
         <input type="hidden" name="{{ csrf_id }}" value="{{ csrf_token }}">
         <input type="hidden" name="retreat" value="{{ request_path }}">
         <input type="hidden" name="switch_prefix" value="0">
-        <button type="submit" class="btn btn-cancel">{% trans %}All Threads{% endtrans %}</button>
+        <button type="submit" class="btn btn-cancel">{% trans %}All{% endtrans %}</button>
       </form>
     </li>
     {% endif %}
@@ -312,6 +316,7 @@
       </form>
     </li>
     {% endfor %}
+    {% endif %}
   </ul>
 </div>
 {% endif %}