API tools faq
paste
Advertisement
alydae

bibliophile - one sidebar blog theme

alydae
Dec 25th, 2016 (edited)
3,928
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.89 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!--
  5.  
  6. BIBLIOPHILE - ONE SIDEBAR
  7. by alydae
  8.  
  9. released: december 26, 2016
  10. last updated: november 19, 2024
  11.  
  12. - this theme DOES support npf posts/new post type.
  13. it may look weird in the customise panel
  14. but it will be fine once you exit and view your blog.
  15.  
  16. - do not steal any part of this code
  17. - do not even TOUCH the credit
  18. - direct questions to enchantedthemes.tumblr.com
  19.  
  20. please read the customisation guide before editing this theme
  21. http://enchantedthemes.tumblr.com/bibliophile/guide
  22.  
  23. this version is coded to be a personal blog.
  24. if you want to use it as a fansite, instructions are in the guide below - there are areas that need to be changed for it to work.
  25.  
  26. to edit the sidebars, find 'editing the sidebar'
  27.  
  28. thank you for using!!!
  29.  
  30. -->
  31.  
  32. <title>{block:PostSummary}{PostSummary} - {/block:PostSummary}{block:TagPage}#{Tag} - {/block:TagPage}{Title}</title>
  33. <link rel="shortcut icon" href="{Favicon}">
  34.  
  35. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  36. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  37.  
  38. <meta name="color:background" content="#fafafa"/>
  39. <meta name="color:posts" content="#ffffff"/>
  40. <meta name="color:text" content="#666666"/>
  41. <meta name="color:links" content="#222222"/>
  42. <meta name="color:links hover" content="#bad0f1"/>
  43. <meta name="color:title" content="#000000"/>
  44. <meta name="color:accent" content="#222222"/>
  45. <meta name="color:border" content="#eeeeee"/>
  46.  
  47. <meta name="color:blog title" content="#000000"/>
  48. <meta name="color:navi background" content="#eeeeee"/>
  49. <meta name="color:navi border" content="#dddddd"/>
  50. <meta name="color:header background" content="#ffffff"/>
  51. <meta name="color:topbar background" content="#eeeeee"/>
  52. <meta name="color:topbar border" content="#dddddd"/>
  53.  
  54. <meta name="image:header" content=""/>
  55.  
  56. <meta name="select:font size" content="10px"/>
  57. <meta name="select:font size" content="11px"/>
  58. <meta name="select:font size" content="12px"/>
  59.  
  60. <meta name="select:font" content="Open Sans"/>
  61. <meta name="select:font" content="Karla"/>
  62. <meta name="select:font" content="Lato"/>
  63. <meta name="select:font" content="Roboto"/>
  64.  
  65. <meta name="select:post width" content="400px"/>
  66. <meta name="select:post width" content="450px"/>
  67. <meta name="select:post width" content="500px"/>
  68. <meta name="select:post width" content="540px"/>
  69.  
  70. <meta name="select:margin" content="25px"/>
  71. <meta name="select:margin" content="50px"/>
  72. <meta name="select:margin" content="75px"/>
  73.  
  74. <meta name="if:hide header on index" content=""/>
  75. <meta name="if:show header on permalink" content=""/>
  76. <meta name="if:show controls on index" content=""/>
  77. <meta name="if:hide tags on index" content=""/>
  78. <meta name="if:scroll to top" content=""/>
  79. <meta name="if:infinite scroll" content=""/>
  80. <meta name="if:load more" content=""/>
  81.  
  82. <meta name="if:search bar" content=""/>
  83. <meta name="if:manual members" content=""/>
  84. <meta name="if:automatic members" content=""/>
  85.  
  86. <meta name="text:link 1 title" content="link 1"/>
  87. <meta name="text:link 1 url" content=""/>
  88. <meta name="text:link 2 title" content="link 2"/>
  89. <meta name="text:link 2 url" content=""/>
  90. <meta name="text:link 3 title" content="link 3"/>
  91. <meta name="text:link 3 url" content=""/>
  92. <meta name="text:link 4 title" content="link 4"/>
  93. <meta name="text:link 4 url" content=""/>
  94. <meta name="text:link 5 title" content="link 5"/>
  95. <meta name="text:link 5 url" content=""/>
  96. <meta name="text:link 6 title" content="link 6"/>
  97. <meta name="text:link 6 url" content=""/>
  98.  
  99. <link href=“//use.fontawesome.com/releases/v6.5.1/css/all.css” rel=“stylesheet”>
  100. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  101.  
  102. <!-- custom font -->
  103.  
  104. <link href="https://fonts.googleapis.com/css?family={select:font}:300,400,600,700,300italic,400italic,600italic,700italic" rel="stylesheet" type="text/css">
  105.  
  106.  
  107. <style type="text/css">
  108. html { background-color:{color:background}!important; }
  109. body { background-color:{color:background}!important; }
  110.  
  111.  
  112. @keyframes fadein {
  113. from { opacity:0; }
  114. to { opacity:1; }
  115. }
  116.  
  117. @-moz-keyframes fadein {
  118. from { opacity:0; }
  119. to { opacity:1; }
  120. }
  121.  
  122. @-webkit-keyframes fadein {
  123. from { opacity:0; }
  124. to { opacity:1; }
  125. }
  126.  
  127. @-ms-keyframes fadein {
  128. from { opacity:0; }
  129. to { opacity:1; }
  130. }
  131.  
  132. @-o-keyframes fadein {
  133. from { opacity:0; }
  134. to { opacity:1; }
  135. }
  136.  
  137.  
  138. /*-- selection --*/
  139.  
  140. ::-moz-selection { background:rgba({RGBcolor:links hover},0.1); color:{color:title}; }
  141. ::selection { background:rgba({RGBcolor:links hover},0.1); color:{color:title}; }
  142.  
  143. /*-- scrollbar --*/
  144.  
  145. ::-webkit-scrollbar { width:2px; height:8px; }
  146. ::-webkit-scrollbar-thumb { background-color:{color:accent}; }
  147. ::-webkit-scrollbar-thumb:horizontal { display:none!important; }
  148.  
  149. /*-- tooltips --*/
  150.  
  151. #s-m-t-tooltip {
  152. color:{color:text};
  153. background-color:{color:posts};
  154. border:1px solid {color:border};
  155. font-family:{select:font}, helvetica, sans-serif;
  156. letter-spacing:0.5px;
  157. text-transform:uppercase;
  158. text-align:center;
  159. position:absolute;
  160. padding:2px 7px 2px 7px;
  161. margin-top:30px;
  162. z-index:99999999!important;
  163. }
  164.  
  165. /*-- tumblr controls --*/
  166.  
  167. iframe.tmblr-iframe {
  168. z-index:9999999!important;
  169. top:60px!important;
  170. right:0!important;
  171. opacity:0;
  172. padding-right:43px;
  173. /* delete from here */
  174. filter:invert(1) hue-rotate(180deg);
  175. -webkit-filter:invert(1) hue-rotate(180deg);
  176. -o-filter:invert(1) hue-rotate(180deg);
  177. -moz-filter:invert(1) hue-rotate(180deg);
  178. -ms-filter:invert(1) hue-rotate(180deg);
  179. /* to here if your blog has a dark background */
  180. transform:scale(0.6);
  181. transform-origin:100% 0;
  182. transition: opacity 0.6s ease-in-out;
  183. -moz-transition: opacity 0.6s ease-in-out;
  184. -webkit-transition: opacity 0.6s ease-in-out;
  185. -webkit-transform:scale(0.6);
  186. -webkit-transform-origin:100% 0;
  187. -o-transform:scale(0.6);
  188. -o-transform-origin:100% 0;
  189. -moz-transform:scale(0.6);
  190. -moz-transform-origin:100% 0;
  191. -ms-transform:scale(0.6);
  192. -ms-transform-origin:100% 0;
  193. }
  194.  
  195. iframe.tmblr-iframe:hover { opacity:0.4!important; }
  196.  
  197. /*-- lightbox --*/
  198.  
  199. #tumblr_lightbox, .tmblr-lightbox {
  200. background-color:{color:background}!important;
  201. z-index:999999!important;
  202. }
  203.  
  204. #vignette, .vignette { opacity:0; }
  205.  
  206. #tumblr_lightbox img, .lightbox-image {
  207. box-shadow:none!important;
  208. border-radius:0!important;
  209. }
  210.  
  211. #tumblr_lightbox_caption, .lightbox-caption { visibility:hidden; }
  212.  
  213.  
  214. /*-- general customisation --*/
  215.  
  216. a, a:hover, .links i, .links i:hover, .like_button:hover + svg, .info i, .info i:hover, .hnavi, div.npf-link-block .poster .title, div.npf-link-block .bottom .site-name {
  217. transition-duration: 0.6s;
  218. -moz-transition-duration: 0.6s;
  219. -webkit-transition-duration: 0.6s;
  220. -o-transition-duration: 0.6s
  221. }
  222.  
  223. body {
  224. color:{color:text};
  225. background-color:{color:background};
  226. font-style:normal;
  227. font-family:{select:font}, helvetica, sans-serif;
  228. font-size:{select:font size};
  229. font-weight:400;
  230. text-decoration:none;
  231. line-height:180%;
  232. margin:0;
  233. overflow-x:overflow;
  234. word-wrap: break-word;
  235. -moz-osx-font-smoothing: grayscale;
  236. -webkit-font-smoothing: antialiased;
  237. font-smoothing: antialiased;
  238. -webkit-animation: fadein 1.5s;
  239. -moz-animation: fadein 1.5s;
  240. -o-animation: fadein 1.5s;
  241. animation: fadein 1.5s;
  242. }
  243.  
  244. a {
  245. text-transform:lowercase;
  246. text-decoration:none;
  247. color:{color:links};
  248. }
  249.  
  250. a:hover { color:{color:links hover}; cursor:pointer; }
  251. a.tumblr_blog b:hover, b a:hover { color:{color:links hover}; }
  252. .c a { border-bottom:1px solid {color:border}; }
  253. a.post_media_photo_anchor, .npf-link-block a { border-bottom:none!important; }
  254.  
  255. i, em { font-style:italic; }
  256. b, strong { color:{color:title}; font-weight:600; }
  257.  
  258. small { font-size:calc({select:font size} - 0.5px); }
  259. big { font-size:calc({select:font size} + 1px); }
  260.  
  261. blockquote {
  262. padding-left:10px;
  263. margin-left:0px;
  264. border-left:1px solid {color:border};
  265. width:95%;
  266. word-wrap:break-word;
  267. }
  268.  
  269. h1, h2, h3, h4, h5, h6, .poll-post .poll-question {
  270. text-transform:uppercase!important;
  271. text-align:left;
  272. font-weight:bold;
  273. font-size:calc({select:font size} + 2px);
  274. letter-spacing:1px;
  275. color:{color:title};
  276. }
  277.  
  278. h1 {
  279. padding-left:15px;
  280. {block:PermalinkPage}padding-top:5px;{/block:PermalinkPage}
  281. }
  282.  
  283. h1 a { text-transform:uppercase!important; }
  284.  
  285. pre {
  286. white-space: pre-wrap;
  287. white-space: -moz-pre-wrap;
  288. white-space: -pre-wrap;
  289. white-space: -o-pre-wrap;
  290. word-wrap: break-word;
  291. background-color:#fafafa;
  292. padding:5px;
  293. }
  294.  
  295.  
  296. /*-- top navigation/links --*/
  297.  
  298. #navi {
  299. top:0;
  300. left:0;
  301. width:100vw;
  302. height:50px;
  303. background:{color:navi background};
  304. border-bottom:1px solid {color:navi border};
  305. z-index:999!important;
  306. text-align:center;
  307. {block:IndexPage}
  308. position:relative;
  309. {block:ifhideheaderonindex}
  310. display:none!important;
  311. {/block:ifhideheaderonindex}
  312. {/block:IndexPage}
  313. {block:PermalinkPage}
  314. {block:ifnotshowheaderonpermalink}
  315. display:none;
  316. {/block:ifnotshowheaderonpermalink}
  317. {block:ifshowheaderonpermalink}
  318. position:relative!important;
  319. {/block:ifshowheaderonpermalink}
  320. {/block:PermalinkPage}
  321. }
  322.  
  323. #navi a, .hnavi a {
  324. padding:18px;
  325. line-height:50px;
  326. font-weight:600;
  327. font-size:12px;
  328. text-transform:lowercase!important;
  329. display:inline;
  330. margin-left:-3px;
  331. }
  332.  
  333. .hnavi {
  334. height:50px;
  335. {block:IndexPage}
  336. position:relative;
  337. {block:ifnothideheaderonindex}
  338. display:none;
  339. {/block:ifnothideheaderonindex}
  340. {block:ifhideheaderonindex}
  341. opacity:1!important;
  342. {/block:ifhideheaderonindex}
  343. {/block:IndexPage}
  344. {block:PermalinkPage}
  345. {block:ifnotshowheaderonpermalink}
  346. opacity:1!important;
  347. {/block:ifnotshowheaderonpermalink}
  348. {block:ifshowheaderonpermalink}
  349. display:none;
  350. {/block:ifshowheaderonpermalink}
  351. {/block:PermalinkPage}
  352. }
  353.  
  354. .hnavi a:hover { background:{color:accent}; color:{color:posts}; }
  355.  
  356. #navi a:empty, .hnavi a:empty { display:none; }
  357.  
  358.  
  359. /*-- header image --*/
  360.  
  361. #image {
  362. {block:IndexPage}
  363. position:relative;
  364. overflow:hidden;
  365. background-color:{color:header background};
  366. {block:ifhideheaderonindex}
  367. display:none!important;
  368. {/block:ifhideheaderonindex}
  369. {/block:IndexPage}
  370. {block:PermalinkPage}
  371. {block:ifnotshowheaderonpermalink}
  372. display:none;
  373. {/block:ifnotshowheaderonpermalink}
  374. {block:ifshowheaderonpermalink}
  375. position:relative;
  376. overflow:hidden;
  377. background-color:{color:header background};
  378. {/block:ifshowheaderonpermalink}
  379. {/block:PermalinkPage}
  380. z-index:99;
  381. }
  382.  
  383. #image img {
  384. height:350px;
  385. width:auto;
  386. margin-left:50%;
  387. transform:translateX(-50%);
  388. display:block;
  389. }
  390.  
  391.  
  392. /*-- topbar --*/
  393.  
  394. #topbar {
  395. position:relative;
  396. height:50px;
  397. width:100vw;
  398. background:{color:topbar background};
  399. border-top:1px solid {color:topbar border};
  400. border-bottom:1px solid {color:topbar border};
  401. z-index:999!important;
  402. }
  403.  
  404. .title {
  405. position:relative;
  406. float:left;
  407. line-height:45px;
  408. text-transform:lowercase;
  409. font-size:22px;
  410. letter-spacing:-1px;
  411. font-weight:700;
  412. margin-left:50px;
  413. margin-right:20px;
  414. color:{color:blog title};
  415. }
  416.  
  417. .links {
  418. position:absolute;
  419. top:0;
  420. right:50px;
  421. float:right;
  422. padding:0px;
  423. height:50px;
  424. }
  425.  
  426. .links img {
  427. height:30px;
  428. width:30px;
  429. border-radius:100%;
  430. margin:10px 0 -10px 0;
  431. float:right;
  432. }
  433.  
  434. .links a { display:inline; margin-left:15px; }
  435.  
  436. .links i, .links i:hover {
  437. line-height:100%;
  438. font-size:15px;
  439. width:15px;
  440. padding:7.5px;
  441. margin:10px 0;
  442. border-radius:100%;
  443. background-color:{color:accent};
  444. }
  445.  
  446. .links i { color:{color:posts}; }
  447. .links i:hover { color:{color:accent}; background-color:{color:posts}; }
  448.  
  449.  
  450. /*-- posts --*/
  451.  
  452. #entries {
  453. margin:{select:margin} auto;
  454. width:calc(200px + {select:margin} + {select:post width} + 30px);
  455. }
  456.  
  457. .posts {
  458. width:{select:post width};
  459. margin-left:calc(200px + {select:margin} + 30px);
  460. margin-bottom:{select:margin};
  461. background-color:{color:posts};
  462. border:1px solid {color:border};
  463. }
  464.  
  465. .posts ul li { list-style:none; margin-left:-20px; }
  466.  
  467. .posts ul li:before {
  468. content:"";
  469. display:inline-block;
  470. background:#ddd;
  471. margin-bottom:2px;
  472. width:20px;
  473. height:1px;
  474. margin-right:10px;
  475. }
  476.  
  477. .posts li, .posts blockquote, .posts img { max-width:100%; height:auto; }
  478.  
  479.  
  480. /*-- captions --*/
  481.  
  482. .c {
  483. padding:0px 15px 0px 15px;
  484. margin:0;
  485. }
  486.  
  487. .tumblr_parent {
  488. margin:0;
  489. padding-left:0px;
  490. border-left:none;
  491. width:100%;
  492. }
  493.  
  494. .tumblr_parent blockquote {
  495. margin-left:0px;
  496. padding-left:10px;
  497. border-left:1px solid {color:border};
  498. }
  499.  
  500. .tumblr_avatar {
  501. margin-right:10px;
  502. margin-bottom:-6px;
  503. width:20px;
  504. height:20px;
  505. border-radius:100%;
  506. }
  507.  
  508. img.tumblr_avatar + a.tumblr_blog {
  509. font-weight:600;
  510. line-height:100%;
  511. padding:5px;
  512. background:{color:background};
  513. border:1px solid {color:border};
  514. }
  515.  
  516. img.tumblr_avatar + a.tumblr_blog:hover { background:{color:posts}; }
  517.  
  518. .tumblr_parent:first-of-type a.tumblr_blog, .tumblr_parent:first-of-type img.tumblr_avatar { display:none; }
  519. .tumblr_parent { padding-top:10px; }
  520. .tumblr_parent:first-of-type { padding-top:0!important; }
  521.  
  522. .npf_photoset { margin-left:-15px; margin-right:-15px; }
  523. .npf_photoset .tmblr-full .npf_image { margin-bottom:-6px; }
  524.  
  525. a.tumblr_blog ~ .npf_photoset, a.tumblr_blog ~ figure { margin-top:15px; }
  526. .tumblr_parent:first-of-type a.tumblr_blog ~ .npf_photoset, .tumblr_parent:first-of-type a.tumblr_blog ~ figure { margin-top:0!important; }
  527.  
  528. .tmblr-full {
  529. margin-left:-15px;
  530. margin-right:-15px;
  531. margin-bottom:-6px;
  532. }
  533.  
  534. .tmblr-attribution {
  535. margin-top:-5px!important;
  536. margin-bottom:6px;
  537. padding:5px 10px;
  538. text-align:right;
  539. background:{color:background};
  540. }
  541.  
  542. .tmblr-attribution a {
  543. text-transform:lowercase;
  544. border:none!important;
  545. font-style:italic;
  546. }
  547.  
  548. .tmblr-attribution:after {
  549. content:'>';
  550. float:right;
  551. padding-left:7px;
  552. font-weight:700;
  553. display:inline;
  554. }
  555.  
  556. .tmblr-attribution:hover {
  557. background:{color:background};
  558. cursor:pointer;
  559. }
  560.  
  561. a.read_more {
  562. font-style:italic;
  563. margin-left:42%;
  564. font-weight:600;
  565. }
  566.  
  567. .poll-post .poll-question {
  568. font-size:calc({select:font size} + 4px);
  569. }
  570.  
  571. .poll-post a.poll-row {
  572. background-color:{color:accent};
  573. border-radius:5px;
  574. border:1px solid {color:border};
  575. color:{color:links};
  576. font-size:{select:font size};
  577. font-weight:400;
  578. padding:5px 10px;
  579. margin:0 0 7px;
  580. min-height:0px;
  581. text-transform:lowercase;
  582. }
  583.  
  584. .poll-post a.poll-row:hover, .poll-post .poll-see-results:hover {
  585. background-color:{color:background};
  586. color:{color:links hover};
  587. }
  588.  
  589. .poll-post .poll-see-results {
  590. font-weight:700;
  591. text-transform:uppercase;
  592. background-color:{color:accent};
  593. border-radius:5px;
  594. padding:5px 10px;
  595. margin:0 0 7px;
  596. letter-spacing:0.5px;
  597. border:1px solid {color:links hover};
  598. box-sizing: border-box;
  599. }
  600.  
  601. /*-- quote posts --*/
  602.  
  603. .quote, p.npf_quote {
  604. padding:10px;
  605. font-size:calc({select:font size} + 2px);
  606. font-style:italic;
  607. line-height:180%;
  608. text-align:center;
  609. }
  610.  
  611. .quotesource {
  612. text-align:right;
  613. padding-bottom:10px;
  614. padding-right:10px;
  615. }
  616.  
  617.  
  618. /*-- link posts --*/
  619.  
  620. .npf-link-block {
  621. border-radius:0px!important;
  622. margin-top:15px;
  623. border:none!important;
  624. }
  625.  
  626. .npf-link-block:hover, div.npf-link-block>a:hover, .npf-link-block:hover .title, .npf-link-block:hover .bottom .site-name { color:{color:links hover}!important; }
  627.  
  628. div.npf-link-block>a { border-bottom:none!important; }
  629.  
  630. .npf-link-block .poster { height:200px!important; border-bottom:none!important; }
  631.  
  632. .npf-link-block .title {
  633. color:#fff!important;
  634. font-family:{select:font}, helvetica, sans-serif;
  635. text-transform:uppercase!important;
  636. font-weight:700!important;
  637. font-size:calc({select:font size} + 2px)!important;
  638. font-style:normal;
  639. margin:0!important;
  640. letter-spacing:0.5px;
  641. line-height:180%;
  642. }
  643.  
  644. div.npf-link-block .poster .title {
  645. width:{text:post width}px;
  646. line-height:180%;
  647. background:none;
  648. border:none;
  649. text-align:center!important;
  650. }
  651.  
  652. div.npf-link-block .poster .title:before {
  653. font-family:'FontAwesome';
  654. font-size:calc({select:font size} + 2px)!important;
  655. margin-right:7px;
  656. content:"\f0c1";
  657. }
  658.  
  659. div.npf-link-block .poster .title:after {
  660. content:">>";
  661. margin-left:7px;
  662. }
  663.  
  664. div.npf-link-block.no-poster .title { color:{color:links}; padding-bottom:15px!important; }
  665.  
  666. div.npf-link-block .poster:before { opacity:0.2!important; }
  667.  
  668. .npf-link-block .bottom {
  669. background-color:{color:background};
  670. border:1px solid {color:border};
  671. }
  672.  
  673. .npf-link-block .bottom .description {
  674. margin:0;
  675. padding:0;
  676. border:none;
  677. text-transform:none;
  678. line-height:180%!important;
  679. font-size:{select:font size}!important;
  680. text-align:left;
  681. font-style:italic;
  682. }
  683.  
  684. .npf-link-block .bottom .site-name {
  685. font-size:calc({select:font size} - 2px)!important;
  686. font-weight:600!important;
  687. letter-spacing:0px!important;
  688. line-height:100%!important;
  689. margin-top:5px!important;
  690. opacity:1!important;
  691. color:{color:links}!important;
  692. }
  693.  
  694.  
  695. /*-- chat posts --*/
  696.  
  697. .chat { list-style:none; }
  698.  
  699. .line.odd { padding:10px; background:{color:background}; }
  700. .line.even { padding:10px; }
  701.  
  702. .label {
  703. text-transform:uppercase;
  704. font-weight:600;
  705. color:{color:accent};
  706. letter-spacing:1px;
  707. }
  708.  
  709.  
  710. /*-- audio posts --*/
  711.  
  712. .audio { background-color:#f2f2f2; padding:10px; }
  713.  
  714. .playbutton {
  715. width:30px;
  716. height:30px;
  717. position:relative;
  718. overflow:hidden;
  719. }
  720.  
  721. .playbox { position:absolute; padding:5px; }
  722.  
  723. .trackdetails {
  724. padding:10px;
  725. width:auto;
  726. height:auto;
  727. margin-left:55px;
  728. padding-left:10px;
  729. font-size:calc({select:font size} + 1px);
  730. }
  731.  
  732.  
  733. /* -- video posts --*/
  734.  
  735. .video.resized { overflow:hidden; }
  736.  
  737. .c .embed_iframe {
  738. width:{text:post width}px;
  739. height:calc(({text:post width}px / 9) * 5);
  740. }
  741.  
  742. iframe#youtube_iframe { margin-bottom:-5px!important; }
  743.  
  744.  
  745. /*-- ask posts --*/
  746.  
  747. .question {
  748. position:relative;
  749. margin-right:65px;
  750. margin-left:15px;
  751. padding:10px;
  752. height:auto;
  753. text-align:right;
  754. word-wrap:break-word;
  755. background:{color:background};
  756. border:1px solid {color:border};
  757. }
  758.  
  759. .question p { margin:0!important; }
  760.  
  761. .asker {
  762. position:relative;
  763. padding:10px 5px 5px 10px;
  764. text-align:right;
  765. text-transform:lowercase;
  766. font-style:italic;
  767. }
  768.  
  769. .asker a { padding-right:0px; }
  770.  
  771. .aicon {
  772. position:relative;
  773. padding:15px;
  774. float:right;
  775. }
  776.  
  777. .aicon img {
  778. width:35px;
  779. border-radius:50%;
  780. z-index:999!important;
  781. }
  782.  
  783. .answer { margin-top:0px; }
  784.  
  785.  
  786. /*-- top post info --*/
  787.  
  788. .topinfo { padding:10px; border-bottom:1px solid {color:border}; }
  789.  
  790. .topinfo img {
  791. height:35px;
  792. width:35px;
  793. border-radius:100%!important;
  794. position:absolute;
  795. margin-left:-27.5px;
  796. margin-right:10px;
  797. }
  798.  
  799. .toptext {
  800. margin:-10px 20px;
  801. position:relative;
  802. line-height:55px;
  803. font-size:calc({select:font size} + 1px);
  804. width:calc({select:post width} - 20px - 25px)
  805. }
  806.  
  807. .pinned { display:inline; font-weight:600; }
  808.  
  809.  
  810. /*-- bottom post info --*/
  811.  
  812. .info {
  813. padding:10px 3px 7px 10px;
  814. text-transform:none;
  815. border-top:1px solid {color:border};
  816. margin-top:0px;
  817. background-color:{color:topbar background};
  818. }
  819.  
  820. .info img {
  821. height:20px;
  822. width:20px;
  823. border-radius:100%;
  824. margin-right:10px;
  825. position:relative;
  826. }
  827.  
  828. .dtext {
  829. margin-left:0px;
  830. margin-top:0px;
  831. position:relative;
  832. background-color:{color:posts};
  833. padding:3px 5px 3px;
  834. {block:ifnotshowcontrolsonindex}
  835. width:calc({select:post width} - 30px);
  836. {/block:ifnotshowcontrolsonindex}
  837. {block:ifshowcontrolsonindex}
  838. width:calc({select:post width} - 30px - 47px);
  839. {block:ifshowcontrolsonindex}
  840. {block:PermalinkPage}
  841. width:calc({select:post width} - 30px - 47px);
  842. {block:PermalinkPage}
  843. border:1px solid {color:border};
  844. }
  845.  
  846. .info i {
  847. font-size:12px;
  848. margin-right:7px;
  849. margin-top:-18px;
  850. float:right;
  851. position:relative;
  852. color:{color:accent};
  853. }
  854.  
  855. .info i:hover { color:{color:links hover}; cursor:pointer!important; }
  856.  
  857. #tags {
  858. position:relative;
  859. padding:7px 10px;
  860. border-top:1px solid {color:border};
  861. word-wrap: break-word;
  862. {block:IndexPage}
  863. {block:ifhidetagsonindex}display:none;{/block:ifhidetagsonindex}
  864. {/block:IndexPage}
  865. }
  866.  
  867. #tags a {
  868. margin-right:10px;
  869. text-transform:lowercase;
  870. font-style:italic;
  871. font-size:calc({select:font size} - 0.5px)
  872. }
  873.  
  874. .custom-like-button {
  875. position:relative;
  876. display:block;
  877. float:right;
  878. width:14px;
  879. height:14px;
  880. padding-left:7px;
  881. }
  882.  
  883. .like_button {
  884. position:absolute;
  885. top:-16px;
  886. left:0;
  887. right:15px;
  888. bottom:0;
  889. width:100%;
  890. height:100%;
  891. opacity:0;
  892. z-index:10;
  893. }
  894.  
  895. .like_button iframe { width:100%!important; height:100%!important; }
  896.  
  897. .likes i {
  898. position:absolute;
  899. top:0;
  900. left:0;
  901. right:0;
  902. bottom:0;
  903. width:100%;
  904. height:100%;
  905. z-index:1;
  906. }
  907.  
  908. .like_button:hover + .likes i {
  909. color:{color:links hover}!important;
  910. cursor:pointer!important;
  911. }
  912.  
  913. .like_button.liked + .likes i { color:#dc143c!important; } /* liked heart colour */
  914.  
  915.  
  916. /*-- post notes --*/
  917.  
  918. ol.notes {
  919. padding:10px;
  920. margin-top:25px;
  921. margin-bottom:{select:margin};
  922. margin-left:calc(200px + {select:margin} + 30px);
  923. width:calc({select:post width} - 20px);
  924. list-style-type:none;
  925. background:{color:posts};
  926. border:1px solid {color:border};
  927. }
  928.  
  929. ol.notes li.note { padding:5px; }
  930.  
  931. ol.notes li.note img.avatar {
  932. vertical-align:-4px;
  933. margin-right:10px;
  934. width:14px;
  935. height:14px;
  936. border-radius:50%;
  937. }
  938.  
  939. ol.notes li.note span.action { font-weight:none; }
  940. ol.notes li.note .answer_content { font-weight:normal; }
  941.  
  942. ol.notes li.note blockquote {
  943. padding-left:10px;
  944. margin-left:25px;
  945. border-left:1px solid {color:border};
  946. width:90%;
  947. }
  948.  
  949. ol.notes li.note blockquote a { text-decoration:none; }
  950.  
  951. .more_notes_link, .notes_loading {
  952. font-weight:600;
  953. display:block;
  954. text-align:left!important;
  955. }
  956.  
  957.  
  958. /*-- pagination and infinite scroll --*/
  959.  
  960. #pagination, footer {
  961. width:{select:post width};
  962. margin:0 auto {select:margin};
  963. position:relative;
  964. text-align:center!important;
  965. padding-left:calc(200px + {select:margin} + 30px);
  966. }
  967.  
  968. #pagination a { margin-right:7px; }
  969.  
  970. {block:ifinfinitescroll}
  971. #pagination, #infscr-loading { display:none!important; }
  972. {/block:ifinfinitescroll}
  973.  
  974. a#loadmore { font-size:{select:font size}px; }
  975.  
  976.  
  977.  
  978. /*-- other --*/
  979.  
  980. .tc {
  981. position:fixed;
  982. top:60px;
  983. right:0;
  984. }
  985.  
  986. .tc .fa { margin:10px 15px 15px 15px; }
  987.  
  988. .st {
  989. position:fixed;
  990. display:none;
  991. left:20px;
  992. bottom:15px;
  993. }
  994.  
  995. .st a { font-size:9px; }
  996.  
  997.  
  998. /*-- credit - DO NOT TOUCH --*/
  999.  
  1000. .credit a {
  1001. font-size:10px;
  1002. bottom:15px;
  1003. right:20px;
  1004. position:fixed;
  1005. text-transform:uppercase;
  1006. }
  1007.  
  1008. /*-- sidebar --*/
  1009.  
  1010. #sidebar {
  1011. width:200px;
  1012. position:absolute;
  1013. margin-left:0px;
  1014. margin-top:0px;
  1015. text-align:justify;
  1016. }
  1017.  
  1018. .box { padding:10px; }
  1019.  
  1020. .box:after {
  1021. content:"";
  1022. display:block;
  1023. margin:20px 0px;
  1024. height:1px;
  1025. width:100%;
  1026. background:{color:border};
  1027. }
  1028.  
  1029. .box h1 {
  1030. text-transform:uppercase;
  1031. font-size:calc({select:font size} + 2px);
  1032. font-weight:700;
  1033. letter-spacing:0px;
  1034. color:{color:title};
  1035. line-height:100%;
  1036. padding:0px;
  1037. }
  1038.  
  1039. .sb { max-width:100px; z-index:9999!important; }
  1040.  
  1041. .sb .search .query {
  1042. border:0;
  1043. outline:0;
  1044. margin-top:10px;
  1045. padding:0px;
  1046. font-family:inherit;
  1047. font-size:inherit;
  1048. font-style:italic;
  1049. color:{color:links};
  1050. background-color:transparent;
  1051. }
  1052.  
  1053. ::-webkit-input-placeholder { color:{color:links}; }
  1054. :-moz-placeholder { color:{color:links}; opacity:1; }
  1055. ::-moz-placeholder { color:{color:links}; opacity:1; }
  1056. :-ms-input-placeholder { color:{color:links}; }
  1057. input:focus::-webkit-input-placeholder { color: transparent; }
  1058. input:focus:-moz-placeholder { color: transparent; }
  1059. input:focus::-moz-placeholder { color: transparent; }
  1060. input:focus:-ms-input-placeholder { color: transparent; }
  1061.  
  1062. .blogs { display:block; height:40px; }
  1063.  
  1064. .blogs img {
  1065. position:relative;
  1066. height:30px;
  1067. width:30px;
  1068. margin-top:5px;
  1069. margin-right:10px;
  1070. margin-bottom:5px;
  1071. border-radius:100%;
  1072. }
  1073.  
  1074. .blogs a { position:relative; top:-17.5px; }
  1075.  
  1076. .updates { display:block; }
  1077.  
  1078. .updates h3 {
  1079. line-height:100%;
  1080. font-style:italic;
  1081. font-weight:600;
  1082. font-size:{select:font size};
  1083. text-transform:none!important;
  1084. letter-spacing:0px;
  1085. display:inline;
  1086. color:{color:text}!important;
  1087. }
  1088.  
  1089. .updates h3:after { content:":"; margin-right:7px; }
  1090.  
  1091.  
  1092.  
  1093. </style>
  1094.  
  1095.  
  1096. <!-- scripts -->
  1097.  
  1098. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1099.  
  1100. <!-- video resizing by @shythemes -->
  1101. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  1102.  
  1103. <!-- pixel union photosets - modified by @bychloethemes -->
  1104. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1105. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  1106.  
  1107. <script>
  1108. //pxu photosets
  1109. $(document).ready(function(){
  1110. $('.photo-slideshow').pxuPhotoset({
  1111. lightbox: true,
  1112. rounded: false,
  1113. gutter: '4px',
  1114. borderRadius: '0px',
  1115. photoset: '.photo-slideshow',
  1116. photoWrap: '.photo-data',
  1117. photo: '.pxu-photo'
  1118. });
  1119. });
  1120.  
  1121. {block:IndexPage}
  1122. {block:ifnothideheaderonindex}
  1123. //show on scroll
  1124. $(document).scroll(function () {
  1125. var y = $(this).scrollTop();
  1126. if (y > 360) {
  1127. $('.hnavi').fadeIn();
  1128. } if (y < 360) {
  1129. $('.hnavi').fadeOut();
  1130. }
  1131. });
  1132. {/block:ifnothideheaderonindex}
  1133. {/block:IndexPage}
  1134.  
  1135. {block:PermalinkPage}
  1136. {block:ifshowheaderonpermalink}
  1137. //show on scroll
  1138. $(document).scroll(function () {
  1139. var y = $(this).scrollTop();
  1140. if (y > 360) {
  1141. $('.hnavi').fadeIn();
  1142. } if (y < 360) {
  1143. $('.hnavi').fadeOut();
  1144. }
  1145. });
  1146. {/block:ifshowheaderonpermalink}
  1147. {/block:PermalinkPage}
  1148. </script>
  1149.  
  1150.  
  1151. </head>
  1152.  
  1153. <body>
  1154.  
  1155.  
  1156. <div id="navi">
  1157. <a href="{text:link 1 url}">{text:link 1 title}</a>
  1158. <a href="{text:link 2 url}">{text:link 2 title}</a>
  1159. <a href="{text:link 3 url}">{text:link 3 title}</a>
  1160. <a href="{text:link 4 url}">{text:link 4 title}</a>
  1161. <a href="{text:link 5 url}">{text:link 5 title}</a>
  1162. <a href="{text:link 6 url}">{text:link 6 title}</a>
  1163. </div>
  1164.  
  1165. <div id="image"><img src="{image:header}"/></div>
  1166.  
  1167.  
  1168. <div id="topbar">
  1169.  
  1170. <div class="title">{title}</div>
  1171. <div class="hnavi">
  1172. <a href="{text:link 1 url}">{text:link 1 title}</a>
  1173. <a href="{text:link 2 url}">{text:link 2 title}</a>
  1174. <a href="{text:link 3 url}">{text:link 3 title}</a>
  1175. <a href="{text:link 4 url}">{text:link 4 title}</a>
  1176. <a href="{text:link 5 url}">{text:link 5 title}</a>
  1177. <a href="{text:link 6 url}">{text:link 6 title}</a>
  1178. </div>
  1179. <div class="links">
  1180. <a href="/" title="home"><i class="fa fa-home" aria-hidden="true"></i></a>
  1181. {block:AskEnabled}<a href="/ask" title="inbox"><i class="fa fa-envelope" aria-hidden="true"></i></a>{/block:AskEnabled}
  1182. {block:SubmitEnabled}<a href="/submit" title="submit"><i class="fa fa-bars" aria-hidden="true"></i></i></a>{/block:SubmitEnabled}
  1183. <a href="https://tumblr.com/follow/{Name}" title="follow"><i class="fas fa-plus"></i></a>
  1184. <a href="/"><img src="{PortraitURL-128}"/></a>
  1185. </div>
  1186. </div>
  1187.  
  1188.  
  1189. <div id="entries">
  1190.  
  1191. <!-- EDITING THE SIDEBAR
  1192. the sidebar sections that need to be edited are right after this note. before editing, please read the guide as it says what can be done to the sections, including adding more and moving them around. the default sections with templates provided are about, updates and statistics but they can be changed to many other sections through following the instructions on the guide at
  1193. http://enchantedthemes.tumblr.com/bibliophile/guide
  1194. -->
  1195.  
  1196. <!-- start sidebar -->
  1197.  
  1198. <div id="sidebar">
  1199.  
  1200. <!-- about -->
  1201. <div class="box">
  1202. <h1>about</h1>
  1203. {Description}
  1204. {block:ifsearchbar}
  1205. <div class="sb">
  1206. <form action="/search" method="get" class="search">
  1207. <input type="text" name="q" value="{SearchQuery}" class="query" placeholder="search this blog..."/>
  1208. </form>
  1209. </div>
  1210. {/block:ifsearchbar}
  1211. </div>
  1212. <!-- end about -->
  1213.  
  1214. <!-- updates -->
  1215. <div class="box">
  1216. <h1>updates</h1>
  1217. <div class="updates"><h3>date</h3>info</div>
  1218. <div class="updates"><h3>date</h3>info</div>
  1219. <div class="updates"><h3>date</h3>info</div>
  1220. </div>
  1221. <!-- end updates -->
  1222.  
  1223. <!-- statistics -->
  1224. <div class="box">
  1225. <h1>statistics</h1>
  1226. <div class="updates"><h3>about</h3>info</div>
  1227. <div class="updates"><h3>established</h3>info</div>
  1228. <div class="updates"><h3>years active</h3>{CopyrightYears}</div>
  1229. <div class="updates"><h3>online</h3>
  1230. <!-- copy online counter here -->
  1231. </div>
  1232. <div class="updates"><h3>views</h3>
  1233. <!-- copy hit counter here -->
  1234. </div>
  1235. <!-- please keep this here! -->
  1236. <div class="updates"><h3>theme credit</h3><a href="http://enchantedthemes.tumblr.com">enchantedthemes</a></div>
  1237. </div>
  1238. <!-- end statistics -->
  1239.  
  1240. </div>
  1241.  
  1242. <!-- end sidebar -->
  1243.  
  1244.  
  1245. {block:Posts}
  1246.  
  1247. <div class="posts" id="{PostID}">
  1248.  
  1249.  
  1250. {block:Date}
  1251. <div class="topinfo">
  1252. {block:RebloggedFrom}
  1253. <a href="{ReblogRootURL}"><img src="{ReblogRootPortraitURL-128}"/></a>
  1254. <div class="toptext">
  1255. <a href="{ReblogRootURL}" style="font-weight:600;">{ReblogRootName}</a>
  1256. {block:IndexPage}{block:NoteCount}<a href="{Permalink}" style="float:right;">{NoteCountWithLabel}</a>{/block:NoteCount}{/block:IndexPage}
  1257. {block:HomePage}{block:PinnedPostLabel}<div class="pinned">&ensp;:&ensp;<a href="{Permalink}">{PinnedPostLabel}</a></div>{/block:PinnedPostLabel}{/block:HomePage}
  1258. </div>
  1259. {/block:RebloggedFrom}
  1260. {block:NotReblog}
  1261. <a href="{Permalink}"><img src="{PortraitURL-128}"/></a>
  1262. <div class="toptext">
  1263. <a href="{Permalink}" style="font-weight:600;">{Name}</a>
  1264. {block:IndexPage}{block:NoteCount}<a href="{Permalink}" style="float:right;">{NoteCountWithLabel}</a>{/block:NoteCount}{/block:IndexPage}
  1265. {block:HomePage}{block:PinnedPostLabel}<div class="pinned">&ensp;:&ensp;<a href="{Permalink}">{PinnedPostLabel}</a></div>{/block:PinnedPostLabel}{/block:HomePage}
  1266. </div>
  1267. {/block:NotReblog}
  1268. </div>
  1269. {/block:Date}
  1270.  
  1271.  
  1272. {block:Text}
  1273. <div class="txt" id="{PostID}">
  1274. {block:Title}<h1>{Title}</h1>{/block:Title}
  1275. <div class="c">{Body}</div>
  1276. </div>
  1277. {/block:Text}
  1278.  
  1279.  
  1280. {block:Photo}
  1281. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  1282. <img src="{PhotoURL-HighRes}" width="{select:post width}" id="photos" style="margin-bottom:-5px;">
  1283. </a>
  1284. {/block:Photo}
  1285.  
  1286.  
  1287. {block:Photoset}
  1288. <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>
  1289. {/block:Photoset}
  1290.  
  1291.  
  1292. {block:Quote}
  1293. <div class="quote">{Quote}</div>
  1294. {block:Source}<div class="quotesource">{Source}</div>{/block:Source}
  1295. {/block:Quote}
  1296.  
  1297.  
  1298. {block:Link}
  1299. <h1><a href="{URL}" {Target}>{Name}&ensp;>></a></h1>
  1300. {block:Description}<div class="c">{Description}</div>{/block:Description}
  1301. {/block:Link}
  1302.  
  1303.  
  1304. {block:Chat}
  1305. {block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
  1306. {/block:Chat}
  1307.  
  1308.  
  1309. {block:Audio}
  1310. <div class="audio">
  1311. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}</div></div>
  1312.  
  1313. <div class="trackdetails">
  1314. {block:TrackName}<b>{TrackName}</b>{/block:TrackName} {block:Artist}by <i>{Artist}</i>{/block:Artist}
  1315. </div>
  1316.  
  1317. </div>
  1318. {/block:Audio}
  1319.  
  1320.  
  1321. {block:Video}
  1322. <div class="video">{Video-500}</div>
  1323. {/block:Video}
  1324.  
  1325.  
  1326. {block:Caption}
  1327. <div class="c">{Caption}</div>
  1328. {/block:Caption}
  1329.  
  1330.  
  1331. {block:Answer}
  1332. <div class="aicon"><img src="{AskerPortraitURL-128}" /></div>
  1333. <div class="asker"><b>{Asker}</b> asked:</div>
  1334. <div class="question">{Question}</div>
  1335. <div class="answer"><div class="c">{Answer}</div></div>
  1336. {/block:Answer}
  1337.  
  1338.  
  1339. {block:Date}
  1340. <div class="info">
  1341. <div class="dtext">
  1342. Posted {TimeAgo} on <span style="text-transform:capitalize;">{DayOfMonth} {Month}{block:PermalinkPage}, {Year}{/block:PermalinkPage}</span>
  1343. </div>
  1344.  
  1345. {block:IndexPage}
  1346. {block:ifshowcontrolsonindex}
  1347. <div class="custom-like-button">
  1348. {LikeButton}
  1349. <span class="likes"><i class="fa fa-heart" aria-hidden="true"></i></span>
  1350. </div>
  1351. <a href="{ReblogURL}"><i class="fa fa-undo" aria-hidden="true"></i></a>
  1352. {/block:ifshowcontrolsonindex}
  1353. {/block:IndexPage}
  1354.  
  1355. {block:PermalinkPage}
  1356. <div class="custom-like-button">
  1357. <div class="like_button">
  1358. {LikeButton}
  1359. </div>
  1360. <span class="likes"><i class="fa fa-heart" aria-hidden="true"></i></span>
  1361. </div>
  1362. <a href="{ReblogURL}"><i class="fa fa-undo" aria-hidden="true"></i></a>
  1363. <div style="margin:5px 5px -2.5px;">
  1364. {block:NotReblog}Original post<br>{/block:NotReblog}
  1365. {block:RebloggedFrom}
  1366. Reblogged from <a href="{ReblogParentURL}" title="{ReblogParentTitle}">{ReblogParentName}</a>,&nbsp;&nbsp;&nbsp;
  1367. {block:ContentSource}Source <a href="{ReblogRootURL}" title="{ReblogRootTitle}">{ReblogRootName}</a>{/block:ContentSource}
  1368. {/block:RebloggedFrom}
  1369. </div>
  1370. {/block:PermalinkPage}
  1371. </div>
  1372. {/block:Date}
  1373.  
  1374. {block:Date}
  1375. {block:HasTags}
  1376. <div id="tags">
  1377. Tagged:&ensp;{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  1378. </div>
  1379. {/block:HasTags}
  1380. {/block:Date}
  1381.  
  1382.  
  1383. </div>
  1384.  
  1385.  
  1386. {block:PostNotes}
  1387. {block:NoteCount}<div style="font-size:calc({select:font size} + 2px); font-weight:700; margin-left:calc(200px + {select:margin} + 30px); color:{color:title}">{NoteCountWithLabel}</div>{/block:NoteCount}
  1388. {PostNotes}
  1389. {/block:PostNotes}
  1390.  
  1391. {/block:Posts}
  1392.  
  1393.  
  1394. </div>
  1395.  
  1396.  
  1397. {block:Pagination}{block:ifloadmore}
  1398. <footer><a id="loadmore">load more posts</a></footer>
  1399. {/block:Pagination}{/block:ifloadmore}
  1400.  
  1401.  
  1402. {block:Pagination}
  1403. <div id="pagination">
  1404. {block:Previouspage}
  1405. <a href="{PreviousPage}" title="back"><i class="fa fa-angle-left"></i></a>{/block:PreviousPage}
  1406. {block:JumpPagination length="3"}
  1407. {block:CurrentPage}
  1408. <span class="current_page" style="margin-right:10px; font-weight:700;">{PageNumber}</span>
  1409. {/block:CurrentPage}
  1410. {block:JumpPage}
  1411. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1412. {/block:JumpPage}
  1413. {/block:JumpPagination}
  1414. {block:NextPage}
  1415. <a class="next" href="{NextPage}" title="next"><i class="fa fa-angle-right"></i></a>
  1416. {/block:Nextpage}
  1417. </div>
  1418. {/block:Pagination}
  1419.  
  1420.  
  1421.  
  1422. {block:ContentSource}
  1423. <!-- {SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  1424. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  1425. {/block:SourceLogo}
  1426. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1427. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  1428.  
  1429.  
  1430. {block:ifscrolltotop}
  1431. <div class="st"><a href="#">scroll to top</a></div>
  1432. {/block:ifscrolltotop}
  1433.  
  1434.  
  1435. <div class="tc">
  1436. <i class="fa fa-bars" aria-hidden="true"></i>
  1437. </div>
  1438.  
  1439.  
  1440. <!-- credit - DO NOT TOUCH -->
  1441.  
  1442. <div class="credit">
  1443. <a href="http://enchantedthemes.tumblr.com" title="alydae">A.</a>
  1444. </div>
  1445.  
  1446. <!--- scripts --->
  1447.  
  1448. <!-- npfPhotosets script by @codematurgy -->
  1449. <script src="https://cdn.jsdelivr.net/gh/boscoxvi/npfphotosets/npfphotosets.js"></script><link href="https://cdn.jsdelivr.net/gh/boscoxvi/npfphotosets/npfphotosetstyle.css" rel="stylesheet" type="text/css">
  1450. <script>
  1451. npfPhotosets(".posts", {
  1452. includeCommonPhotosets: true,
  1453. photosetMargins:"4"
  1454. });
  1455. </script>
  1456.  
  1457. <!-- un-next captions script by @neothm and @magnusthemes -->
  1458. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1459.  
  1460. <script>
  1461. $(document).ready(function(){
  1462. $('.posts').unnest({
  1463. yourCaption: ".c",
  1464. wrapName: ".tumblr_parent",
  1465. newCaptionUsername: true,
  1466. originalPostCaptionUsername: false,
  1467. tumblrAvatars: true,
  1468. tumblrAvatarClass: ".tumblr_avatar",
  1469. usernameColon: false
  1470. });
  1471. });
  1472. </script>
  1473.  
  1474. <!--✻✻✻✻✻✻ npf audio player by @glenthemes ✻✻✻✻✻✻-->
  1475. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  1476. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  1477. <script>
  1478. tumblr_npf_audio({
  1479. emptyTitleText: "Unknown track",
  1480. emptyArtistText: "Unknown artist",
  1481. emptyAlbumText: "",
  1482.  
  1483. titleLabel: "",
  1484. artistLabel: "",
  1485. albumLabel: ""
  1486. });
  1487. </script>
  1488. <style edit-npf-audio-player>
  1489. .npf-audio-wrapper {
  1490. --NPF-Audio-Buttons-Size: 0.8rem;
  1491. --NPF-Audio-Buttons-Color: #444;
  1492. --NPF-Audio-Buttons-Spacing: 2rem;
  1493. --NPF-Audio-Image-Size: 58px;
  1494. --NPF-Audio-Image-Spacing: 0px;
  1495. width: {select:post width};
  1496. margin-left: -15px;
  1497. line-height: 150%;
  1498. font-size: calc({select:font size} + 1px);
  1499. }
  1500.  
  1501. .npf-audio-background {
  1502. background-color: #f2f2f2;
  1503. padding: 1.5rem;
  1504. padding-left: 32px;
  1505. }
  1506.  
  1507. .npf-audio-title { font-weight:600; color:{color:title}; float:left; }
  1508. .npf-audio-artist { font-style:italic; }
  1509. .npf-audio-artist-label:before { content:'by'; font-style:normal; margin-left:3px; }
  1510. .npf-audio-album-label { font-weight:bold; }
  1511. .npf-audio-album { display:none; }
  1512. </style>
  1513.  
  1514. <!--- tooltips script --->
  1515. <script src="https://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  1516.  
  1517. <script type="text/javascript">
  1518.  
  1519. //tooltips
  1520. (function($){
  1521. $(document).ready(function(){
  1522. $("[title]").style_my_tooltips({
  1523. tip_follows_cursor:true,
  1524. tip_delay_time:200,
  1525. tip_fade_speed:300
  1526. });
  1527. });
  1528. })(jQuery);
  1529.  
  1530. //remove tumblr redirects script by magnusthemes@tumblr
  1531. function noHrefLi(){
  1532. var linkSet = document.querySelectorAll('a[href*="href.li/?"]');
  1533. Array.prototype.forEach.call(linkSet,function(el,i){
  1534. var theLink = linkSet[i].getAttribute('href').split("href.li/?")[1];
  1535. linkSet[i].setAttribute("href",theLink);
  1536. });
  1537. }
  1538. noHrefLi();
  1539.  
  1540. //sticky
  1541. $(function(){
  1542. var stickyRibbonTop = $('#topbar').offset().top;
  1543. $(window).scroll(function(){
  1544. if( $(window).scrollTop() > stickyRibbonTop ) {
  1545. $('#topbar').css({position: 'fixed', top: '0px'});
  1546. } else {
  1547. $('#topbar').css({position: 'relative', top: '0px'});
  1548. }
  1549. });
  1550. });
  1551.  
  1552. //scroll to top
  1553. {block:ifscrolltotop}
  1554. $(window).scroll(function() {
  1555. if ( $(window).scrollTop() > 100 ) {
  1556. $('.st').fadeIn('slow');
  1557. } else {
  1558. $('.st').fadeOut('slow');
  1559. }
  1560. });
  1561. $('.st').click(function() {
  1562. $('html, body').animate({scrollTop: 0}, 700);
  1563. return false;
  1564. });
  1565. {/block:ifscrolltotop}
  1566.  
  1567. </script>
  1568.  
  1569. <!-- infinite scroll -->
  1570. {block:ifInfiniteScroll}
  1571. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1572. {/block:ifInfiniteScroll}
  1573.  
  1574. {block:ifInfiniteScroll}
  1575. <script type="text/javascript">
  1576. $(document).ready(function(){
  1577. var $container = $('#entries');
  1578. $container.infinitescroll({
  1579. itemSelector: '.posts',
  1580. navSelector: '#pagination',
  1581. nextSelector: '.next',
  1582. loadingImg: '',
  1583. loadingText: '<em></em>',
  1584. {block:ifloadmore}
  1585. errorCallback: function () {$('a#loadmore:last').fadeOut();},
  1586. {/block:ifloadmore}
  1587. bufferPx: 2000,
  1588. },
  1589. function( newElements ) {
  1590. var $newElems = $( newElements );
  1591. $newElems.find('.photo-slideshow').pxuPhotoset({
  1592. lightbox: true,
  1593. rounded: false,
  1594. gutter: '4px',
  1595. photoset: '.photo-slideshow',
  1596. photoWrap: '.photo-data',
  1597. photo: '.pxu-photo',
  1598. });
  1599. resizeVideos();
  1600. $newElems.unnest({
  1601. yourCaption: ".c",
  1602. wrapName: ".tumblr_parent",
  1603. newCaptionUsername: true,
  1604. originalPostCaptionUsername: false,
  1605. tumblrAvatars: true,
  1606. tumblrAvatarClass: ".tumblr_avatar",
  1607. usernameColon: false
  1608. });
  1609. var $newElemsIDs = $newElems.map(function(){
  1610. return this.id;
  1611. }).get();
  1612. console.log($newElems, $newElemsIDs);
  1613. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1614. });
  1615. {block:ifloadmore}
  1616. $(window).unbind('.infscr');
  1617. $('a#loadmore').click(function(){
  1618. $('#entries').infinitescroll('retrieve');
  1619. return false;
  1620. });
  1621. {/block:ifloadmore}
  1622. });
  1623. </script>
  1624. {/block:ifInfiniteScroll}
  1625.  
  1626. </body>
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!