Add page layout

Include example page
surjit · Jul 14, 2012 · 7e284d8 · 7e284d8
1 parent 85c73c7
commit 7e284d8
Show file tree

Hide file tree

Showing 6 changed files with 100 additions and 2 deletions.
diff --git a/_config.yml b/_config.yml
@@ -1,3 +1,4 @@
+auto: true
 safe: true
 server: true
 server_port: 4000

diff --git a/_layouts/page.html b/_layouts/page.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8"/>
+        <title>{% if page.title %}{{ page.title }} - {% endif %}PHP: The Right Way</title>
+        <meta name="description" content="{{ page.description }}"/>
+        <meta name="robots" content="index,follow,archive"/>
+        <meta property="og:image" content="http://www.phptherightway.com/images/og-logo.png"/>
+        <meta property="og:title" content="PHP: The Right Way"/>
+        <meta property="og:description" content="An easy-to-read, quick reference for PHP best practices, accepted coding standards, and links to authoritative PHP tutorials around the Web"/>
+        <meta property="og:url" content="http://www.phptherightway.com"/>
+        <meta property="og:site_name" content="PHP: The Right Way"/>
+        <meta property="og:type" content="website"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
+        <link href='http://fonts.googleapis.com/css?family=Alfa+Slab+One|Droid+Serif:400,700' rel='stylesheet' type='text/css'>
+        <link rel="stylesheet" href="/styles/all.css"/>
+        <link rel="stylesheet" href="/styles/syntax.css"/>
+        <link rel="icon" href="/images/favicon.png" type="image/png"/>
+        <script>
+        var _gaq = _gaq || [];
+        _gaq.push(['_setAccount', 'UA-362072-7']);
+        _gaq.push(['_trackPageview']);
+        (function() {
+            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+        })();
+        </script>
+    </head>
+    <body>
+        <header class="interior-site-header">
+            <div class="site-title"><a href="/">PHP</a></div>
+            <div class="site-slogan">The Right Way.</div>
+            <a class="btn btn-h" href="#">Return to Main Page</a>
+            <a class="fork-me" href="https://github.com/codeguy/php-the-right-way">
+                <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub">
+            </a>
+        </header>
+        <div class="interior-site-content">
+            <div class="pbh"><em>You are reading extended content about&hellip;</em></div>
+            {{ content }}
+            <footer class="site-footer" id="site-footer">
+                <p>
+                    <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-sa/3.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" href="http://purl.org/dc/dcmitype/Text" property="dct:title" rel="dct:type">PHP: The Right Way</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://www.twitter.com/codeguy" property="cc:attributionName" rel="cc:attributionURL">Josh Lockhart</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/">Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License</a>.<br />Based on a work at <a xmlns:dct="http://purl.org/dc/terms/" href="http://www.phptherightway.com" rel="dct:source">www.phptherightway.com</a>.
+                </p>
+            </footer>
+        </div>
+    </body>
+</html>
diff --git a/pages/example.md b/pages/example.md
@@ -0,0 +1,27 @@
+---
+layout: page
+title: Example Stand-Alone Page
+---
+
+# Page Title
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+
+Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
+tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
+quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
+consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
+proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
diff --git a/styles/all.css b/styles/all.css
diff --git a/styles/site/site-content.less b/styles/site/site-content.less
@@ -5,6 +5,9 @@
         clear: both;
     }
 }
+.interior-site-content{
+    .pad;
+}
 .top{
     background: #333;
     display: inline-block;

diff --git a/styles/site/site-header.less b/styles/site/site-header.less
@@ -3,7 +3,7 @@
     z-index: 1;
     text-align: center;
 }
-h1.site-title{
+.site-title{
     .mbn;
     font-family: 'Alfa Slab One';
     font-size: @baseline * 4;
@@ -25,3 +25,18 @@ h1.site-title{
 .fork-me{
     z-index: 2;
 }
+
+.interior-site-header{
+    background: #EEE;
+    .inner-shadow(fade(#000, 7%) 0 0 40px);
+    .pas;
+    text-align: center;
+
+    .site-title{
+        font-size: @baseline * 2;
+        line-height: @baseline * 2 !important;
+    }
+    .site-slogan{
+        .mbs;
+    }
+}