Skip to content

Instantly share code, notes, and snippets.

@ShadowKyogre
Last active August 29, 2015 14:01
Show Gist options
  • Save ShadowKyogre/513c00cb3f87839dee10 to your computer and use it in GitHub Desktop.
Save ShadowKyogre/513c00cb3f87839dee10 to your computer and use it in GitHub Desktop.
Experimental mobile theme. Also includes some carousel code that can be easily accessed with a thumb.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes", target-densitydpi=device-dpi />
<!-- TUMBLR VARIABLES -->
<meta name="text:GWFTitle" content="Metamorphous" />
<meta name="text:GWFBody" content="Crimson Text" />
<!-- aesthetic features -->
<!-- aesthetic features > basics -->
<meta name="image:background" content="" />
<meta name="color:text" content="#fff" />
<meta name="color:title" content="#0f0" />
<meta name="color:description" content="#87ceeb" />
<!-- /aesthetic features > basics -->
<!-- aesthetic features > links -->
<meta name="color:link" content="#ffa500" />
<meta name="color:pagination link" content="#f0f" />
<meta name="color:custom link" content="#0ff" />
<!-- /aesthetic features > links -->
<!-- aesthetic features > post metadata -->
<meta name="color:metadata" content="#fff" />
<meta name="color:metadata bg" content="#000" />
<meta name="color:metadata separator" content="#fff" />
<meta name="text:metadata bg opacity" content="0.6" />
<meta name="color:post type" content="#ee82ee" />
<!-- /aesthetic features > post metadata -->
<!-- aesthetic features > chat, ask -->
<meta name="color:chat line sep" content="#808080" />
<meta name="color:chat bg even" content="#8b0000" />
<meta name="color:chat bg odd" content="#00008b" />
<meta name="color:chat bubble" content="#7f7f7f" />
<meta name="color:ask bubble" content="#7f7f7f" />
<!-- /aesthetic features > chat, ask -->
<!-- aesthetic features > quote -->
<meta name="color:quote border" content="#ffff00" />
<meta name="color:quote post border" content="#ffff00" />
<meta name="color:quote post bg" content="#000" />
<meta name="color:quote post bg opacity" content="0.6" />
<meta name="color:post border" content="#008000" />
<meta name="color:post bg" content="#000" />
<meta name="text:post bg opacity" content="0.0" />
<!-- /aesthetic features > quote -->
<!-- aesthetic features > tabs -->
<meta name="color:tab icon" content="#0bf" />
<meta name="color:tab link borders" content="#ffc0cb" />
<meta name="color:tab link hover" content="#7d0000" />
<meta name="color:bg" content="#000" />
<meta name="text:bg opacity" content="0.6" />
<meta name="color:active tab glow" content="#00459f" />
<meta name="color:desc tab glow" content="#ff0800" />
<meta name="color:links tab glow" content="#006d04" />
<meta name="color:nav tab glow" content="#5d017e" />
<meta name="color:desc tab bg" content="#2b1000" />
<meta name="text:desc tab bg opacity" content="0.6" />
<meta name="color:nav tab bg" content="#280036" />
<meta name="text:nav tab bg opacity" content="0.6" />
<meta name="color:links tab bg" content="#001d06" />
<meta name="text:links tab bg opacity" content="0.6" />
<meta name="color:desc tab icon" content="#f2992e" />
<meta name="color:links tab icon" content="#00ff1a" />
<meta name="color:nav tab icon" content="#ea00ff" />
<meta name="color:search bar bg" content="#ff0" />
<meta name="color:search bar" content="#000" />
<!-- /aesthetic features > tabs -->
<!-- non-aesthetic features -->
<meta name="if:infinite scroll" content="1" />
<meta name="if:show search" content="1" />
<meta name="if:show jump first last" content="1" />
<meta name="if:photoset carousel" content="1" /> <!-- going to implement, BUT, need to clean up with HTML5 stuff -->
<meta name="if:enable tab colors" content="0" />
<!-- reffed this: http://jsfiddle.net/9Ue9j/3/ -->
<!-- http://www.webdesignerdepot.com/2012/11/how-to-create-a-simple-css3-tooltip/ -->
<!-- http://www.ilikepixels.co.uk/drop/bubbler/ -->
<!-- fonts -->
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family={text:GWFTitle}" />
<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family={text:GWFBody}" />
<link rel="stylesheet" type="text/css" href="http://weloveiconfonts.com/api/?family=entypo" />
{block:ifinfinitescroll}
<!-- INFINITE SCROLL SCRIPT -->
<script src="http://codysherman.com/tools/infinite-scrolling/code"></script>
{/block:ifinfinitescroll}
<title>{Title}{block:PostSummary} - {PostSummary}{/block:PostSummary}</title>
<link rel="shortcut icon" href="{Favicon}" />
<style type="text/css">
/* entypo */
[class*="entypo-"]:before {
font-family: 'entypo', sans-serif;
}
/* posts */
.post
{
padding:0.2083em;
border: 0.04167em solid {color:post border};
background: rgba({RGBcolor:post bg},{text:post bg opacity});
margin-bottom:0.41667em;
border-radius:0.41667em;
}
#main:last-child {
margin-bottom:0px;
}
/* media */
.video, .photo, .photoset, .audio {
text-align:center;
}
.photoset .photo + .desc
{
border-bottom:1px solid;
margin-bottom:1em;
}
.video iframe, .photo img {
max-width:100%;
}
.albumart, .audio-info {
vertical-align:middle;
}
/* quote */
.post blockquote
{
border-left:0.04167em solid {color:quote border};
padding: 0.2083em;
}
.data blockquote
{
border-left:0.04167em solid {color:quote border};
background:rgba({RGBcolor:quote post bg}, {RGBcolor:quote post bg opacity});
}
.post blockquote cite
{
display:block;
}
.post blockquote cite:before
{
content: "\2014 \2009";
}
/* font icons */
.tab label span[class*="entypo-"]
{
color: {color:tab icon};
}
.posts-type
{
color: {color: post type};
display: table-cell;
font-size: 1.6667em;
text-align: center;
border-right: 0.04167em solid;
padding-right: .25em;
}
/* chat */
.chat-bubble .line
{
border-bottom:0.04167em solid {color:chat line sep};
}
.line:nth-child(even) {
background: {color:chat bg even};
}
.line:nth-child(odd) {
background: {color:chat bg odd};
}
.line:first-child {
border-top-left-radius: .125em;
border-top-right-radius: .125em;
}
.line:last-child
{
border-bottom:none;
border-bottom-left-radius: .125em;
border-bottom-right-radius: .125em;
}
.chat-bubble
{
position: relative;
padding: 0.2083em;
background: {color:chat bubble};
-webkit-border-radius: 0.41667em;
-moz-border-radius: 0.41667em;
border-radius: 0.41667em;
border: {color:chat bubble} solid 0.0833em;
margin-bottom:1.2em;
}
.chat-bubble:before
{
content: '';
position: absolute;
border-style: solid;
border-width: 1.25em 1.25em 0;
border-color: {color:chat bubble} transparent;
display: block;
width: 0;
z-index: 0;
margin-left: -1.25em;
bottom: -1.05em;
left: 9%;
}
/* ask */
.question img
{
display:inline-block;
}
.bubble
{
position: relative;
margin-top:-1.75em;
padding: 0px;
background: {color:ask bubble};
padding:0.2083em;
width: calc(100% - 50px - 0.75em);
margin-left:50px;
-webkit-border-radius: 0.41667em;
-moz-border-radius: 0.41667em;
border-radius: 0.41667em;
border: {color:ask bubble} solid 0.083333333em;
}
.bubble:before
{
content: '';
position: absolute;
border-style: solid;
border-width: .25em 1.25em .25em 0;
border-color: transparent {color:ask bubble};
display: block;
width: 0;
z-index: 0;
left: -1.25em;
top: 0.2083em;
}
/* audio */
.audio img
{
display:inline-block;
width:8.3333333em;
}
.audio-info
{
display:inline-block;
}
.posts-type + .other
{
display: table-cell;
text-align: right;
width:100%;
opacity: 0;
transition: opacity 0.2s linear 0s;
font-size: 0.83333333em;
}
.posts-type:hover + .other
{
opacity:1;
transition: opacity 0.2s linear;
}
.posts-type + .other:hover
{
opacity:1;
transition: opacity 0.2s linear;
}
/* metadata */
.metadata {
border-top:0.04167em solid {color:metadata separator};
color: {color:metadata};
background: rgba({RGBcolor:metadata bg},{text:metadata bg opacity});
position:relative;
padding: 0.2083em;
border-bottom-left-radius: 0.41667em;
border-bottom-right-radius: 0.41667em;
display:table;
}
.metadata .other a:last-child:after {
content:none;
}
.metadata .other a:after {
content:"\00a0";
text-decoration: none;
}
/* notes */
div.notes {
border-top:0.04167em solid {color:metadata separator};
}
ol.notes {
overflow:auto;
list-style:none;
height:8.3333333em;
}
/* /posts */
/* Title, avatar, desc */
#title, .data .title
{
text-align:center;
font-family: "{text:GWFTitle}";
/*font-size: 2em;
position: relative;*/
}
#title a
{
text-decoration:none;
}
#title {
height:7.5em;
width:100%;
}
#title-text
{
display: inline-block;
/*top: calc(50% - 0.5em);*/
color: {color:title};
}
#title img
{
display: inline-block;
vertical-align: middle;
}
#desc
{
width:100%;
height:calc(100% - 8.4875em);
overflow:auto;
border-top:0.04167em solid;
color: {color:description};
}
/* Pagination */
#pagination, #links {
display:table;
width:100%;
height:calc(100% - 0.83333333em );
}
#pagination span, #links span {
display: block;
text-align:center;
padding:0.2083em;
display:table-row;
}
#pagination a, #links a, #pagination form {
display:table-cell;
vertical-align:middle;
border: 0.04167em solid {color:tab link borders};
border-bottom: none;
}
#pagination a,
#links a,
#pagination input
{
font-size:1.5em;
}
#pagination input
{
width: calc(100% - 0.83333333em);
background: {color:search bar bg};
color: {color:search bar};
border-radius:0.2083em;
}
/* LINKAGE */
#pagination a:hover,#pagination form:hover
{
background:rgba({RGBcolor:tab link hover},0.5);
}
#links a:hover
{
background:rgba({RGBcolor:tab link hover},0.5);
}
#pagination span:first-child a, #links span:first-child a, #pagination span:first-child form {
border-top-left-radius: 0.41667em;
border-top-right-radius: 0.41667em;
}
#pagination span:last-child a, #links span:last-child a, #pagination span:last-child form {
border-bottom-left-radius: 0.41667em;
border-bottom-right-radius: 0.41667em;
border-bottom: 0.04167em solid {color:tab link borders};
}
#pagination a {
color: {color:pagination link};
}
#links a {
color: {color:custom link};
}
a {
color: {color:link};
}
/* Vertical tabs stuff */
#menu [type=radio] {
display: none;
}
.tab input[type="radio"]:checked + label span[class*="entypo-"]
{
text-shadow: 0 0 0.2083em {color:active tab glow};
}
#menu label {
vertical-align:text-top;
position:relative;
display:block;
left:0px;
width:1.68em;
font-size:1.6667em;
text-align: center;
}
#main {
padding:0.2083em;
height:calc(100% - 0.83333333em);
width:100%;
overflow:auto;
}
#menu {
top:0px;
position:fixed;
left:0px;
height:100%;
width:100%;
}
.tab-wrapper {
display:inline-block;
}
.tab {
background:rgba({RGBcolor:bg},{text:bg opacity});
}
.tab .content {
display:none;
word-wrap:break-word;
top:0px;
left:2.8em;
height:100%;
position:absolute;
background:rgba({RGBcolor:bg},{text:bg opacity});
width:calc(100% - 3.6em);
}
.tab-wrapper .content:empty {
width:0%;
padding:0px;
}
.tab [type=radio]:checked + label + .content:not(:empty){
display:inline-block;
z-index:2;
padding: 0.41667em;
}
/*body,*/ html {
height:100%;
background:url('{image:background}');
background-position: center center;
background-size: cover;
font-family: "{text:GWFBody}";
/*font-size:24px;*/
color: {color:text};
}
#tw-desc img {
width: 1em;
border-radius: 0.208333em;
height: 1em;
margin-top: .25em;
}
#tw-desc input[type="radio"]:checked + label img {
box-shadow: 0px 0px 0.208333em {color:active tab glow};
}
/* tab colors */
{block:ifenabletabcolors}
#tw-desc,
#tw-desc .content
{
background:rgba({RGBcolor:desc tab bg},{text:desc tab bg opacity});
}
#tw-nav,
#tw-nav .content
{
background:rgba({RGBcolor:nav tab bg},{text:nav tab bg opacity});
}
#tw-links,
#tw-links .content
{
background:rgba({RGBcolor:links tab bg},{text:links tab bg opacity});
}
#tw-links input[type="radio"]:checked + label span[class*="entypo-"]
{
text-shadow: 0 0 0.2083em {color:links tab glow};
}
#tw-nav input[type="radio"]:checked + label span[class*="entypo-"]
{
text-shadow: 0 0 0.2083em {color:nav tab glow};
}
/*
#tw-desc input[type="radio"]:checked + label span[class*="entypo-"]
{
text-shadow: 0 0 0.2083em {color:desc tab glow};
}
*/
#tw-desc label span[class*="entypo-"]
{
color: {color:desc tab icon};
}
#tw-nav label span[class*="entypo-"]
{
color: {color:nav tab icon};
}
#tw-links label span[class*="entypo-"]
{
color: {color:links tab icon};
}
#tw-desc input[type="radio"]:checked + label img {
box-shadow: 0px 0px 0.208333em {color:desc tab glow};
}
{/block:ifenabletabcolors}
{CustomCSS}
</style>
<!-- full source code can be tracked here: https://gist.github.com/ShadowKyogre/513c00cb3f87839dee10 -->
<!-- Other scripts are hosted on Google Drive to prevent having to update the URL for these constantly -->
{block:ifphotosetcarousel}
<!-- carousel.js -->
<script src="https://googledrive.com/host/0B1wfV4TAvjbidHV3czh1RUV0SVk" type="text/javascript"></script>
<!-- carousel.css -->
<link rel="stylesheet" type="text/css" href="https://googledrive.com/host/0B1wfV4TAvjbic3Y4YU9RdWphWDQ" />
{/block:ifphotosetcarousel}
<script type="text/javascript">
function fixTagLinks() {
{block:PreviousPage}
document.getElementById('uselessID1').href = window.location.pathname.replace(/\/page\/[0-9]+/gi,'') + '/page/1';
{/block:PreviousPage}
{block:NextPage}
document.getElementById('uselessID2').href = window.location.pathname.replace(/\/page\/[0-9]+/gi,'') + '/page/' + '{TotalPages}';
{/block:NextPage}
}
function runBodyHooks() {
{block:ifshowjumpfirstlast}
// I AM A COMMENT
{block:TagPage}
fixTagLinks();
{/block:TagPage}
{/block:ifshowjumpfirstlast}
{block:ifphotosetcarousel}
considerLastSlides();
{/block:ifphotosetcarousel}
}
window.onload=runBodyHooks;
</script>
</head>
<body>
<!-- content -->
<div id="menu">
<div class="tab-wrapper">
<div class="tab" id="tw-desc">
<!-- tab 1 -->
<input type="radio" accesskey="d" id="tab-1" name="tab-group-1">
<label for="tab-1">
<!-- description panel -->
<img src="{PortraitURL-128}" width="128"></img>
</label>
<div class="content">
<div id="title">
<a href="/"><h1 id="title-text">{Title}</h1></a>
</div>
<div id="desc">
{Description}
</div>
</div>
</div>
<div class="tab" id="tw-nav">
<!-- tab 2 -->
<input type="radio" id="tab-2" accesskey="p" name="tab-group-1">
<label for="tab-2">
<span class="entypo-direction"></span>
</label>
<div class="content">
<div id="pagination">
{block:ifshowsearch}
<span>
<form action='/search' id='nav-search' method='get'>
<input name='q' type='text' value='Search...' value='{SearchQuery}'/>
</form>
</span>
{/block:ifshowsearch}
{block:ifnotinfinitescroll}
{block:PreviousPage}
{block:ifshowjumpfirstlast}
{block:IndexPage}
{block:SearchPage}<!--{/block:SearchPage}
{block:TagPage}<!--{/block:TagPage}
<span><a href="/page/1">&lt;&lt;</a></span>
{block:TagPage}-->{/block:TagPage}
{block:SearchPage}-->{/block:SearchPage}
{/block:IndexPage}
{block:TagPage}
<span><a id="uselessID1" href="/tagged/{URLSafeTag}/page/1">&gt;&gt;</a></span>
{/block:TagPage}
{block:SearchPage}
<span><a href="/search/{URLSafeSearchQuery}/page/1">&lt;&lt;</a></span>
{/block:SearchPage}
{/block:ifshowjumpfirstlast}
<span><a href="{PreviousPage}">&lt;</a></span>
{/block:PreviousPage}
{block:JumpPagination length="5"}
{block:JumpPage}
<span><a href="{URL}">{PageNumber}</a></span>
{/block:JumpPage}
{block:CurrentPage}
<span><a href="{URL}"><b>{PageNumber}</b></a></span>
{/block:CurrentPage}
{/block:JumpPagination}
{block:NextPage}
<span><a href="{NextPage}">&gt;</a></span>
{block:ifshowjumpfirstlast}
{block:IndexPage}
{block:SearchPage}<!--{/block:SearchPage}
{block:TagPage}<!--{/block:TagPage}
<span><a href="/page/{TotalPages}">&gt;&gt;</a></span>
{block:TagPage}-->{/block:TagPage}
{block:SearchPage}-->{/block:SearchPage}
{/block:IndexPage}
{block:TagPage}
<span><a id="uselessID2" href="/tagged/{URLSafeTag}/page/{TotalPages}">&gt;&gt;</a></span>
{/block:TagPage}
{block:SearchPage}
<span><a href="/search/{URLSafeSearchQuery}/page/{TotalPages}">&gt;&gt;</a></span>
{/block:SearchPage}
{/block:ifshowjumpfirstlast}
{/block:NextPage}
{/block:ifnotinfinitescroll}
{block:PermalinkPagination}
{block:PreviousPost}
<span><a href="{PreviousPost}">{lang:Prev post}</a></span>
{/block:PreviousPost}
{block:NextPost}
<span><a href="{NextPost}">{lang:Next post}</a></span>
{/block:NextPost}
{/block:PermalinkPagination}
</div>
</div>
</div>
<div class="tab" id="tw-links">
<!-- tab 3 -->
<input type="radio" id="tab-3" accesskey="l" name="tab-group-1">
<label for="tab-3">
<span class="entypo-network"></span>
</label>
<div class="content">
<div id="links">
{block:AskEnabled}
<span>
<a href="/ask">{AskLabel}</a>
</span>
{block:AskEnabled}
{block:SubmissionsEnabled}
<span>
<a href="/submit">{SubmitLabel}</a>
</span>
{/block:SubmissionsEnabled}
<span><a href="/archive">{lang:Archive}</a></span>
{block:HasPages}
{block:Pages}
<span><a href="{URL}">{Label}</a></span>
{/block:Pages}
{/block:HasPages}
</div>
</div>
</div>
<div class="tab" id="tw-blog">
<!-- tab 4 -->
<input type="radio" id="tab-4" accesskey="b" name="tab-group-1" checked>
<label for="tab-4">
<span class="entypo-newspaper"></span>
</label>
<div class="content">
<div id="main">
{block:SearchPage}
<h1 id="search-results">
{SearchQuery} - {lang:SearchResultCount results}
{block:NoSearchResults}
{lang:Sorry no search results found}.
{/block:NoSearchResults}
</h1>
{block:SearchPage}
{block:TagPage}
<h1 id="tag-results">
<a href="/tagged/{URLSafeTag}/chrono" class="entypo-clock"></a>
<a href="/tagged/{URLSafeTag}">{Tag}</a>
</h1>
{/block:TagPage}
{block:NoSearchResults}<!--{/block:NoSearchResults}
<h1 id="n-pages">
{block:SearchPage}({/block:SearchPage}
{block:TagPage}({/block:TagPage}
{lang:Page CurrentPage of TotalPages}
{block:TagPage}){/block:TagPage}
{block:SearchPage}){/block:SearchPage}
</h1>
{block:NoSearchResults}-->{/block:NoSearchResults}
<div class="autopagerize_page_element">
{block:Posts}
<div class="post">
<div class="data">
{block:Text}
{block:Title}
<h2 class="title">
{Title}
</h2>
{/block:Title}
<div class="desc">{Body}</div>
{/block:Text}
{block:Quote}
<blockquote>
{Quote}
<cite>{Source}</cite>
</blockquote>
{/block:Quote}
{block:Link}
<h2 class="title">
<a href="{URL}" {Target}>{Name}</a>
</h2>
<div class="desc">
{block:Description}
{Description}
{/block:Description}
</div>
{/block:Link}
{block:Chat}
{block:Title}
<h2 class="title">
{Title}
</h2>
{/block:Title}
<div class="chat-bubble">
{block:Lines}
<div class="line">
{block:Label}
<strong>{Label}</strong>
{/block:Label}
{Line}<br/>
</div>
{/block:Lines}
</div>
{/block:Chat}
{block:Answer}
<div class="question">
<img src="{AskerPortraitURL-30}" width="30"></img>
<div class="bubble">
<strong>{Asker} {lang:Asker asked}:</strong>{Question}
</div>
</div>
<div class="desc">
{Answer}
</div>
{/block:Answer}
{block:Video}
<div class="video">
{Video-700}
</div>
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Video}
{block:Photo}
<div class="photo">
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{PhotoWidth-HighRes}"></img>{LinkCloseTag}
</div>
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Photo}
{block:Panorama}
<div class="photo">
{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" width="{PhotoWidth-Panorama}"></img>{LinkCloseTag}
</div>
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Panorama}
{block:Photoset}
{block:ifnotphotosetcarousel}
<div class="photoset">
<!-- idea for photoset: http://codepen.io/anon/pen/mzgtD , http://codepen.io/anon/pen/ydIzE -->
{block:Photos}
<div class="photo">
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{PhotoWidth-HighRes}"></img>{LinkCloseTag}
</div>
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Photos}
</div>
{/block:ifnotphotosetcarousel}
{block:ifphotosetcarousel}
<div class="carousel">
<div class="panels-wrapper">
<div class="panels">
{block:Photos}
<span>
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></img>{LinkCloseTag}
</span>
{/block:Photos}
</div>
</div>
<div class="controls-wrapper">
<div class="controls">
<input type="range" min="1" max="{PhotoCount}" value="1" onchange="updateSlide(this)" oninput="updateSlide(this)" id="slide-{PostID}"></input>
<div class="captions">
<!-- should ideally hold 200 charas visible -->
{block:Photos}
<span>{block:Caption}{Caption}{block:Caption}</span>
{block:Photos}
</div>
</div>
</div>
</div>
{/block:ifphotosetcarousel}
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Photoset}
{block:Audio}
<div class="audio">
{block:AlbumArt}
<img src="{AlbumArtURL}" class="albumart"></img>
{/block:AlbumArt}
<div class="audio-info">
{block:AudioPlayer}
<div class="audioplayer">
{AudioPlayerBlack}
</div>
{/block:AudioPlayer}
{block:Artist}
<div class="artist">
Artist: {Artist}
</div>
{/block:Artist}
{block:Album}
<div class="album">
Album: {album}
</div>
{/block:Album}
{block:TrackName}
<div class="track-name">
Song: {TrackName}
</div>
{/block:TrackName}
</div>
</div>
{block:Caption}
<div class="desc">
{Caption}
</div>
{/block:Caption}
{/block:Audio}
</div>
{block:Date}
{block:More}
<a href="{Permalink}">{lang:Read more}</a>
{/block:More}
<div class="metadata">
{block:Text}
<span class="posts-type entypo-feather"></span>
{/block:Text}
{block:Quote}
<span class="posts-type entypo-quote"></span>
{/block:Quote}
{block:Photo}
<span class="posts-type entypo-picture"></span>
{/block:Photo}
{block:Panorama}
<span class="posts-type entypo-picture"></span>
{/block:Panorama}
{block:Photoset}
<span class="posts-type entypo-picture"></span>
{/block:Photoset}
{block:Link}
<span class="posts-type entypo-link"></span>
{/block:Link}
{block:Chat}
<span class="posts-type entypo-chat"></span>
{/block:Chat}
{block:Audio}
<span class="posts-type entypo-note-beamed"></span>
{/block:Audio}
{block:Video}
<span class="posts-type entypo-video"></span>
{/block:Video}
{block:Answer}
<span class="posts-type entypo-help"></span>
{/block:Answer}
<div class="other">
<a href="{ReblogURL}"><span class="entypo-retweet"></span></a>
<a href="{Permalink}">
<span class="entypo-calendar">
{Year}-{MonthNumberWithZero}-{DayOfMonthWithZero} {24HourWithZero}:{Minutes}
</span>
</a>
{block:RebloggedFrom}
<a href="{ReblogParentURL}">
<span class="entypo-flow-cascade">
{ReblogParentTitle}
</span>
</a>
{block:RebloggedFrom}
{block:NoteCount}
<a href="{Permalink}#notes">
<span>{NoteCount} {lang:Notes}</span>
</a>
{block:NoteCount}
{block:HasTags}
<div class="tags">
<span class="entypo-tag"></span>
{block:Tags}
<a href="{TagURL}">{Tag}</a>
{/block:Tags}
</div>
{/block:HasTags}
</div>
</div>
{/block:Date}
{block:PostNotes}
<div class="notes">
<a name="notes">{PostNotes}</a>
</div>
{/block:PostNotes}
</div>
{/block:Posts}
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment