Skip to content

Instantly share code, notes, and snippets.

@froseph
Created November 10, 2012 05:50
Show Gist options
  • Save froseph/4050069 to your computer and use it in GitHub Desktop.
Save froseph/4050069 to your computer and use it in GitHub Desktop.
Munic Theme for tumbler
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<title>{Title}{block:PostTitle} / {PostTitle}{/block:PostTitle}</title>
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
<link rel="Shortcut Icon" type="image/png" href="{Favicon}" />
<style type="text/css">
a img, img a {border:none;}
* {padding:0;margin:0;}
.clear {clear:both;}
iframe {top:7px !important;}
#wrapper {
width:600px;
margin:0 auto;
}
body {
background:#262626;
border-top:6px solid #ffbc00;
}
#top {
margin:45px 0 70px 0;
}
#header {
float:left;
}
#header h1 a, #header h1 a:hover {
display:block;
text-decoration:none;
font-family:Georgia;
font-size:60px;
color:#fff;
font-weight:normal;
}
#header h1 {
margin:6px 0 -17px 0;
}
#header div {
color:#ffbf00;
font-size:14px;
font-family: "Georgia";
text-transform:lowercase;
font-style:italic;
float:left;
margin-top:8px;
}
#header div a {
color:#ffbf00;
font-size:14px;
font-family: "Georgia";
text-transform:lowercase;
font-style:italic;
text-decoration:none;
}
#header div a:hover {
text-decoration:underline;
}
#nav {
float:right;
margin-top:32px;
text-align:left;
}
#nav li {
display:inline;
list-style:none;
margin-left:22px;
}
#nav li a {
color:#ffbc00;
font-family:"Lucida Grande", "Lucida Sans Unicode";
text-decoration:none;
font-weight:bold;
font-size:12px;
padding:10px 10px 10px 10px;
}
#nav li a:hover {
color:#262626;
background:#ffbc00;
}
/* CONTENT */
#main {
width:600px;
margin:0 auto;
}
span.icon a, .iconp {
position:absolute;
float:left;
margin:0 0 0 0;
top:-3px;
left:-37px;
color:#fff;
font-weight:normal;
text-decoration:none;
text-indent:-9999px;
background:url('http://media.tumblr.com/5yo2viQlxc7nrkbiYxZ2ujeK_500.png') no-repeat;
height:27px;
width:27px;
}
span.meta a {
position:absolute;
float:left;
margin:0 0 0 0;
top:30px;
left:-54px;
font-family:Helvetica, Arial;
font-size:9px;
color:#adadad;
font-weight:normal;
text-decoration:none;
text-transform:uppercase;
text-decoration:none;
text-align:right;
width:40px;
}
span.meta a b {
color:#fff;
}
/* GENERAL POSTS */
.post-content {
margin:0 0 80px 0;
position:relative;
}
.post .ttl a, .ttlp {
font-family:Georgia;
font-weight:normal;
color:#262626;
font-size:21px;
padding:7px;
background:#ffbc00;
text-decoration:none;
text-transform:lowercase;
line-height: 45px;
}
.ttl a:hover {
background:#ffc523;
}
.ttl a span {
padding:7px 0px 7px 4px;
}
.post .body {
margin:20px 0 0 0;
font-family:"Lucida Grande", "Lucida Sans Unicode";
font-size:11px;
color:#fff;
line-height:17px;
}
.post .body a, .item .text a, .chat ul li a, .quote .source a {
color:#FFBc00;
text-decoration:none;
font-variant:small-caps;
font-family:Georgia;
font-size:11px;
}
.post .body a:hover, .item .text a:hover, .chat ul li a:hover, .quote .source a:hover {
text-decoration:underline;
}
.post p {
margin:12px 0 12px 0;
}
.post pre {
margin:12px 0 12px 15px;
font-size:10px;
}
.post ul, .post ol {
margin:12px 0 12px 40px;
}
.post ul li {
list-style:circle;
margin-bottom:3px;
}
.post ol li {
margin-bottom:3px;
}
.post blockquote {
margin-left:20px;
border-left:1px solid #ccc;
padding-left:10px;
color:#ccc;
}
.tags {
font-size:11px;
font-family:Georgia;
color:#fff;
text-decoration:none;
}
.tags a {
color:#FFBc00;
font-variant:small-caps;
}
.tags a:hover {
text-decoration:underline;
}
.tags a:after {
content: ",";
}
.tags a:last-child:after {
content: "";
}
.source {
font-family:Georgia;
font-size:12px;
font-variant:small-caps;
text-transform:none;
color:#ffbc00;
margin:11px 0px 0 0;
}
.source a {
color:#ffbc00;
text-decoration:none;
}
.source a:hover {
text-decoration:underline;
}
#daybox {
margin-bottom:45px;
}
#day {
font-family:Georgia;
font-variant:small-caps;
font-size:18px;
color:#fff;
}
/* PHOTOS, VIDEOS, AUDIO */
.photo .body, .video .body, .audio.body {
margin-top:10px;
}
.photo span.icon a, .video span.icon a {
top:3px;
}
.photo span.meta a, .video span.meta a {
top:36px;
}
.audio span.icon a {
top:0px;
}
.audio span.meta a {
top:33px;
}
/* QUOTES */
.quote {
margin-top:-15px;
}
.quote .body {
font-family:Georgia;
font-size:18px;
line-height:25px;
}
.quote span.icon a {
top:0px;
}
.quote span.meta a {
top:33px;
}
.quote .byline {
float:right;
}
.quote .source {
font-family:"Lucida Grande", "Lucida Sans Unicode";
font-size:11px;
color:#fff;
line-height:17px;
font-variant:normal !important;
}
/* CHATS */
.chat ul {
margin:20px 0 0 0;
}
.chat ul li {
list-style:none;
font-family:"Lucida Grande", "Lucida Sans Unicode";
font-size:11px;
color:#fff;
padding:8px;
}
.label {
font-weight:bold;
}
li.odd {
background:#1f1f1f;
}
li.even {
background:#292929;
}
/* PAGENAV */
#pagenav {
margin:60px 0 0 0;
}
#pagenav .inner {
text-align:center;
position:relative;
}
#older, #newer {
color:#262626;
font-family:"Georgia";
font-size:11px;
text-transform:uppercase;
padding:7px;
background:#ffbc00;
text-decoration:none;
display:block;
position:absolute;
top:-2px;
}
#older:hover, #newer:hover {
background:#ffc523;
}
#older {
float:left;
text-align:left;
left:0px;
}
#newer {
float:right;
text-align:right;
right:10px;
}
#pages {
color:#888;
font-family:"Georgia";
font-size:11px;
text-transform:uppercase;
text-align:center;
}
/* FOOTER */
#bottom {
border-top:2px solid #ffbc00;
border-bottom:2px solid #ffbc00;
margin:80px 0 40px 0;
font-family:"Lucida Grande";
font-size:10px;
color:#ccc;
text-align:center;
padding:13px 0 13px 0;
}
#bottomp {
border-top:2px solid #ffbc00;
border-bottom:2px solid #ffbc00;
margin:0px 0 40px 0;
font-family:"Lucida Grande";
font-size:10px;
color:#ccc;
text-align:center;
padding:13px 0 13px 0;
}
#bottom a, #bottom a:hover, #bottom b {
color:#ccc;
font-weight:bold;
text-decoration:none;
}
</style>
<!--[if IE]>
<style type="text/css">
#bottom {
margin:100px 0 40px 0;
}
#top {
margin:45px 0 155px 0;
}
.ttl a span {
padding:0px 0px 0px 4px;
}
span.icon a, .iconp {
top:5px;
left:-37px;
}
span.meta a {
top:38px;
left:-54px;
}
#nav li a {
color:#ffbc00;
font-family:"Lucida Grande", "Lucida Sans Unicode";
text-decoration:none;
font-weight:bold;
font-size:12px;
padding:10px 10px 10px 10px;
}
#nav li a:hover, #nav li a.on {
background:#262626;
color:#ffc523;
}
</style>
<![endif]-->
</head>
<body>
<div id="wrapper">
<div id="top">
<div id="header">
<h1><a href="/">{Title}</a></h1>
<div>{Description} </div>
</div>
<ul id="nav">
<li><a href="/">home</a></li>
<li><a href="/archive">archive</a></li>
<li><a href="{RSS} ">feed</a></li>
</ul>
<br class="clear">
</div>
<div id="main">
{block:DayPage}<div id="daybox"><span id="day">{Month}&nbsp;{DayOfMonth},&nbsp;{Year}</span></div>{/block:DayPage}
{block:Posts}
<div class="post-content">
{block:Link}
<div class="post link">
<span class="icon"><a href="{Permalink}">link</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
<span class="ttl"><a href="{URL}">{Name}<span>&raquo;</span></a></span>
{block:Description}
<div class="body">
{Description}
</div>
{/block:Description}
{block:RebloggedFrom}
<div class="source">
via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.
</div>
{/block:RebloggedFrom}
</div>
{/block:Link}
{block:Quote}
<div class="post quote">
<span class="icon"><a href="{Permalink}">quote</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
<div class="body">
{Quote}
</div>
{block:Source}
<div class="source">
&mdash;&nbsp;{Source}
</div>
{/block:Source}
</div>
{/block:Quote}
{block:Chat}
<div class="post chat">
<span class="icon"><a href="{Permalink}">chat</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
{block:Title}<span class="ttl"><a href="{Permalink}">{Title}</a></span>{/block:Title}
<ul>
{block:Lines}
<li class="{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>
{/block:Lines}
</ul>
{block:RebloggedFrom}
<div class="source">
via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.
</div>
{/block:RebloggedFrom}
</div>
{/block:Chat}
{block:Text}
<div class="post text">
<span class="icon"><a href="{Permalink}">text</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
{block:Title}<span class="ttl"><a href="{Permalink}">{Title}</a></span>{/block:Title}
<div class="body">
{Body}
</div>
{block:RebloggedFrom}
<div class="source">
via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.
</div>
{/block:RebloggedFrom}
</div>
{/block:Text}
{block:Photo}
<div class="post photo">
<span class="icon"><a href="{Permalink}">photo</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
{block:Caption}
<div class="body">
{Caption}
</div>
{/block:Caption}
{block:RebloggedFrom}
<div class="source">
via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.
</div>
{/block:RebloggedFrom}
</div>
{/block:Photo}
{block:Video}
<div class="post video">
<span class="icon"><a href="{Permalink}">video</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
{Video-500}
{block:Caption}
<div class="body">
{Caption}
</div>
{/block:Caption}
{block:RebloggedFrom}
<div class="source">
via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.
</div>
{/block:RebloggedFrom}
</div>
{/block:Video}
{block:Audio}
<div class="post audio">
<span class="icon"><a href="{Permalink}">audio</a></span>
<span class="meta"><a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/"><b>{DayOfMonth}</b>&nbsp;{ShortMonth}</a></span>
{AudioPlayerWhite}
{block:Caption}
<div class="body">
{Caption}
</div>
{/block:Caption}
<div class="source">
played {FormattedPlayCount} times.{block:RebloggedFrom}&nbsp;via <a href="{ReblogParentURL}">{ReblogParentTitle}</a>.{/block:RebloggedFrom}
</div>
</div>
{/block:Audio}
{block:HasTags}
<div class="tags">
<p>{block:Tags}<a href="{TagURL}" class="single-tag">&#35;{Tag}</a> {/block:Tags}</p>
</div>
{/block:HasTags}
</div>
{/block:Posts}
<div id="pagenav">
<div class="inner">
{block:IndexPage}
{block:NextPage}<a id="older" href="{NextPage}">&larr;&nbsp;Wander back</a>{/block:NextPage}
<span id="pages">Page {CurrentPage} of {TotalPages}</span>
{block:PreviousPage}<a id="newer" href="{PreviousPage}">Go forth&nbsp;&rarr;</a>{/block:PreviousPage}
{/block:IndexPage}
{block:PermalinkPagination}
{block:NextPost}<a id="newer" href="{NextPost}">Newer&nbsp;&rarr;</a> {/block:NextPost}
<span id="pages">Permalink Page</span>
{block:PreviousPost}<a id="older" href="{PreviousPost}">&larr;&nbsp;Older</a>{/block:PreviousPost}
{/block:PermalinkPagination}
</div>
</div>
</div>
<br class="clear">
<div id="bottom">
<!-- Please do not remove the credit attribution here. Feel free to modify the rest of theme as you wish, however. --><b>Design</b> crafted by <a href="http://www.prshnth.com">Prashanth Kamalakanthan</a>. <b>Content</b> powered by <a href="http://www.tumblr.com/">Tumblr</a>.
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment