Advertisement
feiinho

snazzyspace theme border

Sep 26th, 2014
570
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.36 KB | None | 0 0
  1.  
  2.  
  3. <html>
  4. <head>
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8. {block:Description}
  9. <meta name="description" content="{MetaDescription}" />
  10. {/block:Description}
  11.  
  12. <meta name="text:Link 1" content="" />
  13. <meta name="text:Link 1 Title" content="" />
  14. <meta name="text:Link 2" content="" />
  15. <meta name="text:Link 2 Title" content="" />
  16. <meta name="text:Link 3" content="" />
  17. <meta name="text:Link 3 Title" content="" />
  18. <meta name="text:Link 4" content="" />
  19. <meta name="text:Link 4 Title" content="" />
  20. <meta name="text:Link 5" content="" />
  21. <meta name="text:Link 5 Title" content="" />
  22.  
  23. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800' rel='stylesheet' type='text/css'>
  24.  
  25. <style type="text/css">
  26.  
  27. #toTop {
  28. position:fixed; /* this is the magic */
  29. bottom:10px; /* together with this to put the div at the bottom*/
  30. right:10px;
  31. cursor:pointer;
  32. display:none;
  33. z-index:1000;
  34. }
  35.  
  36.  
  37. body {
  38.  
  39. background:url('http://www.snazzyspace.com/defaultimages/f49f69_wood.gif') repeat #FFFFFF;
  40. background-attachment:fixed;
  41. margin:25px 0;
  42.  
  43.  
  44.  
  45.  
  46. text-align:center;
  47. font-size:12px;
  48. font-family: 'Open Sans', sans-serif;
  49.  
  50. color:000;
  51.  
  52. }
  53.  
  54. #container {
  55. margin:0 auto;
  56. width:1100px;
  57. }
  58.  
  59.  
  60. a, a:active, a:visited, a:link {
  61. color:#737373;
  62. font-weight:bold;
  63. text-decoration:none;
  64.  
  65. }
  66.  
  67. a:hover {
  68. color:#000;
  69. }
  70.  
  71. a img {
  72. border:0;
  73. }
  74. {block:IndexPage}
  75. .post {
  76. text-align:left;
  77. padding:5px;
  78. width:500px;
  79. margin:5px 5px 5px 0;
  80. position:relative;
  81.  
  82. }
  83.  
  84. .post img {
  85. -moz-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  86. -webkit-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  87. box-shadow: 0 1px 10px rgba(0,0,0,.3);
  88. }
  89.  
  90. .box {
  91. float:left;
  92. overflow:hidden;
  93. }
  94.  
  95. {/block:IndexPage}
  96. .notes {
  97. clear:both;
  98. text-align:left;
  99. background:#fff;
  100. padding:5px;
  101. width:490px;
  102. margin:5px 0;
  103. -moz-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  104. -webkit-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  105. box-shadow: 0 1px 10px rgba(0,0,0,.3);
  106. opacity:0.8;
  107. }
  108.  
  109. ol.notes {
  110. padding: 0px;
  111. margin: 25px 0px;
  112. list-style-type: none;
  113. border-bottom: solid 1px #ccc;
  114. }
  115.  
  116. ol.notes li.note {
  117. border-top: solid 1px #ccc;
  118. padding: 10px;
  119. }
  120.  
  121. ol.notes li.note img.avatar {
  122. vertical-align: -4px;
  123. margin-right: 10px;
  124. width: 16px;
  125. height: 16px;
  126. }
  127.  
  128. ol.notes li.note span.action {
  129. font-weight: bold;
  130. }
  131.  
  132. ol.notes li.note .answer_content {
  133. font-weight: normal;
  134. }
  135.  
  136. ol.notes li.note blockquote {
  137. border-color: #eee;
  138. padding: 4px 10px;
  139. margin: 10px 0px 0px 25px;
  140. }
  141.  
  142. ol.notes li.note blockquote a {
  143. text-decoration: none;
  144. }
  145. {block:PermalinkPage}
  146. .box {
  147. overflow:hidden;
  148. }
  149.  
  150. .post {
  151. text-align:left;
  152. padding:5px;
  153. width:500px;
  154. margin:5px 5px 5px 0;
  155. }
  156.  
  157. .post img {
  158. }
  159. {/block:PermalinkPage}
  160.  
  161.  
  162.  
  163.  
  164.  
  165. .postCount {
  166. background:#fff;
  167. color:#b8b8b8;
  168. padding:3px 0;
  169. text-align:right;
  170. }
  171.  
  172. .post a, .post a:link, .post a:active, .post a:visited {
  173. color:#707070;
  174. text-decoration:none;
  175. }
  176.  
  177.  
  178. .post a:hover {
  179. color:black;
  180. }
  181.  
  182. ol {
  183. margin:0;
  184. padding:0;
  185. }
  186.  
  187. ol li {
  188. padding:0;
  189. margin:0;
  190. list-style-type:none;
  191. }
  192.  
  193.  
  194. .text, .quote, .link, .chats {
  195. background:#fff;
  196. -moz-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  197. -webkit-box-shadow: 0 1px 10px rgba(0,0,0,.3);
  198. box-shadow: 0 1px 10px rgba(0,0,0,.3);
  199. }
  200.  
  201.  
  202.  
  203.  
  204.  
  205.  
  206. .post:hover #reblog{
  207. margin:0 0 0 0;
  208. display:block;
  209. opacity:1;-webkit-transition: all 0.8s ease-out;
  210. -moz-transition: all 0.8s ease-out;transition: all 2s ease-out;
  211. }
  212.  
  213.  
  214.  
  215. #reblog{
  216. padding:20px 0 0 0;
  217. margin:0 0 0 0;
  218. text-align:center;
  219. position:absolute;
  220. width:510px;
  221. top:0;
  222. left:0;
  223. opacity:0;-webkit-transition: all 0.8s ease-out;
  224.  
  225. -moz-transition: all 0.8s ease-out;transition: all 2s ease-out;}
  226.  
  227.  
  228.  
  229. #reblog a {
  230. display:block;
  231. padding:5px;
  232. margin:0;
  233. font-family: 'Open Sans', sans-serif;
  234. font-size:60px;
  235. color:#fff;
  236. font-weight:800;
  237. text-shadow: 1px 1px 1px #666;
  238. text-transform:lowercase;
  239. letter-spacing:-2px;
  240. }
  241.  
  242.  
  243.  
  244.  
  245.  
  246. #lighter {
  247. width:510px;
  248. cursor:pointer;
  249. position:absolute;
  250. top:0;
  251. background:#fff;
  252. left:0;
  253. opacity:0;
  254. height:800px;
  255. }
  256.  
  257. .post:hover #lighter {
  258. opacity:0.3;
  259. display:block;
  260. -moz-box-shadow: inset 0 0 150px #000;
  261. -webkit-box-shadow: inset 0 0 150px #000;
  262. box-shadow: inset 0 0 150px #000;
  263. }
  264.  
  265.  
  266.  
  267.  
  268. #infscr-loading {
  269. text-align: center;
  270. z-index: 100;
  271. position: fixed;
  272. left: 45%;
  273. bottom: 40px;
  274. padding: 5px;
  275. background: #000;
  276. color: #fff;
  277. font-family: 'Open Sans', sans-serif;
  278. font-size:20px;
  279. text-transform:lowercase;
  280. }
  281.  
  282. #infscr-loading img {
  283. display:none;
  284. }
  285.  
  286. #mainRight {
  287. width:1100px;
  288. margin:0 0 10px 0;
  289. padding:5px;
  290. text-align:center;
  291. }
  292.  
  293. #holder {
  294. margin:0 auto;
  295. width:1100px;
  296. }
  297.  
  298. h1 {
  299. display:block;
  300. padding:5px;
  301. margin:0;
  302. font-family: 'Open Sans', sans-serif;
  303. font-size:120px;
  304. color:#fff;
  305. font-weight:800;
  306. text-shadow: 1px 1px 1px #666;
  307. text-transform:lowercase;
  308. letter-spacing:-1px;
  309. }
  310.  
  311. #descr {
  312. padding:5px;
  313. font-weight:normal;
  314. font-size:13px;
  315. text-transform:uppercase;
  316. color:#fff;
  317. text-shadow:1px 1px 1px #666;
  318. }
  319.  
  320. #navy {
  321. padding:5px;
  322. }
  323. #navy a, #navy a:active, #navy a:visited {
  324. padding:0 10px;
  325. font-weight:normal;
  326. color:#fff;
  327. text-shadow:1px 1px 1px #666;
  328. }
  329. #navy a:hover {
  330. text-decoration:underline;
  331. }
  332. #navy a:after {
  333. content:'x';
  334. font-size:10px;
  335. margin:0 5px 0 20px;
  336. text-shadow:1px 1px 1px #666;
  337. }
  338. </style>
  339. </head>
  340. <body>
  341. <div id="toTop"><img src="http://www.snazzyspace.com/images/back_to_top.png" /></div>
  342.  
  343.  
  344. <div id="container" class="transitions-enabled infinite-scroll clearfix">
  345. <div id="mainRight">
  346. <h1>{Title}</h1>
  347. {block:Description}
  348. <div id="descr">
  349. {Description}
  350. </div>
  351. {/block:Description}
  352.  
  353. <div id="navy">
  354. <a href="/">Home</a>
  355. {block:AskEnabled}
  356. <a href="/ask"> {AskLabel}</a>
  357. {/block:AskEnabled}
  358. {block:SubmissionsEnabled}
  359. <a href="/submit"> {SubmitLabel}</a>
  360. {/block:SubmissionsEnabled}
  361. {block:HasPages}{block:Pages}<a href="{URL}">
  362. {Label}</a>{/block:Pages}
  363. {/block:HasPages}
  364. {block:ifLink1Title}
  365. <a href="{text:Link 1}" title="{text:Link 1 Title}">
  366. {text:Link 1 Title}</a>
  367. {/block:ifLink1Title}
  368. {block:ifLink2Title}
  369. <a href="{text:Link 2}" title="{text:Link 2 Title}">
  370. {text:Link 2 Title}</a>
  371. {/block:ifLink2Title}
  372. {block:ifLink3Title}
  373. <a href="{text:Link 3}" title="{text:Link 3 Title}">
  374. {text:Link 3 Title}</a>
  375. {/block:ifLink3Title}
  376. {block:ifLink4Title}
  377. <a href="{text:Link 4}" title="{text:Link 4 Title}">
  378. {text:Link 4 Title}</a>
  379. {/block:ifLink4Title}
  380. {block:ifLink5Title}
  381. <a href="{text:Link 5}" title="{text:Link 5 Title}">
  382. {text:Link 5 Title}</a>
  383. {/block:ifLink5Title}
  384. </div>
  385.  
  386. </div>
  387.  
  388. <div id="holder">
  389. {block:Posts}
  390. {block:Text}
  391. <div class="box shake post text">
  392. {block:IndexPage}
  393. <div id="lighter"></div>
  394. <div id="reblog">{block:NoteCount}<a class="notesLink "href="{Permalink}">{NoteCount}</a>{/block:NoteCount} <a href="{ReblogURL}" title="Reblog">REBLOG</a></div>
  395. {/block:IndexPage}
  396. {block:Title}
  397. <h3><a href="{Permalink}">{Title}</a></h3>
  398. {/block:Title}
  399.  
  400. {Body}
  401. </div>
  402.  
  403. {/block:Text}
  404.  
  405. {block:Photo}
  406. <div class="box shake post photo">
  407. {block:IndexPage}
  408. <div id="lighter"></div>
  409. <div id="reblog">{block:NoteCount}<a class="notesLink "href="{Permalink}">{NoteCount}</a>{/block:NoteCount} <a href="{ReblogURL}" title="Reblog">REBLOG</a></div>
  410.  
  411. {/block:IndexPage}
  412.  
  413. {block:PermalinkPage}
  414. <a href="{LinkURL}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></a>
  415. {/block:PermalinkPage}
  416.  
  417. {block:IndexPage}
  418. <a href="{LinkURL}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></a>
  419. {/block:IndexPage}
  420.  
  421.  
  422. </div>
  423. {/block:Photo}
  424.  
  425. {block:Photoset}
  426. <div class="box shake post photoset">
  427. {block:IndexPage}
  428. <div id="lighter"></div>
  429. <div id="reblog">{block:NoteCount}<a class="notesLink "href="{Permalink}">{NoteCount}</a>{/block:NoteCount} <a href="{ReblogURL}" title="Reblog">REBLOG</a></div>
  430. {/block:IndexPage}
  431. {Photoset-250}
  432.  
  433. {block:Caption}
  434. <div class="caption">{Caption}</div>
  435. {/block:Caption}
  436. </div>
  437. {/block:Photoset}
  438.  
  439. {block:Quote}
  440. <div class="box shake post quote">
  441. {block:IndexPage}
  442. <div id="lighter"></div>
  443. <div id="reblog">{block:NoteCount}<a class="notesLink "href="{Permalink}">{NoteCount}</a>{/block:NoteCount} <a href="{ReblogURL}" title="Reblog">REBLOG</a></div>
  444. {/block:IndexPage}
  445. "{Quote}"
  446.  
  447. {block:Source}
  448. <div class="source">{Source}</div>
  449. {/block:Source}
  450. </div>
  451. {/block:Quote}
  452.  
  453. {block:Link}
  454. <div class="box shake post link">
  455. {block:IndexPage}
  456.  
  457. {/block:IndexPage}
  458. <a href="{URL}" {Target}>{Name}</a>
  459.  
  460. {block:Description}
  461. <div class="description">{Description}</div>
  462. {/block:Description}
  463. </div>
  464. {/block:Link}
  465.  
  466. {block:Chat}
  467. <div class="box shake post chats">
  468. {block:IndexPage}
  469.  
  470. {/block:IndexPage}
  471. {block:Title}
  472. <h3><a href="{Permalink}">{Title}</a></h3>
  473. {/block:Title}
  474.  
  475. <ul>
  476. {block:Lines}
  477. <li class="{Alt} user_{UserNumber}">
  478. {block:Label}
  479. <span class="label">{Label}</span>
  480. {/block:Label}
  481.  
  482. {Line}
  483. </li>
  484. {/block:Lines}
  485. </ul>
  486. </div>
  487. {/block:Chat}
  488.  
  489. {block:Video}
  490. <div class="box shake post video">
  491. {block:IndexPage}
  492.  
  493. {/block:IndexPage}
  494. {Video-250}
  495.  
  496. {block:Caption}
  497. <div class="caption">{Caption}</div>
  498. {/block:Caption}
  499. </div>
  500. {/block:Video}
  501.  
  502. {block:Audio}
  503. <div class="box shake post audio">
  504.  
  505. {AudioPlayerBlack}
  506.  
  507. {block:Caption}
  508. <div class="caption">{Caption}</div>
  509. {/block:Caption}
  510. </div>
  511. {/block:Audio}
  512. {/block:Posts}
  513. {block:PermalinkPage} {block:PostNotes}{PostNotes}{/block:PostNotes} {/block:PermalinkPage}
  514.  
  515.  
  516.  
  517. </div>
  518. </div>
  519.  
  520. <nav id="page-nav">
  521. <a href="/page/2"></a>
  522. </nav>
  523.  
  524.  
  525. {block:IndexPage}
  526. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  527. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  528. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  529.  
  530. <script type="text/javascript">
  531.  
  532. $(function() {
  533. $(window).scroll(function() {
  534. if($(this).scrollTop() != 0) {
  535. $('#toTop').fadeIn();
  536. } else {
  537. $('#toTop').fadeOut();
  538. }
  539. });
  540.  
  541. $('#toTop').click(function() {
  542. $('body,html').animate({scrollTop:0},800);
  543. });
  544. });
  545.  
  546.  
  547. $(window).load(function () {
  548.  
  549.  
  550.  
  551.  
  552.  
  553. // endless scrolling
  554. var $container = $('#holder');
  555. $container.imagesLoaded(function(){
  556. $container.masonry({
  557. itemSelector: '.box'
  558. });
  559. });
  560. $container.infinitescroll({
  561. navSelector : '#page-nav', // selector for the paged navigation
  562. nextSelector : '#page-nav a', // selector for the NEXT link (to page 2)
  563. itemSelector : '.box', // selector for all items you'll retrieve
  564. bufferPx: 0,
  565. debug : true,
  566. loading: {
  567. finishedMsg: 'No more posts to load.',
  568. img: '',
  569. msgText: 'Loading More Posts'
  570. }
  571. },
  572. // trigger Masonry as a callback
  573. function( newElements ) {
  574. // hide new items while they are loading
  575. var $newElems = $( newElements ).css({ opacity: 0 });
  576. // ensure that images load before adding to masonry layout
  577. $newElems.imagesLoaded(function(){
  578. // show elems now they're ready
  579. $newElems.animate({ opacity: 1 });
  580. $container.masonry( 'appended', $newElems, true );
  581. });
  582. }
  583. );
  584.  
  585. // End of endless scrolling
  586.  
  587. });
  588.  
  589. </script>
  590. {/block:IndexPage}
  591.  
  592. </body>
  593. </html>
  594.  
  595.  
  596.  
  597.  
  598.  
  599.  
  600.  
  601.  
  602.  
  603.  
  604.  
  605.  
  606.  
  607.  
  608.  
  609.  
  610. <a style="position: fixed; z-index: 1999; top: 0px; left: 0px;" href="http://www.snazzyspace.com/" target="_blank" class="trans_col"><img src="http://www.snazzyspace.com/img/badge.png" alt="A snazzyspace.com Theme" border="0"></a> <a style="position: fixed; z-index: 1999; bottom: 100px; right: 0px;" href="http://www.snazzyspace.com/" target="_blank" class="trans_col"><img src="http://www.snazzyspace.com/img/badge_2.png" alt="A snazzyspace.com Theme" border="0"></a><a style="position: absolute; z-index: 10; top: 86px; right: 3px;" href="http://www.snazzyspace.com/tumblr" target="_blank" class="install_but"><img src="http://www.snazzyspace.com/img/install_theme.png" border="0"></a>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement