Advertisement
twerkinqz

Theme 57 by Sylvia

Sep 2nd, 2013
4,295
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.15 KB | None | 0 0
  1. <!--
  2. Theme 57 by Sylvia (twerkinqz)
  3.  
  4. keep the credit or the theme will be destroyed..seriously
  5.  
  6. -->
  7.  
  8. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  9.  
  10. <head>
  11.  
  12. <link href="http://static.tumblr.com/z0cd8ty/aJjm6uyej/meffects.css" rel="stylesheet">
  13.  
  14.  
  15. <script type="text/javascript"
  16. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  17.  
  18. <script type="text/javascript"
  19. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  20.  
  21. <link href="http://static.tumblr.com/z0cd8ty/aJjm6uyej/meffects.css" rel="stylesheet">
  22.  
  23.  
  24.  
  25.  
  26.  
  27. <title>{title}</title>
  28.  
  29. <link rel="shortcut icon" href="{Favicon}">
  30.  
  31.  
  32. <meta name="description" content="{metadescription}" />
  33. <meta name="color:Background" content="#FFFFFF"/>
  34. <meta name="color:Text" content="#000000"/>
  35. <meta name="color:Hover" content="#ffffff"/>
  36. <meta name="color:Link" content="#000000"/>
  37. <meta name="color:Title" content="#000000">
  38. <meta name="image:Background" content="1"/>
  39. <meta name="image:Sidebar" content=""/>
  40. <meta name="if:side" content="1"/>
  41. <meta name="if:1column" content="0"/>
  42. <meta name="if:3column" content="0"/>
  43. <meta name="if:fadedposts" content="0"/>
  44. <meta name="text:Link One Title" content="" />
  45. <meta name="text:Link One" content="" />
  46. <meta name="text:Link Two Title" content="" />
  47. <meta name="text:Link Two" content="" />
  48. <meta name="text:Link Three Title" content="" />
  49. <meta name="text:Link Three" content="" />
  50. <meta name="text:Link Four Title" content="" />
  51. <meta name="text:Link Four" content="" />
  52. <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
  53.  
  54. <style type="text/css">
  55.  
  56. ::-webkit-scrollbar {width: 3px; height: 4px; background: #eee; }
  57.  
  58. ::-webkit-scrollbar-thumb { background-color:transparent; }
  59.  
  60. #tumblr_controls{
  61. position:fixed !important;
  62. -webkit-filter:invert(100%);
  63. opacity:.8;
  64. -webkit-transition:linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  65. }
  66.  
  67.  
  68. body {
  69. padding: 0px;
  70. margin: 0px;
  71. color:{color:text};
  72. font-family: Trebuchet Ms;
  73. font-size: 11px;
  74. line-height:11px;
  75. background-color: {color:Background};
  76. background-image:url({image:Background});
  77. background-attachment: fixed;
  78. background-repeat: repeat
  79. text-align: justify;
  80. }
  81.  
  82. a:link, a:active, a:visited{
  83. color:{color:link};
  84. text-decoration: none;
  85. -webkit-transition: color 0.4s ease-out;
  86. -moz-transition: color 0.4s ease-out;
  87. }
  88.  
  89. a:link, a:visited{
  90. color:{color:link};
  91. background:transparent;
  92. text-decoration:none;
  93. }
  94.  
  95. a:hover{
  96. color:{color:hover};
  97. background:transparent;
  98. }
  99.  
  100. a:active{
  101. color:#000
  102. background:#eee;
  103. text-decoration:underline;
  104. }
  105.  
  106. .entry {
  107. margin: 3px;
  108. padding: 8px;
  109. padding-bottom:6px;
  110. float:left;
  111. overflow:hidden;
  112. {block:ifnotfadedposts}
  113. opacity:1;
  114. {/block:ifnotfadedposts}
  115. text-align: justify;
  116. background-color: white;
  117. font-family:Trebuchet Ms;
  118. font-size: 11px;
  119. line-height:11px;
  120. border: solid 1px #cecece;
  121. {block:PermalinkPage}
  122. width:500px;
  123. {/block:PermalinkPage}
  124. {block:IndexPage}
  125. {block:if1column}
  126. width:230px;
  127. {block:if1column}
  128. {block:ifnot1column}
  129. width:200px;
  130. {/block:ifnot1column}
  131. {/block:IndexPage}
  132. }
  133.  
  134. .entry img{
  135. {block:iffadedposts}
  136. opacity:0.7;
  137. {/block:iffadedposts}
  138. {block:IndexPage}
  139. {block:if1column}
  140. width:230px;
  141. {block:if1column}
  142. {block:ifnot1column}
  143. width:200px;
  144. {/block:ifnot1column}
  145. {/block:IndexPage}
  146. }
  147.  
  148. .entry .permalink{
  149. position:absolute;
  150. {block:if1column}
  151. width:245px;
  152. {/block:if1column}
  153. {block:ifnot1column}
  154. width:215px;
  155. {/block:ifnot1column}
  156. height:35px;
  157. padding-top:2px;
  158. background-color:#fff;
  159. overflow:hidden;
  160. letter-spacing:2px;
  161. bottom: 0px;
  162. font-family: trebuchet ms;
  163. right: 0px;
  164. text-transform: uppercase;
  165. font-size:8px;
  166. line-height:17px;
  167. text-align:center;
  168. opacity:0.0;
  169. z-index:99999999999;
  170. color:{color:link};
  171. -webkit-transition: all 0.3s linear;
  172. -moz-transition: all 0.3s linear;
  173. transition: all 0.3s linear;
  174. }
  175.  
  176. .entry .permalink a{
  177. color:{color:link};
  178. }
  179.  
  180.  
  181. .entry:hover .permalink {
  182. overflow:visible;
  183. opacity: 1;
  184. color:{color:link};
  185. bottom: 0px;
  186. height: 35px;
  187. -webkit-transition: all 0.3s linear;
  188. -moz-transition: all 0.3s linear;
  189. transition: all 0.3s linear;
  190. }
  191.  
  192.  
  193.  
  194.  
  195. #sidebar{
  196. text-align:center;
  197. background-color:white;
  198. margin-top:200px;
  199. margin-left:181px;
  200. font-size: 12px;
  201. width:198px;
  202. padding:5px;
  203. opacity:1;
  204. height:auto;
  205. border: solid 1px #ddd;
  206. z-index:999999999999999999999999999;
  207. position:fixed !important;
  208. -webkit-animation:fadeIn 4s;
  209. -moz-animation:fadeIn 4s;
  210. -ms-animation:fadeIn 4s;
  211. }
  212.  
  213.  
  214. {block:ifside}
  215. #sidebar2{
  216. position:fixed !important;
  217. width:75px;
  218. width:210px;
  219. padding:10px;
  220. margin-left:170px;
  221. z-index:1;
  222. position:fixed !important;
  223. text-align:center;
  224. top:0px;
  225. height:100%;
  226. background-color: #fff;
  227. color: #000;
  228. font-size: 11px;
  229. border-left: solid 1px #ddd;
  230. border-right: solid 1px #ddd;
  231. -webkit-animation:fadeIn 4s;
  232. -moz-animation:fadeIn 4s;
  233. -ms-animation:fadeIn 4s;
  234. }
  235. {/block:ifside}
  236.  
  237. #posts {
  238. {block:if1column}
  239. width: 393px;
  240. margin-left:415px;
  241. {/block:if1column}
  242. {block:ifnot1column}
  243. width: 593px;
  244. margin-left:415px;
  245. {/block:ifnot1column}
  246. {block:if3column}
  247. width: 793px;
  248. margin-left:415px;
  249. {/block:if3column}
  250. margin-top:0px;
  251. float:center;
  252. }
  253.  
  254. .links{
  255. width: auto;
  256. letter-spacing:1px;
  257. height: 15px;
  258. line-height: 22px;
  259. font-family: Trebuchet Ms;
  260. font-size: 10px;
  261. text-decoration: none;
  262. text-align: center;
  263. color:{color:link};
  264. -webkit-transition: all 0.5s ease;
  265. -moz-transition: all 0.5s ease;
  266. -o-transition: all 0.5s ease;
  267. }
  268.  
  269. .links:hover a{
  270. color:{color:link};
  271. }
  272.  
  273. .links:hover {
  274. text-shadow:6px 0px #888, -6px 0px #ccc;
  275. }
  276.  
  277.  
  278.  
  279. .textperma{
  280. display: block;
  281. font-family:Trebuchet Ms;
  282. font-size: 11px;
  283. line-height:11px;
  284. text-transform: lowercase;
  285. text-align: right;
  286. background-color:transparent;
  287. padding: 0px;
  288. margin: 2px;
  289. }
  290.  
  291. .title{
  292. font-family:Trebuchet Ms;
  293. font-size: 13px;
  294. line-height: 15px;
  295. color: {color:Title};
  296. text-transform:uppercase;
  297. }
  298.  
  299. .descript{
  300. font-family:Trebuchet Ms;
  301. font-size:10px;
  302. text-align:center;
  303. }
  304.  
  305. #audio {width:200px; height:auto; min-height:60px; padding-bottom:0px;}
  306.  
  307. .cover {position:absolute; z-index:1; width:60px; height:60px;}
  308.  
  309. .cover img {float:left; width:60px; height:60px;}
  310. .cover img:hover {maragin-top:0px;}
  311.  
  312. .playbox {opacity:0.6; width:27px; height:30px; overflow:hidden; position:absolute; z-index:1000; margin-left:17px; margin-top:17px; text-align:center;}
  313.  
  314. .info {margin-left:73px; margin-top:4px; line-height:14px;}
  315.  
  316. .text img{
  317. width:200px;
  318. }
  319.  
  320.  
  321. </style>
  322.  
  323. {block:IndexPage}
  324. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script><div style="position:fixed !important;right:3px;top:24px; opacity: 0.8; z-index:999999999999999999999999999; "><a href="http://twerkinqz.tumblr.com/"><img src="http://static.tumblr.com/dvz4szr/oismscl3m/yinyang.gif"></a></div><script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  325.  
  326. <script type="text/javascript">
  327. $(window).load(function () {
  328. var $content = $('#posts');
  329. $content.masonry({itemSelector: '.entry'}),
  330. $content.infinitescroll({
  331. navSelector : 'div#pagination',
  332. nextSelector : 'div#pagination a#nextPage',
  333. itemSelector : '.entry',
  334. loading: {
  335. finishedMsg: '',
  336. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  337. },
  338. bufferPx : 600,
  339. debug : false,
  340. },
  341. // call masonry as a callback.
  342. function( newElements ) {
  343. var $newElems = $( newElements );
  344. $newElems.hide();
  345. // ensure that images load before adding to masonry layout
  346. $newElems.imagesLoaded(function(){
  347. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  348.  
  349.  
  350. });
  351. });
  352. });
  353. </script>
  354.  
  355.  
  356.  
  357. {/block:IndexPage}
  358.  
  359. <title>{title}</title>
  360.  
  361. <link rel="shortcut icon" href="{Favicon}">
  362. <meta name="viewport" content="width=820" />
  363.  
  364. </head>
  365.  
  366. <body>
  367.  
  368. <div class="wrapper">
  369. <div class="header">
  370. </div>
  371.  
  372. {block:ifside}
  373. <div id="sidebar2"><br></div>
  374. {/block:ifside}
  375.  
  376.  
  377. <div id="sidebar">
  378. <a href="/"><img src="{image:Sidebar}" width=196px; height=auto;></a>
  379. <br><br>
  380. <div class="descript">{Description}</div>
  381. <span class="links"><a href="/">home</a></span>
  382.  
  383. <span class="links"><a href="/ask">ask</a></span>
  384.  
  385. {block:ifLinkOneTitle}<span class="links"><a href="{text:Link One}">{text:Link One Title}</a></span>{/block:ifLinkOneTitle}
  386. {block:ifLinkTwoTitle}<span class="links"><a href="{text:Link Two}">{text:Link Two Title}</a></span>{/block:ifLinkTwoTitle}
  387. {block:ifLinkThreeTitle}<span class="links"><a href="{text:Link Three}">{text:Link Three Title}</a></span>{/block:ifLinkThreeTitle}
  388. {block:ifLinkFourTitle}<span class="links"><a href="{text:Link Four}">{text:Link Four Title}</a></span>{/block:ifLinkFourTitle}
  389. </div>
  390.  
  391. <div id="descript">
  392. </div>
  393.  
  394. <div class="content">
  395.  
  396. <div class="left">
  397.  
  398. <div id="posts">
  399.  
  400. {block:Posts}
  401. <div class="entry">
  402.  
  403. {block:Text}
  404. {block:Title}<div id="title" align="left">{title}</div>{/block:Title}
  405. <div class="txt">{body}</div>
  406. {block:IndexPage}
  407. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  408. {/block:IndexPage}
  409. {/block:Text}
  410.  
  411. {block:Link}
  412. <a href="{URL}" class="title">{Name}</a>
  413. {block:Description}{Description}{/block:Description}
  414. {block:IndexPage}
  415. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  416. {/block:IndexPage}
  417. {block:Link}
  418.  
  419. {block:Photo}
  420. {block:IndexPage}
  421. <div class="permalink">
  422. <a href="{Permalink}"><a href="{ReblogURL}" target="_blank">reblog</a> with <a href="{permalink}">{NoteCountWithLabel}</a><br><a href="{permalink}">Posted {TimeAgo}</a></div></span>
  423. {LinkOpenTag}<div class="photo"><a href="{permalink}">{block:ifnot1column}<img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"width="200"/></a></div>{/block:ifnot1column}{block:if1column}<img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"width="230"/></a></div>{/block:if1column}{LinkCloseTag}{/block:IndexPage}
  424. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="500"/></a>{LinkCloseTag}{/block:PermalinkPage}
  425. {/block:Photo}
  426.  
  427. {block:Photoset}{block:IndexPage}
  428. <div class="permalink">
  429. <a href="{Permalink}"><a href="{ReblogURL}" target="_blank">reblog</a> with <a href="{permalink}">{NoteCountWithLabel}</a><br><a href="{permalink}">Posted {TimeAgo}</a></div></span>{/block:IndexPage}
  430.  
  431. {block:ifnot1column}<div style="width:200px; overflow-y: hidden;">{Photoset-250}</div>{/block:ifnot1column}{block:if1column}<div style="width:230px; overflow-y: hidden;">{Photoset-250}</div>{/block:if1column}{/block:Photoset}
  432.  
  433. {block:Quote}
  434. <span class="title">{Quote}</span><br><br>
  435. {block:Source}{Source}{/block:Source}
  436. {block:IndexPage}
  437. <br /><div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  438. {/block:IndexPage}
  439. {/block:Quote}
  440.  
  441. {block:Chat}
  442. {block:Title}<span class="title">{Title}</span>{/block:Title}
  443. <ul class="chat">
  444. {block:Lines}
  445. <li class="user_{UserNumber}">
  446. {block:Label}
  447. <span class="label">{Label}</span>
  448. {/block:Label}
  449.  
  450. {Line}
  451. </li>
  452. {/block:Lines}
  453. </ul>
  454. {block:IndexPage}
  455. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  456. {/block:IndexPage}
  457. {/block:Chat}
  458.  
  459. {block:Audio}
  460. <div id="audio"><div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="playbox">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div><div class="info"><b>Artist:</b> <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br><b>Title:</b> <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<b>{block:PlayCount}<br><b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}</div></div>
  461.  
  462. {block:IndexPage}
  463. <div class="textperma"><a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank"></a></span></a></div>
  464. {/block:IndexPage}
  465. {/block:Audio}
  466.  
  467. {block:Video}{block:IndexPage}
  468. <a href="{Permalink}" target="_blank"><i>View Video Here</i></a>
  469.  
  470. {/block:IndexPage}
  471.  
  472. {block:PermalinkPage}
  473. <center>
  474. <div class="videoperma">{Video-500}</div><BR>
  475. </center>{block:PermalinkPage}
  476. {block:Video}
  477.  
  478.  
  479. {block:PermalinkPage}
  480. <center>
  481. {block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}{/block:hasTags}</center>
  482.  
  483. {/block:PermalinkPage}
  484.  
  485. {block:PostNotes}{PostNotes}
  486. {/block:PostNotes}
  487. </div>
  488.  
  489. {/block:Posts}
  490. </div>
  491. </div>
  492. {block:IndexPage}
  493. {block:Pagination}
  494. <div id="pagination">
  495. {block:NextPage}
  496. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  497. {/block:NextPage}
  498. {block:PreviousPage}
  499. <a href="{PreviousPage}">&larr;&nbsp;</a>
  500. {/block:PreviousPage}
  501. </div>
  502. {/block:Pagination}
  503. {/block:IndexPage}
  504. </div>
  505.  
  506. </body>
  507.  
  508. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement