Permalink
Browse files

add bootstrap support and html5 elements to liquid templates

  • Loading branch information...
1 parent 2991d86 commit 6f76d206e814b142a498dbaf955b52ab510002d2 @jgritman committed Dec 3, 2011
Showing with 96 additions and 54 deletions.
  1. +51 −8 _layouts/default.html
  2. +33 −28 _layouts/post.html
  3. +12 −18 index.html
View
@@ -1,12 +1,20 @@
<!DOCTYPE html>
<html>
<head>
+ <meta charset="utf-8">
<title>{% if page.title %}{{ page.title }} - {% endif %}{{ site.title }}</title>
{% if page.description %}
<meta name="description" content="{{ page.description }}" />
{% endif %}
+ <meta name="author" content="{{ site.author }}">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
- <link rel="stylesheet" media="screen" href="/stylesheets/screen.css" type="text/css" />
+
+ <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <link rel="stylesheet" media="screen" href="/stylesheets/styles.css" type="text/css" />
{% if site.feedburner %}
<link href="http://feeds.feedburner.com/{{ site.feedburner.id }}" rel="alternate" title="{{ site.title }}" type="application/atom+xml" />
{% endif %}
@@ -25,16 +33,51 @@
{% endif %}
</head>
<body>
- <div id="page">
- <div id="header">
- <a href="/"><h1>{{ site.title }}</h1></a>
- </div>
- <div id="body">
- {% if page.title %}<h1>{{ page.title }}</h1>{% endif %}
- {{ content }}
+
+ <div class="topbar">
+ <div class="fill">
+ <nav class="container">
+ <ul class="nav">
+ <li><a href="/">Home</a></li>
+ <li><a href="/about.html">About</a></li>
+ </ul>
+ <form method="get" action="http://www.google.com/search" class="pull-right">
+ <input class="input-small" type="text" name="q" size="31" maxlength="255" value="">
+ <input name="sitesearch" type="hidden" value="{{ site.domain }}">
+ <button class="btn" type="submit">Search</button>
+ </form>
+ </nav>
</div>
</div>
+ <div class="container">
+
+ <div class="content">
+ <header class="page-header">
+ <h1>{{ site.title }}</h1>
+ </header>
+ <div class="row">
+ <div id="content" class="span12">
+ {{ content }}
+ </div>
+ <nav class="span4">
+ <h3>Recent Posts</h3>
+ <div id="posts">
+ {% for post in site.posts limit:10%}
+ <p><a href="{{ post.url }}">{{ post.title }}</a></p>
+ {% endfor %}
+ </div>
+ </nav>
+ </div>
+ </div>
+
+ <footer>
+ <p>powered by <a href="https://github.com/mojombo/jekyll">jekyll</a></p>
+ </footer>
+
+ </div>
+
+
{% if site.github %}
<a href="http://github.com/{{ site.github.username }}"><img style="position: absolute; top: 0; right: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub" /></a>
{% endif %}
View
@@ -1,34 +1,39 @@
---
layout: default
---
-{% if page.date %}<div class="postdate">Posted on {{ page.date | date_to_string }}{% if page.last_updated %}, last updated on {{ page.last_updated | date_to_string }}{% endif %}</div>{% endif %}
+<article>
+ <header>
+ <h2>
+ <a href="{{ page.url }}" rel="bookmark" title="Permanent link to ">{{ page.title }}</a>
+ </h2>
+ <h5><time>{{ page.date | date: '%B' }} {{ page.date | date: '%e' }}, {{ page.date | date: '%Y' }}</time></h5>
+ </header>
-<div class="post">
-{{ content }}
-</div>
-
-<div id="related">
- <h2>Related Posts</h2>
- <ul class="posts">
- {% for post in site.related_posts limit:5 %}
- <li><span>{{ post.date | date_to_string }}</span> - <a href="{{ post.url }}">{{ post.title }}</a></li>
- {% endfor %}
- </ul>
-</div>
+ {{ content }}
+
+ <nav id="related">
+ <h3>Related Posts</h3>
+ <ul class="posts">
+ {% for post in site.related_posts limit:5 %}
+ <li><span>{{ post.date | date_to_string }}</span> - <a href="{{ post.url }}">{{ post.title }}</a></li>
+ {% endfor %}
+ </ul>
+ </nav>
-{% if site.disqus %}
-<div id="comments">
- <h2>Comments</h2>
- <div id="disqus_thread"></div>
- <script type="text/javascript">
- var disqus_identifier = "{{ page.url }}";
- (function() {
- var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
- dsq.src = 'http://{{ site.disqus.id }}.disqus.com/embed.js';
- (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
- })();
- </script>
- <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript={{ site.disqus.id }}">comments powered by Disqus.</a></noscript>
- <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
-</div>
+ {% if site.disqus %}
+ <div id="comments">
+ <h2>Comments</h2>
+ <div id="disqus_thread"></div>
+ <script type="text/javascript">
+ var disqus_identifier = "{{ page.url }}";
+ (function() {
+ var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+ dsq.src = 'http://{{ site.disqus.id }}.disqus.com/embed.js';
+ (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+ })();
+ </script>
+ <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript={{ site.disqus.id }}">comments powered by Disqus.</a></noscript>
+ <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
+ </div>
+</article>
{% endif %}
View
@@ -3,22 +3,16 @@
description: A description about my blog homepage
---
-<div id="posts">
- <h2>Blog Posts</h2>
- <ul>
- {% for post in site.posts %}
- <li><span>{{ post.date | date_to_string }}</span> - <a href="{{ post.url }}">{{ post.title }}</a></li>
- {% endfor %}
- </ul>
-</div>
+{% for post in site.posts %}
+<article>
+ <header>
+ <h2>
+ <a href="{{ post.url }}" rel="bookmark" title="Permanent link to ">{{ post.title }}</a>
+ </h2>
+ <h5><time>{{ post.date | date: '%B' }} {{ post.date | date: '%e' }}, {{ post.date | date: '%Y' }}</time></h5>
+ </header>
+ {{ post.content }}
+</article>
+{% endfor %}
+
-<div id="pages">
- <h2>Pages</h2>
- <ul>
- {% for page in site.html_pages %}
- {% if page.title %}
- <li><a href="{{ page.url }}">{{ page.title }}</a></li>
- {% endif %}
- {% endfor %}
- </ul>
-</div>

0 comments on commit 6f76d20

Please sign in to comment.