css: make forum post borders mobile-only.

* Remove box shadows around forum posts.
* Make borders around forum posts mobile only.

app/javascript/src/styles/base/040_colors.css

@@ -52,8 +52,8 @@
   --forum-vote-up-color: green;
   --forum-vote-meh-color: goldrenrod;
   --forum-vote-down-color: red;
-  --forum-post-box-shadow: 1px 1px 2px #AAA;
+  --forum-post-border: 1px solid #DDD;
-  --forum-post-border: 1px solid #AAA;
+  --forum-post-author-background: #EEE;
   --forum-post-highlight-background-color: #FFC;
 
   --comment-sticky-background-color: var(--subnav-menu-background-color);

app/javascript/src/styles/specific/forum.scss

@@ -1,9 +1,7 @@
 div.list-of-forum-posts {
   article {
-    border: var(--forum-post-border);
     margin: 1em 0em;
     word-wrap: break-word;
-    box-shadow: var(--forum-post-box-shadow);
 
     a.voted {
       font-weight: bold;
@@ -86,3 +84,27 @@ div#c-forum-topics {
     color: var(--forum-deleted-topic-color);
   }
 }
+
+@media screen and (max-width: 660px) {
+  #c-forum-topics #a-show {
+    padding: 0 0.5em;
+  }
+
+  div.list-of-forum-posts article {
+    border: var(--forum-post-border);
+
+    div.author, div.content {
+      width: auto;
+      float: none;
+    }
+
+    div.author {
+      border-bottom: var(--forum-post-border);
+      background: var(--forum-post-author-background);
+    }
+
+    div.content {
+      margin-left: 0;
+    }
+  }
+}

app/views/forum_posts/_listing.html.erb

@@ -6,13 +6,3 @@
     <%= render "forum_posts/forum_post", :forum_post => forum_post, :original_forum_post_id => original_forum_post_id %>
   <% end %>
 </div>
-
-<% content_for(:html_header) do %>
-  <style>
-    @media screen and (max-width: 660px) {
-      #a-show { padding: 1em 0.5em; }
-      div.list-of-forum-posts article div.author { width: auto; float: none; border-bottom: 1px solid #999; background: #F0F0F0; }
-      div.list-of-forum-posts article div.content { width: auto; float: none; margin-left: 0; }
-    }
-  </style>
-<% end %>