prototype mobile interface

app/assets/stylesheets/mobile.css.scss

@@ -0,0 +1,7 @@
+/*
+ *= require_self
+ *= require "./common/010_reset"
+ *= require "./common/020_base"
+ *= require "./common/030_links"
+ *= require_tree "./mobile"
+*/

app/assets/stylesheets/mobile/paginator.css.scss

@@ -0,0 +1,38 @@
+div.paginator {
+  display: block;
+  padding: 2em 0 1em 0;
+  font-size: 2em;
+  text-align: center;
+  font-weight: bold;
+  clear: both;
+  
+  a {
+    margin: 0 0.25em;
+    padding: 0 0.5em;
+    font-weight: bold;
+    border: 1px solid #EAEAEA;
+  }
+
+  a.arrow {
+    border: none;
+  }
+
+  a.arrow:hover {
+    background: white;
+    color: #9093FF;
+  }
+
+  a.current {
+    border: 1px solid #AAA;
+  }
+
+  a:hover {
+    background: rgb(60, 60, 220);
+    color: white;
+  }
+
+  span {
+    margin: 0 3px;
+    padding: 2px 6px;
+  }
+}

app/assets/stylesheets/mobile/posts.css.scss

@@ -0,0 +1,138 @@
+@import "../common/000_vars.css.scss";
+
+header {
+  margin: 0 0 10px 0;
+  padding: 0 10px;
+  
+  input {
+    font-size: 1.5em;
+  }
+  
+  menu {
+    margin: 0;
+    padding: 0;
+    
+    li {
+      margin: 0;
+      padding: 0;
+      width: 33%;
+      display: inline-block;
+      vertical-align: middle;
+    }
+    
+    li#search-item {
+      input {
+        font-size: 1.5em;
+      }
+    }
+    
+    li#site-item {
+      color: $link_color;
+      font-size: 1.5em;
+      text-align: center;
+    }
+    
+    li#sign-in-item {
+      text-align: right;
+      
+      a {
+        font-weight: bold;
+      }
+    }
+  }
+}
+
+footer {
+  div.paginator {
+    overflow: visible;
+    
+    li {
+      a {
+        border: none;
+      }
+    }
+    
+    li:first-child {
+      float: left;
+    }
+    
+    li:last-child {
+      float: right;
+    }
+  }
+}
+
+div.post-previews {
+  overflow: visible;
+}
+
+article.post-preview {
+  height: 188px;
+  width: 188px;
+  display: inline-block;
+  float: left;
+  text-align: center;
+  vertical-align: middle;
+}
+
+article.post-preview.blacklisted-active {
+  display: none;
+}
+
+article.post-preview img {
+  border: 3px solid transparent;
+}
+
+article.post-preview.post-status-has-parent img {
+  border: 3px solid #CC0;
+}
+
+article.post-preview.post-status-has-children img {
+  border: 3px solid #0F0;
+}
+
+article.post-preview.post-status-pending img {
+  border: 3px solid #00F;
+}
+
+article.post-preview.post-status-flagged img {
+  border: 3px solid #F00;
+}
+
+img#image {
+  margin: 10px;
+}
+
+div#tag-list {
+  padding: 10px;
+  
+  li {
+    display: inline-block;
+
+    a {
+      background: #eee;
+      font-size: 1.5em;
+      font-weight: bold;
+      margin: 0 0.5em;
+      padding: 0.2em 0.5em;
+      border: 1px solid #666;
+      -moz-border-radius: 3px;
+      -webkit-border-radius: 3px;
+      border-radius: 3px;
+    }
+  }
+}
+
+div#c-posts {
+  li.category-1 a {
+    color: #A00;
+  }
+  
+  li.category-3 a {
+    color: #A0A;
+  }
+  
+  li.category-4 a {
+    color: #0A0;
+  }
+}

app/assets/stylesheets/specific/posts.css.scss

@@ -13,25 +13,6 @@ article.post-preview {
   float: left;
   text-align: center;
   vertical-align: middle;
-  
-  div.text-post-preview {
-    font-size: $h2_size;
-    font-weight: bold;
-    height: 150px;
-    width: 150px;
-    display: block;
-    text-align: center;
-    line-height: 150px;
-    border: 1px solid #CCC;
-  }
-}
-
-div.text-post-medium {
-  height: 150px;
-  width: 480px;
-  text-align: center;
-  line-height: 480px;
-  border: 1px solid #CCC;
 }
 
 article.post-preview.blacklisted-active {