Skip to content

Instantly share code, notes, and snippets.

@fliiiix
Created February 16, 2013 15:47
Show Gist options
  • Save fliiiix/4967425 to your computer and use it in GitHub Desktop.
Save fliiiix/4967425 to your computer and use it in GitHub Desktop.
Tumblr Theme unter WTFPL bei fragen und/oder wünschen blog@l33tsource.com
<!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" xml:lang="en" lang="en">
<head>
<!---->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>{Title}{block:SearchPage} | {SearchQuery}{/block:SearchPage}{block:PostSummary} | {PostSummary}{/block:PostSummary}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
<meta name="text:Stats Codes">
<meta name="text:Link 1"/>
<meta name="text:Link 1 Title"/>
<meta name="text:Link 2"/>
<meta name="text:Link 2 Title"/>
<meta name="text:Link 3"/>
<meta name="text:Link 3 Title"/>
<meta name="image:Background" content="" />
<meta name="color:Background" content="#FFFFFF" />
<meta name="text:Blog title size" content="75px" />
<meta name="color:Body text" content="#444444" />
<meta name="color:Blog title" content="#000000" />
<meta name="image:Banner"/>
<meta name="if:Banner"/>
<meta name="text:Banner Width" content="500px">
<meta name="text:Updates">
<meta name="color:Links">
<meta name="color:Hover">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/53unaru/4jtlgzkf8/easing.js"></script>
<link href='http://fonts.googleapis.com/css?family=Clicker+Script|Megrim' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="http://files.l33tsource.com/jquery.infinitescroll.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#Body').infinitescroll({
loading: {
finished: undefined,
finishedMsg: "",
img: null,
msg: null,
msgText: "",
selector: null,
speed: 'fast',
start: undefined
},
navSelector : "div.Pagination",
nextSelector : "div#Next a:link",
itemSelector : "#Posts",
});
});
</script>
<style type="text/css">
a:link, a:active, a:visited{
color:{color:links};
text-decoration: none;
-webkit-transition: color 0.4s ease-out;
-moz-transition: color 0.4s ease-out;
}
a:hover{
text-decoration:none;
color:{color:hover};
}
@import url(http://static.tumblr.com/jw8fmba/pXhlt5pzb/bebasneue.css);
html,body {
margin: 0;
font-size: 12px;
line-height: 160%;
}
* {
font-family: Calibri, Helvetica, Arial, sans-serif;
color: {color:Body text};
}
a img {
border: none;
}
a {
color: inherit;
font-size: inherit;
}
em,em a,a em {
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
}
blockquote {
margin: 0;
padding: 0 0 0 9px;
border-left: 1px #CCC dotted;
}
.heading {
position: relative;
width: auto;
margin: 50px auto 25px auto;
text-align: center;
}
.heading a {
text-decoration: none;
}
.heading .title h1 {
margin: 0;
line-height: 100%;
font-family: megrim;
font-weight: normal;
font-size: {text:Blog title size};
color: {color:Blog title};
}
.heading .menu_item {
margin: 0 5px;
}
.posts {
position: relative;
margin: 25px auto;
{block:IndexPage}
width: 1242px;
{/block:IndexPage}
{block:PermalinkPage}
width: 410px;
{/block:PermalinkPage}
}
.post {
float: left;
position: relative;
margin: 5px;
}
.post h2 {
margin: 0;
font-size: 16px;
line-height: 18px;
letter-spacing: 1px;
font-weight: normal;
}
.post h3 {
margin: 5px 0;
font-size: 14px;
line-height: 16px;
letter-spacing: 1px;
font-weight: normal;
}
.post h2.quote {
font-family: Georgia, "Times New Roman", Times, serif;
letter-spacing: 0;
font-style: italic;
}
.post p,.post li {
line-height: 175%;
}
.post p {
margin: 10px 0 5px 0;
}
.post ol,.post ul {
margin: 3px 0;
padding: 0;
}
.post li {
margin: 2px 35px;
}
.post .info_bar {
width: 300px;
background: #FFF;
padding: 2px 0;
text-align: center;
position: absolute;
bottom: 10px;
left: 0;
color: #CCC;
font-size: 11px;
opacity: 0;
-webkit-transition: all 0.25s ease;
-moz-transition: all 0.25s ease;
-o-transition: all 0.25s ease;
transition: all 0.25s ease;
{block:PermalinkPage}
display: none;
{/block:PermalinkPage}
}
.post:hover .info_bar {
opacity: 1;
}
.post .info_bar a {
color: #333;
text-decoration: none;
margin: 0 5px;
}
.post .photo {
position: relative;
padding: 0;
line-height: 0 !important;
{block:IndexPage}
background: rgba(255,255,255,1);
{/block:IndexPage}
}
.post .photo .photo_info {
position: absolute;
top: 50%;
left: 50%;
width: 200px;
height: 120px;
margin: -50px 0 0 -100px;
text-align: center;
z-index: 10;
opacity: 0;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
{block:PermalinkPage}
display: none;
{/block:PermalinkPage}
}
.post:hover .photo .photo_info {
opacity: 1;
}
.post .photo .photo_info a {
color: #FFF;
text-decoration: none;
}
.post .photo .photo_info h2 a {
margin: 0;
line-height: 100%;
font-family: 'BebasNeueRegular', Arial, sans-serif;
text-transform: uppercase;
font-size: 100px;
color: #FFF;
}
.post img.main_photo {
width: 300px;
}
.post img {
max-width: 300px;
height: auto;
}
.post .photo img {
opacity: 1;
-webkit-transition: all 0.5s eƒase;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
margin: 0;
}
.post:hover .photo img {
{block:IndexPage}
opacity: 0.5;
{/block:IndexPage}
}
.post .player {
padding: 5px 10px;
background: #FFF;
}
.post .lines {
margin: 0 0 5px 0;
}
.post .lines .line {
padding: 10px;
}
.post .lines .odd {
}
.post .lines .even {
background: #f6f6f6;
}
.post ol.notes {
padding: 0;
list-style-type: none;
}
.post ol.notes li.note {
border-bottom: solid 1px #F6F6F6;
padding: 6px 0;
margin: 0 !important;
}
.post ol.notes li.note img.avatar {
vertical-align: -4px;
margin-right: 10px;
width: 16px;
height: 16px;
}
.post ol.notes li.note span.action {
}
.post ol.notes li.note .answer_content {
font-weight: normal;
}
.post ol.notes li.note blockquote {
border-color: #F6F6F6;
padding: 4px 10px;
margin: 10px 0px 0px 25px;
}
.post ol.notes li.note blockquote a {
text-decoration: none;
}
.pagination {
display: none;
}
body{background:url({image:Background}) {color:Background} fixed center}.post{width:300px}
#box{
height:auto;
opacity:1.0;
text-align:center;
z-index:99999999999999999999;
background:transparent;}
#updates{
border-radius: 5px;
border:1px dashed #000;
position:fixed !important;
left:20px; padding-top:12px;
bottom:20px; padding-bottom:20px;
text-align:center;
height:10px;
width:68px;
overflow:hidden;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background:#FFF;
z-index:9999999999999999999999999999999;}
#updates:hover{
overflow:auto;
border-radius: 5px;
border:1px dashed #000;
padding:5px;
height:87px;
width:140px;
z-index:99999999999999999999999999999999999;
background:#fff;}
#stats{
border-radius: 5px;
border:1px dashed #000;
position:fixed !important;
left:100px; padding-top:12px;
bottom:20px; padding-bottom:20px;
text-align:center;
height:10px;
width:70px;
overflow:hidden;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background:#FFF;
z-index:999;}
#stats:hover{
border-radius: 5px;
border:1px dashed #000;
padding:5px;
height:87px;
width:60px;
z-index:99999999999999999999999999999999999;
background:#fff;}
#links{
border-radius: 5px;
border:1px dashed #000;
position:fixed !important;
left: 20px; padding-top:12px;
bottom:75px; padding-bottom:20px;
text-align:center;
height:10px;
width:68px;
overflow:hidden;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background:#FFF;
z-index:999;}
#links:hover{
border-radius: 5px;
border:1px dashed #000;
padding:5px;
height:150px;
width:59px;
overflow: auto;
z-index:99999999999999999999999999999999999;
background:#fff;}
#message{
border-radius: 5px;
border:1px dashed #000;
position:fixed !important;
left: 100px; padding-top:12px;
bottom:75px; padding-bottom:20px;
text-align:center;
height:10px;
width:68px;
overflow:hidden;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background:#FFF;
z-index:999;}
#message:hover{
border-radius: 5px;
border:1px dashed #000;
padding:5px;
height:180px;
width:500px;
z-index:99999999999999999999999999999999999;
background:#fff;}
#Body {clear: both; margin-bottom: 10px; min-height: 800px;}
{CustomCSS}
</style>
</head>
<body>
<div id="wrapper">
<div id="head">
<div class="heading">
{block:ifnotbanner}
<a class="title" href="/"><h1>{Title}</h1></a>
{/block:ifnotbanner}
{block:ifbanner}
<a class="title" href="/"><h1><img width="{text:banner width}" src="{image:banner}"></h1></a>
{/block:ifbanner}
<p>{description}</p>
</div>
<div class="heading">
<a href="{text:link 1}" style="margin-right:5px; font-size: 14px;">{text:link 1 title}</a>
<a href="{text:link 2}" style="margin-right:5px; font-size: 14px;">{text:link 2 title}</a>
{block:AskEnabled}
<li><a href="/ask" title="Ask a question" style="font-size: 14px;" >{AskLabel}</a></li>
{/block:AskEnabled}
</div>
</div>
<div id="Body">
<div class="posts" id="Posts">
{block:Posts}
<div class="post" id="post_{PostID}">
{block:Text}
{block:Title}<h2>{Title}</h2>{/block:Title}
{Body}{block:More}<h3><a href="{Permalink}">Read more</a></h3>{/block:More}
{/block:Text}
{block:Chat}
{block:Title}<h2>{Title}</h2>{/block:Title}
<div class="lines">{block:Lines}<div class="line {Alt}">{block:Label}{Label}{/block:Label} <em>{Line}</em></div>{/block:Lines}</div>
{/block:Chat}
{block:Quote}
<h2>"{Quote}"</h2>{block:Source}<p>- {Source}</p>{/block:Source}
{/block:Quote}
{block:Link}
<h2><a href="{URL}" {Target}>{Name}</a></h2>{block:Description}{Description}{/block:Description}
{/block:Link}
{block:Photo}
<div class="photo"><div class="photo_info"></div>{LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}" class="main_photo" />{LinkCloseTag}</div>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
{/block:Photo}
{block:Photoset}
{block:IndexPage}{Photoset-250}{/block:IndexPage}{block:PermalinkPage}{Photoset-500}{block:caption}{caption}{/block:caption}{/block:PermalinkPage}
{/block:Photoset}
{block:Video}
{block:IndexPage}{Video-400}{/block:IndexPage}{block:PermalinkPage}{Video-500}{/block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}
{/block:Video}
{block:Audio}
{block:AlbumArt}<a href="{Permalink}"><img src="{AlbumArtURL}" class="main_photo" /></a>{/block:AlbumArt}<div class="player">{AudioPlayerWhite}</div>{block:Caption}{Caption}{/block:Caption}
{/block:Audio}
{block:Date}
<div class="info_bar"><a href="{Permalink}">{NotecountWithLabel}</a> / <a href="{ReblogUrl}">Reblog</a> / <a href="{Permalink}">{TimeAgo}</a></div>
{/block:Date}
</div>
{block:PostNotes}
<div class="post">
{block:NoteCount}
<h2>{NoteCountWithLabel}</h2>
{/block:NoteCount}
{PostNotes}
</div>
{/block:PostNotes}
{/block:Posts}
</div>
</div>
<div class="Pagination" style="display:none;">
<div id="TotlePages">
Page {CurrentPage} <span id="PageOf">of</span> {TotalPages}
</div><!-- End Totle Pages -->
{block:NextPage}
<div id="Next">
<a href="{NextPage}" title="Go to the next page">Next</a>
</div><!-- End Next Page Button -->
{/block:NextPage}
{block:PreviousPage}
<div id="Back">
<a href="{PreviousPage}" title="Go to the previous page">Back</a>
</div><!-- End Back Page Button -->
{/block:PreviousPage}
</div><!-- End Pagination -->
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment