Skip to content

Instantly share code, notes, and snippets.

@wssrstrm
Created October 22, 2012 13:54
Show Gist options
  • Save wssrstrm/3931613 to your computer and use it in GitHub Desktop.
Save wssrstrm/3931613 to your computer and use it in GitHub Desktop.
WSSRSTRM Tumblr Theme
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!--
WSSRSTRM Tumblr Theme v2.0
by Greg Wasserstrom [http://gregwasserstrom.com]
Adapter from Simplification Tumblr Theme v1.1 by Bill Israel [http://cubicle17.com/]
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
<meta name="description" content="{MetaDescription}"/>
<!-- DEFAULT COLORS -->
<meta name="color:Background" content="#fff"/>
<meta name="color:Footer Background" content="#222"/>
<meta name="color:Text" content="#444"/>
<meta name="color:Lighter Text" content="#888"/>
<meta name="color:Darker Text" content="#111"/>
<meta name="color:Accent" content="#ff0066"/>
<meta name="color:Post Separator" content="#bbb"/>
<meta name="color:Navigation" content="#444">
<meta name="color:Hover" content="#008FC5"/>
<meta name="color:Header" content="#008FC5">
<!-- Disqus Shortname -->
<meta name="text:Disqus Shortname" content=""/>
<!-- TypeKit Code -->
<meta name="text:TypeKit Code" content="qic8ypn" />
<!-- Show Notes -->
<meta name="if:Show notes" content="1">
<link rel="shortcut icon" href="{Favicon}"/>
<link rel="alternate" type="application/rss+xml" name="RSS" href="{RSS}"/>
<style type="text/css" media="screen">
html{font-size:87.5%}
body{background:#fff url(http://gwp.mx/tumblr/paper.png);border-top:7px solid {color:Accent};color:{color:Text};font:400 1em/1.3 "adobe-caslon-pro-1", "adobe-caslon-pro-2", Times New Roman, Times, Serif;margin:0;padding:3em 0 0;text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);}
a,a:visited,a:active{color:{color:Accent}}
a:hover{color:{color:Hover}}
h1{color:{color:Darker Text};font-family:"hellenic-wide-1", "hellenic-wide-2",Georgia,serif;font-style:normal;font-weight:400;font-size:56px}
h2,h3,h4,h5,h6{color:{color:Darker Text};font-family:"adobe-caslon-pro-1", "adobe-caslon-pro-2",Times New Roman,Times,serif;font-weight:400;font-style:normal;text-shadow:1px 1px 1px rgba(255, 255, 255, 1);}
p{margin:0 0 1.5em}
ul,ol{margin:0 0 1.5em;padding-left:2.5em}
blockquote{border-left:2px solid {color:Lighter Text};color:{color:Lighter Text};margin:0 1em 1.5em;padding:0 1em;text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);}
/* LAYOUT */
#container{margin:0 auto;min-width:500px;width:37em}
/* HEADER */
#header #menu {float:left;display:block;width:500px;}
#header a.twitter-follow-button{float:left;}
#header #navigation{float:right;list-style:none;margin:0;padding:0}
#header #navigation li{display:inline-block;margin:0 0 15px 0}
#header #navigation a{color:#444;font-family:"alternate-gothic-no-3-d-1", "alternate-gothic-no-3-d-2", "Helvetica", Arial, sans-serif;font-style:normal;font-weight:400;font-size:1em;line-height:1.8em;padding:0.25em;text-decoration:none;text-transform:uppercase;}
#header #navigation a:hover{border-bottom:2px solid {color:Accent};text-decoration:none}
#header h1{display:block;width:500px;margin:0;padding:0;text-align:center;}
#header h1 a{border:0;color:{color:Header};text-decoration:none;}
#header h1 a:hover{color:{color:Accent};}
#header #byline {display:block;width:500px;margin:0 0 5em 0;}
#header #byline h3 {text-align:center;font-size:18px;}
/* POSTS */
#posts { clear: left; }
.text,.link,.quote,.photo,.video,.audio,.chat,.photoset-post{border-bottom:1px dotted {color:Post Separator};margin-bottom:4.5em;}
.link .link-description{margin:0 0 1.5em}
.link a {text-decoration:none;}
.quote .words{border:0;color:{color:Text};font-weight:400; font-size:18pt; font-family: "adobe-caslon-pro-1", "adobe-caslon-pro-2", "Times New Roman", Times, Serif;margin:0 0 1em;padding:0; line-height:1.5em;}
.quote .source{color:{color:Lighter Text};font-style:normal;}
.photo,.video, .photoset-post{text-align:left;}
.video .caption,.audio .caption,.quote .source{clear: right;font-style:italic;margin-bottom:1.5em;margin-top:0.75em;text-align:left;}
.photo a img{border:0;}
.chat ul.convo{list-style-type:none;padding:0;}
.chat ul.convo li{line-height:2;}
.chat ul.convo li .person { font-weight: bold; }
.chat ul.convo li.even .person{color:{color:Accent};}
.audio .playcount { float: right; }
.photo .caption, photoset-post .caption{font-family:"adobe-caslon-pro-1", "adobe-caslon-pro-2", Times New Roman, Times, Serif;font-weight:normal;font-style: normal;text-align:left;margin-left:10px;margin-top:.75em}
/* POST FOOTERS */
.post-footer{list-style:none;font-size:0.857em;margin:3em 0;padding:0;text-align:right;}
.post-footer li{display:inline;margin-left:1em;padding:0}
/* REBLOG */
.post-footer li.reblog{color:{color:Lighter Text};display:block;font-style:italic;margin-bottom:0.25em}
.post-footer li.date h3{color:{color:Lighter Text};display:inline;font-family:"adobe-caslon-pro-1", "adobe-caslon-pro-2", Times New Roman, Times, serif;font-weight:400;font-style:normal;font-size:1em}
/* TAGS */
.post-footer li.tags ul, .post-footer li.tags ul li{display:inline; padding: 0;}
.post-footer li.tags ul li {margin-left: 0.4em;}
/* NOTES */
ol.notes { margin: 0; padding: 0; }
ol.notes li.note { margin: 0 0 0.75em 0; padding: 0 0 0.75em 0 }
ol.notes img.avatar { display: none; }
/* PAGINATION */
#pagination{margin:3em 0}
#pagination #pagecount{color:{color:Lighter Text};margin:0 1.5em}
/* FOOTER */
#footer{border-top:5px solid {color:Accent};background:{color:Footer Background};color:{color:Lighter Text};float:left;overflow:visible;padding:0 0 1.5em;width:100%}
#footer a{text-decoration:none}
#footer a:hover{color:{color:Lighter Text};}
#footer h3{border-bottom:1px solid {color:Lighter Text};color:{color:Lighter Text};font-size:1.5em;margin:2em 0 0.25em}
#footer ul{list-style:none;padding:0}
#footer ul li{line-height:2}
#footer {text-shadow:none;}
#footer h3 {text-shadow:none;}
/* FOLLOWING LIST */
#footer #following li { line-height: 30px; display: inline; }
/* FOOTER LAYOUT */
#footer-contain{margin:0 auto;padding:0;width:50em}
#footer-left{float:left;width:15em}
#footer-middle{float:left;margin-left:2.5em;width:15em}
#footer-right{float:left;margin-left:2.5em;width:15em}
/* SEARCH */
#search input{display:inline;}
#searchresultcount{font-style:italic;margin: 3em 0;text-align: center;}
#searchresultcount .query{font-weight:bold;}
/* CUSTOM CSS */
{CustomCSS}
</style>
<script type="text/javascript" src="http://use.typekit.com/qic8ypn.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
</head>
<body>
<div id="container">
<div id="header">
<div id="menu">
<a href="https://twitter.com/wssrstrm" class="twitter-follow-button" data-show-count="false">Twitter</a>
<script src="//platform.twitter.com/widgets.js" type="text/javascript"></script>
<ul id="navigation">
{block:HasPages}
{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
{/block:HasPages}
{block:AskEnabled}<li><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
{block:SubmissionsEnabled}<li><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
<li><a href="/archive">Archive</a></li>
<li><a href="{RSS}">RSS</a></li>
</ul>
</div>
<h1><a href="/">{Title}</a></h1>
<div id="byline">
<h3><span style="font-style:italic;">by</span> Greg Wasserstrom</h3>
</div>
</div> <!-- end #header -->
<div>
</div>
<div id="posts">
{block:SearchPage}
<div id="searchresultcount">
<p>Your search for <span class="query">{SearchQuery}</span> yielded {SearchResultCount} result(s).</p>
</div>
{/block:SearchPage}
{block:Posts}
{block:Text}
<div class="text">
{block:Title}<h2>{Title}</h2>{/block:Title}
{Body}
{/block:Text}
{block:Quote}
<div class="quote">
<blockquote class="words">&#8220;{Quote}&#8221;</blockquote>
{block:Source}<div class="source">{Source}</div>{/block:Source}
{/block:Quote}
{block:Link}
<div class="link">
<h2><a href="{URL}" {Target}>{Name}</a></h2>
{block:Description}
<div class="link-description">
{Description}
</div>
{/block:Description}
{/block:Link}
{block:Video}
<div class="video">
{Video-500}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Video}
{block:Audio}
<div class="audio">
<span class="playcount">Played {FormattedPlayCount} times</span>
{AudioPlayerBlack}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Audio}
{block:Photo}
<div class="photo">
{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Photo}
{block:Photoset}
<div class="photoset-post">
{Photoset-500}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
{/block:Photoset}
{block:Chat}
<div class="chat">
{block:Title}<h2>{Title}</h2>{/block:Title}
<ul class="convo">
{block:Lines}
<li class="{Alt}">
<span class="person">{block:Label}{Label}{/block:Label}</span>
<span class="line">{Line}</span>
</li>
{/block:Lines}
</ul>
{/block:Chat}
<ul class="post-footer">
{block:HasTags}<li class="tags">Tags: <ul>{block:Tags}<li><a href="{TagURL}">{Tag}</a></li>{/block:Tags}</ul></li>{/block:HasTags}
{block:Date}<li class="date">{block:IfShowNotes}{block:NoteCount}<h3>{NoteCountWithLabel}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</h3>{/block:NoteCount}{/block:IfShowNotes}{block:IfNotDisqusShortname}<a href="{Permalink}">{/block:IfNotDisqusShortname}{block:IfDisqusShortname}<li><a href="{Permalink}#disqus_thread" class="permalink">{block:IfDisqusShortname}<h3>{Month} {DayOfMonthWithZero}, {Year}</a>{/block:Date}</h3></li>
{block:RebloggedFrom}<li class="reblog">Reblogged from <a href="{ReblogParentURL}">{ReblogParentTitle}</a></li>{/block:RebloggedFrom}
{block:ContentSource}<li class="reblog">{block:SourceLogo}<a href="{SourceURL}"><img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /></a>{/block:SourceLogo}{block:NoSourceLogo}Original appeared on <a href="{SourceURL}">{SourceTitle}</a>{/block:NoSourceLogo}</a></li>{/block:ContentSource}
</ul>
</div> <!-- end single post -->
{/block:Posts}
{block:Permalink}
{block:IfShowNotes}
{block:PostNotes}
<h4>Notes</h4>
{PostNotes}
{block:PostNotes}
{/block:IfShowNotes}
{block:IfDisqusShortname}
<div id="disqus_thread"></div>
<script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
<noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">View the discussion thread.</a></noscript>
{/block:IfDisqusShortname}
{/block:Permalink}
</div> <!-- end posts -->
{block:Pagination}
<div id="pagination">
{block:NextPage}<a href="{NextPage}">&larr; Older Entries</a>{/block:NextPage}
<span id="pagecount">Page {CurrentPage} of {TotalPages}</span>
{block:PreviousPage}<a href="{PreviousPage}">Newer Entries &rarr;</a>{/block:PreviousPage}
</div>
{/block:Pagination}
{block:PermalinkPagination}
<div id="pagination">
{block:PreviousPost}<a href="{PreviousPost}">&larr; Previous Post</a>{/block:PreviousPost}
<span id="pagecount">&nbsp;</span>
{block:NextPost}<a href="{NextPost}">Next Post &rarr;</a>{/block:NextPost}
</div>
{/block:PermalinkPagination}
</div> <!-- end container -->
<div id="footer">
<div id="footer-contain">
<div id="footer-left">
<h3 id="about">About</h3>
{Description}
</div>
<div id="footer-middle">
</div>
<div id="footer-right">
<h3 id="search-title">Search</h3>
<div id="search">
<form action="/search" method="get">
<input type="text" name="q" value="{SearchQuery}" size="17"/>
<input type="submit" value="Search"/>
</form>
</div>
<h3 id="colophon">Colophon</h3>
<p>Powered by <a href="http://tumblr.com/">Tumblr</a>, designed by <a href="http://usa.wssrstrm.com">Greg Wasserstrom</a> based on one by <a href="http://cubicle17.com/">Bill Israel</a>. Fonts by <a href="http://typekit.com">TypeKit</a>.</p>
</div>
</div> <!-- end footer contain -->
</div> <!-- end footer -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-8888441-2']);
_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>
{block:IfDisqusShortname}
<script type="text/javascript">
//<![CDATA[
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
{/block:IfDisqusShortname}
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment