API tools faq
paste
Advertisement
loranhale

tokyo

loranhale
Feb 1st, 2019
6,880
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.94 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!--
  5.  
  6.  
  7. tokyo
  8.  
  9. @julesatticus
  10.  
  11.  
  12. -->
  13.  
  14. <head>
  15.  
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  20.  
  21. <link href='https://fonts.googleapis.com/css?family=Fira+Sans:400,400i,600,600i|Lora:400,400i,600,600i|Nunito+Sans:400,400i,600,600i|Open+Sans:400,400i,600,600i|Karla:400,400i,600,600i|Cutive+Mono:400,400i,600,600i|Inconsolata:400,700' rel='stylesheet' type='text/css'>
  22. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
  23. <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  24.  
  25. <!--Default Variables-->
  26.  
  27. <meta name="image:icon" content=""/>
  28.  
  29. <meta name="color:background" content="#ffffff"/>
  30. <meta name="color:text" content="#666666"/>
  31. <meta name="color:link" content="#91a8d0"/>
  32. <meta name="color:link hover" content="#ff6f61"/>
  33. <meta name="color:title"content="#222222"/>
  34. <meta name="color:border" content="#eeeeee"/>
  35. <meta name="color:accent" content="#ff6f61"/>
  36. <meta name="color:posts" content="#ffffff"/>
  37. <meta name="color:icons" content="#c0afdd"/>
  38.  
  39. <meta name="if:infinite scroll" content=""/>
  40. <meta name="if:load more" content=""/>
  41. <meta name="if:search bar" content=""/>
  42. <meta name="if:title" content=""/>
  43. <meta name="if:controls" content=""/>
  44. <meta name="if:icon" content=""/>
  45. <meta name="if:display tumblr avatar" content=""/>
  46.  
  47. <meta name="select:font" content="fira sans"/>
  48. <meta name="select:font" content="trebuchet ms"/>
  49. <meta name="select:font" content="open sans"/>
  50. <meta name="select:font" content="nunito sans"/>
  51. <meta name="select:font" content="karla"/>
  52.  
  53. <meta name="select:font size" content="10px"/>
  54. <meta name="select:font size" content="10.5px"/>
  55. <meta name="select:font size" content="11px"/>
  56.  
  57. <meta name="select:tags" content="tagsshow" title="show">
  58. <meta name="select:tags" content="tagshover" title="hover">
  59. <meta name="select:tags" content="tagshide" title="hide">
  60.  
  61. <meta name="text:sidebar width" content="150"/>
  62. <meta name="text:post width" content="350"/>
  63. <meta name="text:margin" content="100"/>
  64.  
  65. <meta name="text:home" content="home"/>
  66. <meta name="text:ask" content="message"/>
  67. <meta name="text:archive" content="history"/>
  68.  
  69. <meta name="text:link 1 url" content="" />
  70. <meta name="text:link 1" content="" />
  71. <meta name="text:link 2 url" content="" />
  72. <meta name="text:link 2" content="" />
  73. <meta name="text:link 3 url" content="" />
  74. <meta name="text:link 3" content="" />
  75.  
  76. <style type="text/css">
  77.  
  78. /* scrollbar */
  79.  
  80. ::-webkit-scrollbar{
  81. height:4px;
  82. width:9px;
  83. background:{color:background};
  84. }
  85.  
  86. ::-webkit-scrollbar-thumb {
  87. background:{color:accent};
  88. border:4px solid {color:background};
  89. }
  90.  
  91. ::-webkit-scrollbar-track {
  92. background:{color:border};
  93. border:4px solid {color:background};
  94. }
  95.  
  96. /* tumblr controls */
  97.  
  98. iframe.tmblr-iframe {
  99. z-index:99999999999999!important;
  100. top:0px!important;
  101. right:0!important;
  102. opacity:0;
  103. padding-right:38px;
  104. filter:invert(1) contrast(60%);
  105. -webkit-filter:invert(1) contrast(60%);
  106. -o-filter:invert(1) contrast(60%);
  107. -moz-filter:invert(1) contrast(60%);
  108. -ms-filter:invert(1) contrast(60%);
  109. transform:scale(0.65);
  110. transform-origin:100% 0;
  111. -webkit-transform:scale(0.65);
  112. -webkit-transform-origin:100% 0;
  113. -o-transform:scale(0.65);
  114. -o-transform-origin:100% 0;
  115. -moz-transform:scale(0.65);
  116. -moz-transform-origin:100% 0;
  117. -ms-transform:scale(0.65);
  118. -ms-transform-origin:100% 0;
  119. transition: opacity 0.6s ease-in-out;
  120. -moz-transition: opacity 0.6s ease-in-out;
  121. -webkit-transition: opacity 0.6s ease-in-out;
  122. }
  123.  
  124. iframe.tmblr-iframe:hover { opacity:0.6!important; }
  125.  
  126. .hcontrols {
  127. position:fixed;
  128. top:0;
  129. right:0;
  130. z-index:999999999;
  131. }
  132.  
  133. .hcontrols svg { width:18px; height:18px; padding:9px; }
  134. .hcontrols svg path { fill:{color:accent}; }
  135.  
  136. /* tooltips */
  137.  
  138. #s-m-t-tooltip {
  139. max-width:300px;
  140. margin:15px;
  141. padding:2px 6px;
  142. z-index:99999999999;
  143. color:{color:accent};
  144. background:{color:posts};
  145. border:1px solid {color:border};
  146. }
  147.  
  148. /* scroll to top */
  149.  
  150. .top {
  151. position:fixed;
  152. z-index:9999999;
  153. left:30px;
  154. bottom:30px;
  155. display:none;
  156. }
  157.  
  158. .top a .th {
  159. font-size:18px;
  160. color:{color:icons};
  161. transition:all 0.6s ease;
  162. }
  163.  
  164. .top a .th:hover { color:{color:link hover}; }
  165.  
  166. /* keyframes */
  167.  
  168. @keyframes fadein {
  169. from { opacity:0; }
  170. to { opacity:1; }
  171. }
  172.  
  173. @-moz-keyframes fadein {
  174. from { opacity:0; }
  175. to { opacity:1; }
  176. }
  177.  
  178. @-webkit-keyframes fadein {
  179. from { opacity:0; }
  180. to { opacity:1; }
  181. }
  182.  
  183. @-ms-keyframes fadein {
  184. from { opacity:0; }
  185. to { opacity:1; }
  186. }
  187.  
  188. @-o-keyframes fadein {
  189. from { opacity:0; }
  190. to { opacity:1; }
  191. }
  192.  
  193. /* body */
  194.  
  195. body {
  196. background:{color:background};
  197. color:{color:text};
  198. font-family:{select:font}, arial, trebuchet ms, sans-serif;
  199. font-size:{select:font size};
  200. line-height:150%;
  201. margin:0;
  202. letter-spacing:.5px;
  203. word-wrap:break-word;
  204. -moz-osx-font-smoothing:grayscale;
  205. -webkit-font-smoothing:antialiased;
  206. font-smoothing:antialiased;
  207. animation: fadein 1.5s;
  208. -webkit-animation: fadein 1.5s;
  209. -moz-animation: fadein 1.5s;
  210. -o-animation: fadein 1.5s;
  211. }
  212.  
  213. a {
  214. color:{color:link};
  215. text-decoration:none;
  216. transition-duration: 0.6s;
  217. -moz-transition-duration: 0.6s;
  218. -webkit-transition-duration: 0.6s;
  219. -o-transition-duration: 0.6s;
  220. }
  221.  
  222. a:hover { color:{color:link hover}; }
  223.  
  224. blockquote {
  225. border-left:2px solid {color:border};
  226. margin-left:8px;
  227. padding-left:10px;
  228. }
  229.  
  230. pre {
  231. white-space:pre-wrap;
  232. white-space:-moz-pre-wrap;
  233. white-space:-pre-wrap;
  234. white-space:-o-pre-wrap;
  235. word-wrap:break-word;
  236. padding-left:10px;
  237. background:{color:posts};
  238. border-left:2px solid {color:border};
  239. }
  240.  
  241. img { opacity:1; border:none; text-decoration:none; width:auto; }
  242.  
  243. p { margin:10px 0; }
  244. p:first-child { margin-top: 0; }
  245. p:last-child { margin-bottom: 0; }
  246.  
  247. b, strong { color:#333; font-weight:bold; }
  248. i { font-style:italic }
  249.  
  250. small { font-size:calc({select:font size} - .5px); }
  251. big { font-size:calc({select:font size} + 1px); }
  252.  
  253. b a { font-style:bold; }
  254. b a:hover { color:{color:link hover}; }
  255.  
  256. h1 {
  257. font-size:font-size:calc({select:font size} + 4px);
  258. color:{color:title};
  259. margin:6px 0;
  260. font-weight:400;
  261. }
  262.  
  263. h2, h3, h4 {
  264. font-size:font-size:calc({select:font size} + 3px);
  265. color:{color:link};
  266. margin:6px 0;
  267. font-weight:400;
  268. }
  269.  
  270. ol { margin-left:-20px; padding-right:10px;}
  271. ul li { margin-left:-10px; list-style:square; color:{color:text}; }
  272.  
  273. /* font icons */
  274.  
  275. .th {
  276. text-align:center;
  277. display:inline-block;
  278. font-size:12px;
  279. width:12px;
  280. height:12px;
  281. color:{color:icons};
  282. transition:all .6s ease;
  283. }
  284.  
  285. .th:hover { color:{color:accent}; }
  286.  
  287. /* sidebar */
  288.  
  289. aside {
  290. width:{text:sidebar width}px;
  291. left:calc(50% - ({text:post width}px / 2) - {text:margin}px - 150px);
  292. position:fixed;
  293. max-width:200px;
  294. }
  295.  
  296. .r {
  297. width:{text:sidebar width}px;
  298. right:calc(50% - ({text:post width}px / 2) - {text:margin}px - 150px);
  299. position:fixed;
  300. max-width:200px;
  301. }
  302.  
  303. .t { margin-bottom:10px; }
  304. .t a {
  305. font-size:calc({select:font size} + 4px);
  306. font-weight:600;
  307. color:{color:title};
  308. text-transform:lowercase;
  309. letter-spacing:.5px;
  310. font-family:'inconsolata', monospace;
  311. {block:ifnottitle}
  312. display:none;
  313. {/block:ifnottitle}
  314. }
  315.  
  316. .t a:hover { color:{color:link}; }
  317.  
  318. .desc {
  319. display:inline;
  320. float:right;
  321. position:absolute;
  322. width:calc({text:sidebar width}px - 60px);
  323. padding:10px;
  324. border:1px solid {color:border};
  325. background:{color:posts};
  326. border-radius:2px;
  327. {block:ifnoticon}
  328. width:{text:sidebar width}px;
  329. margin-left:-10px;
  330. {/block:ifnoticon}
  331. }
  332.  
  333. /* nav */
  334.  
  335. .links { margin-bottom:10px; counter-reset:section; }
  336.  
  337. .links a, nav {
  338. display:block;
  339. margin-bottom:10px;
  340. font-family:'cutive mono', monospace;
  341. font-weight:600;
  342. font-size:calc({select:font size} + 1px);
  343. }
  344.  
  345. .links a:before, nav:before {
  346. counter-increment:section;
  347. content:'0'counter(section);
  348. margin-right:10px;
  349. color:{color:accent};
  350. }
  351.  
  352. /* icon */
  353.  
  354. .img { width:50px; display:inline; margin-right:10px; }
  355. .img img {
  356. width:50px;
  357. height:50px;
  358. border-radius:2px;
  359. {block:ifnoticon}
  360. display:none;
  361. {/block:ifnoticon}
  362. }
  363.  
  364. /* search bar */
  365.  
  366. nav { width:{text:sidebar width}px; }
  367.  
  368. .si .th {
  369. border:none!important;
  370. display:inline;
  371. position:absolute;
  372. color:{color:icons};
  373. padding-left:1px;
  374. }
  375.  
  376. .search {
  377. margin-left:24px;
  378. margin-top:-15px;
  379. width:100px;
  380. {block:ifNotSearchBar}
  381. display:none;
  382. {/block:ifNotSearchBar}
  383. }
  384.  
  385. .search .query {
  386. border:0;
  387. outline:0;
  388. padding:0;
  389. font-size:calc({select:font size} + 1px);
  390. font-family:'cutive mono',monospace;
  391. font-style:none;
  392. letter-spacing:.5px;
  393. color:{color:link};
  394. background:{color:background};
  395. width:100%;
  396. font-weight:600;
  397. }
  398.  
  399. ::-webkit-input-placeholder { color:{color:text}; }
  400. :-moz-placeholder { color:{color:text}; opacity:1; }
  401. ::-moz-placeholder { color:{color:text}; opacity:1; }
  402. :-ms-input-placeholder { color:{color:text}; }
  403.  
  404. input:focus::-webkit-input-placeholder { color:transparent; }
  405. input:focus:-moz-placeholder { color:transparent; }
  406. input:focus::-moz-placeholder { color:transparent; }
  407. input:focus:-ms-input-placeholder { color:transparent; }
  408.  
  409. /* pagination */
  410.  
  411. footer {
  412. text-align:center;
  413. margin:50px auto 100px auto;
  414. font-size:11px;
  415. }
  416.  
  417. #pg {
  418. color:{color:link};
  419. {block:ifinfinitescroll}
  420. display:none;
  421. {/block:ifinfinitescroll}
  422. margin:0 auto 100px auto;
  423. width:{text:post width}px;
  424. }
  425.  
  426. #pg span { display:inline-block; }
  427. #pg a { display:inline-block; margin:0 5px; }
  428.  
  429. .current_page {
  430. font-weight:bold;
  431. color:{color:link hover};
  432. display:inline-block;
  433. }
  434.  
  435. span.nextprev { float:right; }
  436.  
  437. #infscr-loading { display:none!important; }
  438. a#load { cursor:pointer; text-transform:lowercase; }
  439.  
  440. /* lightbox */
  441.  
  442. .lightbox-caption, #tumblr_lightbox_caption { visibility:hidden; }
  443. .vignette, #vignette { opacity:0; }
  444. .lightbox-image, #tumblr_lightbox img {
  445. box-shadow:none !important;
  446. border-radius:0 !important;
  447. }
  448.  
  449. .tmblr-lightbox, #tumblr_lightbox {
  450. background-color:{color:background}!important;
  451. z-index:99999!important;
  452. }
  453.  
  454. /* photoset */
  455.  
  456. .photo-slideshow .count-1 { margin-bottom:1px!important; }
  457. .photo-slideshow .count-2 {
  458. margin-left:1px!important;
  459. margin-bottom:1px!important;
  460. width:calc(50% - (1px/2))!important;
  461. }
  462.  
  463. .photo-slideshow .count-2:first-child { margin-left:0!important; }
  464. .photo-slideshow .count-3 {
  465. margin-left:1px!important;
  466. margin-bottom:1px!important;
  467. width:calc((100% - (2 * 1px))/3)!important;
  468. }
  469.  
  470. .photo-slideshow .count-3:first-child { margin-left:0!important; }
  471. .photo-slideshow {
  472. display:block!important;
  473. margin-bottom:calc(-(1px - 3px));
  474. position:relative;
  475. width:100%;
  476. }
  477.  
  478. .defcap .photo-slideshow.processed { margin-bottom:0!important; }
  479. .defcap .row:last-of-type .count-1{ margin-bottom:0!important; }
  480. .unnested .photo-slideshow.processed { margin-bottom:calc({select:font size} * (2/3)) !important; }
  481.  
  482. /* posts */
  483.  
  484. #entries {
  485. width:{text:post width}px;
  486. margin:{text:margin}px auto;
  487. }
  488.  
  489. .posts {
  490. width:{text:post width}px;
  491. margin:{text:margin}px auto 0px;
  492. position:relative;
  493. max-width:500px;
  494. min-width:250px;
  495. }
  496.  
  497. .posts img { max-width:100%; }
  498. .media img, .media iframe { width:100%; display:block; }
  499. .posts img, .posts li, .posts blockquote { max-width:100%; }
  500. .caption img, .caption iframe { max-width:100%; }
  501. .posts li, .posts blockquote, .posts img { max-width:100%; height:auto; }
  502.  
  503. /* text */
  504.  
  505. .title {
  506. padding-bottom:10px;
  507. color:{color:text};
  508. font-size:calc({select:font size} + 3px);
  509. font-weight:600;
  510. }
  511.  
  512. .title a { color:{color:link}; }
  513. .title a:hover { color:{color:link hover}; }
  514.  
  515. .text {
  516. padding:15px;
  517. border:1px solid {color:border};
  518. border-radius:2px;
  519. background:{color:posts};
  520. }
  521.  
  522. /* caption */
  523.  
  524. .caption {
  525. border:1px solid {color:border};
  526. padding:15px;
  527. border-radius:2px;
  528. background:{color:posts};
  529. margin-top:3px;
  530. }
  531.  
  532. .commenter img, .blog img {
  533. width:20px;
  534. height:20px;
  535. border-radius:2px;
  536. margin-right:10px;
  537. vertical-align:-11px;
  538. margin-bottom:5px;
  539. {block:ifnotdisplaytumblravatar}
  540. display:none;
  541. {/block:ifnotdisplaytumblravatar}
  542. }
  543.  
  544. .commenter, .blog {
  545. display:inline;
  546. font-weight:600;
  547. text-transform:lowercase;
  548. letter-spacing:1px;
  549. font-size:calc({select:font size} + 1px);
  550. }
  551.  
  552. .commenter a { color:{color:accent}; }
  553. .commenter a:hover { color:{color:title}; }
  554.  
  555. .deactivated::after {
  556. content:"deactivated";
  557. margin-left:5px;
  558. opacity:0;
  559. transition:all .6s ease
  560. }
  561.  
  562. .posts:hover .deactivated:after { opacity:1; }
  563.  
  564. /* quote */
  565.  
  566. .q {
  567. padding:15px;
  568. border:1px solid {color:border};
  569. border-radius:2px;
  570. background:{color:posts};
  571. font-size:14px;
  572. font-family:'Lora', sans-serif;
  573. line-height:15px;
  574. font-style:italic;
  575. color:{color:title};
  576. margin-bottom:10px;
  577. }
  578.  
  579. .source { font-style:none; text-align:right; }
  580.  
  581. /* audio */
  582.  
  583. .audio { margin-bottom:5px; }
  584.  
  585. .player {
  586. width:30px;
  587. height:30px;
  588. position:absolute;
  589. overflow:hidden;
  590. margin-top:1px;
  591. }
  592.  
  593. .hold {
  594. background:#f2f2f2;
  595. border:1px solid {color:border};
  596. border-radius:2px;
  597. position:absolute;
  598. width:30px;
  599. height:30px;
  600. padding:15px;
  601. float:left;
  602. }
  603.  
  604. .audioinfo {
  605. background:{color:posts};
  606. height:30px;
  607. padding:15px;
  608. margin-left:70px;
  609. border:1px solid {color:border};
  610. border-radius:2px;
  611. }
  612.  
  613. .td { max-height:30px; overflow-y:scroll; }
  614. .track {
  615. font-weight:600;
  616. color:{color:title};
  617. font-size:calc({select:font size} + .5px);
  618. }
  619.  
  620. /* video */
  621.  
  622. .video { border:1px solid transparent; }
  623.  
  624. /* ask */
  625.  
  626. .a {
  627. background:{color:posts};
  628. border:1px solid {color:border};
  629. border-radius:2px;
  630. }
  631.  
  632. .ask { padding:15px; border-bottom:1px solid {color:border}; }
  633.  
  634. .asker {
  635. display:inline;
  636. position:relative;
  637. text-transform:lowercase;
  638. font-weight:600;
  639. }
  640.  
  641. .asker img, .answerer img {
  642. width:18px;
  643. height:18px;
  644. border-radius:3px;
  645. margin-right:10px;
  646. margin-bottom:10px;
  647. vertical-align:-15px;
  648. {block:ifnotdisplaytumblravatar}
  649. display:none;
  650. {/block:ifnotdisplaytumblravatar}
  651. }
  652.  
  653. .ans { padding:15px; }
  654. .answerer b { font-weight:600; color:{color:link}; }
  655. .answerer:hover { cursor:pointer; }
  656.  
  657. /* chat */
  658.  
  659. .chat {
  660. list-style:none;
  661. padding:15px;
  662. border:1px solid {color:border};
  663. border-radius:2px;
  664. background:{color:posts};
  665. }
  666.  
  667. .label {
  668. font-weight:bold;
  669. color:{color:title};
  670. display:inline-block;
  671. margin-right:3px;
  672. }
  673.  
  674. .l { margin-bottom:2px; }
  675. .l:last-of-type { margin-bottom:0; }
  676.  
  677. /* permalink */
  678.  
  679. .up { margin-bottom:10px; }
  680.  
  681. .when .th {
  682. width:11px;
  683. height:11px;
  684. font-size:11px;
  685. text-align:center;
  686. display:inline-block;
  687. padding:5px;
  688. border:1px solid #ff6f61;
  689. border-radius:50%;
  690. margin-right:10px;
  691. color:#ff6f61;
  692. transition:all .6s ease;
  693. }
  694.  
  695. .when a {
  696. font-size:calc({select:font size} + 1px);
  697. color:{color:text};
  698. font-weight:600;
  699. }
  700.  
  701. .when a:hover { color:{color:link}; }
  702.  
  703. .permalink { margin-top:5px; margin-bottom:50px; }
  704. .permalink a { text-transform:lowercase; }
  705. .permalink a:hover { color:{color:link hover}; }
  706. .pt a { margin-right:6px; }
  707.  
  708. /* tags */
  709.  
  710. .tags { margin:5px 0; }
  711. .tags a:before { content:'#'; }
  712. .tags a { margin-right:5px; color:{color:link}; }
  713. .tags a:hover { color:{color:link hover}; }
  714.  
  715. .tagsshow { opacity:1; }
  716. .tagshide { display:none; }
  717. .tagshover {
  718. opacity:0;
  719. transition:all .6s ease;
  720. -webkit-transition:all .6s ease;
  721. -moz-transition:all .6s ease;
  722. -o-transition:all .6s ease;
  723. }
  724.  
  725. .posts:hover .tagshover { opacity:1; }
  726.  
  727. /* post notes */
  728.  
  729. .pn {
  730. padding:10px 0;
  731. border-top:1px solid {color:border};
  732. background:{color:background};
  733. }
  734.  
  735. .nt {
  736. margin-bottom:10px;
  737. font-size:13px;
  738. color:{color:accent};
  739. }
  740.  
  741. ol.notes {
  742. list-style-type:none;
  743. text-align:left;
  744. padding:0px;
  745. margin:0;
  746. }
  747.  
  748. ol.notes li.note blockquote {
  749. border-left:1px solid {color:border};
  750. padding-left:10px;
  751. margin-left:10px;
  752. }
  753.  
  754. ol.notes li.note { display:block; padding:0; margin:5px 0; }
  755. ol.notes li.note img.avatar { display:none!important; }
  756. a.more_notes_link {
  757. display:block;
  758. text-align:left;
  759. color:{color:link};
  760. }
  761.  
  762. a.more_notes_link:hover { color:{color:link hover}; }
  763.  
  764. /* like and reblog buttons */
  765.  
  766. .controls {
  767. margin-top:-15px;
  768. float:right;
  769. {block:ifNotControls}
  770. display:none;
  771. {/block:ifNotControls}
  772. }
  773.  
  774. .controls a { overflow:hidden; width:auto; height:auto; }
  775.  
  776. .controls .th {
  777. font-size:12px;
  778. width:12px;
  779. height:12px;
  780. color:{color:icons};
  781. overflow:visible;
  782. border:none!important;
  783. transition:all .6s ease;
  784. -webkit-transition:all .6s ease;
  785. -moz-transition:all .6s ease;
  786. -o-transition:all .6s ease;
  787. }
  788.  
  789. .like:hover .th, .reblog:hover .th {
  790. color:{color:link hover}!important;
  791. }
  792.  
  793. .controls .reblog { opacity:.93; }
  794.  
  795. .controls .like {
  796. margin-top:-15px;
  797. margin-left:22px;
  798. margin-right:0px;
  799. }
  800.  
  801. .controls .like .like_botton:hover + .th {
  802. color:{color:link hover}!important;
  803. transition:all .6s ease;
  804. -webkit-transition:all .6s ease;
  805. -moz-transition:all .6s ease;
  806. -o-transition:all .6s ease;
  807. }
  808.  
  809. .controls .like .liked + .th { opacity:1; }
  810. .controls .like .liked + .th { color:#ec5a5a; }
  811. .controls .like .like_button { position:relative; }
  812.  
  813. .controls .like .like_button iframe {
  814. position:absolute;
  815. top:0;
  816. left:0;
  817. bottom:0;
  818. right:0;
  819. z-index:2;
  820. opacity:0.000001;
  821. }
  822.  
  823. iframe#ask_form{ height:255px!important; }
  824.  
  825. /* do not disturb */
  826.  
  827. .lo { bottom:20px; right:20px; position:fixed; }
  828. .lo a { text-transform:uppercase; font-size:12px; }
  829.  
  830. {CustomCSS}
  831.  
  832. </style>
  833.  
  834. <!-- scripts -->
  835.  
  836. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  837. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  838. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  839.  
  840. <script>
  841. $(document).ready(function() {
  842. $('.photo-slideshow').pxuPhotoset({
  843. lightbox: true,
  844. rounded: false,
  845. gutter: '0px',
  846. borderRadius: '0px',
  847. photoset: '.photo-slideshow',
  848. photoWrap: '.photo-data',
  849. photo: '.pxu-photo'
  850. });
  851. });
  852. </script>
  853.  
  854. <script>
  855. $(document).ready(function(){
  856. $('.search').submit(function(event){
  857. var value = $('input:first').val();
  858. location.replace('https://{Name}.tumblr.com/tagged/' + value);
  859. });
  860. });
  861. </script>
  862.  
  863. </head>
  864. <body>
  865.  
  866. <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M106.6,134c14.3,0,26-11.7,26-26s-11.7-26-26-26s-26,11.7-26,26S92.2,134,106.6,134z M106.6,94c7.7,0,14,6.3,14,14s-6.3,14-14,14s-14-6.3-14-14S98.9,94,106.6,94z M40.4,124.6l7.2,3.3c3,1.4,4.4,4.8,3.3,7.9l-2.8,7.4c-2.1,5.7-1.4,11.8,2.1,16.7c3.4,5,9,7.9,15,7.9c2.2,0,4.4-0.4,6.5-1.2l7.4-2.8c0.7-0.3,1.4-0.4,2.2-0.4c2.4,0,4.7,1.4,5.7,3.7l3.3,7.2c3,6.6,9.4,10.7,16.6,10.7s13.6-4.1,16.6-10.7l3.3-7.2c1-2.2,3.2-3.7,5.7-3.7c0.7,0,1.5,0.1,2.2,0.4l7.4,2.8c2.1,0.8,4.3,1.2,6.5,1.2c0,0,0,0,0,0c5.9,0,11.5-3,15-7.9c3.4-5,4.2-11.1,2.1-16.7l-2.8-7.4c-1.1-3.1,0.3-6.5,3.3-7.9l7.2-3.3c6.6-3,10.7-9.4,10.7-16.6s-4.1-13.6-10.7-16.6l-7.2-3.3c-3-1.4-4.4-4.8-3.3-7.9l2.8-7.4c2.1-5.7,1.4-11.8-2.1-16.7c-3.4-5-9-7.9-15-7.9c-2.2,0-4.4,0.4-6.5,1.2l-7.4,2.8c-0.7,0.3-1.4,0.4-2.2,0.4c-2.4,0-4.7-1.4-5.7-3.7l-3.3-7.2c-3-6.6-9.4-10.7-16.6-10.7S93,35.2,90,41.8l-3.3,7.2c-1,2.2-3.2,3.7-5.7,3.7c-0.7,0-1.5-0.1-2.2-0.4l-7.4-2.8c-2.1-0.8-4.3-1.2-6.5-1.2c-5.9,0-11.5,3-15,7.9c-3.4,5-4.2,11.1-2.1,16.7l2.8,7.4c1.1,3.1-0.3,6.5-3.3,7.9l-7.2,3.3c-6.6,3-10.7,9.4-10.7,16.6S33.8,121.6,40.4,124.6z M45.3,102.3l7.2-3.3c8.7-4,12.9-14.1,9.5-23l-2.8-7.4c-1-2.7,0-4.7,0.7-5.7c1.6-2.4,4.6-3.4,7.4-2.3l7.4,2.8c2.1,0.8,4.2,1.2,6.4,1.2c0,0,0,0,0,0c7.1,0,13.6-4.2,16.6-10.7l3.3-7.2c1.5-3.4,4.7-3.7,5.7-3.7s4.1,0.3,5.7,3.7l3.3,7.2c3,6.5,9.5,10.7,16.6,10.7c2.2,0,4.3-0.4,6.4-1.2l7.4-2.8c2.8-1,5.7,0,7.4,2.3c0.7,1,1.7,3,0.7,5.7l-2.8,7.4c-3.3,8.9,0.8,19,9.5,23l7.2,3.3c3.4,1.5,3.7,4.7,3.7,5.7s-0.3,4.1-3.7,5.7l-7.2,3.3c-8.7,4-12.9,14.1-9.5,23l2.8,7.4c1,2.7,0,4.7-0.7,5.7c-1.6,2.4-4.6,3.4-7.4,2.3l-7.4-2.8c-2.1-0.8-4.2-1.2-6.4-1.2c-7.1,0-13.6,4.2-16.6,10.7l-3.3,7.2c-1.5,3.4-4.7,3.7-5.7,3.7s-4.1-0.3-5.7-3.7l-3.3-7.2c-3-6.5-9.5-10.7-16.6-10.7c-2.2,0-4.3,0.4-6.4,1.2l-7.4,2.8c-2.8,1-5.7,0-7.4-2.3c-0.7-1-1.7-3-0.7-5.7l2.8-7.4c3.3-8.9-0.8-19-9.5-23l-7.2-3.3c-3.4-1.5-3.7-4.7-3.7-5.7S41.9,103.9,45.3,102.3z"/></svg></div>
  867.  
  868. <aside>
  869.  
  870. <div class="t"><a href="/">{title}</a></div>
  871. <div class="img"><img src="{image:icon}"/></div>
  872. <div class="desc">{Description}</div>
  873.  
  874. </aside>
  875.  
  876. <div class="r">
  877. <div class="links">
  878. <a href="/">{text:home}</a>
  879. <a href="/ask">{text:ask}</a>
  880. <a href="/archive">{text:archive}</a>
  881. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  882. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}
  883. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:ifLink3}
  884.  
  885. {block:ifsearchbar}
  886. <nav>
  887. <form action="/search" method="get" class="search">
  888. <input type="text" name="q" value="{SearchQuery}" class="query" placeholder="search"></form>
  889. </nav>
  890. {/block:ifsearchbar}
  891.  
  892. </div>
  893. </div>
  894.  
  895. <!-- posts -->
  896.  
  897. <section id="entries">
  898.  
  899. {block:Posts}
  900. <div class="posts" {PostType} id="{PostID}">
  901.  
  902. {block:IndexPage}
  903. <div class="up">
  904. {block:Date}
  905. <div class="when">
  906. <a href="{Permalink}"><span class="th th-paper-plane-o"></span>{NoteCountWithLabel}</a>
  907. </div>
  908.  
  909. <div class="controls">
  910. <div class="reblog">
  911. <a href="{ReblogURL}" target="_blank" class="reblog">
  912. <span class="th th-reblog"></span>
  913. </a>
  914. </div>
  915.  
  916. <div class="like">{LikeButton}
  917. <span class="th th-heart-1-o"></span>
  918. </div>
  919. </div>
  920. {/block:Date}
  921. </div>
  922. {/block:IndexPage}
  923.  
  924. {block:Text}
  925. {block:Title}<div class="title">{title}</div>{/block:Title}
  926. {/block:Text}
  927.  
  928. {block:Text}
  929. <div class="text">
  930. {block:NotReblog}{Body}{/block:NotReblog}
  931.  
  932. {block:RebloggedFrom}
  933. {block:Reblogs}
  934. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  935.  
  936. <div class="comment">
  937. {block:IsActive}
  938. <div class="commenter"><a target="_blank" href="{Permalink}"><img src="{PortraitURL-64}" />{Username}</a></div>
  939. {/block:IsActive}
  940.  
  941. {block:IsDeactivated}
  942. <div class="deactivated"><div class="blog">{Username}</div></div>
  943. {/block:IsDeactivated}
  944.  
  945. <div class="reblog-content">{Body}</div>
  946. </div>
  947.  
  948. </div>
  949. {/block:Reblogs}
  950. {/block:RebloggedFrom}
  951.  
  952. </div>
  953. {/block:Text}
  954.  
  955. {block:Quote}
  956. <div class="quote">
  957. <div class="q">{Quote}</div>
  958. {block:Source}<div class="source">{Source}</div>{/block:Source}
  959. </div>
  960. {/block:Quote}
  961.  
  962. {block:Link}
  963. <a href="{URL}" class="path{block:Description} has-desc{/block:Description}" {Target}>{Name}</a>
  964. {block:Description}
  965. <div class="link-description">
  966. {block:NotReblog}{Description}{/block:NotReblog}
  967.  
  968. {block:RebloggedFrom}
  969. {block:Reblogs}
  970. <div class="comment">
  971. {block:IsActive}
  972. <div class="commenter"><a target="_blank" href="{Permalink}"><img src="{PortraitURL-64}" />{Username}</a></div>
  973. {/block:IsActive}
  974.  
  975. {block:IsDeactivated}
  976. <div class="deactivated"><div class="blog">{Username}</div></div>
  977. {/block:IsDeactivated}
  978.  
  979. <div class="reblog-content">{Body}</div>
  980. </div>
  981. {/block:Reblogs}
  982. {/block:RebloggedFrom}
  983. </div>
  984. {/block:Description}
  985. {/block:Link}
  986.  
  987. {block:Chat}
  988. <div class="chat">
  989. {block:lines}
  990. <li class="l {Alt}">
  991. {block:label}<span class="label">{label}</span>{/block:label} {line}
  992. </li>
  993. {/block:lines}
  994. </div>
  995. {/block:Chat}
  996.  
  997. {block:Audio}
  998. <div class="audio">
  999. <div class="hold">
  1000. {block:audioplayer}
  1001. <div class="player">{audioplayerwhite}</div>
  1002. {/block:audioplayer}
  1003. </div>
  1004. <div class="audioinfo">
  1005. <div class="td">
  1006. {block:trackname}<div class="track">{trackname}</div>{/block:trackname}
  1007. {block:artist}<div class="artist">{artist}</div>{/block:artist}
  1008. </div>
  1009. </div>
  1010. </div>
  1011. {/block:Audio}
  1012.  
  1013. {block:Video}
  1014. <div class="video">{Video-500}</div>
  1015. {/block:Video}
  1016.  
  1017. {block:Answer}
  1018. <div class="a">
  1019. <div class="ask">
  1020. <div class="asker"><img src="{AskerPortraitURL-48}"/>{Asker}</div>
  1021. <div class="question">{Question}</div>
  1022. </div>
  1023.  
  1024. {block:Answerer}
  1025. <div class="ans">
  1026. <div class="answerer"><img src="{AnswererPortraitURL-48}"/>{Answerer}</div>
  1027. <div class="answer">{Answer}</div>
  1028. </div>
  1029.  
  1030. {block:RebloggedFrom}
  1031. {block:Reblogs}
  1032. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1033.  
  1034. <div class="comment">
  1035. {block:IsActive}
  1036. <div class="commenter"><a target="_blank" href="{Permalink}"><img src="{PortraitURL-64}" />{Username}</a></div>
  1037. {/block:IsActive}
  1038.  
  1039. {block:IsDeactivated}
  1040. <div class="deactivated"><div class="blog">{Username}</div></div>
  1041. {/block:IsDeactivated}
  1042.  
  1043. <div class="reblog-content">{Body}</div>
  1044. </div>
  1045.  
  1046. </div>
  1047. {/block:Reblogs}
  1048. {/block:RebloggedFrom}
  1049. {/block:Answerer}
  1050.  
  1051. {block:NotReblog}
  1052. <div class="ans">
  1053. <div class="answerer"><img src="{PortraitURL-128}"/><b>{Name}</b></div>
  1054. <div class="answer">{Replies}</div>
  1055. </div>
  1056. {/block:NotReblog}
  1057. </div>
  1058. {/block:Answer}
  1059.  
  1060. {block:Photo}
  1061. <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">
  1062. <img src="{PhotoURL-HighRes}" style="display:block;" width="{text:post width}px"></a>
  1063. {/block:Photo}
  1064.  
  1065. {block:Photoset}
  1066. <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>
  1067. {/block:Photoset}
  1068.  
  1069. {block:Caption}
  1070. <div class="caption">
  1071. {block:NotReblog}<figcaption>{Caption}</figcaption>{/block:NotReblog}
  1072.  
  1073. {block:RebloggedFrom}
  1074. <div class="reblog-list">
  1075. {block:Reblogs}
  1076. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1077.  
  1078. <div class="comment">
  1079. {block:IsActive}
  1080. <div class="commenter"><a target="_blank" href="{Permalink}"><img src="{PortraitURL-64}" />{Username}</a></div>
  1081. {/block:IsActive}
  1082.  
  1083. {block:IsDeactivated}
  1084. <div class="deactivated"><div class="blog">{Username}</div></div>
  1085. {/block:IsDeactivated}
  1086.  
  1087. <div class="reblog-content">{Body}</div>
  1088. </div>
  1089.  
  1090. </div>
  1091. {/block:Reblogs}
  1092. </div>
  1093. {/block:RebloggedFrom}
  1094.  
  1095. </div>
  1096. {/block:Caption}
  1097.  
  1098. {block:indexpage}
  1099. <div class="perma">
  1100.  
  1101. {block:HasTags}
  1102. <div class="{select:tags} tags">
  1103. {block:Tags}
  1104. <a href="{TagUrl}">{Tag}</a>
  1105. {/block:Tags}
  1106. </div>
  1107. {/block:HasTags}
  1108.  
  1109. </div>
  1110. {/block:indexpage}
  1111.  
  1112. {block:permalinkpage}
  1113. {block:Date}
  1114. <div class="permalink">
  1115. posted {timeago} on {dayofmonth} {month} {year}
  1116. {block:RebloggedFrom}<br>
  1117. via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp;&nbsp;&nbsp; source: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1118. {block:HasTags}
  1119. <div class="pt">tagged: {block:Tags}<a href="{TagUrl}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1120. </div>
  1121. {/block:Date}
  1122. {/block:permalinkpage}
  1123.  
  1124. {block:PostNotes}
  1125. <div class="nt">{notecountwithlabel}</div>
  1126. <div class="pn">{PostNotes}</div>
  1127. {/block:PostNotes}
  1128.  
  1129. </div>
  1130. {/block:Posts}
  1131.  
  1132. </section>
  1133.  
  1134. {block:indexpage}
  1135. {block:Pagination}
  1136. <div id="pg">
  1137. <span>
  1138. {block:JumpPagination length="3"}{block:CurrentPage}<a class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1139. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1140.  
  1141. <span class="nextprev">
  1142. {block:PreviousPage}<a href="{PreviousPage}">back</a>{block:nextpage} / {/block:nextpage}
  1143. {/block:PreviousPage}
  1144. {block:NextPage}<a class="nxtpg" href="{NextPage}">next</a>{/block:NextPage}
  1145. </span>
  1146. </div>
  1147.  
  1148. {block:ifloadmore}
  1149. <footer>
  1150. <a id="load">load more</a>
  1151. </footer>
  1152. {/block:ifloadmore}
  1153. {/block:Pagination}
  1154. {/block:indexpage}
  1155.  
  1156. {block:ContentSource}
  1157. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1158. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1159. {/block:SourceLogo}
  1160. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1161. {/block:ContentSource}
  1162.  
  1163. <div class="top"><a href="#"><span class="th th-chevron-up"></span>
  1164. </a></div>
  1165.  
  1166. <!--- do not disturb --->
  1167.  
  1168. {block:indexpage}
  1169. {block:ifinfinitescroll}
  1170. <script src="https://static.tumblr.com/xbvpdcx/9LRo1g4a7/jquery.infinitescroll.min.js"></script>
  1171.  
  1172. <script>
  1173. // Infinite Scroll
  1174. $(function() {
  1175.  
  1176. var $container = $('#entries');
  1177. $container.infinitescroll({
  1178.  
  1179. loading: {
  1180. finishedMsg: "<em>No more posts</em>",
  1181. img: null,
  1182. msg: null,
  1183. msgText: "<em>Loading posts...</em>",
  1184. {block:ifloadmore}
  1185. finished: function () {$('a#load').text('Load More'); },
  1186. {/block:ifloadmore}
  1187.  
  1188. },
  1189.  
  1190. navSelector : '#pg',
  1191. nextSelector : '#pg a:last',
  1192. itemSelector : '.posts',
  1193. {block:ifloadmore}
  1194. errorCallback: function () {$('a#load').fadeOut();},
  1195. {/block:ifloadmore}
  1196. bufferPx : 600,
  1197.  
  1198. },
  1199.  
  1200. function( newElements ) {
  1201. $( newElements ).find('.photo-slideshow').pxuPhotoset({
  1202. lightbox: true,
  1203. rounded: true,
  1204. gutter: '0px',
  1205. borderRadius: '0px',
  1206. photoset: '.photo-slideshow',
  1207. photoWrap: '.photo-data',
  1208. photo: '.pxu-photo'
  1209. });
  1210.  
  1211. resizeVideos();
  1212.  
  1213. var $newElems = $(newElements);
  1214. var $newElemsIDs = $newElems.map(function(){
  1215. return this.id;
  1216. }).get();
  1217. console.log($newElems, $newElemsIDs);
  1218. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1219.  
  1220.  
  1221. });
  1222.  
  1223. {block:ifloadmore}
  1224. $container.infinitescroll('unbind');
  1225. $('a#load').on('click', function(e) {
  1226. e.preventDefault();
  1227. $container.infinitescroll('retrieve');
  1228. });
  1229. {/block:ifloadmore}
  1230. });
  1231. </script>
  1232. {/block:ifinfinitescroll}
  1233. {/block:indexpage}
  1234.  
  1235. <div class="lo"><a href="https://julesatticus.tumblr.com" title="theme">j</a></div>
  1236.  
  1237. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1238. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  1239. <script>
  1240. jQuery.noConflict();
  1241. (function($){
  1242. $(document).ready(function(){
  1243. $("a[title],img[title],[title]").style_my_tooltips({
  1244. tip_follows_cursor:true,
  1245. tip_delay_time:200,
  1246. tip_fade_speed:300,
  1247. attribute:"title"
  1248. });
  1249. });
  1250. })(jQuery);
  1251.  
  1252. //scroll to top
  1253. $(window).scroll(function(){
  1254. if ($(this).scrollTop() > 100) {
  1255. $('.top').fadeIn('slow');
  1256. } else {
  1257. $('.top').fadeOut('slow');
  1258. }
  1259. });
  1260. //Click event to scroll to top
  1261. $('.top').click(function(){
  1262. $('html, body').animate({scrollTop : 0},700);
  1263. return false;
  1264. });
  1265. </script>
  1266.  
  1267. </body>
  1268. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!