API tools faq
paste
Advertisement
paigeh987

Theme 27

paigeh987
Jun 25th, 2016
17,101
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 23.54 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!--
  5.  
  6. Theme 27 by Paige @neonbikethemes.tumblr.com
  7. Last Updated 07.06.16
  8.  
  9. Rules:
  10.  
  11. - you may customize but no stealing code
  12. - no removing credit (this is stealing)
  13. - please like/reblog the post
  14.  
  15. Credits
  16.  
  17. - base code by sorrism
  18. - photoset script by pixelunion, tutorial by shythemes
  19. - masonry script by desandro
  20. - infinite scroll script by paul irish
  21.  
  22. -->
  23.  
  24.  
  25. <title>{Title}</title>
  26.  
  27. <link rel="shortcut icon" href="{Favicon}">
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  30.  
  31. <!--Default Variables-->
  32.  
  33. <meta name="color:Background" content="#f0f0f0"/>
  34. <meta name="color:Text" content="#4e4e4e"/>
  35. <meta name="color:Link" content="#88b9ce"/>
  36. <meta name="color:Hover" content="#4d4d4d"/>
  37. <meta name="color:Border" content="#e9e9e9"/>
  38. <meta name="color:Posts" content="#ffffff"/>
  39. <meta name="color:Sidebar" content="#ffffff"/>
  40. <meta name="color:Frame 1" content="#f5d3cd"/>
  41. <meta name="color:Frame 2" content="#acd1e1"/>
  42.  
  43. <meta name="select:Font" content="Inconsolata" title="Inconsolata">
  44. <meta name="select:Font" content="Helvetica" title="Helevtica">
  45. <meta name="select:Font" content="Montserrat" title="Montserrat">
  46. <meta name="select:Font" content="Bitter" title="Bitter">
  47. <meta name="select:Font" content="Open Sans" title="Open Sans">
  48. <meta name="select:Font" content="Lato" title="Lato">
  49.  
  50. <meta name="select:Font size" content="9" title="9px">
  51. <meta name="select:Font size" content="10" title="10px">
  52. <meta name="select:Font size" content="11" title="11px">
  53. <meta name="select:Font size" content="12" title="12px">
  54.  
  55. <meta name="text:subtitle" content="">
  56. <meta name="text:post width" content="300">
  57. <meta name="text:permalink post width" content="400">
  58. <meta name="text:Link 1 URL" content="" />
  59. <meta name="text:Link 1" content="" />
  60. <meta name="text:Link 2 URL" content="" />
  61. <meta name="text:Link 2" content="" />
  62. <meta name="text:Link 3 URL" content="" />
  63. <meta name="text:Link 3" content="" />
  64. <meta name="text:Link 4 URL" content="" />
  65. <meta name="text:Link 4" content="" />
  66. <meta name="text:Link 5 URL" content="" />
  67. <meta name="text:Link 5" content="" />
  68. <meta name="text:Link 6 URL" content="" />
  69. <meta name="text:Link 6" content="" />
  70.  
  71. <meta name="if:round sb img" content="0" />
  72. <meta name="if:show reblog source" content="0" />
  73. <meta name="if:like reblog buttons" content="0" />
  74. <meta name="if:hide captions" content="0" />
  75. <meta name="if:hide tags" content="0" />
  76. <meta name="if:padded photos" content="0" />
  77. <meta name="if:single column" content="1" />
  78. <meta name="if:infinite scroll" content="0" />
  79. <meta name="if:full size bg" content="0" />
  80.  
  81. <meta name="image:background" content="" />
  82. <meta name="image:sidebar" content="" />
  83.  
  84.  
  85.  
  86.  
  87.  
  88. <!--CSS -->
  89.  
  90. <style type="text/css">
  91.  
  92. #s-m-t-tooltip{
  93. position:absolute;
  94. margin-top: 15px;
  95. z-index:9999;
  96. background:{color:posts};
  97. padding:10px;
  98. }
  99.  
  100. /*basics*/
  101.  
  102. blockquote {
  103. padding: 0px 0px 0px 15px;
  104. border-left:1px solid {color:border};
  105. margin: 0 0 0 5px;
  106. }
  107.  
  108. blockqoute img{
  109. height:auto;
  110. max-width:100%;
  111. }
  112.  
  113. body {
  114. background:{color:background};
  115. background-image: url('{image:background}');
  116. {block:Iffullsizebg}
  117. background-size: cover;
  118. {/block:Iffullsizebg}
  119. background-attachment:fixed;
  120. color:{color:text};
  121. font-family:{select:font};
  122. font-size:{select:font size}px;
  123. text-align:left;
  124. margin:0;
  125. line-height:150%;
  126. word-wrap: break-word;
  127. }
  128.  
  129. a {
  130. color:{color:link};
  131. text-decoration:none;
  132. -webkit-transition: all .3s;
  133. -moz-transition: all .3s;
  134. -o-transition: all .3s;
  135. -ms-transition: all .3s;
  136. transition: all .3s;
  137. }
  138.  
  139. a:hover {
  140. text-decoration:none;
  141. color:{color:hover};
  142. -webkit-transition: all .3s;
  143. -moz-transition: all .3s;
  144. -o-transition: all .3s;
  145. -ms-transition: all .3s;
  146. transition: all .3s;
  147. }
  148.  
  149. img{
  150. border:none;
  151. width:auto;
  152. height:auto;
  153. max-width:100%;
  154. }
  155.  
  156.  
  157. small {
  158. font-size:9px;}
  159.  
  160. big {
  161. font-size:12px;}
  162.  
  163. pre {
  164. white-space: pre-wrap;
  165. white-space: -moz-pre-wrap;
  166. white-space: -pre-wrap;
  167. white-space: -o-pre-wrap;
  168. word-wrap: break-word;
  169. }
  170.  
  171. p{
  172. margin:0 0 10 0;
  173. }
  174.  
  175. ul {
  176. list-style-type:square;
  177. }
  178.  
  179. ol{
  180. list-style-type:lower-roman;
  181. }
  182.  
  183. ul li, ol li{
  184. margin-left:-20px;
  185. }
  186.  
  187.  
  188. #title {
  189. font-size:calc({select:font size}px + 3px);
  190. padding:20px;
  191. line-height:18px;
  192. font-weight:bold;
  193. text-align:left;
  194. border-bottom:1px solid {color:border};
  195. background:{color:posts};
  196. }
  197.  
  198. #title a {
  199. color:{color:link};
  200. }
  201.  
  202. .lightbox-image {
  203. max-height:80vh;
  204. max-width:80vw;
  205. }
  206.  
  207.  
  208. /* ----------------------- SIDEBAR -------------------------- */
  209.  
  210. #sidebar {
  211. left:0px;
  212. top:0px;
  213. width:220px;
  214. text-align:left;
  215. color:{color:text};
  216. height:180px;
  217. display:inline-block;
  218. position:fixed;
  219. background:{color:sidebar};
  220. height:100vh;
  221. padding: 60px 50px 50px 50px;
  222. }
  223.  
  224. #sidebar a{
  225. color:{color:text};
  226. }
  227.  
  228. .sbimg{
  229. position:relative;
  230. float:left;
  231. margin: 0px 15px 10px 0px;
  232. }
  233.  
  234. .sbimg img{
  235. width:50px;
  236. height:50px;
  237. {block:Ifroundsbimg}
  238. border-radius:60px;
  239. {/block:Ifroundsbimg}
  240. }
  241.  
  242. #blogt {
  243. position:relative;
  244. display:inline-block;
  245. font-size:14px;
  246. margin: 10px 0px 5px 0px;
  247. text-align:left;
  248. font-weight:bold;
  249. opacity:1;
  250. vertical-align:bottom;
  251. }
  252.  
  253. /* short description */
  254.  
  255. #links {
  256. text-transform:lowercase;
  257. letter-spacing:1px;
  258. margin-bottom:20px;
  259. }
  260.  
  261. /* links actually */
  262.  
  263. .links{
  264. line-height:200%;
  265. }
  266.  
  267. .links a {
  268.  
  269. text-decoration:none;
  270. }
  271.  
  272. .links p{
  273. margin:0;
  274. }
  275.  
  276. .linkline{
  277. border-top:1px solid {color:border};
  278. width:10px;
  279. height:5px;display:inline-block;
  280. margin: 0 8px 0 0;
  281. -webkit-transition:0.5s;
  282. -moz-transition:0.5s;
  283. -ms-transition:0.5s;
  284. -o-transition:0.5s;
  285. transition:0.5s;
  286. }
  287.  
  288. .sblink{
  289. border-bottom:0px;
  290. -webkit-transition:0.5s;
  291. -moz-transition:0.5s;
  292. -ms-transition:0.5s;
  293. -o-transition:0.5s;
  294. transition:0.5s;
  295. }
  296.  
  297. .sblink:hover{
  298. margin-left:0px;
  299. -webkit-transition:0.5s;
  300. -moz-transition:0.5s;
  301. -ms-transition:0.5s;
  302. -o-transition:0.5s;
  303. transition:0.5s;
  304. }
  305. .sblink:hover .linkline{
  306. width:20px;
  307. -webkit-transition:0.5s;
  308. -moz-transition:0.5s;
  309. -ms-transition:0.5s;
  310. -o-transition:0.5s;
  311. transition:0.5s;
  312. }
  313.  
  314. #description {
  315. color:{color:text};
  316. padding:30px 50px 0px 50px;
  317. margin: 40px -50px 30px -50px;
  318. border-top:1px solid {color:border};
  319. word-spacing:1px;
  320. line-height:140%;
  321. }
  322.  
  323.  
  324. /*pagination*/
  325.  
  326. .navigation {
  327. text-transform:lowercase;
  328. text-align:right;
  329. position:fixed;
  330. bottom:0px;
  331. border-top:1px solid {color:border};
  332. padding: 30px 50px 40px 40px;
  333. margin:0px -50px 0px -50px;
  334. width:250px;
  335. {block:Ifinfinitescroll}
  336. display:none;
  337. {/block:Ifinfinitescroll}
  338. }
  339.  
  340. .navigation a {
  341. padding:0px;
  342. }
  343.  
  344. .pagibutton{
  345. display:inline-block;
  346. }
  347.  
  348. /* ----------------------- POSTS -------------------------- */
  349.  
  350. /* container */
  351.  
  352. .grid-item--width2 { width: 400px; }
  353.  
  354. .grid {
  355. margin: 80px 0px 140px 400px;
  356. {block:IndexPage}
  357. {block:Ifsinglecolumn}
  358. width:calc({text:post width}px + 135px);
  359. {/block:Ifsinglecolumn}
  360. {block:Ifnotsinglecolumn}
  361. width:calc(100vw - 420px);
  362. {/block:Ifnotsinglecolumn}
  363. {/block:IndexPage}
  364. {block:PermalinkPage}
  365. width:calc({text:permalink post width}px + 135px);
  366. {/block:PermalinkPage}
  367. height:auto;
  368. }
  369.  
  370. /*posts*/
  371.  
  372. .grid-item {
  373. float:left;
  374. {block:IndexPage}
  375. width:calc({text:post width}px + 60px);
  376. {/block:IndexPage}
  377. {block:PermalinkPage}
  378. width:calc({text:permalink post width}px + 60px);
  379. {/block:PermalinkPage}
  380. max-width:730px;
  381. min-width:230px;
  382. margin: 0px 0px 60px 0px;
  383. height:auto;
  384. }
  385.  
  386. .grid-item img {
  387. max-width:100%;
  388. }
  389.  
  390. .grid-item img, .grid-item li, .grid-item blockquote {max-width: 100%;}
  391.  
  392. .ph{
  393. background:{color:posts};
  394. margin:0px;
  395. border-bottom:1px solid {color:background};
  396. {block:Ifpaddedphotos}
  397. padding:30px;
  398. {/block:Ifpaddedphotos}
  399. {block:Ifnotpaddedphotos}
  400. padding:0px;
  401. {/block:Ifnotpaddedphotos}
  402. }
  403.  
  404. .ph img{
  405. width:100%;
  406. margin-bottom:-4px;
  407. }
  408.  
  409. .text{
  410. background:{color:posts};
  411. margin:0px;
  412. border-bottom:1px solid {color:border};
  413. padding: 20px 30px 20px 30px;
  414. }
  415.  
  416. .caption {
  417. border-bottom:1px solid {color:border};
  418. background:{color:posts};
  419. padding:20px;
  420. }
  421.  
  422. .lframe{
  423. {block:PermalinkPage}
  424. display:none;
  425. {/block:PermalinkPage}
  426. position:absolute;
  427. float:left;
  428. border-top:2px solid {color:frame 1};
  429. border-left:2px solid {color:frame 1};
  430. width:15px;
  431. height:15px;
  432. margin-top:-1px;
  433. margin-left:-1px;
  434. -webkit-transition:0.5s;
  435. -moz-transition:0.5s;
  436. -ms-transition:0.5s;
  437. -o-transition:0.5s;
  438. transition:0.5s;
  439. z-index:9999;
  440. }
  441.  
  442. .rframe{
  443. {block:PermalinkPage}
  444. display:none;
  445. {/block:PermalinkPage}
  446. float:left;
  447. position:absolute;
  448. border-bottom:2px solid {color:frame 2};
  449. border-right:2px solid {color:frame 2};
  450. width:15px;
  451. height:15px;
  452. margin-top:-16px;
  453. margin-left:calc({text:post width}px + 45px);
  454. -webkit-transition:0.5s;
  455. -moz-transition:0.5s;
  456. -ms-transition:0.5s;
  457. -o-transition:0.5s;
  458. transition:0.5s;
  459. z-index:9999;
  460. }
  461.  
  462. .grid-item:hover .lframe{
  463. margin-top:-11px;
  464. margin-left:-11px;
  465. -webkit-transition:0.5s;
  466. -moz-transition:0.5s;
  467. -ms-transition:0.5s;
  468. -o-transition:0.5s;
  469. transition:0.5s;
  470. }
  471.  
  472. .grid-item:hover .rframe{
  473. margin-top:-5px;
  474. margin-left:calc({text:post width}px + 55px);
  475. -webkit-transition:0.5s;
  476. -moz-transition:0.5s;
  477. -ms-transition:0.5s;
  478. -o-transition:0.5s;
  479. transition:0.5s;
  480. }
  481.  
  482. /*quote*/
  483.  
  484. #titlequote{
  485. text-align:left;
  486. font-size:14px;
  487. line-height:18px;
  488. font-weight:bold;
  489. }
  490.  
  491. #source {
  492. margin-top:15px;
  493. margin-left:15px;
  494. }
  495.  
  496. /* AUDIO */
  497.  
  498. .player {
  499. width:27px;
  500. height:27px;
  501. margin: 12px 0 0 2px;
  502. {block:Ifpaddedphotos}
  503. margin: 0px 0px 0px -10px;
  504. width:48px;
  505. height:48px;
  506. {/block:Ifpaddedphotos}
  507. border:1px solid {color:border};
  508. overflow:hidden;
  509. position:absolute;
  510. background:white;
  511. z-index:99;
  512. opacity:.2;
  513. }
  514.  
  515. .player:hover{
  516. opacity:.9;
  517. }
  518.  
  519. .audioinfo {
  520. margin-left:50px;
  521. text-align:right;
  522. min-height:50px;
  523. }
  524.  
  525. .audioart{
  526. position:relative;
  527. float:left;
  528. margin:-20px 30px 0px -30px;
  529. width:90px;
  530. height:90px;
  531. {block:Ifpaddedphotos}
  532. margin: 0px 20px 0px -10px;
  533. width:50px;
  534. height:50px;
  535. {/block:Ifpaddedphotos}
  536. }
  537.  
  538. .audioart img{
  539. max-width:100%;
  540. }
  541.  
  542. .trackview{
  543. width:{text:post width}px;
  544. max-width:100%;
  545. }
  546.  
  547. /* ASKS */
  548.  
  549. .q {
  550. border-bottom:1px solid {color:border};
  551. padding:30px;
  552. background:{color:posts};
  553. }
  554.  
  555. .as {
  556. font-weight:bold;
  557. margin-bottom:6px;
  558. text-transform:lowercase;
  559. }
  560.  
  561. .a {
  562. padding:30px;
  563. background:{color:posts};
  564. border-bottom:1px solid {color:border};
  565. }
  566.  
  567. .askerimg{
  568. position:relative;
  569. float:left;
  570. margin: 0px 6px -4px 0px;
  571. {block:Ifroundsbimg}
  572. border-radius:16px;
  573. {/block:Ifroundsbimg}
  574. }
  575.  
  576.  
  577. /* CHAT */
  578.  
  579. .chat ol{
  580. padding:0;
  581. list-style:none;
  582. margin: -10px 0px 0px 0px;
  583. }
  584. .chat ol li{
  585. margin:0;
  586. }
  587.  
  588. .line {padding:5px 0;}
  589.  
  590. .label {font-weight:bold;
  591. }
  592.  
  593.  
  594. /* LINKS */
  595.  
  596. .linkicon{
  597. position:relative;
  598. float:right;
  599. display:inline-block;
  600. }
  601.  
  602.  
  603. /* VIDEO */
  604.  
  605. .vid{
  606. background:{color:posts};
  607. border-bottom:1px solid {color:border};
  608. {block:Ifpaddedphotos}
  609. padding:30px;
  610. {/block:Ifpaddedphotos}
  611. {block:Ifnotpaddedphotos}
  612. padding:0px;
  613. {/block:Ifnotpaddedphotos}
  614. }
  615.  
  616. .video{
  617. position: relative;
  618. padding-bottom: 56.25%; /* 16:9 */
  619. padding-top: 25px;
  620. height: 0;
  621. }
  622.  
  623. .video iframe{
  624. position: absolute;
  625. top: 0;
  626. left: 0;
  627. width: 100%;
  628. height: 100%;
  629. }
  630.  
  631. /* REBLOG INFORMATION */
  632.  
  633. .rb{
  634. text-align:right;
  635. border-bottom:1px solid {color:border};
  636. padding: 15px 20px 15px 20px;
  637. background:{color:posts};
  638. text-transform:uppercase;
  639. font-size:9px;
  640. letter-spacing:1px;
  641. }
  642.  
  643. .time{
  644. position:relative;
  645. float:left;
  646. text-align:left;
  647. }
  648.  
  649. .rb a {
  650. color:{color:text};
  651. text-decoration:none;
  652. -webkit-transition: all .3s;
  653. -moz-transition: all .3s;
  654. -o-transition: all .3s;
  655. -ms-transition: all .3s;
  656. transition: all .3s;
  657. }
  658.  
  659. .rb a:hover {
  660. text-decoration:none;
  661. color:{color:link};
  662. -webkit-transition: all .3s;
  663. -moz-transition: all .3s;
  664. -o-transition: all .3s;
  665. -ms-transition: all .3s;
  666. transition: all .3s;
  667. }
  668.  
  669.  
  670. /* POST INFO AND NOTES */
  671.  
  672. #permalink {
  673. padding:15px;
  674. text-transform:uppercase;
  675. text-align:left;
  676. font-size:9px;
  677. letter-spacing:1px;
  678. word-spacing:3px;
  679. background:{color:posts};
  680. }
  681.  
  682. #permalink a {
  683. margin-right:3px;
  684. color:{color:text};
  685. }
  686.  
  687.  
  688. .tags {
  689. word-break:break-all;
  690. word-spacing:0px;
  691. text-transform:lowercase;
  692. {block:Ifhidetags}
  693. {block:IndexPage}
  694. display:none;
  695. {/block:IndexPage}
  696. {/block:Ifhidetags}
  697. }
  698.  
  699. .tags a{
  700. margin-right:4px;
  701. border-bottom:1px solid {color:border};
  702. }
  703.  
  704. .tags a:hover{
  705. border-bottom:1px solid {color:link};
  706. }
  707.  
  708. .pagenotes{
  709. background:{color:posts};
  710. padding:20px;
  711. margin: 20px 0px 50px 0px;
  712. line-height:180%;
  713. }
  714.  
  715. .pagenotes ol{
  716. list-style-type:none;
  717. margin-left:-35px;
  718. }
  719.  
  720. .pagenotes li{
  721. margin: 5px 0px 5px 0px;
  722. }
  723.  
  724. .pagenotes img{
  725. display:inline-block;
  726. border-radius:20px;
  727. margin: 0 8px -5px 0;
  728. }
  729.  
  730. .pagenotes blockquote {
  731. padding: 0px 0px 0px 10px;
  732. border-left:1px solid {color:border};
  733. margin-left:0px;
  734. }
  735.  
  736. .lkrb{
  737. float:right;
  738. line-height:12px;
  739. }
  740.  
  741. .lkrbb{
  742. display:inline-block;
  743. }
  744.  
  745.  
  746. /* CREDIT: DO NOT REMOVE THANKS */
  747. .credit{
  748. position:fixed;
  749. bottom:15px;
  750. right:15px;
  751. background:{color:posts};
  752. padding:3px 5px 3px 5px;
  753. letter-spacing:1px;
  754. }
  755.  
  756.  
  757. {CustomCSS}
  758.  
  759.  
  760. </style>
  761.  
  762.  
  763.  
  764. </head>
  765.  
  766. <body>
  767.  
  768.  
  769. <div id="sidebar">
  770.  
  771. <a href="/">
  772. <div class="sbimg"><img src="{image:sidebar}"></div>
  773. </a>
  774.  
  775. <a href="/">
  776. <div id="blogt">{Title}</div>
  777. </a>
  778.  
  779. <div id="links">
  780. {text:subtitle}
  781. </div>
  782.  
  783. <div id="description">
  784. <p>{Description}</p>
  785. </div>
  786.  
  787. <div class="links">
  788.  
  789. {block:ifLink1}<a href="{text:Link 1 URL}">
  790. <div class="sblink">
  791. <div class="linkline"></div>{text:Link 1}</div></a>{/block:ifLink1}
  792. {block:ifLink2} <a href="{text:Link 2 URL}" >
  793. <div class="sblink">
  794. <div class="linkline"></div>{text:Link 2}</div></a>{/block:ifLink2}
  795. {block:ifLink3} <a href="{text:Link 3 URL}">
  796. <div class="sblink">
  797. <div class="linkline"></div>{text:Link 3}</div></a>{/block:ifLink3}
  798. {block:ifLink4} <a href="{text:Link 4 URL}">
  799. <div class="sblink">
  800. <div class="linkline"></div>{text:Link 4}</div></a>{/block:ifLink4}
  801. {block:ifLink5} <a href="{text:Link 5 URL}" >
  802. <div class="sblink">
  803. <div class="linkline"></div>{text:Link 5}</div></a>{/block:ifLink5}
  804. {block:ifLink6} <a href="{text:Link 6 URL}">
  805. <div class="sblink">
  806. <div class="linkline"></div>{text:Link 6}</div></a>{/block:ifLink6}
  807. </div>
  808.  
  809. <!--Pagination: previous/next page links-->
  810.  
  811. <div class="navigation">
  812. {block:Pagination}
  813. {block:NextPage}<a href="{NextPage}" class="pagibutton">older</a>{/block:NextPage}
  814. {block:PreviousPage}<a href="{PreviousPage}" class="pagibutton">newer</a>{/block:PreviousPage}
  815. {/block:Pagination}
  816. </div>
  817.  
  818.  
  819. </div>
  820.  
  821.  
  822.  
  823.  
  824. <div class="grid">
  825.  
  826.  
  827. {block:Posts}
  828. <div class="grid-item">
  829.  
  830. <div class="lframe"></div>
  831.  
  832. {block:Ifshowreblogsource}
  833. {block:RebloggedFrom}
  834. <div class="rb">
  835. <a href="{Permalink}"><div class="time">{DayOfWeek} {12Hour}:{Minutes}{AmPm}</div></a>
  836. <a href="{ReblogParentURL}" title="reblogged from {ReblogParentName}">{ReblogParentName} <i class="fa fa-retweet"></i> </a>
  837. </div>
  838. {/block:RebloggedFrom}
  839. {/block:Ifshowreblogsource}
  840.  
  841. {block:Quote}
  842. <div class="text">
  843. <div id="titlequote">“{Quote}”</div>
  844. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  845. </div>
  846. {/block:Quote}
  847.  
  848. {block:Text}
  849. {block:Title}<div id="title">{Title}</div>{/block:Title}
  850. {block:Body}<div class="text">{Body}</div>{/block:Body}
  851. {/block:Text}
  852.  
  853. {block:Link}
  854. <div id="title">
  855. <a href="{URL}">
  856. <div class="linkicon"><i class="fa fa-external-link" aria-hidden="true"></i></div>
  857. {Name}</a>
  858. </div>
  859. {block:Description}<div class="text">{Description}</div>{/block:Description}
  860. {/block:Link}
  861.  
  862. {block:Chat}
  863. {block:Title}
  864. <div id="title">{Title}</div>
  865. {/block:Title}
  866. <div class="text">
  867. <div class="chat">
  868. <ol>{block:Lines}
  869. <li class="line {Alt}">
  870. {block:Label}
  871. <span class="label">
  872. {Label}</span>
  873. {/block:Label}{Line}</li>
  874. {/block:Lines}
  875. </ol></div>
  876. </div>
  877. {/block:Chat}
  878.  
  879. {block:Photo}
  880. <div class="ph">
  881. <img src="{PhotoURL-HighRes}">
  882. </div>
  883. {/block:Photo}
  884.  
  885. {block:Photoset}
  886. <div class="ph">
  887. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  888. </div>
  889. {/block:Photoset}
  890.  
  891. {block:Video}
  892. <div class="vid">
  893. <div class="video">{Video-500}</div>
  894. </div>
  895. {/block:Video}
  896.  
  897. {block:Audio}
  898. <div class="text">
  899. {block:AudioPlayer}
  900. {block:AlbumArt}
  901. <div class="audioart"><img src="{AlbumArtURL}"></div>
  902. {/block:AlbumArt}
  903. <div class="player">
  904. {AudioPlayerWhite}
  905. </div>
  906. <div class="audioinfo">
  907. {block:Artist}{Artist}{/block:Artist}
  908. <br>{block:TrackName}<b>{TrackName}</b>{/block:TrackName}
  909. <br>{PlayCountWithLabel}
  910. </div>
  911. {/block:AudioPlayer}
  912. {block:AudioEmbed} {AudioEmbed-400}{/block:AudioEmbed}
  913. </div>
  914. {/block:Audio}
  915.  
  916. {block:Answer}
  917. <div class="q">
  918. <img class="askerimg" src="{AskerPortraitURL-16}">
  919. <div class="as">{Asker}</div>
  920. {Question}
  921. </div>
  922. <div class="a">{Answer}</div>
  923. {/block:Answer}
  924.  
  925. <!-- CAPTIONS -->
  926. {block:IfHideCaptions}
  927. {block:PermalinkPage}
  928. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  929. {/block:PermalinkPage}
  930. {/block:IfHideCaptions}
  931. {block:IfnotHideCaptions}
  932. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  933. {/block:IfnotHideCaptions}
  934.  
  935.  
  936.  
  937. {block:Date}
  938. <div id="permalink">
  939. {block:IndexPage}{block:IfLikeReblogButtons}
  940. <div class="lkrb">
  941. <div class="lkrbb">{ReblogButton color="grey" size="12"}</div>
  942. <div class="lkrbb">{LikeButton color="grey" size="13"}</div>
  943. </div>
  944. {/block:IfLikeReblogButtons}{/block:IndexPage}
  945. {block:PermalinkPage}
  946. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}, {12Hour}:{Minutes} {AmPm} /
  947. {/block:PermalinkPage}
  948. <a href="{Permalink}">{TimeAgo}</a>
  949. {block:NoteCount}
  950. / <a href="{Permalink}">{NoteCountwithlabel}</a>
  951. {/block:NoteCount}
  952. {block:PermalinkPage}
  953. {block:RebloggedFrom}
  954. / <a href="{ReblogParentURL}"> from</a>
  955. {block:ContentSource}
  956. / <a href="{ReblogRootURL}" title="{ReblogRootName}">origin</a>
  957. {/block:ContentSource}
  958. {/block:RebloggedFrom}
  959. {/block:PermalinkPage}
  960.  
  961. {block:HasTags}
  962. <div class="tags">
  963. {block:Tags}<a href="{TagUrl}">{Tag}</a>, {/block:Tags}
  964. </div>
  965. {/block:HasTags}
  966.  
  967. </div>
  968. {/block:Date}
  969.  
  970. <div class="rframe"></div>
  971.  
  972.  
  973.  
  974.  
  975. {block:PostNotes}
  976. <div class="pagenotes">
  977. <div id="title" style="margin:-20px -20px 20px -20px;">Notes</div>
  978. {PostNotes-16}
  979. </div>
  980. {/block:PostNotes}
  981.  
  982.  
  983. </div>
  984. {/block:Posts}
  985.  
  986.  
  987. </div>
  988.  
  989.  
  990. {block:ContentSource}
  991. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  992. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  993. {/block:SourceLogo}
  994. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  995. {/block:ContentSource}
  996.  
  997. <!-- CREDIT: DO NOT REMOVE THANKS -->
  998. <a href="http://neonbikethemes.tumblr.com" style="color:{color:text};"><div class="credit">nb</div></a>
  999.  
  1000.  
  1001.  
  1002.  
  1003. <!-- jquery for tooltips-->
  1004. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1005. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1006. <script>
  1007. (function($){
  1008. $(document).ready(function(){
  1009. $("a[title]").style_my_tooltips({
  1010. tip_follows_cursor:true,
  1011. tip_delay_time:30,
  1012. tip_fade_speed:300,
  1013. attribute:"title"
  1014. });
  1015. });
  1016. })(jQuery);
  1017. </script>
  1018.  
  1019. <!-- FONT SCRIPTS -->
  1020. <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,700italic,400italic|Bitter:400,400italic,700|Montserrat:400,700|Lato:400,400italic,700italic,700|Inconsolata:400,700' rel='stylesheet' type='text/css'>
  1021.  
  1022. <!-- ICON FONT SCRIPT -->
  1023. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  1024.  
  1025. <!-- JQUERY -->
  1026. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
  1027.  
  1028. <!-- PHOTOSETS FROM PIXEL UNION -->
  1029. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1030. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1031.  
  1032. <!-- IMAGES LOADED -->
  1033. <script src="https://npmcdn.com/imagesloaded@4.1/imagesloaded.pkgd.min.js"></script>
  1034.  
  1035. <!-- MASONRY -->
  1036. <script src="http://static.tumblr.com/kfhytre/ZiDo96g3z/masonry.pkgd.min.js"></script>
  1037.  
  1038. <!-- INFINITE SCROLL -->
  1039. {block:Ifinfinitescroll}
  1040. <srcipt src="http://static.tumblr.com/kfhytre/f6Ko9vddb/jquery.infinitescroll.min.js"></srcipt>
  1041. {/block:Ifinfinitescroll}
  1042.  
  1043. <script>
  1044. $(function(){
  1045. var $container = $('.grid');
  1046. $('.photo-slideshow').pxuPhotoset({
  1047. lightbox: true,
  1048. rounded: false,
  1049. gutter: '2px',
  1050. borderRadius: '0px',
  1051. photoset: '.photo-slideshow',
  1052. photoWrap: '.photo-data',
  1053. photo: '.pxu-photo'
  1054. });
  1055. $container.imagesLoaded( function(){
  1056. $container.masonry({
  1057. itemSelector : '.grid-item'
  1058. });
  1059. });
  1060. $container.masonry({
  1061. itemSelector: '.grid-item',
  1062. columnWidth: {text:post width} + 120
  1063. });
  1064. {block:Ifinfinitescroll}
  1065. $container.infinitescroll({
  1066. navSelector : '.navigation',
  1067. nextSelector : '.pagibutton',
  1068. itemSelector : '.grid-item',
  1069. bufferPx : 2000
  1070. });
  1071. {/block:Ifinfinitescroll}
  1072. });
  1073. </script>
  1074.  
  1075. </body>
  1076.  
  1077.  
  1078.  
  1079.  
  1080. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!