mobile friendly styling added

This commit is contained in:
Christian Mueller
2014-01-20 23:04:09 +01:00
parent 8a6eadf79a
commit a13d9cd415
3 changed files with 102 additions and 93 deletions
+6 -3
View File
@@ -1,8 +1,11 @@
## News ## News
- January 2014: NoteHub API v1.0 [introduced](/api).
- January 2014: NoteHub 2.0 released: new theme, more performance, extended markdown - January 2014:
- 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)) - 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 ## About
[NoteHub](http://notehub.org) is a free and hassle-free anonymous pastebin for markdown pages intended for anonymous one-off publishing. [NoteHub](http://notehub.org) is a free and hassle-free anonymous pastebin for markdown pages intended for anonymous one-off publishing.
+12 -7
View File
@@ -20,17 +20,28 @@
font-weight: 300; font-weight: 300;
font-family: 'Helvetica Neue','Helvetica','Arial','Lucida Grande','sans-serif'; font-family: 'Helvetica Neue','Helvetica','Arial','Lucida Grande','sans-serif';
} }
.central-element { .central-element {
@media screen and (min-width: 1024px) {
width: @width; width: @width;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
@media screen and (max-width: 1023px) {
margin-left: 1em;
margin-right: 1em;
}
}
.thin-border { .thin-border {
border: 1px solid @foreground; border: 1px solid @foreground;
} }
// end mixins // end mixins
.ui-border {
border-radius: 3px;
.thin-border;
}
code, pre { code, pre {
font-family: "Menlo", "Andale Mono", "Consolas", Fixed, monospace; font-family: "Menlo", "Andale Mono", "Consolas", Fixed, monospace;
font-size: 0.9em; font-size: 0.9em;
@@ -43,17 +54,12 @@ a {
a:hover { a:hover {
color: @link_hover; color: @link_hover;
} }
a:visited { a:visited {
color: @link_visited; color: @link_visited;
} }
#draft { #draft {
margin-bottom: 3em; margin-bottom: 3em;
} }
.ui-border {
border-radius: 3px;
.thin-border;
}
.button { .button {
cursor: pointer; cursor: pointer;
} }
@@ -124,7 +130,6 @@ article {
article p { article p {
line-height: 140%; line-height: 140%;
} }
article > h1:first-child { article > h1:first-child {
text-align: center; text-align: center;
font-size: 2em; font-size: 2em;
+1
View File
@@ -29,6 +29,7 @@
[:head [:head
[:title (print-str (get-message :name) "—" title)] [:title (print-str (get-message :name) "—" title)]
[:meta {:charset "UTF-8"}] [: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"}] [:link {:rel "stylesheet/less" :type "text/css" :href "/style.less"}]
(html (html
(include-js "/js/less.js") (include-js "/js/less.js")