mobile friendly styling added

LANDING.md

@@ -1,8 +1,11 @@
 ## News
 
- - January 2014: NoteHub API v1.0 [introduced](/api).
- - January 2014: NoteHub 2.0 released: new theme, more performance, extended markdown
- - September 2013: Solarized color theme [added](https://github.com/chmllr/NoteHub/pull/4) (thanks Brandon!) ([Demo](http://notehub.org/2012/6/16/how-notehub-is-built?theme=solarized-dark))
+
+ - January 2014:
+   - Mobile friendly styling added.
+   - NoteHub API v1.0 [introduced](/api).
+   - NoteHub 2.0 released: new theme, more performance, extended markdown.
+ - September 2013: Solarized color theme [added](https://github.com/chmllr/NoteHub/pull/4) (thanks Brandon!) ([Demo](http://notehub.org/2012/6/16/how-notehub-is-built?theme=solarized-dark)).
 
 ## About
 [NoteHub](http://notehub.org) is a free and hassle-free anonymous pastebin for markdown pages intended for anonymous one-off publishing.

resources/public/style.less

@@ -20,17 +20,28 @@
   font-weight: 300;
   font-family: 'Helvetica Neue','Helvetica','Arial','Lucida Grande','sans-serif';
 }
+
 .central-element {
+  @media screen and (min-width: 1024px) {
     width: @width;
     margin-left: auto;
     margin-right: auto;
+  }
+  @media screen and (max-width: 1023px) {
+    margin-left: 1em;
+    margin-right: 1em;
+  }
 }
 .thin-border {
   border: 1px solid @foreground;
 }
-
 // end mixins
 
+.ui-border {
+  border-radius: 3px;
+  .thin-border;
+}
+
 code, pre {
   font-family: "Menlo", "Andale Mono", "Consolas", Fixed, monospace;
   font-size: 0.9em;
@@ -43,17 +54,12 @@ a {
 a:hover {
   color: @link_hover;
 }
-
 a:visited {
   color: @link_visited;
 }
 #draft {
   margin-bottom: 3em;
 }
-.ui-border {
-    border-radius: 3px;
-    .thin-border;
-}
 .button {
   cursor: pointer;
 }
@@ -124,7 +130,6 @@ article {
 article p {
   line-height: 140%;
 }
-
 article > h1:first-child {
   text-align: center;
   font-size: 2em;

src/NoteHub/views/pages.clj

@@ -29,6 +29,7 @@
    [:head
     [:title (print-str (get-message :name) "—" title)]
     [:meta {:charset "UTF-8"}]
+    [:meta {:name "viewport" :content "width=device-width, initial-scale=1.2"}]
     [:link {:rel "stylesheet/less" :type "text/css" :href "/style.less"}]
     (html
      (include-js "/js/less.js")