Merge pull request #46 from ZiRo-/master

add images to catalog; style catalog properly

contrib/static/site.css

@@ -158,24 +158,39 @@ hr {
 }
 
 .catalog_thread {
-  float: left;
-  width: 256px;
+    display: inline-block;
+    width: 180px;
     text-align: center;
-  padding: 2px;
-  height: 256px;
+    padding: 0.25em;
+    height: 240px;
     overflow: hidden;
+    background-color: rgba(182, 182, 182 ,0.12);
+    margin: 0.1em;
+    border: 2px solid rgba(111, 111, 111, 0.34);
+}
+
+.catalog_thread:hover {
      background-color: #D6DAF0;
-  margin: 2px;
-  border-style: solid;
-  border-width: 1px;
-  border-style: solid;
-  height: 256px;
+}
+
+#catalog_container {
+    width: 95%;
+    margin: 1em auto;
+    text-align: center;
 }
 
 .catalog_header, .catalog_subject {
     font-weight: bold;
 }
 
+.linkThumb img {
+    max-height: 128px;
+    max-width: 128px;
+    box-shadow: 0 0 4px rgba(0,0,0,0.55);
+    border: 2px solid rgba(153,153,153,0);
+    margin-bottom: 5px;
+}
+
 a:hover , a:visited:hover {
     color: #ff0000;
 }

contrib/templates/default/catalog.mustache

@@ -18,10 +18,10 @@
     <div class="board_header">Catalog for {{board.Name}}</div>
     <!-- postform -->
     <hr />
-    <div id="threads_container">
+    <div id="catalog_container">
       {{#board.Threads}}
         <div class="catalog_thread">
-          <a href="{{OP.PostURL}}">[Open]</a>
+          <a class="linkThumb" href="{{OP.PostURL}}"><img src="{{OP.RepresentativeThumb}}"></a>
           <div class="catalog_header">R: {{ReplyCount}} / P: {{Page}}</div>
           <div class="catalog_subject">{{OP.Subject}}</div>
           <div class="catalog_body">

contrib/templates/default/postform.mustache

@@ -69,7 +69,7 @@
              Solution
            </th>
            <td>
-             <input type="text" name="captcha" />
+             <input type="text" name="captcha" autocomplete="off" />
            </td>
          </tr>
        </tbody>

contrib/templates/default/thread.mustache

@@ -45,7 +45,7 @@
       {{/ thread.Replies}}
     </div>
     <hr/>
-    <div class="navLinks">[<a href="{{thread.BoardURL}}" accesskey="a">Return</a>] [<a href="#thread_{{thread.OP.PostHash}}">Top</a>] [<a href="#navlinks" accesskey="r" onclick="location.reload();">Update</a>]</div>
+    <div class="navLinks">[<a href="{{thread.BoardURL}}" accesskey="a">Return</a>] [<a href="{{thread.Prefix}}catalog-{{thread.Board}}.html" accesskey="r">Catalog</a>] [<a href="#thread_{{thread.OP.PostHash}}">Top</a>] [<a href="#navlinks" accesskey="r" onclick="location.reload();">Update</a>]</div>
       <script type="text/javascript">
           var e = document.getElementById("nntpchan_banner");
           nntpchan_inject_banners(e, "{{thread.Prefix}}");