Pastebin launched a little side project called VERYVIRAL.com, check it out ;-) Want more features on Pastebin? Sign Up, it's FREE!
Guest

EUPORIE

By: Eternal-chaos on Nov 25th, 2012  |  syntax: None  |  size: 15.21 KB  |  views: 1,171  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!--
  2.  
  3. EUPORIE theme by Claudia (http://eternal--chaos.tumblr.com)
  4. You may edit this theme, but do NOT remove the credits.
  5.  
  6. Features:
  7.  
  8. - Navigation: always visible / pop out
  9. - Optional photo background
  10. - Optional show caption
  11. - Minimalistic design
  12. - Two columns (350 px)
  13. - 8 custom links
  14.  
  15. - Title = "home" link
  16. - Permalink: "+" symbol on text posts
  17. - Endless scrolling
  18. - Custom scrollbar & to top button included
  19. - Customizable background-color: blog, text posts and top-bar
  20.  
  21. -->
  22.  
  23. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  24. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  25. <html xmlns="http://www.w3.org/1999/xhtml">
  26. <head>
  27. <meta name="color:Background" content="#ffffff"/>
  28. <meta name="color:scrollbar" content="#9d9d9d" />
  29. <meta name="color:topbar background" content="#444"/>
  30. <meta name="color:text posts background color" content="#f7f7f7"/>
  31. <meta name="text:Navigation Title" content="- n a v i g a t i o n -"/>
  32. <meta name="text:Link 1" content="Archive"/>
  33. <meta name="text:Link 1 URL" content="/archive"/>
  34. <meta name="text:Link 2" content="ask"/>
  35. <meta name="text:Link 2 URL" content="/ask"/>
  36. <meta name="text:Link 3" content=""/>
  37. <meta name="text:Link 3 URL" content=""/>
  38. <meta name="text:Link 4" content=""/>
  39. <meta name="text:Link 4 URL" content=""/>
  40. <meta name="text:Link 5" content=""/>
  41. <meta name="text:Link 5 URL" content=""/>
  42. <meta name="text:Link 6" content=""/>
  43. <meta name="text:Link 6 URL" content=""/>
  44. <meta name="text:Link 7" content=""/>
  45. <meta name="text:Link 7 URL" content=""/>
  46. <meta name="text:Link 8" content=""/>
  47. <meta name="text:Link 8 URL" content=""/>
  48. <meta name="text:Post Title Font Size" content="14px"/>
  49. <meta name="text:Line Height" content="1.5em"/>
  50. <meta name="if:Animation" content="1"/>
  51. <meta name="if:Show scrollbar" content="1">
  52. <meta name="if:Navigation Always Visible" content="0"/>
  53. <meta name="if:Navigation Pop Out" content="1"/>
  54. <meta name="if:Show Captions" content="0"/>
  55. <meta name="image:Background" content=""/>
  56. <script type="text/javascript" src="http://static.tumblr.com/uiqhh9x/jkEm9tb4p/jquery-1.8.1.min.js"></script><link rel="stylesheet" type="text/css" href="http://static.tumblr.com/cpaytv3/2V1m9r58l/reset.css">
  57. <script type="text/javascript" src="http://static.tumblr.com/azgm0zj/8qXmerio2/js.txt"></script><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>{Title}</title>{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}<link rel="shortcut icon" href="{Favicon}"><link rel="alternate" type="application/rss+xml" href="{RSS}">
  58. <style type="text/css">
  59. {block:ifshowscrollbar}::-webkit-scrollbar {height: auto; width: 9px;}
  60. ::-webkit-scrollbar-thumb {background-color:{color:scrollbar};}::-webkit-scrollbar-track {background-color:#ffffff;}::-webkit-scrollbar-buttom {background-color:#fff;}{/block:ifshowscrollbar}
  61. body {color: #000000;background: {color:Background} url({image:Background});    font-family: arial;    font-size: 10px;line-height: {text:Line Height};}p{margin:0 0 .75em 0}p:last-child{margin:0}
  62. a {color: #000; text-decoration:none;{block:IfAnimation}-webkit-transition:all .3s ease;-moz-transition:all .3s ease;transition:all .3s ease;-o-transition:all .3s ease;{/block:IfAnimation}}a:link {color:#000;} a:hover {letter-spacing:3px;}.text { padding: 25px;}blockquote {quotes: "" "" "'" "'"; margin: 0.75em 0 .75em .75em;padding: 3px;line-height: 100%;background-color:#EDEDED;}h1 {font-family:'default';font-size: {text:Title Font Size};line-height: 1.5em;}ul {margin: 0px 1.5em;}li{margin: .375em 0;list-style-type: square;}h3 {font-size:{text:Post Title Font Size}; text-align:center; text-decoration:underline;}.tagged { text-align: center; }.text { padding: 5px }p.question {margin-bottom: .375em;}p.quoote {padding: 5px;line-height: 1.5em;color: #333333;}.queestion {background: #efefef;padding: 5px;margin-bottom: .75em;}.answer {text-align: center;}.post {   position: relative;     {block:IndexPage}width:350px;{/block:IndexPage}{block:PermalinkPage}    width: 500px;{/block:PermalinkPage}background:{color:text posts background color};padding:0px; margin:10px;}.box {position: relative;}
  63.  
  64. #toppbar {text-align: center;margin: 20px auto 10px;width:720px;padding:0px;background:{color:topbar background}; padding-bottom:5px;}
  65. .titlu {text-align:center; font-variant:small-caps; padding-top:15px; padding-bottom:5px;font-size:18px;letter-spacing:5px; color:#eee; display:inline-block;}.titlu a {text-align:center; font-variant:small-caps; padding-top:15px; padding-bottom:5px;font-size:18px;letter-spacing:5px; color:#eee;}.titlu a:hover {text-align:center; font-variant:small-caps; padding-top:15px; padding-bottom:5px;font-size:18px;letter-spacing:5px; color:#eee;}.dees {width:600px; display:inline-block;}#toppbar a {color:#ccc;}#contain {width:740px;margin: 10px auto 0;}#content {width:740px;float: right;}#infscr-loading{position:absolute!important;width:16px!important;height:11px!important;margin-bottom:-16px!important;top:auto!important;bottom:0;left:50%!important}.popup_block{color:#000;display: none;background: #fff;padding: 20px;border:2px dotted #eee;float: left;font-size: 11px;position: fixed;top: 30%;left: 50%;z-index: 999999999;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;}.popup_block a{color:#aaa;}.popup_block a:hover {color:#000; letter-spacing:0px;}.menu-link{margin: 0px 10px;} img.btn_close{float: right;margin: -20px -20px 0 0;}iframe#tumblr_controls,.btn.icon.theme{filter:invert(100%);-webkit-filter:invert(100%);-moz-filter:invert(100%);-o-filter:invert(100%);-ms-filter:invert(100%); opacity:.4;position:fixed!important}.text img {max-width: 100%;}.postinfopermalinkdata{text-align:center}.notes img{display:block;float:left;margin-right:.75em}ol.notes li{margin:.375em 0;list-style-type:none;line-height:16px}
  66. #hovertext {display:block; height:auto; text-align:left; position:absolute; margin-top:0px; margin-left:330px;padding:4px; opacity:1; overflow:hidden;z-index:99999;-webkit-transition: opacity 0.6s linear;-webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out;-o-transition: all 0.6s ease-in-out;background-color:transparent;} .post:hover #hovertext {opacity:1;} #notestext {opacity:0.5;width:auto;display:block;color:#000; margin-top:0px; font-family:calibri; font-size:40%; letter-spacing:3px;z-index:9999;-webkit-transform: rotate(45deg);
  67. -moz-transform: rotate(45deg); -o-transform: rotate(45deg);}#notestext:hover{opacity:0.8;}.hello {clear: both;} #pagination {display: none;}    .hellofix:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.hello{display:inline-block}html[xmlns] .hellofix{display:block}* html .hellofix{height:1%}
  68.    
  69. </style>
  70. <body>
  71.  
  72. <div id="contain" class="hellofix">
  73. <div style="color:#fff;">
  74. <div id="toppbar"><a href="/"><div class="titlu">{Title}</div></a>
  75. <br><div class="dees">{Description}</div>
  76. {block:IfNavigationPopOut}
  77. <p class="text"><a href="#?w=500" rel="links" class="poplight"><span>{text:Navigation Title}</span></a></p>{/block:IfNavigationPopOut}
  78. {block:IfNavigationAlwaysVisible}    
  79. <p class="text">{block:ifLink1}<a href="{text:link 1 url}">{text:link 1}</a>{/block:iflink1}{block:iflink2} • <a href="{text:link 2 url}">{text:link 2}</a>{/block:iflink2}{block:iflink3} • <a href="{text:link 3 url}">{text:link 3}</a>{/block:iflink3}{block:iflink4} • <a href="{text:link 4 url}">{text:link 4}</a>{/block:iflink4}{block:iflink5} • <a href="{text:link 5 url}">{text:link 5}</a>{/block:iflink5}{block:iflink6} • <a href="{text:link 6 url}">{text:link 6}</a>{/block:iflink6}{block:iflink7} • <a href="{text:link 7 url}">{text:link 7}</a>{/block:iflink7}{block:iflink8} • <a href="{text:link 8 url}">{text:link 8}</a>{/block:iflink8} • <a href="http://themes--eternal-chaos.tumblr.com">THEME</a></p>{block:IfNavigationAlwaysVisible}</div></div>
  80.  
  81. <div id="content">{block:Posts}<div class="post">
  82.  
  83. {block:Photo}<div style="padding-bottom:0px;"><div class="photo">
  84. <div class="box">{block:IndexPage}<a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" width="100%"/></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/>{LinkCloseTag}{/block:PermalinkPage}</div>{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}</div></div>{/block:Photo}
  85. {block:Text}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br>{/block:IndexPage}<div class="text">{block:Title}<h3><div style="padding-left:10px;">{Title}</div></h3>{/block:Title}<div style="padding:10px;">{Body}</div></div>{/block:Text}
  86. {block:Quote}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br><div style="padding-top:5px;">
  87. {/block:IndexPage}<div class="text quote"><p class="quoote">&#8220;{Quote}&#8221;</p>{block:Source}<p class="source">&nbsp&nbsp&nbsp- {Source} -</p>{/block:Source}</div><br></div>{/block:Quote}
  88. {block:Link}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br>{/block:IndexPage}<div class="text link"> <h3><a href="{URL}" {Target}><div style="padding-left:10px;">{Name}</div></a></h3>{block:Description}<div style="padding:10px;">{Description}</div>{/block:Description}<br></div>{/block:Link}
  89. {block:Chat}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br>{/block:IndexPage}<div class="text chat"><ul class="conversation">{block:Lines}<li class="line {Alt}">{block:Label}<span class="person">{Label}</span>{/block:Label}<span class="person-said">{Line}</span></li>{/block:Lines}</ul></div>{/block:Chat}
  90. {block:Audio}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div>{/block:IndexPage}<div class="text audio"><p><div style="padding-left:10px; padding-bottom:10px; padding-top:0px;">{AudioPlayerBlack}</div></p>{block:IndexPage}{block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}</div>{/block:Audio}
  91. {block:Answer}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br>{/block:IndexPage}<div class="text answer"><div class="queestion">{Asker} said:<p class="question">{Question}</p></div>{Answer}<br></div>{/block:Answer}
  92. {block:Photoset}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div><br>{/block:IndexPage}<div class="photoset"><div class="box">{block:IndexPage}<center>{Photoset-250}</center>{/block:IndexPage}{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}</div>{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}</div>{/block:Photoset}
  93. {block:Video}{block:IndexPage}<div id="hovertext"><a href="{Permalink}"><div id="notestext">✖</div></a></div>{/block:IndexPage}<div class="video"><div class="box">{block:IndexPage}<center>{Video-250}</center>{/block:IndexPage}{block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  94. </div>{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}</div> {/block:Video}{block:PermalinkPage}<div id="postinfopermalink" class="text">{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{block:HasTags}<p class="tagged">{lang:Tagged}: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}</p>{/block:HasTags}<p class="postinfopermalinkdata">{block:NoteCount}{NoteCountWithLabel}<br />{/block:NoteCount}{block:RebloggedFrom}Reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>&nbsp//&nbspPosted by <a href="{ReblogRootURL}">{ReblogRootName}</a>{block:RebloggedFrom}</p>{block:PostNotes}{PostNotes}{/block:PostNotes}</div>{/block:PermalinkPage}</div>{/block:Posts}</div> <div style="float: LEFT; position: fixed; bottom: 8px; LEFT: 8px; font-family:calibri; font-size:12px;"> <a href="http://themes--eternal-chaos.tumblr.com/"> <img src="http://upload.wikimedia.org/wikipedia/commons/d/d5/Triskele-Symbol-spiral.svg"  height="18"> </a></div> </div></div><script type="text/javascript" src="http://arrow.scrolltotop.com/arrow37.js"></script><div class="loading"></div></div> {block:Pagination}<ul id="pagination">{block:PreviousPage}<li><a href="{PreviousPage}"></a></li>{/block:PreviousPage}{block:JumpPagination length="5"}{block:CurrentPage}<li><span class="current_page numbersNav"><strong>{PageNumber}</strong></span></li>{/block:CurrentPage}{block:JumpPage}<li><a class="jump_page numbersNav" href="{URL}">{PageNumber}</a></li>{/block:JumpPage}{/block:JumpPagination}{block:NextPage}<li><a id="nextPage" href="{NextPage}"></a></li>{/block:NextPage}</ul>{/block:Pagination}{block:IndexPage}<script type="text/javascript">$(window).load(function () {$('#content').masonry(),$('.masonryWrap').infinitescroll({navSelector    : '#pagination',  nextSelector   : '#pagination a#nextPage',itemSelector : ".post, .loading",bufferPx : 40,loadingImg : "http://static.tumblr.com/uiqhh9x/38Em68qk4/loading.gif",loadingText : "<em></em>",},function() { $('#content').masonry({ appendedContent: $(this) }); });});</script>{/block:IndexPage}{block:IfNavigationPopOut}<div id="links" class="popup_block" style="line-height:100%;text-align:center;"><div style="font-size:16px;line-height:100%;margin-bottom: 0.75em;"><strong>LINKS</strong></div><div style="max-height:500px;line-height:150%;">{block:iflink1}<a class="menu-link" href="{text:link 1 url}">{text:link 1}</a>{/block:iflink1}{block:iflink2}<a class="menu-link" href="{text:link 2 url}">{text:link 2}</a>{/block:iflink2}{block:iflink3}<a class="menu-link" href="{text:link 3 url}">{text:link 3}</a>{/block:iflink3}{block:iflink4}<a class="menu-link" href="{text:link 4 url}">{text:link 4}</a>{/block:iflink4}{block:iflink5}<a class="menu-link" href="{text:link 5 url}">{text:link 5}</a>{/block:iflink5}{block:iflink6}<a class="menu-link" href="{text:link 6 url}">{text:link 6}</a>{/block:iflink6}{block:iflink7}<a class="menu-link" href="{text:link 7 url}">{text:link 7}</a>{/block:iflink7}{block:iflink8}<a class="menu-link" href="{text:link 8 url}">{text:link 8}</a>{/block:iflink8}<a class="menu-link" href="http://themes--eternal-chaos.tumblr.com">THEME</a></div></div><script type="text/javascript">  $(document).ready(function() {$('a.poplight[href^=#]').click(function() {       var popID = $(this).attr('rel');var popURL = $(this).attr('href');var query= popURL.split('?');var dim= query[1].split('&');var popWidth = dim[0].split('=')[1]; $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/iddq6cw/Atplvofrt/tooltip-closebutton.png" class="btn_close" title="Close" alt="Close" /></a>');var popMargTop = ($('#' + popID).height() + 80) / 2;var popMargLeft = ($('#' + popID).width() + 80) / 2;$('#' + popID).css({'margin-top' : -popMargTop,'margin-left' : -popMargLeft});$('body').append('<div id="fade"></div>');$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); return false;    });     $('a.close, #fade').live('click', function() {  $('#fade , .popup_block').fadeOut(function() {$('#fade, a.close').remove();});  return false;});});     </script>{/block:IfNavigationPopOut}
  95. </body></html>