Advertisement
tobemarissa

TBM Theme 18: Noir

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