Skip to content

Instantly share code, notes, and snippets.

@geekforbrains
Last active December 16, 2015 02:59
Show Gist options
  • Save geekforbrains/5366496 to your computer and use it in GitHub Desktop.
Save geekforbrains/5366496 to your computer and use it in GitHub Desktop.
Inline example of default Postach.io theme
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>
{% if is_home %}
{{ site.author }}
{% elif is_post %}
{{ post.title }}
{% elif is_link %}
{{ link.title }}
{% elif is_page %}
{{ page.title }}
{% endif %}
| {{ site.name }}
</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="{{ site.author }}">
<link href="{{ site.atom_url }}" rel="alternate" title="{{ site.name }}" type="application/atom+xml">
<link href="{{ static('bootstrap/css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ static('fontawesome/css/font-awesome.min.css') }}" rel="stylesheet">
<style>
body {padding-top: 120px;}
a, a:link, a:visited {color: #62AD24;}
a:hover {color: #3B730E;}
p {color: #333333;}
.navbar-inner {
padding-top: 15px;
padding-bottom: 15px;
background-color: #62AD24;
background-image: none;
background-repeat: no-repeat;
filter: none;
}
a.brand, a.brand:link, a.brand:visited {
font-size: 25px;
color: #ffffff;
text-shadow: none;
}
.nav li a,
.nav li a:link,
.nav li a:visited,
.nav li a:hover,
.nav li.active a,
.nav li.active a:link,
.nav li.active a:visited,
.nav li.active:hover a,
.nav li.active:hover a:link,
.nav li.active:hover a:visited,
.nav {
color: #ffffff;
text-shadow: none;
background: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
.nav li:hover a,
.nav li:hover a:link,
.nav li:hover a:visited,
.nav li.active a:link {
color: #3B730E;
}
h1, h2, h3, h4, h5, h6 {margin-top: 20px;}
.post h1 {
font-size: 28px;
margin-top: 15px;
}
.post h2 {font-size: 24px;}
.post h3 {font-size: 20px;}
.post h4 {font-size: 16px;}
.post h5 {font-size: 12px;}
.post h6 {font-size: 8px;}
.post pre {
margin: 20px 0;
}
.post .link-url {
display: block;
padding-top: 20px;
}
.bio {
position: relative;
background-color: #F5F5F5;
border-top: 2px solid #62AD24;
margin-top: 30px;
margin-bottom: 40px;
padding: 50px 30px 30px 30px;
font-size: 12px;
color: #666666;
}
.bio img.avatar {
position: absolute;
top: -33px;
left: 25px;
width: 66px;
height: 66px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.bio p {
margin: 0;
padding: 0;
}
.bio ul {margin-top: 20px;}
footer {
background-color: #F5F5F5;
margin-top: 40px;
padding: 20px;
font-size: 12px;
color: #666666;
}
</style>
<link href="{{ static('bootstrap/css/bootstrap-responsive.min.css') }}" rel="stylesheet">
<!--[if IE 7]>
<link href="{{ static('fontawesome/css/font-awesome-ie7.min.css') }}" rel="stylesheet">
<![endif]-->
<!--[if lt IE 9]>
<script src="{{ static('bootstrap/js/html5shiv.js') }}"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<div class="row">
<div class="span10 offset1">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="/">{{ site.name }}</a>
<div class="nav-collapse collapse pull-right">
<ul class="nav">
<li><a href="/">Blog</a></li>
{% if pages %}
{% for page in pages %}
<li><a href="{{ page.permalink }}">{{ page.title }}</a></li>
{% endfor %}
{% endif %}
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="span6 offset1">
{% if is_home %}
{% if posts %}
{% for post in posts %}
<div class="post">
<h1><a href="{{ post.permalink }}">{{ post.title }}</a></h1>
{{ post.content }}
{% if post.type == 'link' %}
<span class="link-url"><i class="icon-share"></i> <a href="{{ post.url }}">{{ post.url }}</a></span>
{% endif %}
</div>
<hr /><br />
{% endfor %}
{% else %}
<p><em>No posts yet :(</em></p>
{% endif %}
{% elif is_post %}
<div class="post">
<h1>{{ post.title }}</h1>
<hr />
{{ post.content }}
</div>
{% if site.disqus %}
<hr />
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus }}';
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.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">comments powered by Disqus.</a>
</noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
{% endif %}
{% elif is_link %}
<div class="post">
<h1>{{ link.title }}</h1>
<hr />
{{ link.content }}
<span class="link-url"><i class="icon-share"></i> <a href="{{ link.url }}">{{ link.url }}</a></span>
</div>
{% if site.disqus %}
<hr />
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = '{{ site.disqus }}';
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.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">comments powered by Disqus.</a>
</noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
{% endif %}
{% elif is_page %}
<div class="post">
<h1>{{ page.title }}</h1>
<hr />
{{ page.content }}
</div>
{% endif %}
</div>
<span class="span3 offset1">
<div class="bio">
<img class="avatar" src="{{ account.email|gravatar(66) }}" alt="{{ site.author }}" />
<p>{{ site.bio }}</p>
<ul class="unstyled">
{% if site.twitter %}
<li>
<a href="{{ site.twitter }}" target="_blank">
<i class="icon-twitter"></i> Twitter
</a>
</li>
{% endif %}
{% if site.facebook %}
<li>
<a href="{{ site.facebook }}" target="_blank">
<i class="icon-facebook-sign"></i> Facebook
</a>
</li>
{% endif %}
{% if site.googleplus %}
<li>
<a href="{{ site.googleplus }}" target="_blank">
<i class="icon-google-plus"></i> Google+
</a>
</li>
{% endif %}
{% if site.linkedin %}
<li>
<a href="{{ site.linkedin }}" target="_blank">
<i class="icon-linkedin"></i> LinkedIn
</a>
</li>
{% endif %}
</ul>
</div>
</span>
</div>
<div class="row">
<div class="span10 offset1">
<footer>
&copy; <a href="/">{{ site.name }}</a>. Powered by <a href="http://postach.io" target="_blank">Postach.io</a>
<ul class="inline pull-right">
<li><a href="/">Blog</a></li>
{% if pages %}
{% for page in pages %}
<li><a href="{{ page.permalink }}">{{ page.title }}</a></li>
{% endfor %}
{% endif %}
</ul>
</footer>
</div>
</div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="{{ static('bootstrap/js/bootstrap.min.js') }}"></script>
{% if site.analytics %}
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '{{ site.analytics }}']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
{% endif %}
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment