aeternaphantasia

theme #11: harmonia

Nov 8th, 2017
1,744
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 24.81 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  8.  
  9. <!--
  10.  
  11. Theme #11: Harmonia
  12. coded by kuzuriha
  13.  
  14. 1. Don't remove the credit.
  15. 2. Don't move the credit. Just leave it there.
  16. 3. Don't use as a base code.
  17. 4. Please enjoy! If you find any bugs, please contact me! c:
  18.  
  19. -->
  20.  
  21. <!--Variables-->
  22.  
  23. <meta name="image:bg" content=""/>
  24.  
  25. <meta name="color:bg" content="#fff"/>
  26. <meta name="color:body" content="#616161"/>
  27. <meta name="color:postbg" content="#fff"/>
  28. <meta name="color:first accent" content="#FFBDA0"/>
  29. <meta name="color:second accent" content="#FF9594"/>
  30. <meta name="color:third accent" content="#FFD394"/>
  31.  
  32. <meta name="image:header" content=""/>
  33.  
  34. <meta name="color:headerbg" content="#FFBDA0"/>
  35. <meta name="color:descbg" content="#fff"/>
  36.  
  37. <meta name="text:link1" content=""/>
  38. <meta name="text:link1URL" content=""/>
  39. <meta name="text:link2" content=""/>
  40. <meta name="text:link2URL" content=""/>
  41. <meta name="text:link3" content=""/>
  42. <meta name="text:link3URL" content=""/>
  43. <meta name="text:link4" content=""/>
  44. <meta name="text:link4URL" content=""/>
  45.  
  46. <meta name="if:500px" content="1"/>
  47. <meta name="if:540px" content="0"/>
  48. <meta name="if:fixedheader" content="0"/>
  49.  
  50. <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  51.  
  52. <script src="https://static.tumblr.com/wdp3vza/pJvosgmgd/jquery.style-my-tooltips.js"></script>
  53.  
  54. <script>
  55.  
  56. (function($){
  57.  
  58. $(document).ready(function(){
  59.  
  60. $("a[title]").style_my_tooltips({
  61.  
  62. tip_follows_cursor:true,
  63.  
  64. tip_delay_time:0,
  65.  
  66. tip_fade_speed:0,
  67.  
  68. attribute:"title"
  69.  
  70. });
  71.  
  72. });
  73.  
  74. })(jQuery);
  75.  
  76. </script>
  77.  
  78. <script src="//use.edgefonts.net/pt-serif;karla.js"></script>
  79.  
  80. <script src="https://use.fontawesome.com/1244917dbe.js"></script>
  81.  
  82. {block:if540px}
  83. <script src ="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  84. {/block:if540px}
  85.  
  86. <style type="text/css">
  87. ::-webkit-scrollbar{
  88. width:7px;
  89. background:{color:bg};
  90. }
  91.  
  92. ::-webkit-scrollbar-thumb:vertical{
  93. background:{color:third accent};
  94. height:auto;
  95. border:3px solid #fff;
  96. }
  97.  
  98. ::selection{
  99. background:transparent;
  100. color:{color:third accent};
  101. }
  102.  
  103. ::-moz-selection{
  104. background:transparent;
  105. color:{color:third accent};
  106.  
  107. }
  108.  
  109. iframe.tmblr-iframe {
  110. z-index:99999999999999!important;
  111. {block:indexpage}
  112. top:290px!important;
  113. {/block:indexpage}
  114.  
  115. {block:permalinkpage}
  116. top:220px !important;
  117. {/block:permalinkpage}
  118. opacity:0.4;
  119. /* delete invert(1) from here */
  120. filter:invert(1) contrast(150%);
  121. -webkit-filter:invert(1) contrast(150%);
  122. -o-filter:invert(1) contrast(150%);
  123. -moz-filter:invert(1) contrast(150%);
  124. -ms-filter:invert(1) contrast(150%);
  125. /* to here if your blog has a dark background */
  126. transform:scale(0.65);
  127. transform-origin:left(-250%) 0;
  128. -webkit-transform:scale(0.65);
  129. -webkit-transform-origin:left(-250%) 0;
  130. -o-transform:scale(0.65);
  131. -o-transform-origin:left(-250%) 0;
  132. -moz-transform:scale(0.65);
  133. -moz-transform-origin:left(-250%) 0;
  134. -ms-transform:scale(0.65);
  135. -ms-transform-origin:left(-250%) 0;}
  136.  
  137. iframe.tmblr-iframe:hover {
  138. opacity:0.6!important;}
  139.  
  140.  
  141. body{
  142. margin:0;
  143. padding:0;
  144. background:{color:bg} url('{image:bg}') fixed;
  145. font-family:pt-serif;
  146. font-size:12px;
  147. color:{color:body};
  148. }
  149.  
  150. #s-m-t-tooltip {
  151. max-width:150px;
  152. padding:5px 10px 5px 10px;
  153. margin:20px 14px 7px 10px;
  154. background-color:{color:first accent}; /* change the background color */
  155. font-style: normal;
  156. font-size:10px; /* change the font size */
  157. line-height:11px;
  158. letter-spacing:1px; /* change the letter spacing */
  159. text-transform:uppercase; /* can be uppercase, lowercase, none*/
  160. color:#fff; /* change the text color */
  161. z-index:999999;
  162. }
  163.  
  164. a{
  165. text-decoration:none;
  166. color:{color:second accent};
  167. }
  168.  
  169. a:hover{
  170. color:{color:third accent};
  171. }
  172.  
  173. blockquote blockquote{
  174. padding-left:5px;
  175. border-left:1px solid {color:third accent};
  176. }
  177.  
  178. #container{
  179. margin:0 auto;
  180. width:780px;
  181. top:0;
  182. }
  183.  
  184. #header{
  185. width:780px;
  186. height:220px;
  187.  
  188. {block:iffixedheader}
  189. position:fixed;
  190. z-index:99;
  191. top:0;
  192. {/block:iffixedheader}
  193.  
  194. background:{color:headerbg} url('{image:header}');
  195.  
  196. {block:PermalinkPage}
  197. display:none;
  198. {/block:PermalinkPage}
  199. }
  200.  
  201. #navbar{
  202. width:760px;
  203. padding:10px;
  204. height:40px;
  205. background:#fff;
  206.  
  207. z-index:99;
  208.  
  209. {block:iffixedheader}
  210. top:220px;
  211. position:fixed;
  212. {/block:iffixedheader}
  213.  
  214. {block:PermalinkPage}
  215. top:0;
  216. position:fixed;
  217. {/block:PermalinkPage}
  218. }
  219.  
  220. #bart{
  221. width:120px;
  222. background:{color:first accent};
  223. float:left;
  224. height:1px;
  225. margin-top:20px;
  226. margin-right:10px;
  227. }
  228.  
  229. #blogtitle{
  230. font-family:karla;
  231. font-size:20px;
  232. margin-top:10px;
  233. line-height:100%;
  234. }
  235.  
  236. #desc{
  237. width:210px;
  238. height:100px;
  239. background:{color:descbg};
  240. position:fixed;
  241. top:20px;
  242. margin-left:800px;
  243. padding:10px;
  244. text-transform:lowercase;
  245. text-align:justify;
  246. }
  247.  
  248. #custlinkbar{
  249. width:210px;
  250. position:fixed;
  251. height:40px;
  252. padding:10px;
  253. margin-left:800px;
  254. top:160px;
  255. background:#fff;
  256. }
  257.  
  258. #navcont{
  259. width:290px;
  260. position:absolute;
  261. margin-left:545px;
  262. margin-top:-32px;
  263. }
  264.  
  265. .navlink a{
  266. display:inline-block;
  267. margin-right:10px;
  268. background:{color:first accent};
  269. color:#fff;
  270. line-height:100%;
  271. height:15px;
  272. width:15px;
  273. padding:15px;
  274. text-align:center;
  275. font-size:15px;
  276. }
  277.  
  278. .custlink a{
  279. display:inline-block;
  280. width:14px;
  281. height:14px;
  282. padding:14px;
  283. background:{color:second accent};
  284. color:#fff;
  285. font-size:14px;
  286. text-align:center;
  287. line-height:100%;
  288. margin-left:5px;
  289. margin-right:5px;
  290. }
  291.  
  292. #mcontainer{
  293. width:780px;
  294.  
  295. {block:indexpage}
  296. {block:iffixedheader}
  297. margin-top:350px;
  298. {/block:iffixedheader}
  299. {/block:indexpage}
  300.  
  301. {block:PermalinkPage}
  302. margin-top:150px;
  303. {/block:PermalinkPage}
  304. }
  305.  
  306. .post{
  307. background:{color:postbg};
  308. padding:15px;
  309.  
  310. {block:if500px}
  311. width:500px;
  312. margin-left:100px;
  313. {/block:if500px}
  314.  
  315. {block:if540px}
  316. width:540px;
  317. margin-left:80px;
  318. {/block:if540px}
  319.  
  320. margin-bottom:90px;
  321. word-wrap:break-word;
  322. position:relative;
  323. margin-top:65px;
  324.  
  325. }
  326.  
  327. .cap{
  328. word-wrap:break-word;
  329. }
  330.  
  331. .post img, .cap img{
  332. max-width:100%;
  333. }
  334.  
  335. .cap b, strong{
  336. color:{color:first accent};
  337. }
  338.  
  339. .cap i, em{
  340. color:{color:second accent};
  341. }
  342.  
  343. .title{
  344. font-family:karla;
  345. font-size:20px;
  346. text-transform:uppercase;
  347. display:block;
  348. padding-left:10px;
  349. border-left:3px solid {color:first accent};
  350. font-weight:700;
  351. }
  352.  
  353. #quote{
  354. font-family:karla;
  355. font-size:20px;
  356. text-align:center;
  357. text-transform:lowercase;
  358. font-style:italic;
  359. }
  360.  
  361. #source{
  362. display:inline-block;
  363. font-size:14px;
  364. padding-top:5px;
  365. border-top:3px solid {color:second accent};
  366.  
  367. {block:if500px}
  368. margin-top:10px;
  369. {/block:if500px}
  370.  
  371. {block:if540px}
  372. margin-top:20px;
  373. {/block:if540px}
  374. }
  375.  
  376. .chat li{
  377. list-style-type:none !important;
  378. padding:8px;
  379. margin-left:-40px;
  380. margin-top:4px;
  381. margin-bottom:2px;
  382. font-family:karla;
  383. }
  384.  
  385. .line_odd .label{
  386. font-weight:700;
  387. color:{color:second accent};
  388. }
  389.  
  390. .line_even .label{
  391. font-weight:700;
  392. color:{color:third accent};
  393. }
  394.  
  395. #link{
  396. padding:8px;
  397. background:{color:second accent};
  398. color:#fff;
  399. display:inline-block;
  400. font-family:karla;
  401. font-size:20px;
  402. text-transform:uppercase;
  403. }
  404.  
  405. .postavatar{
  406. width:64px;
  407. height:64px;
  408. position:absolute;
  409. left:-80px;
  410. top:0;
  411. border-radius:5px;
  412. background:#fff;
  413. }
  414.  
  415. .postavatar img{
  416. max-width:64px;
  417. max-height:64px;
  418. border-radius:5px;
  419. }
  420.  
  421. #tagcont{
  422. position:absolute;
  423. display:block;
  424. bottom:-50px;
  425. left:0;
  426. white-space:nowrap;
  427. overflow-x:scroll;
  428. {block:if500px}
  429. width:450px;
  430. max-width:450px;
  431. {/block:if500px}
  432.  
  433. {block:if540px}
  434. width:490px;
  435. max-width:490px;
  436. {/block:if540px}
  437. }
  438.  
  439. #tagcont::-webkit-scrollbar{
  440. width:1px;
  441. }
  442.  
  443.  
  444. .tag a{
  445. display:inline-block;
  446. padding:5px;
  447. margin-right:5px;
  448. background:{color:third accent};
  449. color:#fff;
  450. font-family:karla;
  451. text-transform:uppercase;
  452. font-size:10px;
  453. }
  454.  
  455. .ptype{
  456. position:absolute;
  457. background:{color:postbg};
  458. width:20px;
  459. height:20px;
  460. top:0;
  461. {block:if500px}
  462. left:540px;
  463. {/block:if500px}
  464.  
  465. {block:if540px}
  466. left:580px;
  467. {/block:if540px}
  468.  
  469. padding:5px;
  470. font-size:15px;
  471. color:{color:second accent};
  472. text-align:center;
  473. }
  474.  
  475. .pinfo{
  476. position:absolute;
  477. width:90px;
  478. height:20px;
  479. padding:5px;
  480. background:{color:first accent};
  481.  
  482. {block:if500px}
  483. left:570px;
  484. {/block:if500px}
  485.  
  486. {block:if540px}
  487. left:610px;
  488. {/block:if540px}
  489.  
  490. top:40px;
  491. text-align:center;
  492. color:#fff;
  493. font-family:karla;
  494. text-transform:uppercase;
  495. opacity:0;
  496. transition:.5s linear;
  497. }
  498.  
  499. .pinfo a{
  500. color:#fff;
  501. }
  502.  
  503. .post:hover .pinfo{
  504. opacity:1;
  505. }
  506.  
  507. .ctrcont{
  508. width:120px;
  509. position:absolute;
  510. bottom:-40px;
  511. {block:if500px}
  512. left:461px;
  513. {/block:if500px}
  514.  
  515. {block:if540px}
  516. left:501px;
  517. {/block:if540px}
  518. }
  519.  
  520. svg {
  521. width:10px;
  522. height:auto;
  523. opacity:.5;
  524. padding:1px;
  525. display:block;
  526. overflow:visible;
  527. }
  528.  
  529. .controls a {
  530. position:relative;
  531. display:inline-block;
  532. overflow:hidden;
  533. padding:10px;
  534. width:12px;
  535. height:12px;
  536. margin-right:5px;
  537. background:#fff;
  538. }
  539.  
  540. .controls .reblog {
  541. opacity:.93;
  542. }
  543. .controls .reblog svg {
  544. width:9px;
  545. margin-top:1px;
  546. }
  547.  
  548. .controls .like .liked + svg {
  549. opacity:1;
  550. }
  551.  
  552. .controls .like .liked + svg path {
  553. fill:#ec5a5a;
  554. }
  555.  
  556. .controls .like .like_button {
  557. position:relative;
  558. }
  559.  
  560. .controls .like .like_button iframe {
  561. position:absolute;
  562. top:0;
  563. left:0;
  564. bottom:0;
  565. right:0;
  566. z-index:2;
  567. opacity:0;
  568. }
  569.  
  570. {block:ifnotfixedheader}
  571.  
  572. .scrolltop{
  573. width:20px;
  574. height:20px;
  575. background:#fff;
  576. position:fixed;
  577. bottom:20px;
  578. right:10px;
  579. padding:10px;
  580. text-align:center;
  581. display:none;
  582. transition:.5s linear;
  583. font-size:15px;
  584. }
  585.  
  586. .scrolltop:hover{
  587. background:{color:second accent};
  588. color:#fff;
  589. }
  590.  
  591. {/block:ifnotfixedheader}
  592.  
  593. .playbutton{
  594. position:absolute;
  595. overflow:hidden;
  596. width:33px;
  597. height:30px;
  598. z-index:3;
  599. margin-top:45px;
  600. margin-left:43px;
  601. }
  602.  
  603. .audioinfo{
  604. text-transform:uppercase;
  605. font-family:karla;
  606. margin-left:130px;
  607. position:relative;
  608. margin-top:-115px;
  609. height:85px;
  610. padding:10px;
  611. }
  612.  
  613. .aulabel{
  614. display:inline-block;
  615. min-width:40px;
  616. background:{color:third accent};
  617. color:#fff;
  618. font-family:karla;
  619. text-transform:uppercase;
  620. font-weight:700;
  621. text-align:center;
  622. padding:3px;
  623. margin-right:10px;
  624. margin-bottom:10px;
  625. }
  626.  
  627. .albumart{
  628. width:120px;
  629. height:120px;
  630. margin-top:-10px;
  631. position:relative;
  632. background:{color:first accent} url('https://static.tumblr.com/wdp3vza/l99oz1mko/albumbg.png');
  633. }
  634.  
  635. .albumart img{
  636. width:120px;
  637. height:120px;
  638. }
  639.  
  640. .reblogcont{
  641. position:absolute;
  642. top:70px;
  643. left:-80px;
  644. }
  645.  
  646. .reblogcont a{
  647. display:inline-block;
  648. margin-right:5px;
  649. background:{color:first accent};
  650. color:#fff;
  651. padding:4px;
  652. text-align:center;
  653. font-family:karla;
  654. text-transform:uppercase;
  655. }
  656.  
  657. .qbox{
  658. border:1px solid {color:third accent};
  659. padding:20px;
  660. font-family:karla;
  661. text-transform:lowercase;
  662. }
  663.  
  664. .qt{
  665. text-align:center;
  666. }
  667.  
  668. #asker{
  669. position:relative;
  670. margin:-10px;
  671. margin-bottom:30px;
  672. text-align:center;
  673. }
  674.  
  675. #sender{
  676. float:left;
  677. width:50px;
  678. padding:4px;
  679. background:{color:second accent};
  680. color:#fff;
  681. margin-right:5px;
  682. }
  683.  
  684. .ask a{
  685. min-width:20px;
  686. position:absolute;
  687. padding:3px;
  688. left:58px;
  689. border:1px solid {color:second accent};
  690. }
  691.  
  692. #pagcont{
  693. width:210px;
  694. background:#fff;
  695. height:20px;
  696. padding:10px;
  697. margin-left:800px;
  698. top:240px;
  699. position:fixed;
  700. }
  701.  
  702. #pagin{
  703. width:170px;
  704. margin-left:20px;
  705. position:absolute;
  706. height:20px;
  707. font-family:karla;
  708. text-align:center;
  709. }
  710.  
  711. div.pnotes{
  712. {block:if500px}
  713. width:470px;
  714. {/block:if500px}
  715.  
  716. {block:if540px}
  717. width:510px;
  718. {/block:if540px}
  719.  
  720. background:{color:postbg};
  721. padding:15px;
  722. margin-top:20px;
  723. }
  724.  
  725. .tumblr_parent{
  726. margin-left:-1px;
  727. height:auto;
  728. }
  729.  
  730. a.tumblr_blog{
  731. font-weight:700;
  732. border-bottom:2px solid {color:second accent};
  733. text-transform:uppercase;
  734. padding-bottom:5px;
  735. }
  736.  
  737. div.pnotes::-webkit-scrollbar{
  738. display:none !important;
  739. }
  740.  
  741. ol.notes{
  742. list-style-type:none !important;
  743. padding:8px;
  744. }
  745.  
  746. ol.notes li.note{
  747. top:0;
  748. padding-bottom:10px;
  749. }
  750.  
  751. .pnotes img.avatar{
  752. float:left;
  753. margin-right:10px;
  754. }
  755.  
  756. .pnotes a{
  757. font-family:consolas;
  758. text-transform:uppercase;
  759. }
  760. </style>
  761.  
  762. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  763. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  764.  
  765. </head>
  766.  
  767. <body>
  768. <div id="container">
  769. <div id="header">
  770. </div><!--end header-->
  771. <div id="navbar">
  772. <div id="bart"></div><div id="blogtitle">{Title}</div>
  773. <div id="navcont">
  774. <div class="navlink">
  775. <a href="/" title="home"><i class="fa fa-home"></i></a>
  776.  
  777. <a href="/ask" title="message"><i class="fa fa-envelope"></i></a>
  778. <a href="/archive" title="grid"><i class="fa fa-th-large"></i></a>
  779. <a href="https://kuzuriha.tumblr.com" title="theme by kuzuriha"><i class="fa fa-code"></i></a>
  780. </div>
  781. </div>
  782. </div>
  783.  
  784. <div id="desc">{Description}</div>
  785.  
  786. <div id="custlinkbar">
  787. <div class="custlink">{block:ifLink1}<a href="{text:Link1URL}" title="{text:Link1}"><i class="fa fa-star"></i></a>{/block:ifLink1}
  788.  
  789. {block:ifLink2}<a href="{text:Link2URL}" title="{text:Link2}"><i class="fa fa-tree"></i></a>{/block:ifLink2}
  790.  
  791. {block:ifLink3}<a href="{text:Link3URL}" title="{text:Link3}"><i class="fa fa-umbrella"></i></a>{/block:ifLink3}
  792.  
  793. {block:ifLink4}<a href="{text:Link4URL}" title="{text:Link4}"><i class="fa fa-cube"></i></a>{/block:ifLink4}</div>
  794. </div>
  795.  
  796. {block:indexpage}
  797. <div id="pagcont">
  798. <div id="pagin">
  799.  
  800.  
  801. {block:Pagination}
  802. {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}
  803. <span class="current_page"> {CurrentPage}</span> of {TotalPages}
  804. {block:NextPage}<a href="{NextPage}">→</a>{/block:NextPage}
  805. {/block:Pagination}
  806.  
  807. </div>
  808. </div>
  809. {/block:indexpage}
  810.  
  811. <div id="mcontainer">
  812. {block:Posts}
  813.  
  814. <div class="post" id="{PostID}">
  815. {block:Text}
  816. {block:Title}<div class="title">{Title}</div>{/block:Title}
  817. <div class="cap">{Body}</div>
  818. {block:IndexPage}<div class="ptype"><i class="fa fa-bullhorn"></i></div>
  819. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  820. {/block:Text}
  821.  
  822. {block:Photo}
  823. {LinkOpenTag}
  824. <img src="{PhotoURL-HighRes}"/>
  825. {LinkCloseTag}
  826. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  827. {block:IndexPage}<div class="ptype"><i class="fa fa-photo"></i></div>
  828. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  829. {/block:Photo}
  830.  
  831. {block:Photoset}
  832. <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>
  833.  
  834. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  835. {block:IndexPage}<div class="ptype"><i class="fa fa-photo"></i></div>
  836. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  837. {/block:Photoset}
  838.  
  839. {block:Video}
  840. {block:if540px}
  841. <div class="video">{Video-500}</div>
  842. {/block:if540px}
  843.  
  844. {block:if500px}
  845. {Video-500}
  846. {/block:if500px}
  847.  
  848. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  849. {block:IndexPage}<div class="ptype"><i class="fa fa-video-camera"></i></div>
  850. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  851. {/block:Video}
  852.  
  853. {block:Quote}
  854. <div class="cap">
  855. <div id="quote"><i class="fa fa-quote-left" style="position:absolute; opacity:.3; font-size:40px; margin-top:-5px;margin-left:-5px;"></i>{Quote}</div>
  856. {block:Source}<div id="source">{Source}</div>{/block:Source}
  857. </div>
  858. {block:IndexPage}<div class="ptype"><i class="fa fa-comment"></i></div>
  859. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  860. {/block:Quote}
  861.  
  862. {block:Link}
  863. <a href="{URL}"><div id="link">{Name} →</div></a>
  864. {block:Description}<div class="cap">{Description}</div>{/block:Description}
  865. {block:IndexPage}<div class="ptype"><i class="fa fa-link"></i></div>
  866. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  867. {/block:Link}
  868.  
  869. {block:Chat}
  870. {block:Title}<div class="title">{Title}</div>{/block:Title}
  871. <div class="cap">
  872. <ul class="chat">
  873. {block:Lines}
  874. <li class="line_{Alt}"><span class="label">{block:Label}{Label}{/block:Label}</span> {Line}
  875. {/block:Lines}
  876. </li>
  877. </ul>
  878. </div>
  879.  
  880. {block:IndexPage}<div class="ptype"><i class="fa fa-comments"></i></div>
  881. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  882. {/block:Chat}
  883.  
  884. {block:Audio}
  885.  
  886. {block:AudioPlayer}
  887. <div class="playbutton">{AudioPlayerWhite}</div>
  888. {/block:AudioPlayer}
  889.  
  890. {block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  891.  
  892. <div class="audioinfo">
  893. {block:TrackName}<div class="aulabel">Title</div> {TrackName}{/block:TrackName}
  894. <br>
  895. {block:Artist}<div class="aulabel">by</div> {Artist}{/block:Artist}
  896. <br>
  897. {block:PlayCount}<div class="aulabel">plays</div> {PlayCount}{/block:PlayCount}
  898. </div>
  899.  
  900. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  901.  
  902. {block:IndexPage}<div class="ptype"><i class="fa fa-headphones"></i></div>
  903. <div class="postavatar"><img src="{PortraitURL-64}"/></div>{/block:IndexPage}
  904. {/block:Audio}
  905.  
  906. {block:Answer}
  907. <div class="qbox">
  908. <div id="asker"><div id="sender">from:</div> <div class="ask">{Asker}</div></div>
  909. <div class="qt">
  910. {Question}</div>
  911. </div>
  912.  
  913. <div class="cap">
  914. {Answer}
  915. </div>
  916.  
  917. {block:IndexPage}<div class="ptype"><i class="fa fa-question"></i></div>
  918. <div class="postavatar"><img src="{Favicon}"/></div>{/block:IndexPage}
  919. {/block:Answer}
  920.  
  921. {block:IndexPage}
  922. {block:Date}
  923.  
  924. <div class="ptype" style="top: 40px;"><i class="fa fa-clock-o"></i></div>
  925.  
  926. <div class="pinfo"><a href="{Permalink}">{ShortDayOfWeek}, {DayOfMonth}.{MonthNumber} '{ShortYear}</a></div>
  927. <div class="ptype" style="top:80px;"><i class="fa fa-paper-plane"></i></div>
  928. <div class="pinfo" style="top:80px;">{NoteCountWithLabel}</div>
  929. <div class="ctrcont">
  930. <div class="controls">
  931. <a href="{ReblogURL}" target="_blank" class="reblog">
  932. <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333 c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5 s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733 C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617 c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6 c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg>
  933. </a>
  934. <a href="#" class="like">{LikeButton}
  935. <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95 c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1 c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1 c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4 c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5 c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767 c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45 c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg>
  936. </a>
  937. </div>
  938. </div><!--end ctrcont-->
  939. {/block:Date}
  940.  
  941. {block:RebloggedFrom}
  942. <div class="reblogcont">
  943. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> <a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>
  944. </div>
  945. {/block:RebloggedFrom}
  946.  
  947. {/block:IndexPage}
  948.  
  949.  
  950. {block:ContentSource}
  951. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  952. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  953. {/block:SourceLogo}
  954. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  955. {/block:ContentSource}
  956.  
  957.  
  958.  
  959. {block:IndexPage}
  960. {block:HasTags}
  961. <div id="tagcont">
  962. <div class="tag">{block:Tags}<a href="{TagURL}">{Tag}</a>
  963. {/block:Tags}</div>
  964. </div>
  965. {/block:HasTags}
  966. {/block:IndexPage}
  967.  
  968. {block:PermalinkPage}
  969. {block:PostNotes}
  970. <div class="pnotes">
  971. <ol class="notes">{PostNotes}</ol>
  972. </div>
  973. {/block:PostNotes}
  974. </div>
  975. {/block:PermalinkPage}
  976.  
  977.  
  978. </div><!--end mcontainer-->
  979. {/block:Posts}
  980.  
  981. </div><!--end container-->
  982.  
  983. {block:ifnotfixedheader}
  984. <a href="#" class ="scrolltop"><i class="fa fa-arrow-up"></i></a>
  985. {/block:ifnotfixedheader}
  986.  
  987. <!--unnest-->
  988. <script src="https://static.tumblr.com/wdp3vza/sstot11wg/unnest.min.js"></script>
  989. <script>
  990. $(document).ready(function(){
  991. $('.post').unnest({
  992. yourCaption: ".cap",
  993. wrapName: ".tumblr_parent",
  994. newCaptionUsername: false,
  995. originalPostCaptionUsername: false,
  996. tumblrAvatars: false,
  997. tumblrAvatarClass: ".tumblr_avatar",
  998. usernameColon: false
  999. });
  1000. });
  1001.  
  1002. //pxu script
  1003. $(document).ready(function(){
  1004. $('.photo-slideshow').pxuPhotoset({
  1005. lightbox: true,
  1006. rounded: false,
  1007. gutter: '5px',
  1008. borderRadius: '0px',
  1009. photoset: '.photo-slideshow',
  1010. photoWrap: '.photo-data',
  1011. photo: '.pxu-photo'
  1012. });
  1013. });
  1014. </script>
  1015.  
  1016. {block:ifnotfixedheader}
  1017. {block:indexpage}
  1018. <script type="text/javascript">
  1019. $(function(){
  1020. var stickyRibbonTop = $('#navbar').offset().top;
  1021. $(window).scroll(function(){
  1022. if( $(window).scrollTop() > stickyRibbonTop ) {
  1023. $('#navbar').css({position: 'fixed', top: '0px'});
  1024. } else {
  1025. $('#navbar').css({position: 'relative'});
  1026. }
  1027. });
  1028. });
  1029.  
  1030. $(document).ready(function(){
  1031.  
  1032. //Check to see if the window is top if not then display button
  1033. $(window).scroll(function(){
  1034. if ($(this).scrollTop() > 100) {
  1035. $('.scrolltop').fadeIn();
  1036. } else {
  1037. $('.scrolltop').fadeOut();
  1038. }
  1039. });
  1040.  
  1041. //Click event to scroll to top
  1042. $('.scrolltop').click(function(){
  1043. $('html, body').animate({scrollTop : 0},800);
  1044. return false;
  1045. });
  1046.  
  1047. });
  1048.  
  1049. </script>{/block:indexpage}
  1050. {/block:ifnotfixedheader}
  1051. </body>
  1052. </html>
Advertisement
Add Comment
Please, Sign In to add comment