Advertisement
tobemarissa

TBM Theme 10: New York City

Sep 10th, 2013
191
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!---This is theme 10 by tobemarissa.tumblr.com :) It is called New York City.
  2.  
  3.  
  4. Please do not remove credit! If will find out if you do. This theme took a while, so just be nice and don't.
  5.  
  6. If you have any questions about the theme, feel dree you come to my ask and ask! :)
  7.  
  8. Enjoy the theme!--->
  9.  
  10.  
  11.  
  12.  
  13. <html>
  14.  
  15. <head>
  16.  
  17. <meta name="image:sidebar" content=""/>
  18. <meta name="image:background" content="" />
  19. <meta name="font:body" content="" />
  20. <meta name="color:links" content="#d89d9d" />
  21. <meta name="color:hover" content="#000000" />
  22. <meta name="color:background" content="#ffffff" />
  23. <meta name="color:sidebar" content="#ffffff">
  24. <meta name="color:linkbacks" content="#cccccc" />
  25. <meta name="text:link1url" content="" />
  26. <meta name="text:link1title" content="" />
  27. <meta name="text:titlebartext" content="diet mountain dew" />
  28. <meta name="if:Link1" content="" />
  29.  
  30.  
  31. <link rel="shortcut icon" href="{Favicon}">
  32.  
  33. <link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'>
  34.  
  35. <script type="text/javascript">
  36. WebFontConfig = {
  37. google: { families: [ 'Raleway:100:latin' ] }
  38. };
  39. (function() {
  40. var wf = document.createElement('script');
  41. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  42. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  43. wf.type = 'text/javascript';
  44. wf.async = 'true';
  45. var s = document.getElementsByTagName('script')[0];
  46. s.parentNode.insertBefore(wf, s);
  47. })(); </script>
  48.  
  49.  
  50.  
  51.  
  52. <style type="text/css">
  53.  
  54. @font-face{font-family:Jenna Sue;src:url(http://static.tumblr.com/9wzbixa/nq2mj2mox/jennasue.ttf);}
  55.  
  56. @import url(http://fonts.googleapis.com/css?family=Raleway:100);
  57.  
  58.  
  59.  
  60. /* GENERAL */
  61.  
  62. body{
  63. background-image:url('{image:background}');
  64. background-color:{color:background};
  65. background-attachment: fixed;
  66. background-repeat: repeat;
  67. links color: {color:links};
  68. font-family:{font:body};
  69. font-size: 11px;
  70. }
  71.  
  72. a {
  73. color:{color:links};
  74. -webkit-transition-duration:.5s;
  75. }
  76.  
  77. a:hover {
  78. color:{color:hover};
  79. text-decoration: none;
  80. }
  81.  
  82. div#titlebar{
  83. position: fixed;
  84. width:758px;
  85. background-color: #ffffff;
  86. background-image:url('http://i43.tinypic.com/96b448.png');
  87. height: 100px;
  88. opacity:.7;
  89. margin-top: -10px;
  90. font-size: 30px;
  91. margin-left:152px;
  92. text-align:center;
  93. z-index:1
  94. }
  95.  
  96. /* SIDEBAR */
  97.  
  98. div#sidebar{
  99. position: fixed;
  100. width:200px;
  101. height: auto;
  102. margin-top: 220px;
  103. margin-left: 1000px;
  104. border: 1px solid #eee;
  105. background-color:{color:sidebar};
  106. padding: 2px;
  107. font-size: 11px;
  108. }
  109.  
  110.  
  111. div#title{
  112. font-size: 40px;
  113. position: fixed;
  114. font-family: 'Jenna Sue';
  115. top: 180px;
  116. left:1000px;
  117. padding: 2px;
  118. width:200px;
  119. height: auto;
  120. }
  121.  
  122. /* POSTS */
  123.  
  124. img{
  125. -webkit-transition: opacity 0.8s linear;
  126. opacity: 0.80;
  127. }
  128. img:hover{
  129. -webkit-transition: opacity 0.8s linear;
  130. opacity: 1;
  131. }
  132.  
  133. #posts {margin-top:-10px;float:left; padding-top:100px;
  134. width: 762px;
  135. margin-left: 150px; overflow:hidden; background-color:#ffffff;}
  136.  
  137.  
  138. .entry {margin:1px; padding: 1px 1px 1px 1px;height: auto; float:left;text-align: left; background: white;border: 0px solid #eee;-webkit-box-shadow: 5 5px 5px -6px black;-moz-box-shadow: 5 5px 5px -6px black;box-shadow: 5 5px 5px -6px black; width:250px;}
  139. {block:PermalinkPage}width: 500px;{/block:PermalinkPage}
  140. opacity: 0.8;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;transition: all 1s ease-out;}
  141.  
  142. .entry:hover {opacity: 1;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;transition: all 1s ease-out;}
  143.  
  144. .bubble {text-align:left;background: #eee; margin:7px 0px 5px 0px;padding:10px;position: relative;-moz-border-radius:5px;-webkit-border-radius:2px;border-radius:2px; font-size: 10px; color: black;} .bubble a{color: black;}
  145. .bubble p {margin:1px 0px; font-size: 10px;}
  146. .bubble span {display:block;position:absolute;width:1px;height:1px;font-size: 0;line-height: 1px;left:-10px;top:10px;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:10px solid #eee;font-size: 10px;}
  147.  
  148. .entry .perma{z-index: 1; background-color: black; position: absolute; top:5px;margin-left: 0px;opacity: 0;-webkit-transition: all .5s ease;-moz-transition: all .7s ease;-o-transition: all .5s ease;transition: all .5s ease;}
  149.  
  150. .entry:hover .perma{top:5px;margin-left: 0px; background-color:white; width: auto; overflow:visible;-webkit-transition: opacity 1s linear;opacity: 1;}
  151.  
  152. .perm {height: 20px; background-color: white; width: 275;opacity:.8;position: absolute;text-align: center;margin-top:10px;-webkit-transition: opacity .8s linear; opacity: .8;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;transition: all 0.2s linear; line-height: 25px;font-size: 9px; color: black;} .perm a {color: black;}
  153.  
  154. .perm:hover {opacity: .6;}
  155.  
  156.  
  157.  
  158. blockquote{
  159. padding:0px 0px 2px 5px;
  160. margin:0px 0px 2px 1px;
  161. border-left: 1px dotted #555555;
  162. }
  163.  
  164. blockquote p, ul{
  165. margin:0px;
  166. padding:0px;
  167. }
  168.  
  169.  
  170. a img{border: 0px;}
  171.  
  172. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  173.  
  174. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  175. .user_7 .label, .user_8 .label, .user_9 .label {color:#555555;}
  176.  
  177. .notes img{width:10px; position:relative; top:3px;}
  178.  
  179. .permalink{
  180. display: block;
  181. font-size: 10px;
  182. text-align: right;
  183. text-decoration: none;
  184. }
  185.  
  186. /* NAVIGATION */
  187.  
  188.  
  189. #tbar {background-color:transparent; width:75px; height:110%; margin-left:1000px; margin-top:220px; position:fixed; overflow:hidden; border-left:0px solid; border-right:0px solid; padding:0px}
  190.  
  191. #tlinks a {width:48px; height:10px; padding:5px 1px; display:block; color: black; background-color: {color:linkbacks}; font-family:consolas; font-size:10px; text-transform: lowercase; text-decoration: none; letter-spacing: 1px; margin-top:0px; margin-bottom:-3px}
  192. #tlinks a:hover {color: {color:hoverlink}; text-transform: uppercase;}
  193.  
  194. .bubbles {
  195. position:relative;
  196. padding:10px;
  197. left:85px;
  198. background:#cfabab;
  199. text-shadow: 1px 1px 1px #;
  200. text-align:left;
  201. font-size: 8px;
  202. text-transform:uppercase;
  203. font-family:"silkscreen";
  204. width: 340px;
  205. -moz-border-radius:10px;
  206. -webkit-border-radius:10px;
  207. border-radius:10px;
  208. background:-moz-linear-gradient(top, #cfabab, #8a8a8a);
  209. background:linear-gradient(top, #cfabab, #8a8a8a);
  210. }
  211.  
  212. .bubbles:after {
  213. content:"\00a0";
  214. display:block; /* reduce the damage in FF3.0 */
  215. position:absolute;
  216. left:-15px;
  217. top:10px;
  218. width:0;
  219. height:0;
  220. border-width:15px 15px 0px;
  221. border-style:solid;
  222. border-color:#cfabab transparent;
  223. }
  224.  
  225.  
  226.  
  227.  
  228. </style>
  229.  
  230.  
  231.  
  232.  
  233.  
  234. </head>
  235.  
  236. <body>
  237.  
  238. <div id="title"><center>{Title}</center></div>
  239.  
  240. <center>
  241.  
  242. <div id="sidebar">
  243.  
  244. <a href="/"><img src="{image:sidebar}" width=200p;></a>
  245.  
  246. {Description}
  247.  
  248.  
  249.  
  250. </div>
  251.  
  252. </center>
  253.  
  254. <div id="titlebar">
  255.  
  256. </div>
  257.  
  258. <div id="tbar">
  259.  
  260. <div align="center" id="tlinks">
  261. <a href="/">home</a><br />
  262. <a href="/ask">ask</a><br />
  263. {block:ifLink1}<a href="{text:link1url}">{text:link1title}</a><br />{/block:ifLink1}
  264. <a href="http://tobemarissa.tumblr.com/tagged/themes">theme</a></div></div>
  265.  
  266.  
  267. <div id="posts">
  268.  
  269. {block:Posts}
  270. <div class="entry">
  271.  
  272. {block:Text}
  273. {block:Title}<span class="title"><a href="{permalink}">{Title}</a></span>{/block:Title}
  274. {Body}
  275. {block:IndexPage}
  276. <div style="text-align: right; border-top: 1px solid #eee; padding: 3px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  277. {/block:IndexPage}
  278. {/block:Text}
  279.  
  280. {block:Link}
  281. <a href="{URL}" class="title">{Name}</a>{block:Description}{Description}
  282. {block:IndexPage}
  283. <div style="text-align: right; border-top: 1px solid #eee; padding: 3px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  284. {/block:IndexPage}
  285. {/block:Description}{block:Link}
  286.  
  287. {block:Answer}
  288. <div class="bubble"><b><small>{Asker}</b>: {Question}&nbsp;</div><div style="overflow: auto; font-size: 10px;">{Answer}
  289. {block:IndexPage}
  290. <div style="text-align: right; border-top: 1px solid #eee; padding-top: 3px; font-size: 10px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  291. {/block:IndexPage}
  292. </div></small></span></a>
  293. {/block:Answer}
  294.  
  295. {block:Photo}
  296. {block:IndexPage}
  297. <div class="perma">
  298. <span class="perm"><a href="{ReblogURL}" target="_blank"><img src="http://static.tumblr.com/nfj2p6f/rnCma8u6y/dashboard_controls_radar_button_reblog.png" height=20px;></A></span> </div>
  299. {LinkOpenTag}<img src="{PhotoURL-500}" width="250"/>{LinkCloseTag}
  300. {/block:IndexPage}
  301. {block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" width="500"/>{LinkCloseTag}{/block:PermalinkPage}
  302. {/block:Photo}
  303.  
  304. {block:Photoset}
  305. {block:IndexPage}
  306. <div class="perma">
  307. <span class="perm"><a href="{ReblogURL}" target="_blank">REBLOG</a> WITH <a href="{permalink}">{notecount} NOTES</a></span> </div>
  308. {Photoset-250}
  309. {/block:IndexPage}
  310. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  311. {/block:Photoset}
  312.  
  313. {block:Quote}
  314. {Quote}{block:Source}<br><br><strong><center>{Source}</center></strong><br>{/block:Source}
  315. {block:IndexPage}
  316. <div style="text-align: right; border-top: 1px solid #eee; padding: 3px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  317. {/block:IndexPage}
  318. {/block:Quote}
  319.  
  320. {block:Chat}
  321. {block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}<br>
  322. {block:IndexPage}
  323. <div style="text-align: right; border-top: 1px solid #eee; padding: 3px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  324. {/block:IndexPage}
  325. {/block:Chat}
  326.  
  327. {block:Audio}
  328. {AudioPlayerBlack}<br><br>{block:Artist}<b>{Artist}</b>{/block:Artist}: {block:TrackName}<i>{TrackName}</i><br><br>{/block:TrackName}
  329. {block:IndexPage}
  330. <div style="text-align: right; border-top: 1px solid #eee; padding: 3px;"><a href="{Permalink}" target="_blank"> {Timeago} with {notecountwithlabel}</a></div>
  331. {/block:IndexPage}
  332. {/block:Audio}
  333.  
  334. {block:Video}
  335. {block:IndexPage}
  336. {Video-250}
  337. <div class="perma">
  338. <span class="perm"><a href="{ReblogURL}" target="_blank">REBLOG</a> WITH <a href="{permalink}">{notecount} NOTES</a></span> </div>
  339. {/block:IndexPage}
  340. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  341. {/block:Video}
  342.  
  343. {block:PermalinkPage}
  344. <center><br>{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>{/block:PermalinkPage}
  345.  
  346. {block:PostNotes}{PostNotes}
  347. {/block:PostNotes}
  348. </div>
  349.  
  350. {/block:Posts}
  351. </div></div> {block:IndexPage}{block:Pagination}<div id="pagination">{block:NextPage}
  352. <a id="nextPage" href="{NextPage}"><div style="color: transparent;">&nbsp;&rarr;</div></a>{/block:NextPage}
  353. {block:PreviousPage}<a href="{PreviousPage}"><div style="color: transparent;">&larr;&nbsp;</div></a>{/block:PreviousPage}
  354. </div>{/block:Pagination}{/block:IndexPage}</div>
  355.  
  356. {block:indexpage}
  357. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  358. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  359. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  360. <script type="text/javascript">
  361. $(window).load(function(){
  362. var $wall = $('#posts');
  363. $wall.imagesLoaded(function(){
  364. $wall.masonry({
  365. itemSelector: '.entry, .entry_photo',
  366. isAnimated : false
  367. });
  368. });
  369.  
  370. $wall.infinitescroll({
  371. navSelector : '#page-nav',
  372. nextSelector : '#page-nav a',
  373. itemSelector : '.entry, .entry_photo',
  374. bufferPx : 2000,
  375. debug : false,
  376. errorCallback: function() {
  377. $('#infscr-loading').fadeOut('normal');
  378. }},
  379. function( newElements ) {
  380. var $newElems = $( newElements );
  381. $newElems.hide();
  382. $newElems.imagesLoaded(function(){
  383. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  384. });
  385. }); $('#content').show(500);
  386. });
  387. </script>
  388. {/block:indexpage}
  389.  
  390. <script type="text/javascript">
  391. $(function() {
  392. $("#topDivA").click(function(){
  393. var target = $("html");
  394. $('html, body').animate({
  395. scrollTop: target.offset().top
  396. }, 1000);
  397. });
  398.  
  399. });</script>
  400.  
  401.  
  402. </body>
  403.  
  404.  
  405. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement