template like developmentseed and better font

_config_dev.yml

@@ -0,0 +1,14 @@
+# Site settings
+title: Darbadar
+email: [email protected]
+description: > # this means to ignore newlines until "baseurl:"
+  Travel Blog 123
+baseurl: "" # the subpath of your site, e.g. /blog/
+url: "" # the base hostname & protocol for your site
+twitter_username: jekyllrb
+github_username:  harshac
+permalink: /:year/:month/:title
+timezone: Asia/Kolkata
+
+# Build settings
+markdown: kramdown

_includes/head.html

@@ -9,4 +9,5 @@
   <link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl | prepend: site.url}}">
   <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
   <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" />
+  <link href='http://fonts.googleapis.com/css?family=Source+Serif+Pro|Source+Sans+Pro:300,400,800' rel='stylesheet' type='text/css'>
 </head>

_includes/header.html

@@ -5,7 +5,7 @@
     <a class="site-title" href="{{ site.baseurl }}/"><img src="/assets/name.png"/></a>
 
     <nav class="site-nav">
-      <a href="#" class="menu-icon">
+      <a class="menu-icon">
         <svg viewBox="0 0 18 15">
           <path fill="#424242" d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.031C17.335,0,18,0.665,18,1.484L18,1.484z"/>
           <path fill="#424242" d="M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0c0-0.82,0.665-1.484,1.484-1.484 h15.031C17.335,6.031,18,6.696,18,7.516L18,7.516z"/>

_posts/2001-09-20-address-to-the-nation-george-w-bush.md

@@ -1,13 +1,8 @@
 ---
-layout: default
+layout: post
 title: "Address to the Nation"
-categories: speeches
-speaker: "George W. Bush"
 ---
 
-# Address to the Nation
-by George W. Bush on September 20, 2001
-
 Mr. Speaker, Mr. President Pro Tempore, members of Congress, and fellow Americans:
 
 In the normal course of events, Presidents come to this chamber to report on the state of the Union. Tonight, no such report is needed. It has already been delivered by the American people.

_posts/2008-09-08-america-and-the-spirit-of-volunteerism-george-w-bush.md

@@ -1,13 +1,8 @@
 ---
-layout: default
+layout: post
 title: "America and the Spirit of Volunteerism"
-categories: speeches
-speaker: "George W. Bush"
 ---
 
-# America and the Spirit of Volunteerism
-by George W. Bush on September 8, 2008
-
 Thank you, all. Please be seated. Welcome to the South Ground of the White House. It is a joy to be here with members of the armies of compassion. I'm really glad you're here and I appreciate your inspiration to our fellow citizens. I believe you are a constant reminder of the true source of our nation's strength, which is the good hearts and souls of the American people.
 
 We have seen the good hearts of our people over the last week as caring volunteers have helped their fellow citizens through Hurricane Gustav and Tropical Storm Hanna. The Red Cross, which provides a vital role in helping the relief efforts and recovery efforts, has been spending millions of dollars to provide shelter and food for evacuees and to help with the clean-up efforts. Yet charitable contributions have not kept pace with their expenses, and I hope our fellow citizens will support the Red Cross, particularly as Hurricane Ike and other storms develop over the Gulf Coast. You can help by going to the Red Cross's website -- redcross.org -- and make a vital contribution to help our fellow citizens.

_posts/2011-11-11-the-adventure-of-the-cardboard-box.md

@@ -1,13 +1,8 @@
 ---
-layout: default
+layout: post
 title: "The Adventure of the Cardboard Box"
-author: "Arthur Conan Doyle"
-categories: literature
 ---
 
-# The Adventure of the Cardboard Box
-by Arthur Conan Doyle
-
 In choosing a few typical cases which illustrate the remarkable mental qualities of my friend, Sherlock Holmes, I have endeavoured, as far as possible, to select those which presented the minimum of sensationalism, while offering a fair field for his talents. It is, however, unfortunately impossible entirely to separate the sensational from the criminal, and a chronicler is left in the dilemma that he must either sacrifice details which are essential to his statement and so give a false impression of the problem, or he must use matter which chance, and not choice, has provided him with. With this short preface I shall turn to my notes of what proved to be a strange, though a peculiarly terrible, chain of events.
 
 It was a blazing hot day in August. Baker Street was like an oven, and the glare of the sunlight upon the yellow brickwork of the house across the road was painful to the eye. It was hard to believe that these were the same walls which loomed so gloomily through the fogs of winter. Our blinds were half-drawn, and Holmes lay curled upon the sofa, reading and re-reading a letter which he had received by the morning post. For myself, my term of service in India had trained me to stand heat better than cold, and a thermometer at ninety was no hardship. But the morning paper was uninteresting. Parliament had risen. Everybody was out of town, and I yearned for the glades of the New Forest or the shingle of Southsea. A depleted bank account had caused me to postpone my holiday, and as to my companion, neither the country nor the sea presented the slightest attraction to him. He loved to lie in the very center of five millions of people, with his filaments stretching out and running through them, responsive to every little rumour or suspicion of unsolved crime. Appreciation of nature found no place among his many gifts, and his only change was when he turned his mind from the evil-doer of the town to track down his brother of the country.

_posts/2012-06-09-the-adventure-of-the-dying-detective.md

@@ -1,13 +1,9 @@
 ---
-layout: default
+layout: post
 title: "The Adventure of the Dying Detective"
-author: "Arthur Conan Doyle"
 categories: literature
 ---
 
-# The Adventure of the Dying Detective
-by Arthur Conan Doyle
-
 Mrs. Hudson, the landlady of Sherlock Holmes, was a long-suffering woman. Not only was her first-floor flat invaded at all hours by throngs of singular and often undesirable characters but her remarkable lodger showed an eccentricity and irregularity in his life which must have sorely tried her patience. His incredible untidiness, his addiction to music at strange hours, his occasional revolver practice within doors, his weird and often malodorous scientific experiments, and the atmosphere of violence and danger which hung around him made him the very worst tenant in London. On the other hand, his payments were princely. I have no doubt that the house might have been purchased at the price which Holmes paid for his rooms during the years that I was with him.
 
 The landlady stood in the deepest awe of him and never dared to interfere with him, however outrageous his proceedings might seem. She was fond of him, too, for he had a remarkable gentleness and courtesy in his dealings with women. He disliked and distrusted the sex, but he was always a chivalrous opponent. Knowing how genuine was her regard for him, I listened earnestly to her story when she came to my rooms in the second year of my married life and told me of the sad condition to which my poor friend was reduced.

_posts/2012-07-24-the-adventure-of-the-veiled-lodger.md

@@ -1,13 +1,8 @@
 ---
-layout: default
+layout: post
 title: "The Adventure of the Veiled Lodger"
-author: "Arthur Conan Doyle"
-categories: literature
 ---
 
-# The Adventure of the Veiled Lodger
-by Arthur Conan Doyle
-
 When one considers that Mr. Sherlock Holmes was in active practice for twenty-three years, and that during seventeen of these I was allowed to cooperate with him and to keep notes of his doings, it will be clear that I have a mass of material at my command. The problem has always been not to find but to choose. There is the long row of year-books which fill a shelf, and there are the dispatch-cases filled with documents, a perfect quarry for the student not only of crime but of the social and official scandals of the late Victorian era. Concerning these latter, I may say that the writers of agonized letters, who beg that the honour of their families or the reputation of famous forebears may not be touched, have nothing to fear. The discretion and high sense of professional honour which have always distinguished my friend are still at work in the choice of these memoirs, and no confidence will be abused. I deprecate, however, in the strongest way the attempts which have been made lately to get at and to destroy these papers. The source of these outrages is known, and if they are repeated I have Mr. Holmes's authority for saying that the whole story concerning the politician, the lighthouse, and the trained cormorant will be given to the public. There is at least one reader who will understand.
 
 It is not reasonable to suppose that every one of these cases gave Holmes the opportunity of showing those curious gifts of instinct and observation which I have endeavoured to set forth in these memoirs. Sometimes he had with much effort to pick the fruit, sometimes it fell easily into his lap. But the most terrible human tragedies were often involved in those cases which brought him the fewest personal opportunities, and it is one of these which I now desire to record. In telling it, I have made a slight change of name and place, but otherwise the facts are as stated.

_posts/2014-01-12-really-long-title-post.md

@@ -1,6 +1,6 @@
 ---
 layout: default
-title: "Some really obnoxiously long post title could be possible so just make sure it doesn't break all the things for real, yo, okay?"
+title: "Some really obnoxiously long post title"
 ---
 
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sodales ac orci vitae vulputate. Maecenas in tortor non metus euismod sollicitudin. Etiam tincidunt pretium diam gravida elementum. Phasellus eu lacus ut massa sagittis suscipit eget eu dui. Donec metus enim, sodales convallis mauris varius, vestibulum sollicitudin lorem. Mauris venenatis nulla ut eros blandit gravida. Nulla gravida, tortor nec dapibus suscipit, eros enim consequat odio, at tempus massa sapien vel felis. Mauris iaculis massa mi.

_sass/_base.scss

@@ -156,6 +156,7 @@ pre {
 .wrapper {
     max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
     max-width:         calc(#{$content-width} - (#{$spacing-unit} * 2));
+    width: 60em;
     margin-right: auto;
     margin-left: auto;
     padding-right: $spacing-unit;
@@ -202,3 +203,7 @@ pre {
         }
     }
 }
+
+.cf {
+    @extend %clearfix;
+}

_sass/_layout.scss

@@ -2,8 +2,6 @@
  * Site header
  */
 .site-header {
-    border-top: 5px solid $grey-color-dark;
-    border-bottom: 1px solid $grey-color-light;
     min-height: 56px;
 
     // Positioning context for the mobile navigation icon
@@ -13,7 +11,6 @@
 .site-title {
     font-size: 26px;
     line-height: 56px;
-    letter-spacing: -1px;
     margin-bottom: 0;
     float: left;
 
@@ -166,7 +163,17 @@
 }
 
 .page-heading {
-    font-size: 20px;
+    font-size: 42px;
+    text-align: center;
+    padding: 60px;
+    font-weight: 800;
+    &:after {
+        content: "";
+        border-bottom: 1px solid #999;
+        width: 2em;
+        display: block;
+        margin: auto;
+    }
 }
 
 .post-list {
@@ -175,6 +182,25 @@
 
     > li {
         margin-bottom: $spacing-unit;
+        float: left;
+        width: $box-width;
+        height: $box-height;
+        margin-right: $spacing-unit;
+        border: 1px solid $grey-color-light;
+        padding: 10px;
+        box-sizing: border-box;
+
+        &:nth-of-type(3n) {
+            margin-right: 0;
+        }
+        &:nth-of-type(3n+1) {
+            clear: both;
+        }
+
+        h2 a {
+            font-weight: 800;
+            color: $text-color;
+        }
     }
 }
 
@@ -193,14 +219,27 @@
 /**
  * Posts
  */
+.post {
+    width: 32em;
+    margin: auto;
+}
 .post-header {
+    padding: 48px 0;
     margin-bottom: $spacing-unit;
+    text-align: center;
+    &:after {
+        content: "";
+        border-bottom: 1px solid #999;
+        width: 2em;
+        display: block;
+        margin: auto;
+    }
 }
 
 .post-title {
     font-size: 42px;
-    letter-spacing: -1px;
     line-height: 1;
+    font-weight: 800;
 
     @include media-query($on-laptop) {
         font-size: 36px;
@@ -233,4 +272,10 @@
             font-size: 18px;
         }
     }
+
+    p {
+        font-family: "Source Serif Pro";
+        line-height: 1.6;
+        margin-bottom: 2em;
+    }
 }

css/main.scss

@@ -6,26 +6,28 @@
 
 
 // Our variables
-$base-font-family: Helvetica, Arial, sans-serif;
-$base-font-size:   16px;
+$base-font-family: "Source Sans Pro", Helvetica, arial, sans-serif;
+$base-font-size:   21px;
 $small-font-size:  $base-font-size * 0.875;
 $base-line-height: 1.5;
 
 $spacing-unit:     30px;
 
-$text-color:       #111;
-$background-color: #fdfdfd;
+$text-color:       #333;
+$background-color: #fff;
 $brand-color:      #2a7ae2;
 
 $grey-color:       #828282;
 $grey-color-light: lighten($grey-color, 40%);
 $grey-color-dark:  darken($grey-color, 25%);
 
 // Width of the content area
-$content-width:    800px;
+$content-width:    1280px;
 
 $on-palm:          600px;
-$on-laptop:        800px;
+$on-laptop:        1280px;
+$box-width:        ($content-width - (4 * $spacing-unit)) / 3;
+$box-height:       $box-width / 1.6;
 
 
 

index.html

@@ -4,9 +4,9 @@
 
 <div class="home">
 
-  <h1 class="page-heading">Posts</h1>
+  <h1 class="page-heading">Stories</h1>
 
-  <ul class="post-list">
+  <ul class="post-list cf">
     {% for post in site.posts %}
       <li>
         <span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>