Advertisement
ILikeMochiCx

Zephyr

Jun 17th, 2018
8,806
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.54 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400italic' rel='stylesheet' type='text/css'>
  7. <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i" rel="stylesheet">
  8. <link href="https://file.myfontastic.com/S8E3xNJickH6zYXAALoSQh/icons.css" rel="stylesheet">
  9.  
  10. <title>{Title}</title>
  11.  
  12. <!--
  13. ___________________________________________________________________________
  14.  
  15.  
  16. Zephyr - Theme #14
  17. my usual terms apply; please do not redstribute, copy, or steal in any way
  18.  
  19. shoseii.tumblr.com
  20.  
  21. ___________________________________________________________________________
  22.  
  23. -->
  24.  
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27.  
  28. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  29.  
  30.  
  31. {block:Description}<meta name="description" content="{MetaDescription}" />
  32. {/block:Description}
  33.  
  34. <meta name="image:Background" content=""/>
  35. <meta name="image:Header" content=""/>
  36.  
  37. <meta name="color:Background" content="#ffffff"/>
  38. <meta name="color:Posts Background" content="#ffffff"/>
  39. <meta name="color:Border Color" content="#eeeeee"/>
  40. <meta name="color:Text" content="#000000"/>
  41. <meta name="color:Bold" content="#ED6B73"/>
  42. <meta name="color:Caption" content="#f9f9f9"/>
  43. <meta name="color:Caption Text" content="#898989"/>
  44. <meta name="color:Title" content="#000000"/>
  45. <meta name="color:Nav Link Text" content="#ffffff">
  46. <meta name="color:Link" content="#797979"/>
  47. <meta name="color:Link Hover" content="#f59797"/>
  48. <meta name="color:Selection" content="#a5d7f0"/>
  49. <meta name="color:Scrollbar" content="#cccccc"/>
  50.  
  51. <meta name="text:Link 1" content=""/>
  52. <meta name="text:Link 1 URL" content=""/>
  53. <meta name="text:Link 2" content=""/>
  54. <meta name="text:Link 2 URL" content=""/>
  55. <meta name="text:Link 3" content=""/>
  56. <meta name="text:Link 3 URL" content=""/>
  57. <meta name="text:Link 4" content=""/>
  58. <meta name="text:Link 4 URL" content=""/>
  59. <meta name="text:Link 5" content=""/>
  60. <meta name="text:Link 5 URL" content=""/>
  61. <meta name="text:Link 6" content=""/>
  62. <meta name="text:Link 6 URL" content=""/>
  63.  
  64. <meta name="select:Post Width" content="200" title="200px"/>
  65. <meta name="select:Post Width" content="250" title="250px"/>
  66. <meta name="select:Post Width" content="300" title="300px"/>
  67. <meta name="select:Post Width" content="350" title="350px"/>
  68. <meta name="select:Post Width" content="400" title="400px"/>
  69. <meta name="select:Post Width" content="450" title="450px"/>
  70. <meta name="select:Post Width" content="500" title="500px"/>
  71. <meta name="select:Post Width" content="550" title="550px"/>
  72. <meta name="select:Post Width" content="600" title="600px"/>
  73. <meta name="select:Post Width" content="650" title="650px"/>
  74. <meta name="select:Post Width" content="700" title="700px"/>
  75.  
  76. <meta name="if:Popup Header" content="1"/>
  77. <meta name="if:Infinite Scroll" content="1"/>
  78. <meta name="if:Manual Load" content=""/>
  79. <meta name="if:Mini Cursor" content=""/>
  80. <meta name="if:Grayscale Effect" content=""/>
  81. <meta name="if:Post Fade" content="1"/>
  82. <meta name="if:Show Caption" content=""/>
  83. <meta name="if:Multi Column" content=""/>
  84.  
  85. <style type="text/css">
  86.  
  87. @font-face{
  88. font-family:Objectivity;
  89. src:url(https://static.tumblr.com/2e9nahe/DNGpa8o1c/objectivity-bold.woff)
  90. }
  91.  
  92. {block:ifMiniCursor}
  93. *, body, a {cursor: url(http://static.tumblr.com/p7wg3p9/o3jmn8igq/tiny.png), auto;}
  94.  
  95. a:hover {cursor: url(http://static.tumblr.com/p7wg3p9/EWnmn8ip5/tinyhover.png), auto;}
  96. {/block:ifMiniCursor}
  97.  
  98. ::-webkit-scrollbar{
  99. width:17px;
  100. height:17px;
  101. background-color:{color:Background};
  102. }
  103.  
  104. ::-webkit-scrollbar:horizontal{
  105. display:none;
  106. }
  107.  
  108. ::-webkit-scrollbar-track {
  109. border:8px solid {color:Background};
  110. background-color:#ccc;
  111. }
  112.  
  113. ::-webkit-scrollbar-thumb {
  114. border:8px solid {color:Background};
  115. background-color:{color:Scrollbar};
  116. }
  117.  
  118. ::-moz-selection{
  119. background:{color:Selection};
  120. color:#fff;
  121. }
  122.  
  123. ::selection{
  124. background:{color:Selection};
  125. color:#fff;
  126. }
  127.  
  128. body{
  129. width:100%;
  130. margin:0;
  131. font:13px 'Source Sans Pro', sans-serif;
  132. line-height:20px;
  133. font-weight:400;
  134. color:{color:Text};
  135. text-align:left;
  136. -webkit-font-smoothing: antialiased;
  137. -moz-osx-font-smoothing: grayscale;
  138. background:{color:Background} url('{image:Background}') fixed repeat center;
  139. }
  140.  
  141. a{
  142. text-decoration:none;
  143. outline:none;
  144. -moz-outline-style:none;
  145. color:{color:Link};
  146. cursor:pointer;
  147. -webkit-transition: all 0.3s ease-in-out;
  148. -moz-transition: all 0.3s ease-in-out;
  149. -o-transition: all 0.3s ease-in-out;
  150. -ms-transition: all 0.3s ease-in-out
  151. transition: all 0.3s ease-in-out;
  152. }
  153.  
  154. a:visited{
  155. color:{color:Link};
  156. }
  157.  
  158. a:hover{
  159. color:{color:Link Hover};
  160. }
  161.  
  162. b,strong{
  163. font-weight:heavy;
  164. color:{color:Bold};
  165. }
  166.  
  167. blockquote{
  168. padding-left:5px;
  169. border-left:1px solid #ccc;
  170. }
  171.  
  172. /*--Header--*/
  173.  
  174. @media (max-width:1024px){
  175. body #home{
  176. position:relative;
  177. width:100vw;
  178. height:auto;
  179. margin-bottom:0px;
  180. }
  181.  
  182. body #he{
  183. display:inline-block;
  184. position:relative;
  185. }
  186.  
  187. body #rotunda{
  188. display:none;
  189. }
  190.  
  191. body #bio{
  192. position:relative;
  193. width:auto;
  194. max-width:800px;
  195. margin:50px auto;
  196. top:0px;
  197. padding:0 20px 0 20px;
  198. transform:translateY(0%);
  199. text-align:center;
  200. }
  201.  
  202. body #desc{
  203. margin:10px auto;
  204. }
  205.  
  206. body #icon{
  207. position:relative;
  208. margin:0 auto 20px auto;
  209. }
  210.  
  211. body #content{
  212. margin-top:0px;
  213. }
  214. }
  215.  
  216. header{
  217. background:{color:Background};
  218. position:fixed;
  219. width:100vw;
  220. top:-150px;
  221. left:0;
  222. padding:30px 20px 20px 20px;
  223. z-index:99999!important;
  224. -webkit-transition: all 0.3s ease-in-out;
  225. -moz-transition: all 0.3s ease-in-out;
  226. -o-transition: all 0.3s ease-in-out;
  227. -ms-transition: all 0.3s ease-in-out;
  228. transition: all 0.3s ease-in-out;
  229. }
  230.  
  231. #home{
  232. width:62%;
  233. height:100vh;
  234. margin:0 auto;
  235. padding-bottom:10px;
  236. }
  237.  
  238. #he{
  239. display:none;
  240. background:url({image:Header}) no-repeat;
  241. background-size:cover;
  242. width:100vw;
  243. height:50vh;
  244. }
  245.  
  246. #rotunda{
  247. position:absolute;
  248. width:62%;
  249. max-height:82vh;
  250. top:50vh;
  251. right:0;
  252. transform:translateY(-50%);
  253. z-index:-99;
  254. }
  255.  
  256. #icon{
  257. position:absolute;
  258. width:50px;
  259. height:50px;
  260. margin:-15px -80px;
  261. border-radius:100px;
  262. }
  263.  
  264. #icon2{
  265. position:absolute;
  266. width:50px;
  267. height:50px;
  268. margin:-15px -80px;
  269. border-radius:100px;
  270. }
  271.  
  272. #bio{
  273. position:absolute;
  274. width:25%;
  275. top:50vh;
  276. transform:translateY(-55%);
  277. margin-left:-10%;
  278. padding:35px 0 0 10px;
  279. font-size:14px;
  280. }
  281.  
  282. #title{
  283. font:bold 50px 'Objectivity', sans-serif;
  284. line-height:22px;
  285. text-transform:lowercase;
  286. -webkit-transition: all 0.3s ease-in-out;
  287. -moz-transition: all 0.3s ease-in-out;
  288. -o-transition: all 0.3s ease-in-out;
  289. -ms-transition: all 0.3s ease-in-out;
  290. transition: all 0.3s ease-in-out;
  291. }
  292.  
  293. #title a{
  294. color:{color:Title};
  295. }
  296.  
  297. #title a:hover{
  298. color:{color:Link Hover};
  299. }
  300.  
  301. #desc{
  302. max-width:400px;
  303. font-weight:400;
  304. font-size:14px;
  305. margin-top:10px;
  306. line-height:26px;
  307. }
  308.  
  309. .links{
  310. margin-top:10px;
  311. font-size:14px;
  312. letter-spacing:2px;
  313. z-index:99999999;
  314. }
  315.  
  316. .links a{
  317. color:#000;
  318. font-size:16px;
  319. margin-right:10px;
  320. -webkit-transition: all 0.3s ease-in-out;
  321. -moz-transition: all 0.3s ease-in-out;
  322. -o-transition: all 0.3s ease-in-out;
  323. -ms-transition: all 0.3s ease-in-out;
  324. transition: all 0.3s ease-in-out;
  325. }
  326.  
  327. .links a:hover{
  328. color:{color:Nav Link Text};
  329. }
  330.  
  331. /*--Link Menu--*/
  332.  
  333. #nav{
  334. background:#222;
  335. position:fixed;
  336. width:0;
  337. height:100vh;
  338. top:0;
  339. right:0;
  340. padding-top:70px;
  341. letter-spacing:1px;
  342. z-index:99999;
  343. -webkit-transition:all 0.5s ease-in-out;
  344. -moz-transition:all 0.5s ease-in-out;
  345. -o-transition:all 0.5s ease-in-out;
  346. transition:all 0.5s ease-in-out;
  347. }
  348.  
  349. #nav a{
  350. display:block;
  351. color:#fff;
  352. margin:30px 20px 40px 0;
  353. text-align:right;
  354. text-transform:uppercase;
  355. font:20px 'Source Sans Pro', sans-serif;
  356. letter-spacing:2px;
  357. -webkit-transition:all 0.5s ease-in-out;
  358. -moz-transition:all 0.5s ease-in-out;
  359. -o-transition:all 0.5s ease-in-out;
  360. transition:all 0.5s ease-in-out;
  361. }
  362.  
  363. #nav a:hover{
  364. color:#444;
  365. }
  366.  
  367. nav .closebtn{
  368. position:absolute;
  369. top:-15px;
  370. left:20px;
  371. }
  372.  
  373. /*--Posts--*/
  374.  
  375. #center{
  376. margin:0 auto;
  377. {block:ifnotMultiColumn}
  378. max-width:{select:Post Width}px;
  379. {/block:ifnotMultiColumn}
  380. {block:PermalinkPage}
  381. max-width:700px;
  382. {/block:PermalinkPage}
  383. }
  384.  
  385. #content{
  386. {block:ifMultiColumn}
  387. max-width:100%;
  388. margin:0 auto;
  389. {/block:ifMultiColumn}
  390. margin-top:50px;
  391. margin-bottom:50px;
  392. }
  393.  
  394. .entry{
  395. {block:indexpage}
  396. max-width:{select:Post Width}px;
  397. width:98%;
  398. overflow:hidden;
  399. {/block:indexpage}
  400. margin:0px 0px 60px 0px;
  401. padding:3px;
  402. background:{color:Posts Background};
  403. {block:permalinkpage}
  404. max-width:700px;
  405. width:88%;
  406. padding:23px;
  407. overflow:hidden;
  408. {/block:permalinkpage}
  409. }
  410.  
  411. .entry img{
  412. {block:indexpage}
  413. max-width:{select:Post width}px;
  414. width:100%;
  415. margin-bottom:-4px;
  416. {/block:indexpage}
  417. {block:permalinkpage}
  418. max-width:700px;
  419. width:100%;
  420. {/block:permalinkpage}
  421. }
  422.  
  423. ol.notes{
  424. padding:0px;
  425. max-width:700px;
  426. width:100%;
  427. height:218px;
  428. overflow:auto;
  429. margin:5px 0px;
  430. list-style-type:none;
  431. border:1px solid{color:Border Color};
  432. }
  433.  
  434. ol.notes li.note{
  435. border-top:solid 1px {color:Border Color};
  436. padding:10px;
  437. }
  438.  
  439. ol.notes li.note:first-child{
  440. border:none;
  441. }
  442.  
  443. ol.notes li.note img.avatar{
  444. vertical-align:-4px;
  445. margin-right:10px;
  446. width:16px;
  447. height:16px;
  448. }
  449.  
  450. ol.notes li.note blockquote{
  451. border-color:{color:Border Color};
  452. padding:4px 10px;
  453. margin:10px 0px 0px 25px;
  454. }
  455.  
  456. ol.notes li.note blockquote a{
  457. text-decoration:none;
  458. }
  459.  
  460. /*--Grayscale Effect--*/
  461.  
  462. #img{
  463. {block:indexpage}
  464. {block:ifPostFade}
  465. opacity:0.6;
  466. {/block:ifPostFade}
  467. {block:ifGrayscaleEffect}
  468. filter: url(filters.svg#grayscale);
  469. filter: gray;
  470. -webkit-filter: grayscale(1);
  471. {/block:ifGrayscaleEffect}
  472. -webkit-transition:all 0.3s ease-in-out;
  473. -moz-transition:all 0.3s ease-in-out;
  474. -o-transition:all 0.3s ease-in-out;
  475. transition:all 0.3s ease-in-out;
  476. {/block:indexpage}
  477. }
  478.  
  479. .entry:hover #img{
  480. {block:indexpage}
  481. opacity:1;
  482. {block:ifGrayscaleEffect}
  483. filter: url(filters.svg#grayscale);
  484. filter: gray;
  485. -webkit-filter: grayscale(0);
  486. {/block:ifGrayscaleEffect}
  487. {/block:indexpage}
  488. }
  489.  
  490. /*--Permalinks--*/
  491.  
  492. .permalink{
  493. background:{color:Posts Background};
  494. color:#ccc;
  495. max-width:calc({select:Post Width}px - 10px);
  496. height:auto;
  497. position:relative;
  498. font-size:11px;
  499. padding:0 5px 0 5px;
  500. margin-top:10px;
  501. text-align:left;
  502. z-index:999;
  503. -webkit-transition:all 0.5s ease-in-out;
  504. -moz-transition:all 0.5s ease-in-out;
  505. -o-transition:all 0.5s ease-in-out;
  506. transition:all 0.5s ease-in-out;
  507. }
  508.  
  509. .info li{
  510. display:inline-block;
  511. list-style:none;
  512. margin-right:10px;
  513. }
  514.  
  515. .info i{
  516. margin-right:3px;
  517. vertical-align:-.2em;
  518. font-size:13px;
  519. }
  520.  
  521. .info a{
  522. color:{color:Link};
  523. }
  524.  
  525. .info a:hover{
  526. color:{color:Link Hover};
  527. }
  528.  
  529. .tags{
  530. line-height:25px;
  531. text-transform:uppercase;
  532. }
  533.  
  534. .tags i{
  535. color:{color:Link};
  536. }
  537.  
  538. .tags a{
  539. display:inline-block;
  540. margin-right:5px;
  541. }
  542.  
  543. .tags a:first-child{
  544. margin:0px;
  545. }
  546.  
  547. .likeb{
  548. position:relative;
  549. margin-left:17px;
  550. }
  551.  
  552. .like_button:before{
  553. content:"\39";
  554. position:absolute;
  555. color:{color:Link};
  556. font-family:'cy-outicons';
  557. margin-left:-17px;
  558. font-size:13px;
  559. -webkit-transition:all 0.5s ease-in-out;
  560. -moz-transition:all 0.5s ease-in-out;
  561. -o-transition:all 0.5s ease-in-out;
  562. transition:all 0.5s ease-in-out;
  563. }
  564.  
  565. .like_button{
  566. position:absolute;
  567. top:-1px;
  568. left:0;
  569. width:100%;
  570. height:100%;
  571. }
  572.  
  573. .like_button iframe{
  574. position:absolute;
  575. width:190%;
  576. height:100%;
  577. bottom:0;
  578. right:0;
  579. opacity:0;
  580. z-index:999;
  581. }
  582.  
  583. .like_button.liked:before, .like_button:hover:before{
  584. color:{color:Link Hover};
  585. content:"\38";
  586. }
  587.  
  588. .like_button.liked + .b{
  589. color:{color:Link Hover};
  590. }
  591.  
  592. /*--Miscellaneous--*/
  593.  
  594. iframe.tmblr-iframe{
  595. z-index:99999999999999!important;
  596. top:10px!important;
  597. right:0!important;
  598. opacity:0.4;
  599. /* delete from here */
  600. filter:invert(1) contrast(150%);
  601. -webkit-filter:invert(1) contrast(150%);
  602. -o-filter:invert(1) contrast(150%);
  603. -moz-filter:invert(1) contrast(150%);
  604. -ms-filter:invert(1) contrast(150%);
  605. /* to here if your blog has a dark background */
  606. transform:scale(0.6);
  607. transform-origin:100% 0;
  608. -webkit-transform:scale(0.6);
  609. -webkit-transform-origin:100% 0;
  610. -o-transform:scale(0.6);
  611. -o-transform-origin:100% 0;
  612. -moz-transform:scale(0.6);
  613. -moz-transform-origin:100% 0;
  614. -ms-transform:scale(0.6);
  615. -ms-transform-origin:100% 0;
  616. -webkit-transition:all 0.5s ease-in-out;
  617. -moz-transition:all 0.5s ease-in-out;
  618. -o-transition:all 0.5s ease-in-out;
  619. transition:all 0.5s ease-in-out;
  620. border:none;
  621. box-shadow:none;
  622. }
  623.  
  624. iframe.tmblr-iframe:hover{
  625. opacity:0.6!important;
  626. }
  627.  
  628. .load-more{
  629. position:relative;
  630. border:1px solid {color:Border Color};
  631. padding:5px;
  632. }
  633.  
  634. footer{
  635. width:70px;
  636. margin-left:auto;
  637. margin-right:auto;
  638. margin-bottom:50px;
  639. }
  640.  
  641. .pagination{
  642. display:none;
  643. }
  644.  
  645. #pagination{
  646. color:#ccc;
  647. width:calc({select:Post Width}px + 20px);
  648. {block:ifMultiColumn}
  649. position:absolute;
  650. bottom:0px;
  651. width:500px;
  652. margin:0 auto;
  653. {/block:ifMultiColumn}
  654. }
  655.  
  656. #pagination a{
  657. border:1px solid {color:Border color};
  658. padding:0px 5px 3px 5px;
  659. }
  660.  
  661. .back{
  662. margin-top:0px;
  663. }
  664.  
  665. .next{
  666. margin-top:0px;
  667. }
  668.  
  669. .text img{
  670. {block:IndexPage}
  671. max-width:calc({select:Post width}px - 20px);
  672. {/block:IndexPage}
  673. {block:PermalinkPage}
  674. max-width:500px;
  675. {/block:PermalinkPage}
  676. width:auto;
  677. height:auto;
  678. }
  679.  
  680. .text{
  681. background:#fbfbfb;
  682. padding:10px;
  683. overflow:hidden;
  684. }
  685.  
  686. .audio:hover .player{
  687. opacity:1;
  688. }
  689.  
  690. .audio{
  691. background:#fbfbfb;
  692. margin-left:48px;
  693. line-height:14px;
  694. letter-spacing:1px;
  695. text-align:left;
  696. padding:10px 0px 10px 10px;
  697. }
  698.  
  699. .audio img{
  700. position:absolute;
  701. width:48px;
  702. margin-top:-10px;
  703. margin-left:-58px;
  704. z-index:9;
  705. }
  706.  
  707. .player{
  708. opacity:0;
  709. background:#f2f2f2;
  710. position:absolute;
  711. display:block;
  712. width:30px;
  713. height:27px;
  714. margin-top:1px;
  715. margin-left:-49px;
  716. overflow:hidden;
  717. z-index:99999;
  718. -webkit-transition:all 0.3s ease-in-out;
  719. -moz-transition:all 0.3s ease-in-out;
  720. -o-transition:all 0.3s ease-in-out;
  721. transition:all 0.3s ease-in-out;
  722. }
  723.  
  724. .tumblr_audio_player{
  725. margin-left:-2px;
  726. z-index:99;
  727. }
  728.  
  729. .title{
  730. font:14px Helvetica, Arial;
  731. }
  732.  
  733. .song{
  734. font-size:9px;
  735. }
  736.  
  737. .quote{
  738. font-weight:bold;
  739. font-size:14px;
  740. margin-left:11px;
  741.  
  742. }
  743.  
  744. #s-m-t-tooltip{
  745. background:#fff;
  746. color:#444;
  747. font-size:8px;
  748. font-style:italic;
  749. font-weight:500;
  750. letter-spacing:2px;
  751. text-transform:uppercase;
  752. max-width:300px;
  753. padding:4px;
  754. z-index:9999999999;
  755. margin:20px 10px 10px 10px;
  756. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  757. }
  758.  
  759. .ask{
  760. background:{color:Caption};
  761. color:{color:Text};
  762. width:auto;
  763. padding:10px;
  764. border:1px solid {color:Border Color};
  765. border-radius:5px;
  766. text-align:left;
  767. }
  768.  
  769. .answer{
  770. margin-left:10px;
  771. margin-top:0px;
  772. }
  773.  
  774. .answer img{
  775. {block:IndexPage}
  776. max-width:calc({select:Post width}px - 20px);
  777. {/block:IndexPage}
  778. {block:PermalinkPage}
  779. max-width:500px;
  780. {/block:PermalinkPage}
  781. width:auto;
  782. height:auto;
  783. }
  784.  
  785. .caption{
  786. {block:IndexPage}
  787. background:{color:Caption};
  788. border:1px solid {color:Border Color};
  789. {/block:IndexPage}
  790. font-size:12px;
  791. color:{color:Caption Text};
  792. margin-top:10px;
  793. padding:5px;
  794. overflow:auto;
  795. }
  796.  
  797. .caption img{
  798. width:auto;
  799. height:auto;
  800. max-width:calc({select:Post width}px - 70px);
  801. {block:PermalinkPage}
  802. max-width:430px;
  803. {/block:PermalinkPage}
  804. }
  805.  
  806. .back-to-top{
  807. position: fixed;
  808. bottom:-75px;
  809. left:10px;
  810. background: url('http://static.tumblr.com/2e9nahe/xvCoaucis/arrow-up.svg') no-repeat;
  811. background-size:15px;
  812. width:100px;
  813. height:100px;
  814. z-index:9999999;
  815. }
  816.  
  817. .back-to-top a{
  818. text-indent: -9999px;
  819. display: block;
  820. }
  821.  
  822. #infscr-loading{
  823. display:none!important;
  824. }
  825.  
  826. .tumblr_video_container{
  827. width:auto!important;
  828. height:auto!important;
  829. }
  830.  
  831. .vignette, #vignette {
  832. opacity:0;
  833. }
  834. .lightbox-image, #tumblr_lightbox img {
  835. box-shadow:none!important;
  836. border-radius:0!important;
  837. max-width:none;
  838. }
  839.  
  840. .tmblr-lightbox, #tumblr_lightbox {
  841. background-color:{color:Background}!important;
  842. }
  843.  
  844. .soundcloud_audio_player{
  845. width:100%;
  846. }
  847.  
  848. </style>
  849.  
  850. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  851.  
  852. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  853. <script>
  854. (function($){
  855. $(document).ready(function(){
  856. $("[title]").style_my_tooltips({
  857. tip_follows_cursor:true,
  858. tip_delay_time:20,
  859. tip_fade_speed:400,
  860. attribute:"title"
  861. });
  862. });
  863. })(jQuery);
  864. </script>
  865.  
  866.  
  867. <!--Scroll back to top-->
  868.  
  869. <div class="back-to-top" id="back-top">
  870. <a href="javascript:void(0)" class="back-to-top">Top</a>
  871. </div>
  872.  
  873.  
  874. <script type="text/javascript">
  875. $(function () {
  876. $("#back-top").hide();
  877. $(window).scroll(function () {
  878. if ($(this).scrollTop() > 150) {
  879. $('#back-top').fadeIn();
  880. } else {
  881. $('#back-top').fadeOut();
  882. }
  883. });
  884. });
  885. jQuery('.back-to-top').click(function () {
  886. jQuery('html, body').animate({
  887. scrollTop: 0
  888. }, 'slow');
  889. });
  890. </script>
  891.  
  892.  
  893. <!--end of Scroll back to top-->
  894.  
  895. <!--minimal soundcloud player by shythemes-->
  896. <script>
  897. // minimal soundcloud player © shythemes.tumblr
  898. $(document).ready(function(){
  899. var color = '#acd7bb'; // color of play button (hex)
  900. $('.soundcloud_audio_player').each(function(){
  901. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  902. });
  903. });
  904. </script>
  905. <!--end minimal soundcloud player-->
  906.  
  907.  
  908. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  909. <script>
  910. $(document).ready(function(){
  911. $('.photo-slideshow').pxuPhotoset({
  912. lightbox: true,
  913. rounded: false,
  914. gutter: '5px',
  915. photoset: '.photo-slideshow',
  916. photoWrap: '.photo-data',
  917. photo: '.pxu-photo'
  918. });
  919. });
  920. </script>
  921.  
  922. {block:ifPopupHeader}
  923. <script>
  924. $(document).ready(function(){
  925. $(window).scroll(function(){
  926. if($(window).scrollTop() > $(document).height()*0.06){
  927. $("header").css("top", "0px")
  928. }
  929. else{
  930. $("header").css("top", "-150px")
  931. }
  932. });
  933. });
  934. </script>
  935. {/block:ifPopupHeader}
  936.  
  937. <script>
  938. function openNav() {
  939. document.getElementById("nav").style.width = "250px";
  940. }
  941. function closeNav() {
  942. document.getElementById("nav").style.width = "0";
  943. }
  944. </script>
  945.  
  946. {block:ifInfiniteScroll}
  947. <div class="pagination">
  948. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage"}>previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  949. </div>
  950. {/block:ifInfiniteScroll}
  951.  
  952. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  953.  
  954.  
  955. </head>
  956.  
  957. <body>
  958.  
  959. {block:ifPopupHeader}
  960. <header>
  961. <img id="icon2" style="margin-left:0px;" src="{Favicon}">
  962. <div id="title" style="margin-left:60px;margin-top:-10px;font-size:20px;"><a href="/">{Title}</a></div>
  963. <div class="links" style="margin-left:60px;margin-top:0px;">
  964. <a style="font-size:13px;" href="/">home</a>
  965. <a style="font-size:13px;" href="/ask">ask</a>
  966. <a style="font-size:13px;" href="/archive">archive</a>
  967. <a style="font-size:13px;" onclick="openNav()">links</a>
  968. </div>
  969. </header>
  970. {/block:ifPopupHeader}
  971.  
  972. <div id="home">
  973. <div id="he"></div>
  974. <img id="rotunda" src="{image:Header}">
  975. <div id="bio">
  976. <img id="icon" src="{Favicon}">
  977. <div id="title"><a href="/">{Title}</a></div>
  978. <div class="links">
  979. <a href="/">home</a>
  980. <a href="/ask">ask</a>
  981. <a href="/archive">archive</a>
  982. <a onclick="openNav()">links</a>
  983. </div>
  984. <div id="desc">{Description}</div>
  985. </div>
  986. </div>
  987.  
  988. <nav id="nav">
  989. <a href="javascript:void(0)" class="closebtn" style="font-size:30px;" onclick="closeNav()">&times;</a>
  990. <a href="{text:Link 1 URL}">{text:Link 1}</a>
  991. <a href="{text:Link 2 URL}">{text:Link 2}</a>
  992. <a href="{text:Link 3 URL}">{text:Link 3}</a>
  993. <a href="{text:Link 4 URL}">{text:Link 4}</a>
  994. <a href="{text:Link 5 URL}">{text:Link 5}</a>
  995. <a href="{text:Link 6 URL}">{text:Link 6}</a>
  996. </nav>
  997.  
  998. <div id="center">
  999.  
  1000. <div id="content">
  1001.  
  1002. {block:Posts}
  1003.  
  1004.  
  1005. <div class="entry" id="{PostID}">
  1006.  
  1007. {block:Text}
  1008. <div class="text">{block:IndexPage}{/block:IndexPage}{block:Title}<h2><b><a href="{Permalink}">{Title}</a></b></h2>{/block:Title}
  1009. {Body}
  1010. </div>
  1011. {/block:Text}
  1012.  
  1013. {block:Photo}
  1014. <div id="img">
  1015. {block:IndexPage}<img src="{PhotoURL-HighRes}"/>
  1016. </div>
  1017.  
  1018. {/block:IndexPage}
  1019. {block:PermalinkPage}<img src="{PhotoURL-HighRes}"/>{block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  1020. {/block:PermalinkPage}
  1021. {/block:Photo}
  1022.  
  1023. {block:Photoset}
  1024. {block:IndexPage}
  1025. <div id="img">
  1026. <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>
  1027. </div>
  1028. {/block:IndexPage}
  1029.  
  1030. {block:PermalinkPage}<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>
  1031. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  1032. {/block:PermalinkPage}
  1033. {/block:Photoset}
  1034.  
  1035.  
  1036. {block:Quote}
  1037. <div class="text">
  1038. <div style="position:absolute;margin-top:-5px;margin-left:-5px;font:30px times new roman;opacity:0.5;">“</div>
  1039. <div class="quote">{Quote}</div>
  1040. {block:Source}<p style="text-align:center;font:italic 10px georgia;">—&nbsp;{Source}</p>{/block:Source}
  1041. </div>
  1042. {/block:Quote}
  1043.  
  1044. {block:Link}
  1045. <div class="text">
  1046. <a href="{URL}"><h1><b>{Name}</h1></b></a>{block:Description}{Description}{/block:Description}</div>
  1047. {/block:Link}
  1048.  
  1049. {block:Chat}
  1050. <div class="text">
  1051. {block:Title}<h3>{Title}</h3>{/block:Title}
  1052. {block:Lines}<p>
  1053. {block:Label}<b>{Label}</b>{/block:Label}
  1054. {Line}</p>
  1055. {/block:Lines}
  1056. </div>
  1057. {/block:Chat}
  1058.  
  1059. {block:Audio}
  1060. <div class="audio">
  1061. {block:AudioPlayer}
  1062. <div class="player">{AudioPlayerWhite}</div>
  1063. {block:AlbumArt}<img id="img" src="{AlbumArtURL}"/>{/block:AlbumArt}
  1064. {block:TrackName}<span class="title"><b>{TrackName}</b></span>{/block:TrackName}
  1065. <br>{block:Artist}<span class="song">{Artist}</span>{/block:Artist}
  1066. </div>
  1067. {/block:AudioPlayer}
  1068.  
  1069. {block:PermalinkPage}
  1070. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  1071. {/block:PermalinkPage}
  1072. {/block:Audio}
  1073.  
  1074. {block:Answer}
  1075. <div style="padding-bottom:5px;"><b><u>{Asker}</u></b> asked:</div>
  1076. <div class="ask">
  1077. {Question}
  1078. </div>
  1079. <div class="answer">
  1080. {Answer}
  1081. </div>
  1082. {/block:Answer}
  1083.  
  1084. {block:Video}
  1085. {block:IndexPage}
  1086. <div id="img">
  1087. <div class="video">{Video-500}</div>
  1088. </div>
  1089. {/block:IndexPage}
  1090.  
  1091. {block:PermalinkPage}<div class="video">{Video-500}</div>
  1092. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:PermalinkPage}
  1093. {/block:Video}
  1094.  
  1095. {block:ContentSource} <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{Logowidth}px" height="{LogoHeight}" alt="{SourceTitle}" /> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}--> {/block:ContentSource}
  1096.  
  1097. {block:IndexPage}
  1098. {block:ifShowCaption}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:ifShowCaption}
  1099. <div class="permalink">
  1100. <div class="info">
  1101. <li><a href="{Permalink}" target="_blank" title="{NoteCountWithLabel}"><i class="oi-clock"></i>{TimeAgo}</a></li>
  1102. <li><a href="{ReblogURL}" target="_blank"><i class="oi-return"></i>reblog</a></li>
  1103. <li><a class="likeb" href="#">{LikeButton size="100"}<span class="b">like</span></a></li>
  1104. {block:ifShowTags}{block:HasTags}<span class="tags"><i class="oi-tags"></i>{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}<br></span>{/block:HasTags}{/block:ifShowTags}
  1105. </div>
  1106. </div>
  1107. {/block:IndexPage}
  1108.  
  1109. {block:PermalinkPage}
  1110. {block:Date}
  1111. <div style="border-top:1px solid #ccc;width:100%;max-width:700px;margin-top:5px;"></div>
  1112. <div style="font-weight:600;font-size:14px;margin-top:10px;">{DayOfWeek}, {Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}</div>
  1113. {/block:Date}
  1114. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  1115. <br>{block:HasTags}Tagged: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}<br>{/block:HasTags}
  1116. {block:RebloggedFrom}Via: <i><a href="{ReblogParentURL}">{ReblogParentName}</i></a>
  1117. <br>Source: <i><a href="{ReblogRootURL}">{ReblogRootName}</i></a>{/block:RebloggedFrom}
  1118. {/block:PermalinkPage}
  1119.  
  1120. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1121.  
  1122.  
  1123. </div>
  1124.  
  1125. {/block:Posts}
  1126.  
  1127. {block:ifnotinfinitescroll}
  1128. {block:Pagination}
  1129. <div id="pagination">
  1130. {block:PreviousPage}<a href="{PreviousPage}" title="previous">«</a>&nbsp;&nbsp;|{/block:PreviousPage}&nbsp;&nbsp;{block:NextPage}<a href="{NextPage}" title="next">»</a>{/block:NextPage}
  1131. </div>
  1132. {/block:Pagination}
  1133. {/block:ifnotinfinitescroll}
  1134.  
  1135. </div>
  1136.  
  1137. {block:ifInfiniteScroll}{block:ifManualLoad}
  1138. {block:Pagination}<footer><a href="#" class="load-more">load more</a></footer>{/block:Pagination}
  1139. {/block:ifManualLoad}{/block:ifInfiniteScroll}
  1140.  
  1141. </div>
  1142.  
  1143.  
  1144. {block:IndexPage}
  1145. <script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
  1146. {block:ifMultiColumn}
  1147. <script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.min.js"></script>
  1148. {/block:ifMultiColumn}
  1149. {block:ifInfiniteScroll}
  1150. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1151. {/block:ifInfiniteScroll}
  1152. <script>
  1153. $(document).ready(function(){
  1154. var $container = $('#content');
  1155. {block:ifMultiColumn}
  1156. $container.masonry({
  1157. itemSelector: '.entry',
  1158. columnWidth: {select:Post Width},
  1159. gutter: 50,
  1160. isFitWidth: true
  1161. });
  1162. $container.imagesLoaded().progress(function(){
  1163. $container.masonry('layout');
  1164. });
  1165. $(window).resize(function(){
  1166. $container.masonry();
  1167. });
  1168. {/block:ifMultiColumn}
  1169.  
  1170. {block:ifInfiniteScroll}
  1171. $container.infinitescroll({
  1172. itemSelector: ".entry",
  1173. navSelector: ".pagination",
  1174. nextSelector: ".pagination a#next",
  1175. loadingImg: "",
  1176. loadingText: "<em> </em>",
  1177. bufferPx: 100,
  1178. extraScrollPx: 50,
  1179. errorCallback: function(){ $('.load-more').text('no more posts').parent().delay(2000).slideUp("slow"); }
  1180. },
  1181.  
  1182. function(newElements){
  1183. var $newElems = $(newElements);
  1184. $newElems.find('.photo-slideshow').pxuPhotoset({
  1185. lightbox: true,
  1186. rounded: false,
  1187. gutter: '4px',
  1188. photoset: '.photo-slideshow',
  1189. photoWrap: '.photo-data',
  1190. photo: '.pxu-photo'
  1191. });
  1192.  
  1193. var $newElemsIDs = $newElems.map(function(){
  1194. return this.id;
  1195. }).get();
  1196. console.log($newElems, $newElemsIDs);
  1197. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1198.  
  1199. resizeVideos();
  1200.  
  1201. var $newElems = $( newElements ).hide();
  1202. $newElems.imagesLoaded(function(){
  1203. $newElems.fadeIn();
  1204. {block:ifMultiColumn}
  1205. $container.masonry( 'appended', $newElems, true );
  1206. {/block:ifMultiColumn}
  1207. });
  1208.  
  1209. var color = '#ededed';
  1210. $('.soundcloud_audio_player').each(function(){
  1211. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=false&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  1212. });
  1213.  
  1214. });
  1215. {block:ifManualLoad}
  1216. $(window).unbind('.infscr');
  1217. $('.load-more').click(function(){
  1218. $('#content').infinitescroll('retrieve');
  1219. return false;
  1220. });
  1221. {/block:ifManualLoad}
  1222. {/block:ifInfiniteScroll}
  1223. });
  1224. </script>
  1225. {/block:IndexPage}
  1226.  
  1227.  
  1228. <a href="http://shoseii.tumblr.com" style="font:italic 10px 'Libre Baskerville', serif;position:fixed;bottom:5px;right:3px;" title="© shoseii">&</a>
  1229.  
  1230. <script>
  1231. var nav = responsiveNav(".nav-collapse");
  1232. </script>
  1233.  
  1234. </body>
  1235.  
  1236. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement