Mention FluentCV.

_includes/head.html

@@ -2,7 +2,7 @@
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="chrome=1">
   <title>{{ site.title }}</title>
-  <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700' rel='stylesheet' type='text/css'>
+  <link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="/css/main.css">
   <meta name="viewport" content="width=device-width">
   <!--[if lt IE 9]>

_layouts/home.html

@@ -5,6 +5,7 @@ layout: master-bare
   <header>
     <h1><img src="android-chrome-48x48.png" class="logo">{{ site.titleMarkup }}</h1>
     <p>A Swiss Army Knife for <strong>résumés and CVs</strong><br>For Windows, OS X, Linux, and Node.js</p>
+    {{ content }}
     <p><strong>Install</strong> with NPM:<br><br><code>npm install hackmyresume -g</code></p>
     <p><strong>Feed me</strong>: One or more <a href="https://github.com/fluentdesk/FRESCA">FRESH</a> or <a href="https://github.com/json-resume/json-resume-schema">JSON Resume</a> format résumés.</p>
     <p><strong>Sit back</strong> while I generate polished résumés in HTML, WORD, Markdown, PDF, LaTeX, JSON, YAML, XML, plain text, smoke signal, and carrier pigeon.</p>
@@ -16,15 +17,14 @@ layout: master-bare
       <li><a href="{{ site.github_url }}">View on <strong>GitHub</strong></a></li>
       <li><a href="jane/resume">See a <strong>SAMPLE</strong></a></li>
     </ul>
+    <p>This project is maintained by <a href="https://github.com/{{ site.github_username }}">{{ site.author_name }}</a><br>
+    Hosted on GitHub Pages</p>
   </header>
-
-  <section>
-  {{ content }}
-  </section>
-
-  <footer>
-    <p>This project is maintained by <a href="https://github.com/{{ site.github_username }}">{{ site.author_name }}</a></p>
-    <p><small>Hosted on GitHub Pages &mdash; Theme by <a href="https://github.com/orderedlist">orderedlist</a></small></p>
-  </footer>
 </div>
+<footer>
+  <div class="wrapper">
+    <h1>Not a fan of the command line? Check out <a href="http://fluentcv.com">FluentCV Desktop</a>.</h1>
+    <a href="http://fluentcv.com"><img src="img/fluentcv_desktop.png" id="fluentcv"></a>
+  </div>
+</footer>
 <script src="/js/scale.fix.js"></script>

_sass/_hackmyresume.scss

@@ -2,7 +2,7 @@
 
 body {
   background-color: #fff;
-  padding:50px;
+  padding: 0; margin: 0;
   font: 14px/1.5 $base-font;
   color:#727272;
   font-weight:400;
@@ -24,6 +24,9 @@ h1, h2, h3 {
 h1 {
   font-size:28px;
   margin-bottom: 0;
+  position: relative;
+  padding-left: 17px;
+  font-family: $title-font;
 }
 
 h2 {
@@ -34,6 +37,13 @@ h3, h4, h5, h6 {
   color:#494949;
 }
 
+p > code {
+  background-color: #EAEAEA;
+  padding: 5px;
+  text-transform: none;
+  letter-spacing: 1px;
+}
+
 a {
   color:#39c;
   text-decoration:none;
@@ -55,8 +65,14 @@ a:hover small {
 }
 
 .wrapper {
-  width:860px;
+  width: 100%;
+  max-width: 1150px;
   margin:0 auto;
+  padding: 40px 20px;
+  // Expand with height of floated children
+  // http://stackoverflow.com/q/804926/4942583
+  overflow: hidden;
+  position: relative;
 }
 
 blockquote {
@@ -104,11 +120,15 @@ img {
   max-width:100%;
 }
 
+
+header, section, footer, img, .wrapper {
+  box-sizing: border-box;
+}
+
 header {
-  width:270px;
+  position: static;
-  float:left;
-  position:fixed;
   -webkit-font-smoothing:subpixel-antialiased;
+  min-width: 250px;
 }
 
 header ul {
@@ -128,6 +148,13 @@ header li {
   height:40px;
 }
 
+header > p {
+  text-transform: uppercase;
+  font-size: 80%;
+  margin: 0;
+  margin-bottom: 15px;
+}
+
 header li:first-child a {
   border-radius:5px 0 0 5px;
 }
@@ -171,9 +198,11 @@ header ul a strong {
 }
 
 section {
-  width:500px;
+  width: 66%;
-  float:right;
+  float: left;
+  max-width: 750px;
   padding-bottom:50px;
+  position: relative;
 }
 
 small {
@@ -188,84 +217,56 @@ hr {
 }
 
 footer {
-  width:270px;
+  width: 100%;
-  float:left;
+  float: none;
-  position:fixed;
+  position: static;
-  bottom:50px;
   -webkit-font-smoothing:subpixel-antialiased;
+  background-color: #232323;
+  padding: 0;
+  h1 {
+    color: #DADADA;
+    text-align: center;
+    font-weight: 300;
+    font-size: 44px;
+    margin-bottom: 1em;
+    padding-left: 0;
+  }
+  a {
+    color: #4EC4FF;
+    &:hover {
+      color: #A8E2FF;
+    }
+  }
 }
 
-@media print, screen and (max-width: 960px) {
+img.main {
+  border: solid 10px #000;
+  border-radius: 10px;
+  margin: 0;
+  max-width: 100%;
+  margin-bottom: 15px;
+}
 
-  div.wrapper {
+img.logo {
-    width:auto;
+  position: absolute;
-    margin:0;
+  width: 24px;
+  top: 4px;
+  left: -5px;
+}
+
+img#fluentcv {
+  display: block;
+  margin: 0 auto;
+}
+
+@media screen and (min-width: 760px) {
+  img.main {
+    position: absolute;
+    right: 20px; top: 40px;
+    width: 60%;
   }
-
-  header, section, footer {
-    float:none;
-    position:static;
-    width:auto;
-  }
-
   header {
-    padding-right:320px;
+    width: 33%;
-  }
+    max-width: 400px;
-
-  section {
-    border:1px solid #e5e5e5;
-    border-width:1px 0;
-    padding:20px 0;
-    margin:0 0 20px;
-  }
-
-  header a small {
-    display:inline;
-  }
-
-  header ul {
-    position:absolute;
-    right:50px;
-    top:52px;
-  }
-}
-
-@media print, screen and (max-width: 720px) {
-  body {
-    word-wrap:break-word;
-  }
-
-  header {
-    padding:0;
-  }
-
-  header ul, header p.view {
-    position:static;
-  }
-
-  pre, code {
-    word-wrap:normal;
-  }
-}
-
-@media print, screen and (max-width: 480px) {
-  body {
-    padding:15px;
-  }
-
-  header ul {
-    width:99%;
-  }
-
-  header li, header ul li + li + li {
-    width:33%;
-  }
-}
-
-@media print {
-  body {
-    padding:0.4in;
-    font-size:12pt;
-    color:#444;
   }
 }

_sass/_hmr.scss

@@ -1,74 +0,0 @@
-header > p {
-  text-transform: uppercase;
-  font-size: 80%;
-  margin: 0;
-  margin-bottom: 15px;
-}
-
-.wrapper {
-  max-width: 1150px;
-  width: 100%;
-}
-
-p > code {
-  background-color: #EAEAEA;
-  padding: 5px;
-  text-transform: none;
-  letter-spacing: 1px;
-}
-
-header {
-  position: static;
-  width: 33%;
-  max-width: 400px;
-}
-
-section {
-  width: 66%;
-  float: left;
-  max-width: 750px;
-}
-
-header, section, img {
-  box-sizing: border-box;
-}
-
-img.main {
-  border: solid 10px #000;
-  border-radius: 10px;
-  margin: 0 20px;
-}
-
-img.logo {
-  position: absolute;
-  width: 24px;
-  top: 4px;
-  left: -5px;
-}
-
-h1 {
-  position: relative;
-  padding-left: 17px;
-  font-family: $title-font;
-}
-
-@media print, screen and (max-width: 960px) {
-  header {
-    width: auto;
-    padding-right: 0;
-
-  }
-  img {
-    margin: 0;
-  }
-  header ul {
-      /* position: absolute; */
-      position: static;
-      right: 50px;
-      top: 52px;
-  }
-  section {
-    float: none;
-    width: auto;
-  }
-}

css/main.scss

@@ -7,4 +7,4 @@ $base-font: "Noto Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
 $title-font: 'Open Sans Condensed', $base-font;
 
 // Import partials from `sass_dir` (defaults to `_sass`)
-@import "minimal", "syntax-highlighting", "hmr";
+@import "syntax-highlighting", "hackmyresume";