Merge pull request felixge#27 from MohammedFadin/master

felixge · felixge · commit 59821bf657ce · 2014-12-09T14:04:59.000+01:00
Added Responsive Support
diff --git a/Makefile b/Makefile
@@ -1,10 +1,11 @@
 GUIDES = $(notdir $(wildcard guide/*.pdc))
 HTML_GUIDES = $(addprefix public/,$(GUIDES:.pdc=.html))
 PANDOC_DEFAULT_OPTIONS = \
-		-5 \
+		--to html5 \
 		-c css/screen.css \
 		-B template/header.html \
-		-A template/footer.html
+		-A template/footer.html \
+		-H template/meta.html
 PANDOC_GUIDE_OPTIONS = \
 		-B template/navigation.html \
 		--toc
diff --git a/public/css/screen.css b/public/css/screen.css
@@ -1,3 +1,22 @@
+@media only screen and (min-width: 1224px){
+  .container{
+    width: 960px;
+    margin: 0 auto;
+  }
+}
+
+@media only screen and (orientation: portrait){
+  code{
+      white-space: pre-wrap; /* No code overlap */
+  }
+}
+
+@media only screen and (orientation: landscape){
+  code{
+      white-space: pre-wrap;
+  }
+}
+
 body{
   font-family: Georgia,serif;
 }
@@ -14,11 +33,6 @@ a:visited{
   color: #B950B7;
 }
 
-.container{
-  width: 960px;
-  margin: 0 auto;
-}
-
 .shell, pre.sourceCode{
   -moz-border-radius: 5px;
   padding: 10px;
@@ -41,7 +55,7 @@ h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover{
   text-decoration: underline;
 }
 
-code.sourceCode span.kw { color: #C6C5FE; font-weight: bold; } 
+code.sourceCode span.kw { color: #C6C5FE; font-weight: bold; }
 code.sourceCode span.dt { color: #fff; }
 code.sourceCode span.dv { color: #FF73FD; }
 code.sourceCode span.bn { color: #40a070; }
diff --git a/template/meta.html b/template/meta.html
@@ -0,0 +1,3 @@
+<meta name="description" content="Unofficial guide to Node.JS">
+<meta name="author" content="Felix Geisendörfer">
+<meta name="viewport" content="width=device-width, initial-scale=1">

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+<meta name="description" content="Unofficial guide to Node.JS">`
	`2`	`+<meta name="author" content="Felix Geisendörfer">`
	`3`	`+<meta name="viewport" content="width=device-width, initial-scale=1">`