API tools faq
paste
study_ace

theme 04: persimmon

study_ace
Oct 21st, 2018
1,943
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 22.28 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3. <title>{block:PostSummary}{PostSummary} | {/block:PostSummary}{block:TagPage}#{Tag} | {/block:TagPage}{block:SearchPage}search results for: {SearchQuery} | {/block:SearchPage}{Title}</title>
  4. <link rel="shortcut icon" href="{Favicon}">
  5.  
  6. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  7.  
  8. <link href="https://fonts.googleapis.com/css?family=Inconsolata:400,700" rel="stylesheet">
  9.  
  10. <!---
  11. theme: persimmon by @studyace
  12. icons honeybee by #themehive
  13. sidebar preview icon from unsplash
  14. please dont steal, remove/edit credit, redistribute w/o permission, copy code/ideas, or use as a base
  15. contact @ studyace.tumblr.com / cutercodes.tumblr.com
  16. --->
  17.  
  18. <link rel="stylesheet" type="text/css" href="https://static.tumblr.com/n7gvaew/8gop026qc/normalize.css">
  19.  
  20. <meta name="color:Text" content="#000"/>
  21. <meta name="color:Links" content="#000"/>
  22. <meta name="color:Links Hover" content="#888"/>
  23. <meta name="color:Gradient Beginning" content="pink"/>
  24. <meta name="color:Gradient End" content="purple"/>
  25. <meta name="color:Icons Sidebar BG" content="#000"/>
  26. <meta name="color:Sidebar Icons" content="#fff"/>
  27. <meta name="color:Sidebar BG" content="#fff"/>
  28. <meta name="color:Sidebar Links" content="#000"/>
  29. <meta name="color:Title" content="#000"/>
  30. <meta name="color:Description" content="#888"/>
  31. <meta name="color:Post BG" content="#fff"/>
  32. <meta name="color:Info" content="#fff"/>
  33. <meta name="color:Tooltip" content="#fff"/>
  34. <meta name="color:Tooltip BG" content="#000"/>
  35.  
  36. <meta name="image:Sidebar" content="https://66.media.tumblr.com/1a65c8ddead95863d214340e0d443557/tumblr_p620heZ0XO1x0h5yoo9_250.jpg"/>
  37.  
  38. <meta name="text:Facebook URL" content=""/>
  39. <meta name="text:Twitter URL" content=""/>
  40. <meta name="text:Instagram URL" content=""/>
  41.  
  42. <meta name="text:Link 1 URL" content=""/>
  43. <meta name="text:Link 1" content="one"/>
  44. <meta name="text:Link 2 URL" content=""/>
  45. <meta name="text:Link 2" content="two"/>
  46. <meta name="text:Link 3 URL" content=""/>
  47. <meta name="text:Link 3" content="three"/>
  48. <meta name="text:Link 4 URL" content=""/>
  49. <meta name="text:Link 4" content="four"/>
  50. <meta name="text:Link 5 URL" content=""/>
  51. <meta name="text:Link 5" content="five"/>
  52. <meta name="text:Link 6 URL" content=""/>
  53. <meta name="text:Link 6" content="six"/>
  54.  
  55. <meta name="if:Search Box" content="1"/>
  56. <meta name="if:Social Media" content="1"/>
  57. >
  58. <meta name="select:Post Width" content="post-700" title="700px">
  59. <meta name="select:Post Width" content="post-500" title="500px">
  60. <meta name="select:Post Width" content="post-400" title="400px">
  61. <meta name="select:Post Width" content="post-250-2" title="250px 2 column">
  62. <meta name="select:Post Width" content="post-250-1" title="250px 1 column">
  63. <meta name="select:Sidebar Links" content="l0" title="0"/>
  64. <meta name="select:Sidebar Links" content="l1" title="1"/>
  65. <meta name="select:Sidebar Links" content="l2" title="2"/>
  66. <meta name="select:Sidebar Links" content="l3" title="3"/>
  67. <meta name="select:Sidebar Links" content="l4" title="4"/>
  68. <meta name="select:Sidebar Links" content="l5" title="5"/>
  69. <meta name="select:Sidebar Links" content="l6" title="6"/>
  70.  
  71. <style type="text/css">
  72.  
  73. #s-m-t-tooltip { max-width:200px; z-index:10000000000000000000000; margin:24px 14px 7px 12px; padding:8px 10px; background:{color:Tooltip BG}; font:10px, line-height:16px; text-align:center; color:{color:Tooltip}; }
  74.  
  75. body { font:15px "Inconsolata", helvetica; line-height:21px;
  76. background-image:linear-gradient({color:Gradient Beginning}, {color:Gradient End});
  77. background-size:cover;
  78. background-attachment:fixed;
  79. background-repeat:no-repeat;
  80. }
  81. h1 { font-size:22px; margin:0px; line-height:28px; }
  82. a { text-decoration:none; color:{color:Links}; transition:all 0.5s ease; }
  83. a:hover {
  84. color:{color:Links Hover};
  85. }
  86. .post img { max-width:100%; }
  87. .post { word-break:break-word; }
  88.  
  89. #sidebar1 {
  90. background-color:{color:Icons Sidebar BG};
  91. position:fixed;
  92. height:100%;
  93. top:0;
  94. left:0;
  95. padding:10px;
  96. width:40px;
  97. }
  98.  
  99. #links {
  100. position:fixed;
  101. top:50%;
  102. transform:translateY(-50%);
  103. font-size:20px;
  104. left:10px;
  105. }
  106.  
  107. #links a {
  108. color:{color:Sidebar Icons};
  109. padding:10px;
  110. background-color:transparent;
  111. border-radius:100%;
  112. transition:all 0.5s ease;
  113. display:block;
  114. width:40px;
  115. box-sizing:border-box;
  116. height:40px;
  117. margin-bottom:15px;
  118. transition:all 0.4s ease;
  119. background-image:linear-gradient({color:Gradient Beginning}, {color:Gradient End});
  120. background-size:1px 10px;
  121. background-repeat:no-repeat;
  122. }
  123.  
  124. #links a:hover {
  125. background-size:40px 40px;
  126. }
  127.  
  128. #links a:last-child {
  129. margin-bottom:0px;
  130. }
  131.  
  132. .th-home-o:before{
  133. content:'\ea63';
  134. font-family:'honeybee';
  135. }
  136.  
  137. .th-envelope-o:before{
  138. content:'\ebdb';
  139. font-family:'honeybee';
  140. }
  141.  
  142. .th-calendar-1-o:before{
  143. content:'\e983';
  144. font-family:'honeybee';
  145. }
  146.  
  147. .th-location-2-o:before{
  148. content:'\e9d1';
  149. font-family:'honeybee';
  150. }
  151.  
  152. .sm_border {
  153. background-color:{color:Sidebar Icons};
  154. height:1px;
  155. width:30px;
  156. margin-left:5px;
  157. margin-bottom:15px;
  158. }
  159.  
  160. .th-facebook-o:before{
  161. content:'\ebdf';
  162. font-family:'honeybee';
  163. }
  164.  
  165. .th-instagram-o:before{
  166. content:'\ebe5';
  167. font-family:'honeybee';
  168. }
  169.  
  170. .th-twitter-o:before{
  171. content:'\ec1b';
  172. font-family:'honeybee';
  173. }
  174.  
  175. #sidebar2 {
  176. left:60px;
  177. top:0px;
  178. background-color:{color:Sidebar BG};
  179. height:100%;
  180. width:300px;
  181. position:fixed;
  182. }
  183.  
  184. .l0 #links2 a, .l1 #links2 a:nth-child(n+2), .l2 #links2 a:nth-child(n+3), .l3 #links2 a:nth-child(n+4), .l4 #links2 a:nth-child(n+5), .l5 #links2 a:nth-child(n+6), .l6 #links2 a:nth-child(n+7) {
  185. display:none;
  186. }
  187.  
  188. .sidebar2_img, #desc, #title, #links2 {
  189. margin-left:25px;
  190. }
  191.  
  192. .sidebar2_img {
  193. border-radius:100%;
  194. margin-top:40px;
  195. margin-bottom:10px;
  196. }
  197.  
  198. #title {
  199. color:{color:Title};
  200. font-size:22px;
  201. width:250px;
  202. line-height:31px;
  203. font-weight:700;
  204. margin-bottom:10px;
  205. }
  206.  
  207. #desc {
  208. color:{color:Description};
  209. width:250px;
  210. font-size:16px;
  211. line-height:22px;
  212. margin-bottom:20px;
  213. }
  214.  
  215. #links2 a, .searchb {
  216. color:{color:Sidebar Links};
  217. display:block;
  218. width:100%;
  219. font-size:16px;
  220. transition:all 0.7s ease;
  221. background-image:linear-gradient(to right, {color:Gradient Beginning}, {color:Gradient End});
  222. background-size:0px 100%;
  223. background-repeat:no-repeat;
  224. padding:7px 10px;
  225. box-sizing:border-box;
  226. border-radius:12px;
  227. width:250px;
  228. }
  229.  
  230. #links2 a:hover, .searchb:hover {
  231. background-size:250px 100%;
  232. color:#fff;
  233. }
  234.  
  235. #links2 .th {
  236. margin-right:15px;
  237. }
  238.  
  239. .th-aloe-vera-o:before{
  240. content:'\e94b';
  241. font-family:'honeybee';
  242. }
  243. .th-blossom-o:before{
  244. content:'\e907';
  245. font-family:'honeybee';
  246. }
  247. .th-flower-o:before{
  248. content:'\ea2d';
  249. font-family:'honeybee';
  250. }
  251. .th-holly-o:before{
  252. content:'\ea59';
  253. font-family:'honeybee';
  254. }
  255. .th-rose-o:before{
  256. content:'\ecad';
  257. font-family:'honeybee';
  258. }
  259. .th-sunflower-o:before{
  260. content:'\eb76';
  261. font-family:'honeybee';
  262. }
  263. .th-loupe-o:before {
  264. content:'\eaa6';
  265. font-family:'honeybee';
  266. margin-left:3px;
  267. }
  268.  
  269. .search {
  270. display:inline;
  271. margin-top:-11px;
  272. margin-left:-12px;
  273. }
  274.  
  275. .search .query {
  276. border: 0;
  277. outline: 0;
  278. padding: 5px;
  279. font-family: inherit;
  280. font-size: inherit;
  281. color: inherit;
  282. margin-left:5px;
  283. background-color: transparent;
  284. }
  285.  
  286. ::-webkit-input-placeholder {color: inherit;}
  287. :-moz-placeholder {color: inherit; opacity:1;}
  288. ::-moz-placeholder {color: inherit; opacity:1;}
  289. :-ms-input-placeholder {color: inherit;}
  290.  
  291. input:focus::-webkit-input-placeholder {color: transparent;}
  292. input:focus:-moz-placeholder {color: transparent;}
  293. input:focus::-moz-placeholder {color: transparent;}
  294. input:focus:-ms-input-placeholder { color: transparent;}
  295.  
  296. .tumblr_avatar {
  297. vertical-align:middle;
  298. margin-right:10px;
  299. border-radius:100%;
  300. height:2em;
  301. }
  302.  
  303. .tumblr_parent {
  304. margin:0px 0px 10px 0px;
  305. border:1px solid #ccc;
  306. padding:10px 10px 0px 10px;
  307. }
  308.  
  309. .tumblr_parent:last-child {
  310. margin-bottom:-15px;
  311. }
  312.  
  313. .posts {
  314. position:absolute;
  315. left:calc(50% + 140px);
  316. transform:translateX(-50%);
  317. margin-top:50px;
  318. margin-bottom:50px;
  319. }
  320.  
  321. @media only screen and (max-width: 1365px) {
  322. #sidebar2 {
  323. width:200px;
  324. }
  325. #title, #desc {
  326. width:150px;
  327. }
  328. #links2 a:hover, .searchb:hover {
  329. background-size:160px 100%;
  330. }
  331. }
  332.  
  333. .post-700 .posts {
  334. width:800px;
  335. }
  336.  
  337. .post-500 .posts {
  338. width:600px;
  339. }
  340.  
  341. .post-400 .posts {
  342. width:500px;
  343. }
  344.  
  345. .post-250-1 .posts {
  346. width:350px;
  347. }
  348.  
  349. .post-250-2 .posts {
  350. width:630px;
  351. column-count: 2;
  352. column-gap: 50px;
  353. }
  354.  
  355. .post {
  356. background-color:{color:Post BG};
  357. padding:15px;
  358.  
  359. margin-bottom:30px;
  360. margin-left:auto;
  361. margin-right:auto;
  362. border-radius:10px;
  363. }
  364.  
  365. .post-700 .post {
  366. width:700px;
  367. }
  368.  
  369. .post-500 .post {
  370. width:500px;
  371. }
  372.  
  373. .post-400 .post {
  374. width:400px;
  375. }
  376. .post-250-1 .post {
  377. width:250px;
  378. }
  379.  
  380. .post-250-2 .post {
  381. width:250px;
  382. break-inside: avoid;
  383. display:inline-block;
  384. }
  385. .post-700 .width-800, .post-700 .width-500, .post-700 .width-400, .post-700 .width-250 {
  386. display:none;
  387. }
  388.  
  389. .post-500 .width-800, .post-500 .width-700, .post-500 .width-400, .post-500 .width-250 {
  390. display:none;
  391. }
  392. .post-400 .width-800, .post-400 .width-700, .post-400 .width-400, .post-400 .width-250 {
  393. display:none;
  394. }
  395.  
  396. .post-250-1 .width-800, .post-250-1 .width-700, .post-250-1 .width-500, .post-250-1 .width-400 {
  397. display:none;
  398. }
  399.  
  400. .post-250-2 .width-800, .post-250-2 .width-700, .post-250-2 .width-500, .post-250-2 .width-400 {
  401. display:none;
  402. }
  403.  
  404. .post-width-500 .element-width-400,
  405. .post-width-500 .element-width-250 { display: none; }
  406.  
  407. .post-width-400 .element-width-500,
  408. .post-width-400 .element-width-250 { display: none; }
  409.  
  410. .post-width-250 .element-width-500,
  411. .post-width-250 .element-width-400 { display: none; }
  412.  
  413. .qt {
  414. text-align:center;
  415. font-size:18px;
  416. line-height:25px;
  417. }
  418.  
  419. .source {
  420. font-size:15px;
  421. text-align:right;
  422. margin-bottom:10px;
  423. }
  424.  
  425. [photoset-layout] {
  426. grid-gap:10px;
  427. }
  428.  
  429. .photopp .tumblr_parent {
  430. margin-top:-15px;
  431. }
  432.  
  433. .photopost .tumblr_parent {
  434. border-top:0px;
  435. }
  436.  
  437. .photop {
  438. margin-bottom:10px;
  439. }
  440.  
  441. [photoset-layout] {
  442. }
  443.  
  444. .askp .tumblr_parent {
  445. margin-bottom:10px;
  446. }
  447.  
  448. .ask {
  449. border:1px solid #ccc;
  450. padding:10px;
  451. margin-bottom:15px;
  452. font-size:14px;
  453. line-height:20px;
  454. text-align:center;
  455. }
  456.  
  457. .ask img {
  458. border-radius:100%;
  459. }
  460.  
  461. .ask h1 {
  462. text-transform:lowercase;
  463. font-size:17px;
  464. }
  465.  
  466. .chatline {
  467. display:block;
  468. margin-bottom:10px;
  469. }
  470.  
  471. .album {
  472. border:10px solid #ccc;
  473. z-index:10000;
  474. background-image:url('https://static.tumblr.com/xdzt0ir/87ho6heum/cursive_default_album_art_sign.png');
  475. width:100px;
  476. margin:15px 0px 0px 15px;
  477. height:100px;
  478. background-position:center;
  479. }
  480.  
  481. .audinf h1 {
  482. margin:0px 0px -10px 0px;
  483. }
  484.  
  485. .audinf {
  486. position:absolute;
  487. left:150px;
  488. top:0px;
  489. }
  490.  
  491. .audp {
  492. width:30px;
  493. height:30px;
  494. overflow:hidden;
  495. position:absolute;
  496. top:47.5px;
  497. left:57.5px;
  498. }
  499.  
  500. .ph {
  501. margin-top:-10px;
  502. margin-bottom:7px;
  503.  
  504. }
  505.  
  506. .cap {
  507. margin-bottom:30px;
  508. }
  509.  
  510. .askp .cap {
  511. margin-bottom:20px;
  512. }
  513.  
  514. .perma {
  515. background-image:linear-gradient({color:Gradient Beginning}, {color:Gradient End});
  516. padding:5px 10px;
  517. color:{color:Info};
  518. text-transform:uppercase;
  519. border-radius:10px;
  520. transition:all 0.4s ease;
  521. }
  522.  
  523. .perma:hover {
  524. text-shadow: 3px 2px 2px #fff;
  525. color:{color:Info};
  526. }
  527.  
  528. .tags {
  529. display:block;
  530. margin-top:7px;
  531. }
  532.  
  533. .tag:after {
  534. content:", ";
  535. }
  536.  
  537. .tag:last-child:after {
  538. content:"";
  539. }
  540.  
  541. .th-heart-1-o:before {
  542. content:"\ea55";
  543. font-family:"honeybee";
  544. }
  545.  
  546. .reblog1 a, .like-b {
  547. transition:all 0.4s ease;
  548. }
  549.  
  550. .reblog1 a:hover, .like-b:hover {
  551. text-shadow:3px 2px 2px {color:Info};
  552. }
  553.  
  554. .like1, .reblog1 {
  555. float:right;
  556. margin-top:-3px;
  557. }
  558.  
  559. .like-b {
  560. position:relative;
  561. display:inline-block;
  562. height:1em;
  563. line-height:1em;
  564. overflow:hidden;
  565. margin-bottom:-1px;
  566. background-image:linear-gradient({color:Gradient Beginning}, {color:Gradient End});
  567. color:{color:Info};
  568. padding:6px;
  569. border-radius:6px;
  570. }
  571. .like-b .like_button iframe {
  572. position:absolute;
  573. top:0;
  574. left:0;
  575. bottom:0;
  576. right:0;
  577. z-index:2;
  578. opacity:0;
  579. }
  580. .like-b .liked + .b {
  581. color:inherit;
  582. }
  583.  
  584. .like1 a {
  585. color:{color:Info};
  586. }
  587.  
  588. .th-counter-arrow:before {
  589. content:"\ebc2";
  590. font-family:"honeybee";
  591. }
  592.  
  593. .reblog1 {
  594. background-image:linear-gradient({color:Gradient Beginning}, {color:Gradient End});
  595. padding:4px 6px 2px 6px;
  596. border-radius:6px;
  597. margin-right:5px;
  598. }
  599.  
  600. .reblog1 a {
  601. color:{color:Info};
  602. }
  603.  
  604. .pn {
  605. background-color:{color:Post BG};
  606. margin-top:30px;
  607. }
  608.  
  609. .pn li {
  610. list-style-type:none;
  611. }
  612.  
  613. .answer_content, .action {
  614. font-size:0px;
  615. display:inline-block;
  616. }
  617.  
  618. .like, .reblog {
  619. font-size:0px;
  620. display:inline-block;
  621. margin-right:10px;
  622. margin-bottom:7px;
  623. }
  624.  
  625. .like img, .reblog img, .avatar {
  626. width:40px;
  627. height:40px;
  628. border-radius:10px;
  629. display:inline-block;
  630. transition:all 0.5s ease;
  631. }
  632.  
  633. .like img:hover, .reblog img:hover, .avatar:hover {
  634. border-radius:100%;
  635. opacity:0.8;
  636. }
  637.  
  638. .pag {
  639. margin:auto;
  640. width:270px;
  641. text-align:center;
  642. }
  643.  
  644. .pag a, .current_page {
  645. padding:7px 10px;
  646. background-color:{color:Post BG};
  647. margin-right:10px;
  648. text-align:center;
  649. color:{color:Links};
  650. text-decoration:none;
  651. font-family:20px;
  652. transition:all 0.5s ease;
  653. }
  654.  
  655. .current_page, .pag a:hover {
  656. color:{color:Gradient End};
  657. }
  658.  
  659. .pag .th {
  660. font-size:10px;
  661. margin-bottom:25px;
  662. }
  663.  
  664. .th-chevron-left:before {
  665. content:"\ebb9";
  666. font-family:"honeybee";
  667. }
  668.  
  669. .th-chevron-right:before {
  670. content:"\ebc6";
  671. font-family:"honeybee";
  672. }
  673.  
  674. #credit {
  675. position:fixed;
  676. background-color:{color:Post BG};
  677. bottom:10px;
  678. right:10px;
  679. padding:6px 9px;
  680. color:{color:Text};
  681. border-radius:7px;
  682. }
  683.  
  684. {CustomCSS}
  685.  
  686. </style>
  687. </head>
  688. <body class="{select:Post Width}">
  689.  
  690. <div id="sidebar1">
  691. <div id="links">
  692. <a href="/" title="home"><span class="th th-home-o"></span></a>
  693. <a href="/ask" title="ask"><span class="th th-envelope-o"></span></a>
  694. <a href="/submit" title="submit"><span class="th th-location-2-o"></span></a>
  695. <a href="/archive" title="archive"><span class="th th-calendar-1-o"></span></a>
  696. {block:ifSocialMedia}
  697. <div class="sm_border"></div>
  698. <a href="{text:Facebook URL}" title="facebook"><span class="th th-facebook-o"></span></a>
  699. <a href="{text:Twitter URL}" title="twitter"><span class="th th-twitter-o"></span></a>
  700. <a href="{text:Instagram URL}" title="instagram"><span class="th th-instagram-o"></span></a>
  701. {/block:ifSocialMedia}
  702. </div>
  703. </div>
  704.  
  705.  
  706. <div id="sidebar2" class="{select:Sidebar Links}">
  707. <img class="sidebar2_img" src="{image:Sidebar}" width="60px" height="60px"/>
  708.  
  709. <div id="title">{Title}</div>
  710. <div id="desc">{Description}</div>
  711. <div id="links2">
  712. <a href="{text:Link 1 URL}"><span class="th th-aloe-vera-o"></span>{text:Link 1}</a>
  713. <a href="{text:Link 2 URL}"><span class="th th-blossom-o"></span>{text:Link 2}</a>
  714. <a href="{text:Link 3 URL}"><span class="th th-flower-o"></span>{text:Link 3}</a>
  715. <a href="{text:Link 4 URL}"><span class="th th-holly-o"></span>{text:Link 4}</a>
  716. <a href="{text:Link 5 URL}"><span class="th th-rose-o"></span>{text:Link 5}</a>
  717. <a href="{text:Link 6 URL}"><span class="th th-sunflower-o"></span>{text:Link 6}</a>
  718. {block:ifSearchBox}<div class="searchb"><span class="th th-loupe-o"></span><form class="search" action="javascript:return false">
  719. <input type="text" class="query" placeholder="search">
  720. </form></div>{/block:ifSearchBox}
  721. </div>
  722. </div>
  723.  
  724. <div class="posts">
  725. {block:Posts}
  726.  
  727. <!-- {SourceURL} {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource} <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  728.  
  729. <div class="post" id="{PostID}">
  730.  
  731. {block:Text}
  732. <div class="textpost">
  733. {block:Title}<h1 style="margin-bottom:10px">{Title}</h1>{/block:Title}
  734. <div class="cap">{Body}</div>
  735. </div>
  736. {/block:Text}
  737.  
  738. {block:Photo}
  739. <div class="photopost photopp">
  740. <img src="{PhotoURL-HighRes}" width="700px" class="width-700 photop">
  741. <img src="{PhotoURL-HighRes}" width="500px" class="width-500 photop">
  742. <img src="{PhotoURL-HighRes}" width="400px" class="width-400 photop">
  743. <img src="{PhotoURL-HighRes}" width="250px" class="width-250 photop">
  744. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  745. </div>
  746. {/block:Photo}
  747.  
  748. {block:Photoset}
  749. <div class="photopost">
  750. <div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>
  751. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  752. </div>
  753. {/block:Photoset}
  754.  
  755. {block:Quote}
  756. <div class="qt">{Quote}</div>
  757. <h1 class="source">{Source}</h1>
  758. {/block:Quote}
  759.  
  760. {block:Link}
  761. <h1><a href="{LinkURL}" target="_blank">{Name}</a></h1>
  762. {block:Description}<div class="cap">{Description}</div>{/block:Description}
  763. {/block:Link}
  764.  
  765. {block:Video}
  766. {Video-500}
  767. {block:Caption}<div class="cap">{Caption}</div>{/block:Caption}
  768. {/block:Video}
  769.  
  770. {block:Chat}
  771. {block:Title}<h1>{Title}</h1>{/block:Title}
  772. {block:Lines}
  773. <div class="chatline">{block:Label}<b>{Label}</b>{/block:Label} {Line}</div> {/block:Lines}
  774. {/block:Chat}
  775.  
  776. <div class="audio" style="position:relative">
  777. {block:Audio}
  778. <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}" width="100px" height="100px"/>{/block:AlbumArt}</div>
  779. <div class="audp">{AudioPlayerWhite}</div>
  780. <div class="aud">
  781. <div class="audinf"><br>{block:TrackName}<h1 style="margin-top:-5px">{TrackName}</h1>{/block:TrackName}
  782. <br>{block:Artist}{Artist}{/block:Artist}
  783. <p style="margin-top:5px;">{PlayCountWithLabel}</p></div>
  784. </div>
  785. <div class="cap" style="margin-bottom:10px">{block:Caption}{Caption}{/block:Caption}</div>
  786. {/block:Audio}
  787. </div>
  788.  
  789. {block:Answer}
  790. <div class="askp">
  791. <div class="ask">
  792. <img src="{AskerPortraitURL-48}"/>
  793. <h1>{Asker}</h1>
  794. {Question}
  795. </div>
  796. <div class="cap answer">{Answer}</div> </div>
  797. {/block:Answer}
  798.  
  799. {block:Date}
  800. <div class="info">
  801. <a href="{Permalink}" class="perma" title="{NoteCountWithLabel}">{TimeAgo}</a>
  802. <div class="like1"><a class="like-b">{LikeButton}<span class="th th-heart-1-o"></span></a></div>
  803. <div class="reblog1"><a href="{ReblogURL}" target="_blank" ><span class="th th-reblog"></span></a></div>
  804. {block:HasTags}
  805. <div class="tags">
  806. {block:Tags}<a href="{TagURL}" class="tag">{Tag}</a>{/block:Tags}
  807. </div>
  808. {/block:HasTags}
  809. </div>
  810. {/block:Date}
  811.  
  812. {block:PermalinkPage}
  813. <div class="pn">
  814. {block:PostNotes}
  815. {PostNotes-64}
  816. {/block:PostNotes}
  817. </div>
  818. {/block:PermalinkPage}
  819.  
  820. </div>
  821.  
  822. {/block:Posts}
  823.  
  824. {block:Pagination}<div class="pag">{block:PreviousPage}
  825. <a href="{PreviousPage}" class="prev"><span class="th th-chevron-left"></span></a>
  826. {/block:PreviousPage}{block:JumpPagination length="5"}{block:CurrentPage}
  827. <span class="current_page">{PageNumber}</span>
  828. {/block:CurrentPage}{block:JumpPage}
  829. <a class="jump_page" href="{URL}">{PageNumber}</a>
  830. {/block:JumpPage}{/block:JumpPagination}{block:NextPage}
  831. <a href="{NextPage}" class="next"><span class="th th-chevron-right"></span></a>
  832. {/block:NextPage}</div>{/block:Pagination}
  833.  
  834. </div>
  835.  
  836. <a id="credit" title="theme credit" href="https://studyace.tumblr.com">☂</a>
  837.  
  838. <script src="//code.jquery.com/jquery-1.7.1.min.js"></script>
  839. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  840. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  841. <script> $(function(){ $('.post').unnest({
  842. yourCaption: ".cap", //your caption selector, the div wrapping {Caption}
  843. wrapName: ".tumblr_parent", //the name of the captions’ new wrapper
  844. newCaptionUsername: true, //if the user adds a new caption, following a series of captions, show their username above the caption
  845. originalPostCaptionUsername: true, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  846. tumblrAvatars: true, //”dashboard style” caption, have the avatar of the blog next to the username
  847. tumblrAvatarClass: ".tumblr_avatar", //class of the avatar next to the username
  848. usernameColon: false //if turned to false, removes the colon at the end of usernames
  849. }); }); </script>
  850.  
  851. <script src="https://static.tumblr.com/p0knose/nRYp3ktqo/jquery.style-my-tooltips.js"></script>
  852. <script>
  853. (function($){
  854. $(document).ready(function(){
  855. $("a[title]").style_my_tooltips({
  856. tip_follows_cursor:true,
  857. tip_delay_time:30,
  858. tip_fade_speed:300,
  859. attribute:"title"
  860. });
  861. });
  862. })(jQuery);
  863. $(document).ready(function(){
  864. $('.search').submit(function(event){
  865. var value = $('input:first').val();
  866. location.replace('https://{Name}.tumblr.com/tagged/' + value);
  867. });
  868. });
  869. function gatherData(images, arr) {
  870. for (let i = 0; i < images.length; i++) {
  871. let currentData = {
  872. "width": images[i].getAttribute('data-width'),
  873. "height": images[i].getAttribute('data-height'),
  874. "low_res": images[i].getAttribute('data-lowres'),
  875. "high_res": images[i].getAttribute('data-highres')
  876. };
  877. arr.push(currentData);
  878. }
  879. }
  880. function getIndex(elem) {
  881. let i = 0;
  882. while( (elem = elem.previousElementSibling) != null ) i++;
  883. return i;
  884. }
  885. function lightbox(elem) {
  886. let currentPhotoset = elem.parentNode;
  887. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  888. let data = [];
  889. gatherData(photosetPhotos, data);
  890. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  891. }
  892. </script>
  893.  
  894. </body>
  895. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!