Advertisement
tobemarissa

TBM Theme 25: Cloudy

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