Advertisement
tobemarissa

TBM Theme 27: XOXO

Jan 8th, 2014
82
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.00 KB | None | 0 0
  1. <!--You cannot remove credit! If you absolutely NEED to move it, I expect it to be placed somewhere else on the theme, preferably on the main page. If you remove credit, I will report you :) I take a lot of time on these theme so please respect that. If you have any questions or problems, just let me know and I'll be happy to help you! :)-->
  2.  
  3. <html>
  4.  
  5. <head>
  6.  
  7. <meta name="color:links" content="#b9964f" />
  8. <meta name="color:linkshover" content="#272626" />
  9. <meta name="color:title" content="#4d2d1f" />
  10. <meta name="color:sidebar" content="#ffffff" />
  11. <meta name="color:background" content="#fdf0e5" />>
  12. <meta name="image:background" content="" />
  13. <meta name="image:sidebar" content="" />
  14. <meta name="text:link1" content=""/>
  15. <meta name="text:link1url" content="" />
  16.  
  17.  
  18.  
  19. <link rel="shortcut icon" href="http://media.tumblr.com/tumblr_ll7xdypSeR1qi6qow.gif">
  20.  
  21. <title>{Title}</title>
  22.  
  23.  
  24. <style type="text/css">
  25.  
  26. @font-face {font-family:"arma";src:url('http://static.tumblr.com/7glhdxz/B3Mmgevme/pf_arma_five.ttf');}
  27.  
  28.  
  29. @font-face{font-family:"Halo Handletter";src:url('http://static.tumblr.com/9wzbixa/Chgmj2j5c/halohandletter.ttf');}
  30.  
  31.  
  32. /*GENERAL*/
  33.  
  34. body{
  35. background-image:url('{image:background}');
  36. background-color:{color:background};
  37. background-attachment: fixed;
  38. font-family:"arma";
  39. font-size:8px;
  40. }
  41.  
  42. a:link, a:active, a:visited{
  43. color: #ccc;
  44. text-decoration: none;}
  45.  
  46. a:hover {
  47. color:#000;
  48. text-decoration: none;}
  49.  
  50.  
  51. /*SIDEBAR*/
  52.  
  53. div#sidebar{
  54. margin-left:100px;
  55. width:300px;
  56. height:auto;
  57. z-index:1;
  58. position:fixed;
  59. background:{color:sidebar};
  60. margin-top:85px;
  61. font-family:"arma";
  62. font-size:8px;
  63. text-align:center;
  64. padding:3px;
  65. border:1px solid #ccc;
  66. }
  67.  
  68. div#title{
  69. margin-left:50px;
  70. width:200px;
  71. text-align:center;
  72. color:{color:title};
  73. font-size:50px;
  74. position:fixed;
  75. margin-top:330px;
  76. background:transparent;
  77. font-family:"Halo Handletter";
  78. text-shadow: 2px 2px 2px #fff;
  79.  
  80. z-index:2;
  81.  
  82. }
  83.  
  84. div#desc{
  85. left: 110px;
  86. top:400px;
  87. width:300px;
  88. border-top: 1px solid #ccc;
  89. border-bottom: 1px solid #ccc;
  90. position:fixed;
  91. background-color:#ffffff;
  92. font-family:'arma';
  93. font-size: 8px;
  94. z-index:2;
  95. padding:3px;
  96. text-align:center;
  97. opacity:.6;
  98. }
  99.  
  100. div#border{
  101. left:1100px;
  102. height:120%;
  103. top:-20px;
  104. background-image: url('http://i917.photobucket.com/albums/ad12/xguyswithguitarsx/border_zpsedf38566.png');
  105. background-repeat: repeat;
  106. width:36px;
  107. position:fixed;
  108. }
  109.  
  110. /*POSTS*/
  111.  
  112. div#posts{
  113. margin-left: 550px;
  114. margin-top:-20px;
  115. width:540px;
  116. height:100%;
  117. background: #ffffff;
  118. padding-left:6px;
  119. padding-top:0px;
  120. border-right: 1px dotted #000;
  121. border-left: 1px dotted #000;
  122.  
  123. }
  124.  
  125. .entry {
  126. margin:3px;
  127. padding:5px;
  128. float:left;
  129. background-color: white;
  130. overflow: hidden;
  131. {block:IndexPage}
  132. width:250px;
  133. {/block:IndexPage}
  134. {block:PermalinkPage}
  135. width:500px;
  136. padding:3px;
  137. padding-bottom:1px;
  138. margin-left: 50px;
  139. {/block:PermalinkPage}
  140. }
  141.  
  142. .tweek {
  143. font-size:15px;
  144. line-height:100%;
  145. padding:2px;
  146. color:#fff;
  147. z-index:987897978978999999;
  148. }
  149.  
  150.  
  151. #audiostats {display:block; height:auto; position:relative; min-height:80px;}
  152.  
  153. .audioentry {width:200px; background-color:#ffffff; position:relative; padding:5px; {block:IndexPage}overflow:hidden;{/block:IndexPage}; min-height:80px;}
  154.  
  155. .audio {top: 15px; left: 15px; -webkit-border-radius: 50px; -moz-border-radius: 50px; position: absolute; z-index: 3; background: white; opacity: .5; filter:alpha(opacity=50)}
  156.  
  157. .audioplayer {width: 20px; height: 30px; overflow: hidden; margin: 17px 24px 13px 16px;}
  158.  
  159. .perms {
  160. border-bottom: 1px solid {color:border};
  161. color:#777;
  162. font-size:8px;
  163. opacity: 0;
  164. -webkit-transition-duration: .75s;top:0px;
  165. width:250px;
  166. height:22px;
  167. padding-bottom:4px;
  168. background-color: #fff;
  169. position: absolute;
  170. margin-top:6px;
  171. text-align:center;
  172. text-transform:uppercase;
  173. font-family:consolas;
  174. letter-spacing:1px;
  175. display:block;
  176. }
  177.  
  178. .entry:hover .perms {
  179. opacity:0.9;
  180. z-index:999999;
  181. padding-top:4px;}
  182.  
  183. .permalinktext{
  184. text-align:center;
  185. color: #b9964f;
  186. }
  187.  
  188.  
  189.  
  190. /*NAVIGATION*/
  191.  
  192. div.navigate a{
  193. background: {color:links}; color: #ffffff; display:block; width: 58px; text-align: center; padding-top:2px; padding-bottom:3px; margin-left:2px; margin-top:2px; position:relative; text-align: center; z-index:1; display: inline-block;
  194. }
  195. div.navigate a:hover{
  196. background: {color:linkshover}; color: #ffffff;
  197. }
  198.  
  199. /*EXTRAS*/
  200.  
  201.  
  202.  
  203. </style>
  204.  
  205.  
  206.  
  207. </head>
  208.  
  209. <body>
  210.  
  211. <div id="title">{Title}</div>
  212.  
  213.  
  214.  
  215. <div id="sidebar">
  216. <img src="{image:sidebar}" width=300px; height:413px;>
  217. <br>
  218. <center><div class="navigate">
  219. <a href="http://link1.com">home</a><a href="/ask">ask</a><a href="/archive">archive</a><a href="{text:link1url}">{text:link1}</a><a href="http://tobemarissa.tumblr.com">credit</a></div></center>
  220.  
  221. <div id="desc">{Description}</div>
  222.  
  223. </div>
  224.  
  225. <div id="border"></div>
  226.  
  227.  
  228.  
  229.  
  230.  
  231.  
  232.  
  233. <div id="posts">
  234.  
  235. {block:Posts}
  236. <div class="entry">
  237.  
  238.  
  239.  
  240.  
  241. {block:Text}
  242. <div class="text">
  243. <div style="text-transform:uppercase">{block:Title}
  244. <a href="{Permalink}">{Title}</a>
  245. {/block:Title}</div>
  246. {Body}
  247. {block:IndexPage}
  248. <div class="permalinktext">
  249. ___________________________________________________________
  250. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  251. </div>
  252. {/block:IndexPage}
  253.  
  254. </div>
  255. {/block:Text}
  256.  
  257.  
  258. {block:Link}
  259. <div class="text">
  260. <span style="text-transform:uppercase;"><a href="{URL}" class="link" {Target}>{Name}</a></span>
  261. {block:Description}
  262. <div class="description">{Description}</div>
  263. {/block:Description}
  264. {block:IndexPage}
  265. <div class="permalinktext">
  266. ___________________________________________________________
  267. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  268. </div>
  269. {/block:IndexPage}
  270. </div>{/block:Link}
  271.  
  272. {block:Photo}
  273. {block:IndexPage}<div class="perms">
  274. posted on {DayOfWeek} <br> with <a href="{permalink}">{notecountwithlabel}</a> / <a href="{ReblogURL}" target="_blank">reblog</a>
  275. </div> {/block:IndexPage}
  276. {block:IndexPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" style="opacity:0.6" width=
  277. "250px"/></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" style="opacity:0.6" width="500px"/>{LinkCloseTag}{/block:PermalinkPage}
  278. {block:ifshowcaption}{caption}{/block:ifshowcaption}
  279. {/block:Photo}
  280.  
  281. {block:Photoset}
  282. {block:IndexPage}<div class="perms">
  283. posted on {DayOfWeek} <br> with <a href="{permalink}">{notecountwithlabel}</a> / <a href="{ReblogURL}" target="_blank">reblog</a>
  284. </div> {/block:IndexPage}
  285. {block:IndexPage}<center>{Photoset-500}</center>{/block:IndexPage}
  286. <center>{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}</center>
  287. {/block:Photoset}
  288.  
  289.  
  290. {block:Quote}
  291. <div class="text">
  292. <div class="quote">&#10077;</div>
  293. <div style="margin-top:2px;;margin-bottom:0px;min-height:30px; padding: 4px; background-color:#fafafa;border:1px dotted #eee; letter-spacing:1px;text-transform:uppercase; font-size:8px; font-family: consolas; border-radius:5px;">
  294. {Quote} </div>
  295. {block:Source}
  296. <div class="source"><div style="text-align:right; color:{color:link};padding-top:5px;"> • {Source}</div></div>
  297. {/block:Source}
  298. {block:IndexPage}
  299. <div class="permalinktext">
  300. ___________________________________________________________
  301. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  302. </div>
  303. {/block:IndexPage}
  304. </div>{/block:Quote}
  305. {block:Chat}
  306. <div class="text">
  307. {block:Title}
  308. <a href="{Permalink}">{Title}</a>
  309. {/block:Title}
  310. <ul class="chat">
  311. {block:Lines}
  312. <li class="{Alt} user_{UserNumber}"> {block:Label} <span class="label">{Label}</span> {/block:Label}
  313.  
  314. {Line} </li>
  315. {/block:Lines}
  316. </ul>
  317. {block:IndexPage}
  318. <div class="permalinktext">
  319. ___________________________________________________________
  320. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a>
  321. </div>
  322. {/block:IndexPage}
  323. </div>{/block:Chat}
  324.  
  325.  
  326.  
  327. {block:Audio}
  328.  
  329. <div id="audiostats">
  330. <div class="audioentry">
  331.  
  332. <img src="http://static.tumblr.com/2lqtwbf/coolyqooj/untitled-1.png" alt="default album art" width="80" height="80" style="position:absolute; vertical-align:middle;" />
  333.  
  334. {block:AlbumArt}<img width="80" height="80" src="{AlbumArtURL}" style="position:absolute;" />{/block:AlbumArt}
  335.  
  336. <div class="audio"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  337.  
  338. <div style="margin-left:90px; line-height:12px">{block:TrackName}<b>Song:</b> {TrackName}<br>{/block:TrackName}
  339. {block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist}
  340. {block:Album}<b>Album:</b> {Album}<br>{/block:Album}
  341. {FormattedPlayCount} plays{block:Caption}{Caption}{/block:Caption}</div>
  342. </div>
  343. <div class="permalinktext">
  344. ___________________________________________________________
  345. posted on {shortmonth} {dayofmonth} with <a href="{permalink}">{notecountwithlabel}</a></span></div>
  346. {/block:IndexPage}
  347. {/block:Audio}
  348.  
  349. {block:Video}
  350. {block:IndexPage}<div class="perms">
  351. posted on {DayOfWeek} <br> with <a href="{permalink}">{notecountwithlabel}</a> / <a href="{ReblogURL}" target="_blank">reblog</a>
  352. </div> {/block:IndexPage}
  353. <center>
  354. {block:IndexPage}
  355. {Video-250}
  356. {/block:IndexPage}
  357. </center>
  358. {block:PermalinkPage}
  359. <center>{Video-500}</center>
  360. {/block:PermalinkPage}
  361. {block:Video}
  362.  
  363. {block:Answer}
  364. <div style="padding:13px;text-align:left;">
  365. <strong><i>{asker}:</i> {question}</strong>
  366. <div class="caption" style="margin-top:3px;">
  367. {Answer}</div>
  368. {block:indexpage}
  369. <div align="right" style="padding-right:10px; padding-top:3px;padding-bottom:0px;"><a href="{Permalink}">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  370. </a>&nbsp;&nbsp;-&nbsp;&nbsp;<a href="{Permalink}">{DayOfMonth} {Month}
  371. </a></div>{/block:indexpage}
  372. </div>
  373. {/block:Answer}
  374.  
  375. {block:IndexPage}<div style="display:none;">{block:ContentSource}<a href="{SourceURL}">{SourceTitle}</a> {block:RebloggedFrom}<a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{/block:ContentSource}</div>{/block:IndexPage}
  376.  
  377. {block:PermalinkPage}
  378. {block:caption}{caption}<br>{/block:caption}
  379. <center>{block:Date}Posted on {DayOfWeek}, {Month} {DayOfMonth}, {Year} with {NoteCountWithLabel}{/block:Date}
  380. {block:RebloggedFrom}<br><b>via</b>: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{block:ContentSource} | <b>source</b>: <a href="{SourceURL}">{SourceTitle}</a> {/block:ContentSource}
  381. </center>
  382. {/block:PermalinkPage}
  383.  
  384. <div style="text-align:left;">
  385. {block:PostNotes}{PostNotes}
  386. {/block:PostNotes}</div>
  387. </div>
  388.  
  389.  
  390.  
  391. {/block:Posts}
  392. </div>
  393. </div>
  394. {block:IndexPage}<br>
  395. {block:Pagination}
  396. <div id="pagination">
  397. {block:NextPage}
  398. <a id="nextPage" href="{NextPage}"></a>
  399. {/block:NextPage}
  400. {block:PreviousPage}
  401. <a href="{PreviousPage}"></a>
  402. {/block:PreviousPage}
  403. </div>
  404. {/block:Pagination}
  405. {/block:IndexPage}
  406. </div>
  407. </body>
  408.  
  409. {block:indexpage}
  410. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  411. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  412. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  413. <script type="text/javascript">
  414. $(window).load(function(){
  415. var $wall = $('#posts');
  416. $wall.imagesLoaded(function(){
  417. $wall.masonry({
  418. itemSelector: '.entry, .entry_photo',
  419. isAnimated : false
  420. });
  421. });
  422.  
  423. $wall.infinitescroll({
  424. navSelector : '#page-nav',
  425. nextSelector : '#page-nav a',
  426. itemSelector : '.entry, .entry_photo',
  427. bufferPx : 2000,
  428. debug : false,
  429. errorCallback: function() {
  430. $('#infscr-loading').fadeOut('normal');
  431. }},
  432. function( newElements ) {
  433. var $newElems = $( newElements );
  434. $newElems.hide();
  435. $newElems.imagesLoaded(function(){
  436. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  437. });
  438. }); $('#content').show(500);
  439. });
  440. </script>
  441. {/block:indexpage}
  442.  
  443. <script type="text/javascript">
  444. $(function() {
  445. $("#topDivA").click(function(){
  446. var target = $("html");
  447. $('html, body').animate({
  448. scrollTop: target.offset().top
  449. }, 1000);
  450. });
  451.  
  452. });</script>
  453.  
  454.  
  455. </body>
  456.  
  457. <hmtl>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement