1. Added support for styled subtitle in header

2. Added javascript detection for placeholder 3. Added backup style for search field with no-placeholder support
imathis · Jun 8, 2011 · a20dc08 · a20dc08
1 parent 901f4d7
commit a20dc08
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 6 deletions.
diff --git a/_config.yml b/_config.yml
@@ -4,6 +4,7 @@ destination: public
 
 url: http://yoursite.com
 title: My Octopress Blog
+subtitle: A blogging framework for hackers.
 author: Your Name
 subscribe_rss: /atom.xml
 subscribe_email: http://feedburner.com/asdfasdf

diff --git a/themes/classic/sass/default/core/_layout.scss b/themes/classic/sass/default/core/_layout.scss
@@ -35,7 +35,7 @@ body {
     }
   }
   > header {
-    font-size: .8em;
+    font-size: 1em;
     padding-top: 1.5em;
     padding-bottom: 1.5em;
   }

diff --git a/themes/classic/sass/default/core/_theme.scss b/themes/classic/sass/default/core/_theme.scss
@@ -10,6 +10,7 @@ $page-bg: #252525;
 $header-bg: #333; //#0c2e46; //darken(#238bd2, 32); //#263448; //#323232;
 $header-border: lighten($header-bg, 15);
 $title-color: #f2f2f2;
+$subtitle-color: #aaa;
 
 $nav-bg: #ccc;//#3a6ea5;
 $nav-color: darken($nav-bg, 38);

diff --git a/themes/classic/sass/default/partials/_header.scss b/themes/classic/sass/default/partials/_header.scss
@@ -1,5 +1,5 @@
 body > header {
-  background-color: $header_bg;
+  background-color: $header-bg;
   h1 {
     display: inline-block;
     margin: 0;
@@ -8,4 +8,10 @@ body > header {
       text-decoration: none;
     }
   }
+  h2 {
+    margin: .2em 0 0;
+    @extend .sans;
+    font-size: 1em;
+    color: $subtitle-color;
+  }
 }
diff --git a/themes/classic/sass/default/partials/_navigation.scss b/themes/classic/sass/default/partials/_navigation.scss
@@ -12,9 +12,9 @@ body > nav {
     @include background-clip(padding-box);
     margin: 0; padding: 0;
     .search {
-      padding: .25em .5em 0;
+      padding: .3em .5em 0;
       font-size: .85em;
-      line-height: 1em;
+      line-height: 1.1em;
       width: 95%;
       @include border-radius(.5em);
       @include background-clip(padding-box);
@@ -41,7 +41,6 @@ body > nav {
     ul {
       @include horizontal-list(0);
       float: left;
-      //float: right;
       display: block;
       padding-top: .25em;
     }
@@ -92,6 +91,12 @@ body > nav {
     }
   }
 }
+.no-placeholder {
+  body > nav .search {
+    background: lighten($nav-bg, 15) image-url('search.png') .3em .25em no-repeat;
+    text-indent: 1.3em;
+  }
+}
 .maskImage {
   ul[role=subscription] { li, a { border: 0; padding: 0; }}
   a[rel=subscribe-rss]{

diff --git a/themes/classic/source/_includes/header.html b/themes/classic/source/_includes/header.html
@@ -1 +1,4 @@
 <h1><a href="/">{{ site.title }}</a></h1>
+{% if site.subtitle %}
+  <h2>{{ site.subtitle }}</h2>
+{% endif %}
diff --git a/themes/classic/source/javascripts/octopress.js b/themes/classic/source/javascripts/octopress.js
@@ -24,12 +24,17 @@ function addSidebarToggler() {
 function testFeatures() {
   var features = ['maskImage'];
   $(features).map(function(feature){
-    if(Modernizr.testAllProps(feature)) {
+    if (Modernizr.testAllProps(feature)) {
       $('html').addClass(feature);
     } else {
       $('html').addClass('no-'+feature);
     }
   });
+  if ("placeholder" in document.createElement("input")) {
+    $('html').addClass('placeholder');
+  } else {
+    $('html').addClass('no-placeholder');
+  }
 }
 
 function addDivLines(){