From a20dc08e105e85171bf5466cacb475b3bbcd8820 Mon Sep 17 00:00:00 2001
From: Brandon Mathis <brandon@imathis.com>
Date: Wed, 8 Jun 2011 18:58:00 -0400
Subject: 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
---
_config.yml | 1 +
themes/classic/sass/default/core/_layout.scss | 2 +-
themes/classic/sass/default/core/_theme.scss | 1 +
themes/classic/sass/default/partials/_header.scss | 8 +++++++-
themes/classic/sass/default/partials/_navigation.scss | 11 ++++++++---
themes/classic/source/_includes/header.html | 3 +++
themes/classic/source/javascripts/octopress.js | 7 ++++++-
7 files changed, 27 insertions(+), 6 deletions(-)
diff --git a/_config.yml b/_config.yml
index ff0bfdbb..8fb8984d 100644
--- 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
index 21f728de..2fabd928 100644
--- 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
index 62b1a007..5b95175a 100644
--- 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
index 63a58c6a..4cc92e4f 100644
--- 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
index eeafb928..4abb6a2a 100644
--- 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
index 4e0519e6..e08da6dc 100644
--- 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
index 68e5139b..dc391aac 100644
--- 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(){
--
cgit v1.2.1