Advertisement
ITSMERONALD

Theme #1: Creepy

Apr 2nd, 2013
2,757
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.88 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4.  
  5. <!-- Theme 01 by ITSMERONALD.TUMBLR.COM (Ron)
  6. - Don't base this theme as a code
  7. - Keep the credit on
  8. - You can edit this theme but just don't remove the credit.
  9. - Enjoy this theme :D
  10. -->
  11.  
  12. <head><title>{Title}</title>
  13. <link rel="shortcut icon" href="{Favicon}">
  14. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18.  
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}"/>
  21. {/block:Description}
  22.  
  23. <meta name="image:background" content="" />
  24. <meta name="image:sidebarBG" content="" />
  25. <meta name="image:navBG" content="http://static.tumblr.com/qbwrk8v/cdvmjbk1f/2.png" />
  26. <meta name="image:postsBG" content="" />
  27.  
  28. <meta name="color:background" content="#222222"/>
  29. <meta name="color:primary" content="#5a5959"/>
  30. <meta name="color:sidebar" content="#141414"/>
  31. <meta name="color:secondary" content="#1b1b1b"/>
  32. <meta name="color:tertiary" content="#000000"/>
  33. <meta name="color:navBG" content="#050505"/>
  34. <meta name="color:link" content="#838282"/>
  35. <meta name="color:link hover" content="#292929"/>
  36.  
  37. <meta name="if:Grey Images" content="1" />
  38. <meta name="if:endless scrolling" content="1"/>
  39.  
  40. <meta name="text:link one" content="/"/>
  41. <meta name="text:link one name" content=""/>
  42. <meta name="text:link two" content="/"/>
  43. <meta name="text:link two name" content=""/>
  44. <meta name="text:link three" content="/"/>
  45. <meta name="text:link three name" content=""/>
  46. <meta name="text:link four" content="/"/>
  47. <meta name="text:link four name" content=""/>
  48. <meta name="text:link five" content="/"/>
  49. <meta name="text:link five name" content=""/>
  50.  
  51. <style type="text/css">
  52. body {
  53. background:{color:background};
  54. background-image:url('{image:background}');
  55. background-attachment: fixed;
  56. background-position: top center;
  57. font-family:consolas;
  58. font-size:10px;
  59. text-align:justify;
  60. color:{color:primary};}
  61.  
  62. a { text-decoration:none; color:{color:link}; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; }
  63. a:hover {color:{color:link hover}; }
  64.  
  65. {block:IndexPage}{block:Ifgreyimages}
  66. img { -webkit-transition: opacity 0.7s linear;opacity: 0.75; -webkit-filter: grayscale(60%); -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; }
  67. img:hover {-webkit-transition: opacity 0.7s linear;opacity: 1; -webkit-filter: grayscale(0%); -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; }
  68. {/block:Ifgreyimages}{/Block:IndexPage}
  69. img {border:0px;} img:hover{; }
  70.  
  71.  
  72. .sidebar {background:{color:sidebar}; background-position: bottom; background-repeat:repeat; background-image:url('{image:sidebarBG}'); width:100%; left:0px; top:0px;position:fixed;opacity:.6; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; z-index:1; -webkit-box-shadow:0px 5px 8px 4px {color:sidebar}; -moz-box-shadow:0px 5px 8px 4px {color:sidebar}; box-shadow:0px 5px 8px 4px {color:sidebar}; }
  73. .sidebar:hover {opacity:1;}
  74.  
  75.  
  76. .title {font-size:16px; display:inline-block; font-family:georgia; font-weight:normal; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; letter-spacing: 4px; }
  77. .title:hover {{color:tertiary}}
  78.  
  79. h3 {font-weight:normal; font-family:consolas; font-size:11px; margin-top:0px; margin-bottom:-8px; letter-spacing:4px; }
  80.  
  81. .wrap { width:{block:indexpage}1000px{/block:indexpage}{block:permalinkpage}500px{/block:permalinkpage}; padding-top:100px;}
  82.  
  83. .posts { width:{block:indexpage}1000px{/block:indexpage} {block:permalinkpage}500px{/block:permalinkpage}; position:relative; float:right; margin-bottom:50px; padding-bottom:10px; left:200px; }
  84.  
  85. .post {padding:7px;background:{color:secondary};float:left;position:relative; {block:indexpage}margin:7px; width:210px;{/block:indexpage} {block:permalinkpage}width:500px;{/block:permalinkpage} border: 1px solid {color:sidebar}; background-image:url('{image:postsBG}'); }
  86.  
  87. .post:hover .permalink {opacity:1; z-index:9999;-moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in;}
  88.  
  89. .permalink {text-align:left; text-transform:uppercase; opacity:0; font-size:9px; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; position:absolute; background-color:{color:sidebar}; padding:5px; margin-left:10px; margin-top:10px; width:182px;}
  90. .permalink:hover{background-image:url('{image:navBG}'); -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in;}
  91.  
  92. .fart {font-size:11px; display:inline-block; font-family:georgia; font-weight:normal; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in; letter-spacing: 4px; text-transform:lowercase;margin-left:20px;;}
  93. .fart:hover {{color:tertiary}}
  94.  
  95. .page {position:absolute; top:0px; left:0px;}
  96.  
  97. .vector {opacity:0;
  98. -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;
  99. width:224px;
  100. text-align:center;
  101. background:{color:sidebar};
  102. font-family:consolas;
  103. font-size:10px;
  104. position: absolute;
  105. margin-left:-7px;
  106. margin-top:-7px;
  107. z-index:1;
  108. line-height:5px;
  109. }
  110.  
  111. .post:hover .vector {{block:indexpage} display: block; opacity:1; line-height:20px;{/block:indexpage}}
  112.  
  113. .nav {font-family:consolas; text-align:center; width:100%; line-height:0px; background-color:{color:navBG}; left:0px; bottom:0px; padding:10px; margin-top:-24px; background-image:url('{image:navBG}');}
  114. .nav a {background:{color:secondary}; color:{color:primary}; padding:2px; margin-right:-5px; opacity:0; font-size:8px;}
  115. .nav a:hover {background-color:{color:primary}; color::{color:secondary};}
  116.  
  117. .sidebar:hover .nav a{opacity:1; line-height:30px; padding:10px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;}
  118. .sidebar:hover .nav {margin-top:0px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease;}
  119.  
  120. .descrip {margin-top:5px; text-align:center; -moz-transition: 0.3s ease-in; -webkit-transition: 0.3s ease-in; -o-transition: 0.3s ease-in; transition: 0.3s ease-in;}
  121.  
  122. .chatty { color:{color:primary}; margin-bottom:0px; padding:1px; }
  123. .chatty .chatty.even { background-color:{color:background}; color:{color:primary}; margin-bottom:0px; padding:1px;}
  124.  
  125. .caption {font-size:8px; text-transform:uppercase; margin-top:-8px; background:{color:secondary};}
  126. #albart {width:{block:indexpage}210px{/block:indexpage} {block:permalinkpage}500px{/block:permalinkpage};}
  127. .player {background:#000; width:{block:indexpage}210px{/block:indexpage} {block:permalinkpage}500px{/block:permalinkpage};}
  128. .notes {margin-top:8px; font-size:10px; font-weight:bold; text-transform:uppercase;}
  129. ol.notes {padding-left:40px; list-style-type:none; font-weight:normal; font-size:{text:font size}; text-transform:none;}
  130. ol.notes li.note {padding-top:2px;}
  131. ol.notes li.note img.avatar {width:14px; height:14px; border: 5px solid {color:secondary};}
  132.  
  133. .label {font-weight:bold; text-transform:uppercase; font-size:10px; font-family:{font:title};}
  134.  
  135. ul, ol {margin-left:-20px!important; font-size:10px;}
  136.  
  137. blockquote{ padding: 3px; margin: 3px; border-left: 1px dotted {color:secondary};
  138. }
  139.  
  140. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
  141. #infscr-loading {display:none;}
  142.  
  143. .navigation{{block:ifendlessscrolling}display:none; opacity:0;{/block:ifendlessscrolling}{block:ifnotendlessscrolling}padding:10px; font-size:10px; background:{color:sidebar}; float:center; position:relative;{/block:ifnotendlessscrolling}}
  144.  
  145. .navigation a {background-color:{color:secondary}; padding:10px;}
  146. .navigation a:hover {background-color:{color:tertiary}; color:{color:secondary}; padding:10px;}
  147.  
  148. ::-webkit-scrollbar {
  149. width:10px; height:5px;}
  150. ::-webkit-scrollbar-button:start:decrement,
  151. ::-webkit-scrollbar-button:end:increment {
  152. height: 6px;display: block;background-color:#090808;}
  153. ::-webkit-scrollbar-track-piece {
  154. background-color: #090808;}
  155. ::-webkit-scrollbar-thumb:vertical {
  156. height: 10px;background-color:transparent; border-top:1px solid transparent; border-bottom:1px solid #090808;}
  157.  
  158. iframe#tumblr_controls {position:fixed!important; opacity:.8;}
  159.  
  160. {CustomCSS}
  161.  
  162. </style>
  163.  
  164. <script type='text/javascript' src='http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js'></script>
  165.  
  166. {block:IndexPage}
  167. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  168. {block:ifendlessscrolling}<script src="http://static.tumblr.com/twte3d7/qNulm663d/infinite.js"></script>{/block:ifendlessscrolling}
  169.  
  170. <script type="text/javascript">
  171. $(window).load(function () {
  172. $('.posts').masonry(),
  173. $('.masonryWrap').infinitescroll({
  174. navSelector : "div.navigation",
  175. // selector for the paged navigation (it will be hidden)
  176. nextSelector : ".navigation a#next",
  177. // selector for the NEXT link (to page 2)
  178. itemSelector : ".post",
  179. // selector for all items you'll retrieve
  180. bufferPx : 10000,
  181. extraScrollPx: 10000,
  182. loadingImg : "http://i39.tinypic.com/239zqf.gif",
  183. loadingText : "<em></em>",
  184. },
  185. // call masonry as a callback.
  186. function() { $('.posts').masonry({ appendedContent: $(this) }); }
  187. );
  188. });
  189. </script>
  190. {/block:IndexPage}
  191.  
  192. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/BH7lio0yf/jquery.js"></script>
  193. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
  194. <script type="text/javascript" charset="utf-8">
  195. var $j = jQuery.noConflict();
  196. $j(function() {
  197. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  198. $j("img").lazyload({
  199. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  200. effect: "fadeIn",
  201. });
  202. });
  203. </script>
  204. </head>
  205.  
  206. <body>
  207.  
  208.  
  209. <div class="sidebar">
  210.  
  211. <div class="nav">
  212. <a href="/"><div class="title"><i>{title}</i></div></a>
  213. <a href="/archive">history</a>
  214. <a href="/ask">message</a>
  215. <a href="/random">random</a>
  216. <a href="http://itsmeronald.tumblr.com">theme</a>
  217. {block:IfLinkOneName}<a href="{text:link one}">{text:link one name}</a>{/block:IfLinkOneName}
  218. {block:IfLinkTwoName}<a href="{text:link two}">{text:link two name}</a>{/block:IfLinkTwoName}
  219. {block:IfLinkThreeName}<a href="{text:link three}">{text:link three name}</a>{/block:IfLinkThreeName}
  220. {block:IfLinkFourName}<a href="{text:link four}">{text:link four name}</a>{/block:IfLinkFourName}
  221. {block:IfLinkFiveName}<a href="{text:link five}">{text:link five name}</a>{/block:IfLinkFiveName}
  222. {block:HasPages}{block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}{/block:HasPages} </div>
  223.  
  224.  
  225. {block:description}<div class="descrip"><span style="background-color:{color:secondary};">
  226. <br>{description}<br><br>
  227. </span></div>{/block:description}
  228.  
  229. <br>
  230. {block:Pagination}<div class="navigation">{block:NextPage}<p id="page_nav"><a style="float:left; margin-top:-15px;" href="{NextPage}" id="next">Older</a>{/block:NextPage}
  231. {block:PreviousPage}<a style="float:right; margin-top:-5px;" href="{PreviousPage}">Newer</a></p>{/block:PreviousPage}</div>
  232. {/block:Pagination}
  233. </div>
  234.  
  235.  
  236. <div class="wrap"><div class="posts">
  237.  
  238.  
  239. {block:Posts}
  240.  
  241. {block:Text}<div class="post text">
  242. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  243. {block:Title}<h3>{Title}</h3>{/block:Title}
  244. {Body}
  245. </div>
  246. {/block:Text}
  247.  
  248. {block:Photo}
  249. <div class="post photo">
  250. <div class="permalink"><a href="{ReblogURL}" target="_blank">[Reblog]</a> <div class="fart">{block:NoteCount}<a href="{permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}</div></div>
  251. <div id="photo">{block:IndexPage}<a href="{Permalink}">{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}<img src="{block:IndexPage}{PhotoURL-500}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}" width="{block:indexpage}210px{/block:indexpage}{block:permalinkpage}500px{/block:permalinkpage}" alt="{PhotoAlt}"/>{block:IndexPage}</a>{/block:IndexPage}{block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}{block:permalinkpage}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:permalinkpage}</div></div>
  252. {/block:Photo}
  253.  
  254. {block:Photoset}<div class="post photoset">
  255. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  256. {block:IndexPage}<div style="width:210px; height:auto; overflow:hidden;">{Photoset-250}</div>{/block:IndexPage}{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}{block:permalinkpage}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:permalinkpage}<div class="page"><a href="{Permalink}"><div class="vector"></div></a></div></div>{/block:Photoset}
  257.  
  258. {block:Quote}<div class="post quote"><a href="{Permalink}">{Quote}</a>{block:Source}<div style="opacity:.5;">{Source}</div>{/block:Source}</div>{/block:Quote}
  259.  
  260. {block:Link}<div class="post link">
  261. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  262. <h3><a href="{URL}" class="link" {Target}>{Name}</a></h3>{block:Description}<div class="description">{Description}</div>{/block:Description}
  263. </div>{/block:Link}
  264.  
  265. {block:Chat}
  266. <div class="post chat">
  267. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  268. {block:Title}
  269. <div id="tit">{Title}</div>
  270. {/block:Title}
  271. <div class="chatty">
  272. {block:Lines}
  273. <div class="chatty {Alt}">
  274. {block:Label}
  275. <b>{Label}</b>
  276. {/block:Label}
  277. {Line}
  278. </div>
  279. {/block:Lines}
  280. </div>
  281. </div>{/block:Chat}
  282.  
  283. {block:Video}<div class="post video">
  284. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  285. {block:indexpage}<div style="width:{block:ifnotbiggerposts}210px{/block:ifnotbiggerposts}{block:ifbiggerposts}270px{/block:ifbiggerposts}; height:auto; overflow:hidden;">{block:ifnotbiggerposts}{Video-250}{/block:ifnotbiggerposts}{block:ifbiggerposts}{Video-250}{/block:ifbiggerposts}</div>{/block:indexpage}{block:permalinkpage}{Video-500}{/block:permalinkpage}
  286. {block:PermalinkPage}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:PermalinkPage}
  287. </div>{/block:Video}
  288.  
  289. {block:Audio}
  290. <div class="post audio">
  291. <div class="vector"> <img src="http://i45.tinypic.com/2rfd0z9.jpg"> (<a href="{Permalink}"> {TimeAgo}</a>) · {ShortMonth} {DayOfMonth},{Year} → {NoteCountWithLabel}</div>
  292. <div class="player">{AudioPlayerBlack}</div>{block:permalinkpage}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:permalinkpage}
  293. </div>
  294. {/block:Audio}
  295.  
  296. {block:PermalinkPage}
  297. <div class="notes">
  298. Posted {block:Date}{ShortDayOfWeek} {ShortMonth} {DayOfMonthWithZero} at {12Hour}:{Minutes}{AmPm}{/block:Date} with {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags}<div style="font-size:9px; font-weight:normal; margin-top:1px;">{block:Tags}<a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}</div>{/block:HasTags}
  299. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  300. {/block:PermalinkPage}
  301.  
  302. {/block:Posts}
  303.  
  304. </div></div></div></body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement