Advertisement
feiinho

perfect places theme

Nov 16th, 2017
180
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!---------------------------------------------------------
  2.  
  3. (◍•ᴗ•◍)♡ ✧*。
  4.  
  5. Perfect Places Theme
  6. by ThemeKid Chloë | @redivide | @themekid
  7.  
  8. > Do not delete/alter any credit.
  9. > Do not claim as your own.
  10. > Do not copy any code.
  11. > Do not redistribute.
  12.  
  13. ===========================================================
  14.  
  15. DEPENDENCIES:
  16.  
  17. > jQuery
  18. https://jquery.com/
  19. > Popups based off of
  20. https://kaushikresearch.wordpress.com/jquery/popup-with-jquery/
  21. > Infinite Scroll
  22. http://infinite-scroll.com/
  23. > PXU Photosets modified by BCT
  24. http://bychloethemes.tumblr.com/post/155956945114/
  25. > ImagesLoaded
  26. http://imagesloaded.desandro.com/
  27. > Video Resizing
  28. http://shythemes.tumblr.com/post/134536748863/
  29. > SMT Tooltips
  30. http://manos.malihu.gr/style-my-tooltips-jquery-plugin/
  31. > Unnest Captions
  32. http://neothm.com/post/148902138319/
  33. > Outicons
  34. http://antonps.com/outicons/
  35. > Google Fonts
  36. http://fonts.google.com/
  37. > FontAwesome Icons
  38. http://fontawesome.io/
  39. > Lightwidget
  40. https://lightwidget.com/
  41. > Masonry
  42. https://masonry.desandro.com/
  43. > jQuery Marquee
  44. https://github.com/aamirafridi/jQuery.Marquee
  45. > Twitter Fetcher
  46. https://github.com/jasonmayes/Twitter-Post-Fetcher
  47.  
  48. ---------------------------------------------------------->
  49. <html>
  50. <head>
  51. <meta charset="UTF-8" />
  52. <title>{block:TagPage}{Tag} posts | {/block:TagPage}{block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  53. <link rel="shortcut icon" href="{Favicon}">
  54. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  55. {block:Description}
  56. <meta name="description" content="{MetaDescription}" />
  57. {/block:Description}
  58.  
  59. {block:Hidden}
  60.  
  61. <meta name="color:Accent" content="#9a6767" />
  62. <meta name="if:Redirect Ask" content="" />
  63.  
  64. <meta name="text:IMPORTANT" content="do not enable the redirect ask if you are using the default /ask page. it will cause your browser to crash! only enable if you are using a custom ask page."/>
  65. <meta name="text:Ask Link" content="/ask" />
  66. <meta name="text:Quote" content="quote" />
  67. <meta name="text:Stats" content="stats" />
  68.  
  69. {/block:Hidden}
  70.  
  71. <!--there is a reason you can't find this link for outicons when you google, it's because i made it. so leave it the fuck alone and go make your own-->
  72. <link href='http://static.tumblr.com/8pnyeus/sXxofi7lt/outicons.css' rel='stylesheet' type='text/css'>
  73. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  74. <link href="https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700|Open+Sans:400,700|Domine:400,700" rel="stylesheet">
  75. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  76. <link rel="stylesheet" href="http://static.tumblr.com/8pnyeus/29To2og0o/styles.css">
  77. <script src="https://dl.dropboxusercontent.com/s/7ke33tjjl8rty02/scripts.js"></script>
  78. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
  79. <script>{block:IfRedirectAsk}
  80. if(window.location.pathname == '/ask') location.replace('{text:Ask Link}');{/block:IfRedirectAsk}
  81. (function($){ $(document).ready(function(){ $("[title],a[title],img[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:100, tip_fade_speed:300, attribute:"title" }); }); })(jQuery);
  82. var fhs = document.createElement('script');var fhs_id = "5521980";var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;fhs.src = "//freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"' style='display:none'></span>");
  83. </script>
  84.  
  85. <style type="text/css">
  86. [class*=" oi-"]:before,[class^=oi-]:before {
  87. line-height: inherit;
  88. }
  89. * {
  90. margin: 0;
  91. padding: 0;
  92. }
  93. #tumblr_controls, .tmblr-iframe {
  94. top: -5px!important;
  95. right: 3px!important;
  96. -webkit-filter: invert(100%);
  97. filter: invert(100%);
  98. position: fixed!important;
  99. -webkit-transform: scale(.7, .7);
  100. -moz-transform: scale(.7, .7);
  101. transform: scale(.7, .7);
  102. -webkit-transform-origin: right top;
  103. -moz-transform-origin: right top;
  104. -ms-transform-origin: right top;
  105. -o-transform-origin: right top;
  106. transform-origin: right top;
  107. z-index: 999999999999999999!important
  108. }
  109. ::-webkit-scrollbar {
  110. background-color:#ddd;
  111. height: 11px;
  112. width: 11px;
  113. border: 5px solid #fff;
  114. }
  115. ::-webkit-scrollbar-thumb {
  116. background-color: #000;
  117. border: 5px solid #fff;
  118. }
  119. ::-moz-selection {
  120. color: {color:Accent};
  121. background: rgba({RGBcolor:Accent},0.1);
  122. }
  123.  
  124. ::selection {
  125. color: {color:Accent};
  126. background: rgba({RGBcolor:Accent},0.1);
  127. }
  128. #reblogged {
  129. bottom: 30px!important;
  130. }
  131. #s-m-t-tooltip {
  132. max-width: 300px;
  133. padding: 3px 6px;
  134. margin: 20px 10px;
  135. background: #000;
  136. color: #fff;
  137. z-index: 999999999999999!important;
  138. font-size: 9px;
  139. text-transform: uppercase;
  140. font-family: 'Roboto Condensed', monospace;
  141. }
  142. body {
  143. color: #000;
  144. font-size: 10px;
  145. font-family: "Domine", serif;
  146. word-break: break-word;
  147. background: #fff;
  148. }
  149. img:not(.lightbox-image) {
  150. vertical-align: middle;
  151. max-width: 100%;
  152. }
  153. a {
  154. text-decoration: none;
  155. color: {color:Accent};
  156. }
  157. a:hover {
  158. font-style: italic;
  159. }
  160. h1,h2,h3,h4,h5,h6 {
  161. font-family: 'Domine', sans-serif;
  162. font-weight: normal;
  163. }
  164. #t-bar {
  165. background: {color:Accent};
  166. padding: 6px 10px;
  167. width: 100%;
  168. position: fixed;
  169. top: 0;
  170. box-sizing: border-box;
  171. left: 0;
  172. z-index: 99999;
  173. display: none;
  174. }
  175. #t-bar a {
  176. color: #000;
  177. }
  178. #qbar {
  179. background: {color:Accent};
  180. padding: 5px 10px;
  181. width: 100%;
  182. position: fixed;
  183. bottom: 0;
  184. box-sizing: border-box;
  185. left: 0;
  186. z-index: 99999999999999999999;
  187. }
  188. #qbar span#stats {
  189. float: right;
  190. }
  191. #qbar a {
  192. color: #000;
  193. }
  194. header {
  195. text-align: center;
  196. margin-bottom: 30px;
  197. }
  198. header h1 {
  199. font-size: 2em;
  200. margin-bottom: 10px;
  201. font-family: 'Domine', serif;
  202. }
  203. #desc {
  204. margin: 5px auto;
  205. line-height: 1.7;
  206. margin: 10px 0;
  207. padding: 10px 0;
  208. }
  209. #banner {
  210. position: relative;
  211. }
  212. div#l-banner {
  213. border-width: 16.5px;
  214. border-color: {color:Accent} {color:Accent} {color:Accent} transparent;
  215. border-style: solid;
  216. width: 0px;
  217. height: 0px;
  218. position: absolute;
  219. top: 1px;
  220. left: -31px;
  221. z-index: -1;
  222. }
  223. div#r-banner {
  224. border-width: 16.5px;
  225. border-color: {color:Accent} transparent {color:Accent} {color:Accent};
  226. border-style: solid;
  227. width: 0px;
  228. height: 0px;
  229. position: absolute;
  230. top: 1px;
  231. right: -31px;
  232. z-index: -1;
  233. }
  234. ul#nav {
  235. background: {color:Accent};
  236. padding: 8px;
  237. border-radius: 4px;
  238. box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
  239. z-index: 999;
  240. margin: 5px 0;
  241. }
  242. ul.nav {
  243. list-style: none;
  244. }
  245. ul#nav a {
  246. color: #000;
  247. }
  248. ul.nav li {
  249. margin: 0px 5px;
  250. text-transform: lowercase;
  251. line-height: 15px;
  252. vertical-align: middle;
  253. display: inline-block;
  254. }
  255. ul.nav li i {
  256. font-size: 1.3em;
  257. vertical-align: middle;
  258. margin-right: 7px;
  259. }
  260. #infscr-loading {
  261. position:absolute;
  262. margin-bottom:-50px;
  263. bottom:20px;
  264. width:200px;
  265. margin-left:50%;
  266. left:-100px;
  267. text-align:center;
  268. }
  269. #wrapper {
  270. width: 710px;
  271. margin: 0 auto;
  272. position: relative;
  273. margin-top: 30px;
  274. padding: 10px 0px 70px;
  275. }
  276. article {
  277. width: 210px;
  278. box-sizing: border-box;
  279. margin-bottom: 40px;
  280. position: relative;
  281. overflow: hidden;
  282. background: #fff;
  283. }
  284. * + .caption {
  285. margin-top:10px;
  286. }
  287. img.caption_avatar {
  288. border-radius:3px;
  289. margin-right:5px;
  290. height:20px;
  291. }
  292. blockquote.tumblr_parent {
  293. margin-bottom:10px;
  294. border-bottom:1px solid #f6f6f6;
  295. padding-bottom:10px;
  296. }
  297. blockquote.tumblr_parent:last-of-type {
  298. margin-bottom:0;
  299. padding-bottom:0;
  300. }
  301. blockquote.tumblr_parent ul,
  302. blockquote.tumblr_parent ol {
  303. margin:10px 0;
  304. line-height:2em;
  305. padding-left:25px;
  306. }
  307. blockquote.tumblr_parent ul {
  308. list-style:circle;
  309. }
  310. blockquote.tumblr_parent blockquote {
  311. border-left:2px solid #eee;
  312. padding-left:10px;
  313. margin:10px 0;
  314. margin-left:15px;
  315. }
  316. blockquote.tumblr_parent p {
  317. margin:5px 0;
  318. }
  319. a.tumblr_blog {
  320. font-family: 'Roboto Condensed', sans-serif;
  321. text-transform: uppercase;
  322. font-size: 0.9em;
  323. font-weight: bold;
  324. letter-spacing: 0.3px;
  325. }
  326. .t blockquote.tumblr_parent p:last-of-type {
  327. margin-bottom:0;
  328. }
  329. .photo, .photoset {
  330. overflow: hidden;
  331. }
  332. .quote cite {
  333. display:block;
  334. text-align:right;
  335. margin-top:5px;
  336. }
  337. .chat ul {
  338. list-style:none;
  339. }
  340. .chat ul span {
  341. font-family:'Roboto Condensed', sans-serif;
  342. font-weight:bold;
  343. }
  344. .chat ul li {
  345. padding: 6px 0;
  346. border-bottom: 1px solid #f6f6f6;
  347. }
  348. .chat ul li:last-of-type {
  349. border-bottom:0;
  350. }
  351. .album-art {
  352. height:50px;
  353. margin-bottom:15px;
  354. width:100%;
  355. background:{color:Accent} repeat center center;
  356. background-size:contain;
  357. }
  358. .audio-info {
  359. list-style:none;
  360. padding:0;
  361. margin:0;
  362. }
  363. .audio-info li {
  364. border-bottom:1px solid #eaeaea;
  365. padding:4px 0;
  366. text-align:right;
  367. }
  368. .audio-info i, .audio-info b {
  369. float:left;
  370. }
  371. .audio-info b {
  372. font-family:'Roboto Condensed', sans-serif;
  373. }
  374. .audio-info i {
  375. color:#7b7b7b;
  376. margin-right:4px;
  377. }
  378. .tumblr_audio_player {
  379. width: calc(100% - 20px);
  380. position: absolute;
  381. top: 10px;
  382. height: 50px;
  383. opacity: 0.6;
  384. }
  385. span.asker {
  386. display: block;
  387. margin-bottom: 5px;
  388. }
  389. .asker img {
  390. height: 20px;
  391. border-radius: 3px;
  392. margin-right: 3px;
  393. }
  394. .asker a {
  395. font-family: 'Roboto Condensed', sans-serif;
  396. text-transform: uppercase;
  397. font-size: 0.9em;
  398. font-weight: bold;
  399. letter-spacing: 0.3px;
  400. }
  401. .question {
  402. background: #f6f6f6;
  403. padding: 10px;
  404. border-radius: 3px;
  405. }
  406. .question + .question {
  407. margin-top: 8px;
  408. }
  409. .caption:empty {
  410. margin: 0;
  411. }
  412. {block:IndexPage}
  413. article.text-type {
  414. padding: 15px;
  415. border: 1px solid #f6f6f6;
  416. }
  417. blockquote.tumblr_parent:last-of-type {
  418. border-bottom: none;
  419. }
  420. article.non-text-type .mask {
  421. position:absolute;
  422. top:0;
  423. left:0;
  424. width:100%;
  425. height:100%;
  426. z-index:999;
  427. -webkit-transition: all 0.3s ease-in-out;
  428. -moz-transition: all 0.3s ease-in-out;
  429. -o-transition: all 0.3s ease-in-out;
  430. transition: all 0.3s ease-in-out;
  431. }
  432. article.non-text-type:hover .mask {
  433. opacity:1;
  434. visibility:visible;
  435. -webkit-transition: all 0.3s ease-in-out;
  436. -moz-transition: all 0.3s ease-in-out;
  437. -o-transition: all 0.3s ease-in-out;
  438. transition: all 0.3s ease-in-out;
  439. }
  440. article.non-text-type .photo img {
  441. -webkit-transition: all 0.3s ease-in-out;
  442. -moz-transition: all 0.3s ease-in-out;
  443. -o-transition: all 0.3s ease-in-out;
  444. transition: all 0.3s ease-in-out;
  445. }
  446.  
  447. article.non-text-type:hover .photo img {
  448. -webkit-filter: grayscale(50%);
  449. filter: grayscale(50%);
  450. -webkit-transform:scale(1.2, 1.2);
  451. -moz-transform:scale(1.2, 1.2);
  452. transform:scale(1.2, 1.2);
  453. -webkit-transition: all 0.3s ease-in-out;
  454. -moz-transition: all 0.3s ease-in-out;
  455. -o-transition: all 0.3s ease-in-out;
  456. transition: all 0.3s ease-in-out;
  457. }
  458. article.non-text-type .mask .more {
  459. width:140px;
  460. text-align:center;
  461. font-family:'Roboto Condensed', sans-serif;
  462. text-transform:uppercase;
  463. position:relative;
  464. line-height:200%;
  465. left:calc(50% - 70px);
  466. top:calc(50% - 54px);
  467. height:108px;
  468. }
  469. article.non-text-type .mask .more a {
  470. width:130px;
  471. padding:5px;
  472. background:#fff;
  473. margin:4px 0;
  474. display:block;
  475. position:relative;
  476. -webkit-transition: all 0.3s ease-in-out;
  477. -moz-transition: all 0.3s ease-in-out;
  478. -o-transition: all 0.3s ease-in-out;
  479. transition: all 0.3s ease-in-out;
  480. }
  481. article.non-text-type .mask .more a:nth-of-type(odd) {
  482. left:-195px;
  483. -webkit-transition: all 0.3s ease-in-out;
  484. -moz-transition: all 0.3s ease-in-out;
  485. -o-transition: all 0.3s ease-in-out;
  486. transition: all 0.3s ease-in-out;
  487. }
  488. article.non-text-type .mask .more a:nth-of-type(even) {
  489. right:-195px;
  490. -webkit-transition: all 0.3s ease-in-out;
  491. -moz-transition: all 0.3s ease-in-out;
  492. -o-transition: all 0.3s ease-in-out;
  493. transition: all 0.3s ease-in-out;
  494. }
  495. article.non-text-type:hover .mask .more a:nth-of-type(odd) {
  496. left:0;
  497. -webkit-transition: all 0.3s ease-in-out;
  498. -moz-transition: all 0.3s ease-in-out;
  499. -o-transition: all 0.3s ease-in-out;
  500. transition: all 0.3s ease-in-out;
  501. }
  502. article.non-text-type:hover .mask .more a:nth-of-type(even) {
  503. right:0;
  504. -webkit-transition: all 0.3s ease-in-out;
  505. -moz-transition: all 0.3s ease-in-out;
  506. -o-transition: all 0.3s ease-in-out;
  507. transition: all 0.3s ease-in-out;
  508. }
  509. article.text-type .mask a {
  510. font-family: 'Roboto Condensed', sans-serif;
  511. text-transform: uppercase;
  512. font-weight: bold;
  513. margin: 0 2px;
  514. }
  515. article.text-type .mask {
  516. margin-top: 10px;
  517. text-align: right;
  518. }
  519. article.text-type a:first-of-type {
  520. display: none;
  521. }
  522. article.text-type a:not(:last-of-type):after {
  523. content:'·';
  524. margin-left: 4px;
  525. }
  526. {/block:IndexPage}{block:PermalinkPage}
  527. article {
  528. width:530px;
  529. padding:25px;
  530. margin:0 auto;
  531. }
  532. blockquote.tumblr_parent {
  533. padding-left:2px;
  534. padding-right:2px;
  535. }
  536. .photoset {
  537. margin-bottom:7px;
  538. }
  539. .chat, .quote {
  540. border-bottom:1px solid #f6f6f6;
  541. padding-bottom:5px;
  542. }
  543. .tumblr_audio_player {
  544. width: calc(100% - 50px);
  545. top: 25px;
  546. }
  547. ul.extra-info {
  548. padding:0;
  549. margin:0;
  550. list-style:none;
  551. text-align:left;
  552. font-family:'Roboto Condensed', sans-serif;
  553. font-size:0.9em;
  554. text-transform:uppercase;
  555. }
  556. ul.extra-info li {
  557. padding: 4px 0;
  558. margin: 3px 0;
  559. border-bottom: 1px solid #f6f6f6;
  560. text-align:left;
  561. }
  562. ul.extra-info i {
  563. font-size:13px;
  564. color:#000;
  565. margin-right:3px;
  566. }
  567. ol.notes a, .extra-info a {
  568. color:#000;
  569. font-weight:bold;
  570. }
  571. ol.notes {
  572. padding:0;
  573. margin: 0;
  574. list-style-type: none;
  575. padding: 0;
  576. font-family:'Roboto Condensed', sans-serif;
  577. font-size:0.9em;
  578. text-transform:uppercase;
  579. }
  580. ol.notes li.note {
  581. padding: 4px 0;
  582. margin: 3px 0;
  583. padding-left: 16px;
  584. border-bottom: 1px solid #f6f6f6;
  585. }
  586. ol.notes li.note .avatar_frame {
  587. float:right;
  588. margin-top:-2px;
  589. }
  590. ol.notes li.note img.avatar {
  591. border-radius:3px;
  592. }
  593. ol.notes li.note blockquote {
  594. border-left:2px solid #eee;
  595. padding-left:10px;
  596. margin:10px 0;
  597. margin-left:15px;
  598. font-family:"Times New Roman", Times, serif;
  599. font-size:12px;
  600. text-transform:initial;
  601. }
  602. ol.notes li.note blockquote a {
  603. text-decoration: none;
  604. font-weight:normal;
  605. }
  606. li.more_notes_link_container {
  607. font-weight: bold;
  608. text-transform: uppercase;
  609. font-size: 0.85em;
  610. }
  611. li.like:before {
  612. content: "\e099";
  613. font-family: untitled-font-1!important;
  614. font-style: normal;
  615. font-weight: 400;
  616. speak: none;
  617. display: inline-block;
  618. text-decoration: inherit;
  619. width: 1em;
  620. text-align: center;
  621. font-variant: normal;
  622. text-transform: none;
  623. vertical-align: middle;
  624. line-height: 1;
  625. font-size: 1em;
  626. -webkit-font-smoothing: antialiased;
  627. -moz-osx-font-smoothing: grayscale;
  628. margin-right: -11px;
  629. color:#f3719f;
  630. left: -16px;
  631. position: relative;
  632. font-size:13px;
  633. }
  634. li.reblog:before {
  635. content:'\e083';
  636. font-family: untitled-font-1!important;
  637. font-style: normal;
  638. font-weight: 400;
  639. speak: none;
  640. display: inline-block;
  641. text-decoration: inherit;
  642. width: 1em;
  643. text-align: center;
  644. font-variant: normal;
  645. text-transform: none;
  646. vertical-align: middle;
  647. line-height: 1;
  648. font-size: 1em;
  649. -webkit-font-smoothing: antialiased;
  650. -moz-osx-font-smoothing: grayscale;
  651. margin-right: -11px;
  652. color:#000;
  653. left: -16px;
  654. position: relative;
  655. font-size:13px;
  656. }
  657. li.original_post:before {
  658. content:'\e078';
  659. }
  660. {/block:PermalinkPage}
  661. </style>
  662. </head>
  663.  
  664. <body>
  665. <div id="t-bar">
  666. <ul class="nav">
  667. <li><a href="/">home</a>
  668. {block:AskEnabled}<li><a href="{text:Ask Link}">message</a>{/block:AskEnabled}
  669. <li><a href="/archive">past</a>
  670. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a>{/block:Pages}{/block:HasPages}
  671. </ul>
  672. </div>
  673. <div id="qbar">{text:Quote} <span id="stats">{text:Stats}</span></div>
  674. <div id="wrapper">
  675. <header>
  676. <h1>{Title}</h1>
  677. {block:Description}<div id="desc">
  678. {Description}
  679. </div>{/block:Description}
  680. <div id="banner">
  681. <div id="l-banner"></div>
  682. <ul id="nav" class="nav">
  683. <li><a href="/">home</a>
  684. {block:AskEnabled}<li><a href="{text:Ask Link}">message</a>{/block:AskEnabled}
  685. <li><a href="/archive">past</a>
  686. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a>{/block:Pages}{/block:HasPages}
  687. </ul>
  688. <div id="r-banner"></div>
  689. </div>
  690. </header>
  691. <section id="posts">
  692. {block:Posts}<article id="{PostID}" class="{block:Photo}non-{/block:Photo}{block:Photoset}non-{/block:Photoset}text-type">
  693. {block:Text}<div class="text t">
  694. {block:Title}<h2>{Title}</h2>{/block:Title}
  695. <div class="caption">{Body}</div>
  696. </div>{/block:Text}{block:Photo}<div class="photo">
  697. <img src="{block:IndexPage}{PhotoURL-400}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}">
  698. </div>{/block:Photo}{block:Photoset}<div class="photoset">
  699. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  700. {block:Photos}<div class="photo-data">
  701. <div class="pxu-photo">
  702. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  703. </div>
  704. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  705. </div>{/block:Photos}
  706. </div>
  707. </div>{/block:Photoset}{block:Quote}<div class="quote {Length} t">
  708. <h2>{Quote}</h2>
  709. {block:Source}<cite>{Source}</cite>{/block:Source}
  710. </div>{/block:Quote}{block:Link}<div class="link t">
  711. <h2><a href="{URL}"><i class="oi-link"></i> {Name}</a></h2>
  712. {block:Description}<div class="caption">{Description}</div>{/block:Description}
  713. </div>{/block:Link}{block:Chat}<div class="chat t">
  714. <ul>
  715. {block:Lines}<li>{block:Label}<span>{Label}</span>{/block:Label} {Line}{/block:Lines}
  716. </ul>
  717. </div>{/block:Chat}{block:Audio}<div class="audio t">
  718. {block:AlbumArt}<div class="album-art" style="background-image:url({AlbumArtURL})"></div>{/block:ALbumArt}
  719. <ul class="audio-info">
  720. <li><i class="oi-mic"></i> <b>Artist:</b> <span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  721. <li><i class="oi-playlist"></i> <b>Title:</b> <span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  722. <li><i class="oi-disc"></i> <b>Album:</b> <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}
  723. <li><i class="oi-repeat"></i> <b>Plays:</b> {FormattedPlayCount}
  724. </ul>
  725. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  726. </div>{/block:Audio}{block:Video}<div class="vid t">
  727. <div class="video">
  728. {block:IndexPage}{Video-400}{/block:IndexPage}{block:PermalinkPage}{Video-700}{/block:PermalinkPage}
  729. </div>
  730. </div>{/block:Video}{block:Answer}<div class="answer t">
  731. <div class="question">
  732. <span class="asker"><img src="{AskerPortraitURL-24}"> {Asker}</span>
  733. {Question}
  734. </div>
  735. {block:Answerer}<div class="question">
  736. <span class="asker"><img src="{AnswererPortraitURL-24} "> {Answerer}</span>
  737. {Answer}
  738. </div>{/block:Answerer}
  739. <div class="caption">
  740. {Replies}
  741. </div>
  742. </div>{/block:Answer}{block:IndexPage}
  743. <div class="mask">
  744. <div class="more">
  745. <a href="{Permalink}" target="_blank">{TimeAgo}</a>
  746. <a href="{Permalink}" target="_blank">{NoteCount}</a>
  747. <a href="{ReblogURL}" target="_blank">reblog</a>
  748. </div>
  749. </div>
  750. {/block:IndexPage}{block:PermalinkPage}{block:Caption}
  751. <div class="caption">
  752. {Caption}
  753. </div>{/block:Caption}
  754. {block:Date}<ul class="extra-info">
  755. <li><i class="oi-time"></i> {DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear} ({TimeAgo})
  756. {block:NoteCount}<li><i class="oi-chart"></i> {NoteCountWithLabel}{/block:NoteCount}
  757. {block:RebloggedFrom}<li><i class="oi-refresh"></i> <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  758. {block:ContentSource}<li><i class="oi-globe"></i> <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}
  759. {block:HasTags}<li><i class="oi-tags"></i> {block:Tags}<a href="/tagged/{Tag}">#{Tag}</a> {/block:Tags}{/block:HasTags}
  760. </ul>{/block:Date}
  761. {block:PostNotes}<div id="notes">
  762. {PostNotes-16}
  763. </div>{/block:PostNotes}
  764. {/block:PermalinkPage}
  765. </article>
  766. {/block:Posts}
  767. </section>
  768. </div>
  769. {block:Pagination}
  770. <div class="pagination" style="visibility:hidden;">
  771. {block:NextPage}<a href="{NextPage}" id="next-link">next</a>{/block:NextPage}
  772. </div>
  773. {/block:Pagination}
  774. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  775. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  776. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  777. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  778. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  779. <script src="http://static.tumblr.com/wgg6svp/I8Yobwo15/unnest.min.js"></script>
  780. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  781. <script>
  782. var pxuOptions = {
  783. lightbox: true,
  784. rounded: false,
  785. gutter: '3px',
  786. photoset: '.photo-slideshow',
  787. photoWrap: '.photo-data',
  788. photo: '.pxu-photo'
  789. }, infScrollOptions = {
  790. navSelector : "div.pagination",
  791. nextSelector : ".pagination a#next-link",
  792. itemSelector : "article",
  793. loading: {
  794. finishedMsg: "<p>You've reached the end of the Earth.</p>",
  795. img : "https://res1.nabtrade.com.au/Content/Images/ajax_loader.gif",
  796. msg: null,
  797. msgText: ""
  798. },
  799. }, masonryOptions = {
  800. itemSelector: 'article',
  801. isAnimated: false,
  802. columnWidth: 210,
  803. gutterWidth: 40,
  804. }, unnestOptions = {
  805. yourCaption: ".caption",
  806. wrapName: ".tumblr_parent",
  807. newCaptionUsername: true,
  808. originalPostCaptionUsername: false,
  809. tumblrAvatars: true,
  810. tumblrAvatarClass: ".caption_avatar",
  811. usernameColon: false
  812. }
  813.  
  814. var divs = $('#t-bar');
  815. var height = $('header').outerHeight() + 40;
  816. $(window).scroll(function(){
  817. if($(window).scrollTop() < height ){
  818. divs.fadeOut(150);
  819. } else {
  820. divs.fadeIn(150);
  821. }
  822. });
  823. $(function(){
  824. $('.photo-slideshow').pxuPhotoset(pxuOptions);
  825. $('article').unnest(unnestOptions);
  826. {block:IndexPage}
  827. var $tumblelog = $('#posts');
  828. $tumblelog.imagesLoaded(function () {
  829. $tumblelog.masonry(masonryOptions);
  830. });
  831. $tumblelog.infinitescroll(
  832. infScrollOptions, function( newElements ) {
  833. var $newElems = $( newElements );
  834. var $newElemsIDs = $newElems.map(function () {
  835. return this.id;
  836. }).get();
  837. $newElems.find('.photo-slideshow').pxuPhotoset(pxuOptions);
  838. $newElems = $(newElements).css({ opacity: 0, zIndex: -1});
  839. $newElems.imagesLoaded(function(){
  840. $newElems.animate({ opacity: 1, zIndex: 1 });
  841. $tumblelog.masonry( 'appended', $newElems );
  842. });
  843. $newElems.unnest(unnestOptions);
  844. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  845. resizeVideos();
  846. });
  847. {/block:IndexPage}
  848. });
  849. </script>
  850. </body>
  851. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement