Advertisement
rasperries

tessellate dark theme sor

Sep 15th, 2019
249
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.61 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4. theme: tessellate
  5. - sorrism -
  6.  
  7. time stamp shortening by bycholoethemes
  8. responsive videos by nouvae
  9. icons: https://feathericons.com/
  10. photosets by annasthms @ espoirthemes
  11.  
  12. -->
  13.  
  14.  
  15. <!DOCTYPE html>
  16.  
  17. <head>
  18.  
  19.  
  20. <title>{block:TagPage}#{Tag} : {/block:TagPage} {block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  21.  
  22. <link rel="shortcut icon" href="{favicon}">
  23.  
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  26.  
  27. <!--Default Variables-->
  28.  
  29. <meta name="color:Background" content="#ffffff"/>
  30. <meta name="color:Background Two" content="#fafafa"/>
  31. <meta name="color:Accents" content="#f4f4f4"/>
  32. <meta name="color:Text" content="#909090"/>
  33. <meta name="color:Link Hover" content="#eeeeee"/>
  34. <meta name="color:Blog Title" content="#202020"/>
  35. <meta name="color:Title" content="#000000"/>
  36. <meta name="color:Scrollbar" content="#707070" />
  37. <meta name="color:Borders" content="#eeeeee"/>
  38. <meta name="color:Text Borders" content="#eeeeee"/>
  39.  
  40. <meta name="select:Gutter" title="1px" content="1"/>
  41. <meta name="select:Gutter" title="2px" content="2"/>
  42. <meta name="select:Gutter" title="3px" content="3"/>
  43. <meta name="select:Gutter" title="4px" content="4"/>
  44. <meta name="select:Gutter" title="5px" content="5"/>
  45.  
  46. <meta name="text:Link 1 URL" content=""/>
  47. <meta name="text:Link 1" content=""/>
  48. <meta name="text:Link 2 URL" content=""/>
  49. <meta name="text:Link 2" content=""/>
  50. <meta name="text:Link 3 URL" content=""/>
  51. <meta name="text:Link 3" content=""/>
  52.  
  53. <meta name="text:Home Title" content="home"/>
  54. <meta name="text:Ask Title" content="message"/>
  55. <meta name="text:Archive Title" content="archive"/>
  56.  
  57. <meta name="text:Featured Tag One" content="photography"/>
  58. <meta name="text:Featured Tag Two" content="fashion"/>
  59. <meta name="text:Featured Tag Three" content="art"/>
  60. <meta name="text:Featured Tag Four" content="portrait"/>
  61.  
  62. <meta name="text:Footer Text" content=""/>
  63.  
  64. <meta name="if:Infinite Scroll" content="0"/>
  65. <meta name="if:Center Header" content="0"/>
  66. <meta name="if:Featured Tags" content="1"/>
  67.  
  68. <meta name="select:Font" content="Lato" title="Lato"/>
  69. <meta name="select:Font" content="Roboto" title="Roboto"/>
  70. <meta name="select:Font" content="PT Sans" title="PT Sans"/>
  71. <meta name="select:Font" content="Source Sans Pro" title="Source Sans Pro"/>
  72. <meta name="select:Font" content="Muli" title="Muli"/>
  73. <meta name="select:Font" content="Rubik" title="Rubik"/>
  74. <meta name="select:Font" content="Fira Sans" title="Fira Sans"/>
  75. <meta name="select:Font" content="Open Sans" title="Open Sans"/>
  76. <meta name="select:Font" content="Libre Franklin" title="Libre Franklin"/>
  77. <meta name="select:Font" content="Lora" title="Lora"/>
  78. <meta name="select:Font" content="Playfair Display" title="Playfair Display"/>
  79. <meta name="select:Font" content="Merriweather" title="Merriweather"/>
  80. <meta name="select:Font" content="Libre Baskerville" title="Libre Baskerville"/>
  81. <meta name="select:Font" content="Roboto Slab" title="Roboto Slab"/>
  82. <meta name="select:Font" content="Georgia" title="Georgia"/>
  83. <meta name="select:Font" content="Aleo" title="Aleo"/>
  84. <meta name="select:Font" content="PT Serif" title="PT Serif"/>
  85. <meta name="select:Font" content="Noto Serif" title="Noto Serif"/>
  86. <meta name="select:Font" content="PT Mono" title="PT Mono"/>
  87. <meta name="select:Font" content="Roboto Mono" title="Roboto Mono"/>
  88. <meta name="select:Font" content="Inconsolata" title="Inconsolata"/>
  89. <meta name="select:Font" content="Source Code Pro" title="Source Code Pro"/>
  90.  
  91. <meta name="select:Accent Styling" content="upp" title="Uppercase"/>
  92. <meta name="select:Accent Styling" content="itl" title="Italic"/>
  93. <meta name="select:Accent Styling" content="" title="None"/>
  94.  
  95.  
  96. <link href="https://fonts.googleapis.com/css?family={select:Font}:400,400i,600,700" rel="stylesheet"><link href="https://static.tumblr.com/0podkko/xIbplezmo/modified_photosets.css" rel="stylesheet">
  97.  
  98. <!--CSS customization here. -->
  99.  
  100. <style type="text/css">
  101. /*tumblr controls and lightbox*/
  102. .tmblr-lightbox {background:rgba({RGBcolor:background two}, .95)!important;}
  103.  
  104. .tmblr-lightbox img {opacity:0;}
  105.  
  106. .lightbox-caption {
  107. color:{color:title}!important;
  108. font-family:inherit!important;
  109. font-size:1em!important;
  110. font-weight:normal!important;
  111. text-shadow:none!important;
  112. }
  113.  
  114. .lightbox-image {
  115. -moz-box-shadow:none!important;
  116. -webkit-box-shadow:none!important;
  117. box-shadow:none!important;
  118. -moz-border-radius:0px!important;
  119. -webkit-border-radius:0px!important;
  120. border-radius:0px!important;
  121. padding:0px!important;
  122. opacity:1!important;
  123. }
  124.  
  125. .vignette {opacity:0!Important;}
  126. body > .tmblr-iframe {
  127. right:15px;
  128. opacity:0;
  129. overflow:auto;
  130. width:0;
  131. top:10px;
  132. z-index:99;
  133. -webkit-transform:scale(.6);
  134. -moz-transform:scale(.6);
  135. transform:scale(.6);
  136. -webkit-filter:invert(100%); /* Safari 6.0 - 9.0 */
  137. filter:invert(100%);
  138. -webkit-backface-visibility:hidden;
  139. padding:0px 50px 10px 10px;
  140. transition:all .3s linear;
  141. -webkit-transition:all .3s linear;
  142. -o-transition:all .3s linear;
  143. -moz-transition:all .3s linear;
  144. -webkit-backface-visibility:hidden;
  145. -webkit-transform-origin:right top;
  146. -moz-transform-origin:right top;
  147. -ms-transform-origin:right top;
  148. -o-transform-origin:right top;
  149. transform-origin:right top;
  150. }
  151. body > .tmblr-iframe:hover {opacity:.5!important;}
  152. body > .tmblr-iframe, .cc {position:fixed;}
  153. .cc {
  154. top:18px;
  155. z-index:12;
  156. right:15px;
  157. }
  158. .cc svg {
  159. display:inline-block;
  160. margin-left:5px;
  161. width:12px;
  162. height:auto;
  163. opacity:.75;
  164. overflow:visible;
  165. }
  166. .cc svg {stroke:{color:title};}
  167. /*tooltip*/
  168. .ui-tooltip {
  169. position:Absolute;
  170. z-index:9999;
  171. padding-top:10px;
  172. }
  173. .ui-tooltip-content {
  174. background:{color:link hover};
  175. padding:0.75em 10px;
  176. box-shadow:2px 2px 2px rgba({RGBcolor:title},.7);
  177. -webkit-box-shadow:2px 2px 10px rgba({RGBcolor:text},.3);
  178. }
  179. .upp .ui-tooltip-content {
  180. font-size:.8em;
  181. font-weight:600;
  182. }
  183. .itl .ui-tooltip-content {font-style:italic;}
  184. /*scrollbar*/
  185. ::-webkit-scrollbar {
  186. height:6px;
  187. width:6px;
  188. background:{color:background two};
  189. }
  190. ::-webkit-scrollbar-track {background:transparent;}
  191. ::-webkit-scrollbar-thumb{
  192. background:{color:scrollbar};
  193. -moz-border-radius:4px;
  194. -webkit-border-radius:4px;
  195. border-radius:4px;
  196. }
  197. article *::-webkit-scrollbar {
  198. background:{color:background};
  199. width:2px;
  200. height:2px;
  201. }
  202. /*general*/
  203. body {
  204. background:{color:background two};
  205. color:{color:text};
  206. font:10px/1.4em {select:font}, helvetica, sans-serif;
  207. word-wrap:break-word;
  208. text-align:left;
  209. overflow-x:hidden;
  210. letter-spacing:.25px;
  211. -moz-osx-font-smoothing:grayscale;
  212. -webkit-font-smoothing:antialiased;
  213. font-smoothing:antialiased;
  214. margin:0;
  215. }
  216. a {
  217. color:{color:text};
  218. text-decoration:none;
  219. }
  220. a, svg, .ftags a > span {
  221. transition:all .3s linear;
  222. -webkit-transition:all .3s linear;
  223. -o-transition:all .3s linear;
  224. -moz-transition:all .3s linear;
  225. }
  226.  
  227. a, a img {cursor:pointer;}
  228.  
  229. a:hover {
  230. color:{color:link hover}!important;
  231. text-decoration:none;
  232. }
  233. a svg:hover {stroke:{color:link hover};}
  234.  
  235. img {
  236. opacity:1;
  237. border:0;
  238. text-decoration:none;
  239. max-width:100%;
  240. height:auto;
  241. display:block;
  242. }
  243.  
  244. blockquote {
  245. padding:.25em 0 .25em 15px;
  246. margin:.5em 0;
  247. border-left:1px solid {color:text borders};
  248. }
  249.  
  250. pre {
  251. padding:0;
  252. margin:0;
  253. line-height:inherit!important;
  254. background:transparent;
  255. font-family:consolas!Important;
  256. font-size:inherit!important;
  257. white-space:pre-wrap;
  258. white-space:-moz-pre-wrap;
  259. white-space:-pre-wrap;
  260. white-space:-o-pre-wrap;
  261. word-wrap:break-word;
  262. }
  263.  
  264. p {margin:.5em 0;}
  265.  
  266. p:first-of-type {margin-top:0;}
  267.  
  268. p:last-of-type {margin-bottom:0;}
  269.  
  270. b, strong, b a, strong a {
  271. font-weight:700;
  272. color:{color:title};
  273. }
  274.  
  275. ol, ul {
  276. list-style:none;
  277. text-align:left;
  278. padding-left:0;
  279. }
  280.  
  281. li {
  282. position:relative;
  283. padding:.25em 0 .25em 20px;
  284. margin-left:0;
  285. }
  286.  
  287. ol li {counter-increment:list;}
  288.  
  289. ol li:before, ul li:before {
  290. left:-20px;
  291. display:inline-block;
  292. position:relative;
  293. width:0;
  294. vertical-align:middle!important;
  295. }
  296.  
  297. ol li:before {content:counter(list) '.';}
  298.  
  299. ul li:before {
  300. content:'';
  301. width:15px;
  302. height:1px;
  303. position:absolute;
  304. left:0;
  305. top:calc(.7em + 3px);
  306. background:{color:text borders};
  307. }
  308.  
  309. .chat li:before, .meat li:before {display:none!important;}
  310.  
  311. .chat li {margin:0;}
  312.  
  313. small, big, sub, pre, sup {
  314. font-size:8px!important;
  315. line-height:1.4em!important;
  316. vertical-align:baseline!important;
  317. }
  318.  
  319. h1, h2, h3, h4 {
  320. margin:.5em 0;
  321. font-size:1em;
  322. padding:0;
  323. font-weight:600;
  324. color:{color:title};
  325. font-weight:normal;
  326. }
  327.  
  328. hr {
  329. border:none;
  330. box-shadow:0;
  331. margin:2em 0;
  332. width:30%;
  333. border-top:2px solid {color:text borders};
  334. }
  335. @-webkit-keyframes fade-in {
  336. 0% {opacity:0;}
  337. 50% { opacity:0;}
  338. 100% { opacity:1;}
  339. }
  340. @-moz-keyframes fade-in {
  341. 0% {opacity:0;}
  342. 50% { opacity:0;}
  343. 100% { opacity:1;}
  344. }
  345. @keyframes fade-in {
  346. 0% {opacity:0;}
  347. 50% { opacity:0;}
  348. 100% { opacity:1;}
  349. }
  350. header {
  351. -webkit-animation-name: fade-in;
  352. -webkit-animation-duration: 2s;
  353. }
  354. /*header*/
  355. header {
  356. position:relative;
  357. {block:ifCenterHeader}
  358. text-align:center;
  359. {/block:ifCenterHeader}
  360. }
  361. .tai {
  362. color:{color:blog title};
  363. font-size:1.2em;
  364. line-height:39px;
  365. display:block;
  366. }
  367. .upp nav, .upp .pagination a, .upp .bl {
  368. font-size:.8em;
  369. font-weight:600;
  370. text-transform:uppercase;
  371. letter-spacing:1px;
  372. }
  373. .upp .tai, .upp .title, .upp .ftags span, .upp .etc {
  374. text-transform:uppercase;
  375. letter-spacing:1px;
  376. }
  377. .upp .title, .upp .tai {font-size:1em;}
  378. .upp nav {font-weight:600;}
  379. .itl .tai, .itl .title {font-style:italic;}
  380. nav {padding-top:15px;}
  381. nav a {
  382. display:inline-block;
  383. margin-right:10px;
  384. }
  385. header nav a {
  386. {block:ifCenterHeader}
  387. margin:0 5px;
  388. {/block:ifCenterHeader}
  389. }
  390. header > div {margin-top:.75em;}
  391. /*pagination*/
  392. footer {
  393. padding-top:50px;
  394. margin-top:50px;
  395. position:relative;
  396. border-top:1px solid {color:borders};
  397. z-index:-1!important;
  398. opacity:0!important;
  399. }
  400. footer a {display:inline-block}
  401. .pagination a span {display:inline-block;}
  402. .pagination {text-align:right;}
  403. .left {text-align:left;}
  404. {block:indexpage}
  405. .hey {float:left;}
  406. .stay {float:none!Important;}
  407. {/block:indexpage}
  408. .float {float:right;}
  409. .nice {
  410. position:fixed;
  411. right:15px;
  412. bottom:15px;
  413. font-size:8px;
  414. }
  415. .page-load-status {display:none;}
  416. .page-load-status a span {display:inline-block;}
  417. .infinite-scroll-request, .page-load-status a {position:absolute;}
  418. .page-load-status a {
  419. left:0;
  420. top:0;
  421. -webkit-transform:translatey(-50%);
  422. -moz-transform:translatey(-50%);
  423. -ms-transform:translatey(-50%);
  424. transform:translatey(-50%);
  425. }
  426. .loading {
  427. left:calc(50% - 12.5px);
  428. bottom:calc((150px + {select:gutter}px )* 4 - 100px);
  429. position:absolute;
  430. display:none;
  431. }
  432. .loading, .spinner {
  433. width:25px;
  434. height:25px;
  435. }
  436. .spinner {
  437. margin:0 auto;
  438. background-color:rgba({RGBcolor:text},.6);
  439. border-radius:100%;
  440. -webkit-animation:scaleout 1.0s infinite ease-in-out;
  441. animation:scaleout 1.0s infinite ease-in-out;
  442. }
  443. @-webkit-keyframes scaleout {
  444. 0% {-webkit-transform:scale(0) }
  445.  
  446. 100% {
  447. -webkit-transform:scale(1.0);
  448. opacity:0;
  449. }
  450. }
  451. @keyframes scaleout {
  452. 0% {
  453. -webkit-transform:scale(0);
  454. transform:scale(0);
  455. }
  456.  
  457. 100% {
  458. -webkit-transform:scale(1.0);
  459. transform:scale(1.0);
  460. opacity:0;
  461. }
  462. }
  463. .ftext {
  464. font-size:1em;
  465. {block:ifnotcenterheader}
  466. text-align:justify;
  467. {/block:ifnotcenterheader}
  468. margin-top:15px;
  469. }
  470. footer .ftext:first-child {margin-top:-15px}
  471. .bl span, .load, .pag span {
  472. padding:15px;
  473. background:{color:accents};
  474. }
  475. .ftags a {
  476. display:inline-block;
  477. position:relative;
  478. color:{color:title}!important;
  479. margin:15px {select:gutter}px 15px 0;
  480. }
  481. .ftags a:last-of-type {margin-right:0;}
  482. .ftags a > span {
  483. position:absolute;
  484. bottom:-10px;
  485. font-size:.9em;
  486. padding:15px;
  487. line-height:1.4em;
  488. left:0;
  489. opacity:0;
  490. background:transparent;
  491. width:calc(100% - 30px);
  492. }
  493. .ftags a:hover > span {
  494. opacity:1;
  495. bottom:0;
  496. background:{color:background};
  497. }
  498. .ftags .over:hover svg {opacity:.7;}
  499. /*posts*/
  500. .con {
  501. padding:100px;
  502. margin:0 auto;
  503. min-height:calc(100vh - 200px);
  504. background:{color:background};
  505. }
  506. .con, section {
  507. width:calc((150px + {select:gutter}px )* 4 - {select:gutter}px);
  508. position:relative;
  509. }
  510. section {
  511. margin:75px auto;
  512. padding-top:75px;
  513. border-top:1px solid {color:borders};
  514. {block:permalinkpage}
  515. margin-bottom:50px;
  516. {/block:permalinkpage}
  517. }
  518. article {
  519. vertical-align:top;
  520. position:relative;
  521. z-index:-1!important;
  522. opacity:0!important;
  523. background:{color:background};
  524. width:100%;
  525. {block:indexpage}
  526. width:150px;
  527. height:150px;
  528. margin-bottom:{select:gutter}px;
  529. display:inline-block;
  530. overflow:hidden;
  531. {/block:indexpage}
  532. }
  533. article, footer {
  534. transition:opacity 1s;
  535. -webkit-transition:opacity 1s;
  536. -moz-transition:opacity 1s;
  537. -o-transition:opacity 1s;
  538. }
  539. .loaded {
  540. z-index:2!important;
  541. opacity:1!important;
  542. }
  543. .ph {
  544. position:relative;
  545. overflow:hidden;
  546. display:block;
  547. }
  548. .ph img {width:100%;}
  549. [photoset-layout] {grid-gap:{select:gutter}px;}
  550. [photoset-layout] div {cursor:pointer;}
  551. .small {
  552. display:block;
  553. height:150px;
  554. width:150px;
  555. background:{color:accents} no-repeat center;
  556. background-size:cover;
  557. -webkit-backface-visibility:hidden;
  558. }
  559. .small:hover {opacity:.7;}
  560. .ps img:not(:first-child) {display:none;}
  561.  
  562. .small img{block:indexpage}, article .photo-slideshow{/block:indexpage} {
  563. width:100%;
  564. display:none;
  565. }
  566. {block:indexpage}.video, .video * {display:none;}{/block:indexpage}
  567. modal .video, modal .pinfo {display:block!important;}
  568. .comment figure.tmblr-full {margin:calc({select:gutter}px /2) 0!important;}
  569. .comment figure.tmblr-full:first-of-type {margin-top:10px!important;}
  570. .comment figure.tmblr-full:last-of-type {margin-bottom:10px!important;}
  571. .comment figure.tmblr-full:last-child {margin-bottom:0!important;}
  572. modal .ed .pinfo {
  573. display:flex!important;
  574. flex-direction:row;
  575. align-items:stretch;
  576. }
  577.  
  578. .video *, article video {
  579. display:block;
  580. width:100%;
  581. }
  582. .spotify_audio_player {height:80px!important;}
  583.  
  584. .tmblr-truncated-link {
  585. display:inline-block;
  586. font-style:italic;
  587. font-weight:600;
  588. text-transform:lowercase;
  589. }
  590. .over {
  591. position:absolute;
  592. top:0;
  593. left:0;
  594. height:150px;
  595. width:150px;
  596. background:{color:accents};
  597. z-index:5;
  598. cursor:pointer;
  599. line-height:150px;
  600. text-align:center;
  601. }
  602. .over svg {
  603. position:absolute;
  604. height:2em;
  605. width:2em;
  606. top:calc(50% - 1em);
  607. left:calc(50% - 1em);
  608. stroke:rgba({RGBcolor:text},.7);
  609. fill:none;
  610. stroke-width:1.5;
  611. }
  612. modal .over {display:none;}
  613. {block:indexpage}
  614. .big {
  615. width:calc(300px + {select:gutter}px);
  616. height:calc(300px + {select:gutter}px);
  617. }
  618. .big .small, .big .over {
  619. width:calc(300px + {select:gutter}px);
  620. height:calc(300px + {select:gutter}px);
  621. }
  622. .big .over {line-height:calc(300px + {select:gutter}px);}
  623. {/block:indexpage}
  624. /*modal*/
  625. modal {
  626. position:fixed;
  627. z-index:15;
  628. display:none;
  629. visibility:hidden;
  630. overflow-y:scroll;
  631. height:100vh;
  632. width:100vw;
  633. top:0;
  634. left:0;
  635. }
  636. modal:before {
  637. content:'';
  638. width:calc((150px + {select:gutter}px )* 4);
  639. padding:100px 0;
  640. background:{color:background};
  641. position:fixed;
  642. top:0;
  643. left:50%;
  644. transform:translatex(-50%);
  645. -webkit-tranform:translatex(-50%);
  646. z-index:16;
  647. height:calc(100vh - 200px);
  648. }
  649. modal .inner {
  650. display:block;
  651. position:relative;
  652. z-index:20;
  653. background:transparent;
  654. width:calc((150px + {select:gutter}px )* 4);
  655. margin:50px auto;
  656. padding:50px 25px;
  657. -webkit-transform:translateY(50px);
  658. -moz-transform:translateY(50px);
  659. -ms-transform:translateY(50px);
  660. transform:translateY(50px);
  661. opacity:0;
  662. -webkit-transition:all 0.2s linear;
  663. -moz-transition:all 0.2s linear;
  664. transition:all 0.2s linear;
  665. }
  666. modal.slide .inner {
  667. background:{color:background};
  668. -webkit-transform:translateY(0);
  669. -moz-transform:translateY(0);
  670. -ms-transform:translateY(0);
  671. transform:translateY(0);
  672. opacity:1;
  673. }
  674. modal .video * {width:calc((150px + {select:gutter}px )* 4);}
  675. modal img {
  676. display:block;
  677. width:100%;
  678. }
  679. modal .small {display:none;}
  680.  
  681. /*titles*/
  682. .title {
  683. color:{color:title};
  684. font-size:1.1em;
  685. line-height:1.4em;
  686. }
  687. .title a {color:{color:title};}
  688. .title a:hover {color:{color:link hover};}
  689.  
  690. .source {margin-top:10px;}
  691. /*captions*/
  692. modal .caption {
  693. flex:1;
  694. padding-left:50px;
  695. }
  696. .p .caption {
  697. padding-bottom:50px;
  698. margin:-25px 0 50px 0;
  699. border-bottom:1px solid {color:borders};
  700. }
  701. .caption *:not(.user) {
  702. font-family:inherit!important;
  703. color:inherit!important;
  704. font-size:inherit!important;
  705. font-weight:inherit!important;
  706. text-align:inherit!important;
  707. }
  708. .caption .comment:first-of-type blockquote:nth-child(2) {
  709. padding:0;
  710. border:0;
  711. margin:0;
  712. }
  713. .comment {
  714. padding:0 0 15px 0;
  715. margin:0;
  716. list-style:none;
  717. }
  718. .comment a:not(.user) {border-bottom:1px solid rgba({RGBcolor:text},.3);}
  719. .comment:last-of-type {padding-bottom:0;}
  720. .ed .comment:first-of-type {padding-top:25px;}
  721. .ed .pinfo .comment:first-of-type {padding-top:0;}
  722. .user {
  723. display:inline-block;
  724. line-height:1em;
  725. margin-bottom:10px;
  726. }
  727. .user a, .user {color:rgba({RGBcolor:text},.7);}
  728. .ted:first-of-type {padding-top:25px;}
  729. /*asks*/
  730. .as {
  731. margin:0 5px 0 0;
  732. color:{color:title};
  733. text-transform:lowercase;
  734. }
  735. .as a {color:{color:title};}
  736. .q {
  737. margin-bottom:15px;
  738. padding:15px;
  739. background:{color:Accents};
  740. }
  741. /*chats*/
  742. .ted .chat {margin-top:-15px;}
  743. .chat {
  744. margin:0;
  745. padding:0;
  746. list-style:none;
  747. }
  748. .l {
  749. padding:15px 0;
  750. border-bottom:1px solid {color:borders};
  751. }
  752. .l:last-of-type {
  753. border:0;
  754. padding-bottom:0;
  755. }
  756. .l:first-of-type {padding-top:0;}
  757. .label {
  758. display:block;
  759. font-style:italic;
  760. text-transform:lowercase;
  761. margin-bottom:.5em;
  762. color:{color:title};
  763. }
  764. /*audio*/
  765. .player {
  766. width:25px;
  767. height:24px;
  768. position:absolute;
  769. left:10px;
  770. top:calc(50% - 15px);
  771. display:block;
  772. overflow:hidden;
  773. }
  774. .hold {
  775. position:relative;
  776. display:block;
  777. min-height:24px;
  778. padding:15px;
  779. color:rgba({RGBcolor:text},.7);
  780. }
  781. .audio_info {
  782. vertical-align:middle;
  783. line-height:12px;
  784. margin-left:35px;
  785. max-width:calc(100% - 35px);
  786. }
  787. .audio_info span {
  788. white-space:nowrap;
  789. overflow:hidden;
  790. text-overflow:ellipsis;
  791. display:block;
  792. }
  793. .hold .track {
  794. font-weight:600;
  795. color:{color:text};
  796. }
  797. /*permalink and notes*/
  798. .pinfo {margin-bottom:50px;}
  799. .i .pinfo {
  800. display:none;
  801. padding-bottom:50px;
  802. border-bottom:1px solid {color:borders};
  803. }
  804. .when a {color:{color:text}!important;}
  805. .r {margin-right:3px;}
  806. .r:after {content:' post, ';}
  807. .ed .when, .caption {vertical-align:top;}
  808. .ed .when a {
  809. position:relative;
  810. line-height:1em;
  811. }
  812. .ed .when a > span {
  813. display:inline-block;
  814. position:relative;
  815. }
  816. .upp .when, .upp .permalink {
  817. font-size:.8em;
  818. text-transform:uppercase;
  819. letter-spacing:1px;
  820. }
  821. .permalink {margin-top:50px;}
  822. .permalink > span, .when > span {
  823. padding:15px;
  824. display:inline-block;
  825. background:{color:accents};
  826. }
  827. .when a, .permalink a {
  828. display:inline-block;
  829. color:rgba({RGBcolor:text},.7);
  830. }
  831. .like-b {height:1em;}
  832.  
  833. .like-b .like_button iframe {
  834. position:absolute;
  835. top:0;
  836. left:0;
  837. bottom:0;
  838. right:0;
  839. height:1em!important;
  840. z-index:2;
  841. opacity:0.0000001;
  842. }
  843.  
  844. .like-b .liked ~ .b {color:#D95E40;}
  845.  
  846. .like-b .liked ~ .b:after {content:'d';}
  847. .pag {
  848. margin-top:15px;
  849.  
  850. }
  851. .meat {
  852. position:Relative;
  853. text-transform:lowercase;
  854. padding-top:50px;
  855. margin-top:50px;
  856. border-top:1px solid {color:borders};
  857. }
  858. .pag {
  859. margin-top:-75px;
  860. position:absolute;
  861. }
  862. .pag span {display:inline-block;}
  863. .tags {margin-top:5px;}
  864. .tags * {color:rgba({RGBcolor:text},5);}
  865. .tags a {
  866. display:inline;
  867. margin-right:5px;
  868. }
  869. ol.notes {
  870. margin:0;
  871. font-size:.8em;
  872. list-style-type:none;
  873. padding:0;
  874. max-height:300px;
  875. overflow-y:auto;
  876. }
  877. ol.notes li.note {
  878. padding:0;
  879. width:50%;
  880. vertical-align:top;
  881. display:inline-block;
  882. }
  883. ol.notes li.note:last-of-type {padding-bottom:0;}
  884. ol.notes li.note:nth-child(odd) * {color:rgba({RGBcolor:text},.7);}
  885. ol.notes li.note img.avatar {display:none!important;}
  886. .more_notes_link, .notes_loading {
  887. color:{color:title}!important;
  888. display:block;
  889. text-align:left!important;
  890. }
  891. /*responsiveness, ugh*/
  892. body {
  893. -webkit-transition:all 0.2s linear;
  894. -moz-transition:all 0.2s linear;
  895. transition:all 0.2s linear;
  896. }
  897. .sub800 .con {padding:100px 25px 50px 25px;}
  898. .sub600 .con {padding:50px 15px;}
  899. .sub800 section, .sub800 article, .sub800 .con {width:calc(100vw - 50px);}
  900. .sub600 section, .sub600 article, .sub600 .con {width:calc(100vw - 30px)!important;}
  901. .sub800 article {
  902. display:block;
  903. height:auto!Important;
  904. margin-bottom:50px;
  905. padding-bottom:50px;
  906. border-bottom:1px solid {color:borders};
  907. overflow:auto;
  908. }
  909. .sub800 footer {
  910. border-top:0;
  911. margin-top:0;
  912. padding-top:0;
  913. }
  914. .sub800 .small, .sub800 .over, .sub800 .hey {display:none;}
  915. .sub800 .video {display:block;}
  916. .sub800 .pinfo {
  917. padding-bottom:25px;
  918. border:0;
  919. margin:0;
  920. }
  921. .sub800 .ed .pinfo {
  922. display:flex;
  923. flex-direction:row;
  924. align-items:stretch;
  925. }
  926. .sub800 .ed .caption {flex:1}
  927. .sub800 .when {margin-bottom:25px;}
  928. .sub800 .ed .when {margin-right:50px;}
  929. .sub600 .ed .pinfo {display:block!important;}
  930. .sub600 section {
  931. margin:50px auto;
  932. padding-top:50px;
  933. }
  934. .sub600 .con {text-align:center;}
  935. .sub600 .ed .when {margin-right:0;}
  936. .sub600 .pagination {
  937. text-align:center;
  938. }
  939. {customCss}
  940. </style>
  941.  
  942. </head>
  943.  
  944. <body class="{block:indexpage}i{/block:indexpage} {block:permalinkpage}p{/block:permalinkpage} {select:accent styling}" {block:homepage}id="page{currentpage}"{/block:homepage}><div class="cc"><i data-feather="settings"></i></div><modal class="pop"></modal>
  945.  
  946. <div class="con">
  947. <header><a href="/" class="tai">{title}</a><div>{description}</div><nav>{block:ifHomeTitle}<a href="/">{text:home title}</a>{/block:ifHomeTitle}{block:ifAskTitle}<a href="/ask">{text:ask title}</a>{/block:ifAskTitle}{block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}{block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}{block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:ifLink3}{block:ifArchiveTitle}<a href="/archive">{text:archive title}</a>{/block:ifArchiveTitle}</nav></header>
  948.  
  949. <section id="entries">{block:Posts}<article id="{PostId}"><div class="inner {block:caption}ed{/block:caption}">
  950.  
  951. {block:Date}
  952. <div class="pinfo">
  953.  
  954. {block:indexpage}<div class="when"><span><a href="{permalink}" target="_blank"><span class="tm">{timestamp}</span>{block:notecount} with <span class="not">{notecount}</span>{/block:notecount}</a><br><a href="{ReblogURL}" target="_blank" class="r">reblog</a><a class="like-b">{LikeButton size="50"}<span class="b">like</span></a></span></div>{/block:indexpage}
  955.  
  956. {block:caption}<div class="caption">{block:Reblogs}<li class="comment"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a>{body}</li>{/block:Reblogs}{block:NotReblog}<li class="comment"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{name}</a>{Caption}</li>{/block:NotReblog}</div>{/block:caption}
  957.  
  958. </div>
  959. {/block:Date}
  960.  
  961. {block:Quote}{block:indexpage}<div class="over"><i data-feather="message-circle"></i></div>{/block:indexpage}<div class="title">{Quote}</div>{block:Source}<div class="source">{Source}</div>{/block:Source}{/block:Quote}
  962.  
  963. {block:Text}{block:indexpage}<div class="over"><i data-feather="file-text"></i></div>{/block:indexpage}{block:Title}<div class="title">{Title}</div>{/block:Title}{block:RebloggedFrom}{block:Reblogs}<li class="comment {block:Title}ted{/block:Title}"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a>{body}</li>{/block:Reblogs}{/block:RebloggedFrom}{block:NotReblog}<li class="comment {block:Title}ted{/block:Title}">{body}</li>{/block:NotReblog}{/block:Text}
  964.  
  965. {block:Link}{block:indexpage}<div class="over"><i data-feather="link"></i></div>{/block:indexpage}<div class="title"><a href="{URL}" {Target}>{Name}</a></div>
  966. {block:Description}{block:NotReblog}<li class="comment ted">{description}</li>{/block:NotReblog}{/block:Description}{block:RebloggedFrom}{block:Reblogs}<li class="comment"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a>{body}</li>{/block:Reblogs}{/block:RebloggedFrom}{/block:Link}
  967.  
  968. {block:Chat}{block:indexpage}<div class="over"><i data-feather="users"></i></div>{/block:indexpage}{block:Title}<div class="title">{Title}</div>{/block:Title}<ol class="chat {block:Title}ted{/block:Title}">{block:Lines}<li class="l {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ol>{/block:Chat}
  969.  
  970. <div class="ph">{block:Photo}{block:indexpage}<a class="small" style="background-image:url('{PhotoURL-HighRes}')"></a><a class="reg"><img src="{PhotoURL-HighRes}" 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"></a>{/block:indexpage}{block:permalinkpage}{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}{/block:permalinkpage}{/block:Photo}
  971.  
  972. {block:Photoset}{block:indexpage}{block:Photos}<a class="small ps" style="background-image:url('{PhotoURL-HighRes}');"></a>{/block:Photos}{/block:indexpage}<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>{/block:Photoset}
  973. </div>
  974.  
  975. {block:Video}{block:indexpage}<div class="over"><i data-feather="film"></i></div>{/block:indexpage}<div class="video">{Video-500}</div>{/block:Video}
  976.  
  977.  
  978. {block:Audio}{block:indexpage}<div class="over"><i data-feather="music"></i></div>{/block:indexpage}{block:AudioPlayer}<div class="hold"><div class="player">{AudioPlayerWhite}</div><div class="audio_info">{block:TrackName}<span class="track">{TrackName}</span>{/block:TrackName}{block:Artist}<span class="artist">{Artist}</span>{/block:Artist}</div></div>{/block:AudioPlayer}{/block:Audio}
  979.  
  980. {block:Answer}{block:indexpage}<div class="over"><i data-feather="mail"></i></div>{/block:indexpage}<div class="q"><span class="as user">{Asker} sent:</span>{Question}</div>{block:answerer}<li class="comment"><span class="user">{answerer} replied:</span><div class="tex">{answer}</div></li>{/block:Answerer}{block:NotReblog}<li class="comment"><div class="tex" style="margin-top:0;">{replies}</div></li>{/block:NotReblog}{block:rebloggedfrom}{block:reblogs}<li class="comment"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a><div class="tex">{body}</div></li>{/block:Reblogs}{/block:rebloggedfrom}{/block:Answer}
  981.  
  982. </div>
  983. {block:date}
  984. {block:permalinkpage}<div class="permalink"><span>posted {dayofweek}, {month} {dayofmonth}{dayofmonthsuffix}{block:RebloggedFrom}<br>via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource}, source: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:ContentSource}{/block:RebloggedFrom}{block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a> {/block:Tags}</div>{/block:HasTags}</span></div>{/block:permalinkpage}
  985. {/block:date}
  986. </article>
  987.  
  988. {block:PostNotes}<article class="meat"><div class="pag title"><span>{NoteCountWithLabel}</span></div>{PostNotes}</article>{/block:PostNotes}
  989.  
  990. {/block:Posts}
  991.  
  992. <div class="loading"><div class="spinner"></div></div></section>
  993.  
  994. <footer>
  995. <div class="page-load-status">
  996. <a class="infinite-scroll-last bl nomas" title="scroll to top"><span>End of Content</span></a>
  997. <a class="infinite-scroll-error bl nomas" title="scroll to top"><span>Oops! There was an error.</span></a>
  998. </div>{block:Pagination}<div class="pagination initial {block:PreviousPage}left{/block:PreviousPage}">{block:NextPage}<a href="{NextPage}" class="next bl {block:PreviousPage}float{/block:PreviousPage}"><span>Next Page</span></a>{/block:NextPage}{block:PreviousPage}<a href="{PreviousPage}" class="bl"><span>Prev Page</span></a>{/block:PreviousPage}</div>{block:ifinfinitescroll}<div class="pagination initial"><a class="load bl">Load More Posts</a></div>{/block:ifinfinitescroll}{/block:Pagination}{block:PermalinkPagination}<div class="pagination {block:PreviousPost}left{/block:PreviousPost}">{block:NextPost}<a href="{NextPost}" class="next bl {block:PreviousPost}float{/block:PreviousPost}"><span>Next Post</span></a>{/block:NextPost}{block:PreviousPost}<a href="{PreviousPost}" class="bl"><span>Prev Post</span></a>{/block:PreviousPost}</div>
  999. {/block:PermalinkPagination}{block:ifFooterText}<div class="ftext">{text:Footer Text}</div>{/block:ifFooterText}</footer>
  1000.  
  1001. </div>
  1002. {block:ContentSource}
  1003. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1004. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1005. {/block:SourceLogo}
  1006. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1007. {/block:ContentSource}
  1008.  
  1009.  
  1010. <!-- jquery -->
  1011.  
  1012. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script><script src="https://unpkg.com/imagesloaded@4.1.4/imagesloaded.pkgd.min.js"></script><script src="https://unpkg.com/isotope-layout@3.0.6/dist/isotope.pkgd.js"></script>{block:indexpage}<script type="text/javascript" src="//static.tumblr.com/i5s2zks/9Acok8oo2/bct-timeago.min.js"></script>{block:ifinfinitescroll}<script src="https://unpkg.com/infinite-scroll@3.0.5/dist/infinite-scroll.pkgd.min.js"></script>{/block:ifinfinitescroll}{/block:indexpage}<script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script><script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script><script src="https://unpkg.com/feather-icons@4.9.0/dist/feather.min.js"></script><script src="https://static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  1013. <script>
  1014. function showposts() {
  1015. var els = $('article'),
  1016. i = 0,
  1017. f = function () {
  1018. $(els[i++]).addClass('loaded');
  1019. if(i < els.length) setTimeout(f, 50);
  1020. };
  1021. f();
  1022. }
  1023. function showfooter() {
  1024. $('footer').addClass('loaded');
  1025. }
  1026. function closemodal() {
  1027. $('modal').fadeOut(200, "linear").empty();
  1028. }
  1029. function notes(selector, suffix) {
  1030. $(selector).each(function(){
  1031. if ($(this).hasClass('done')) {
  1032. return
  1033. }
  1034. else {
  1035. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  1036. if (n > 999) {
  1037. n = Math.floor(n / 100) / 10;
  1038. $(this).text(n + 'k ' + suffix + 's');
  1039. }
  1040. else if (n > 1 && n <= 999) {
  1041. $(this).text(n + ' ' + suffix + 's');
  1042. }
  1043. else {$(this).text(n + ' ' + suffix);}
  1044. $(this).addClass('done');
  1045. }
  1046. });
  1047. }
  1048. function flexFrame() {
  1049. $('.comment').each(function() {
  1050. $(this).find('iframe').wrap("<div class='video'></div>");
  1051. });
  1052. flexibleFrames($('.video'));
  1053. }
  1054. function featuredTag(tagname) {
  1055. var taggie = tagname;
  1056. if ($('.ftags').length === 0) {
  1057. if ($('.ftext').length === 0) {
  1058. $('footer').append('<div class="ftags"></div>');
  1059. }
  1060. else {$('.ftext').prepend('<div class="ftags"></div>');}
  1061. $('.initial').prepend('<a class="bl hey"><span>Featured Tags</span></a>');
  1062. }
  1063. var tagdata = "https://{name}.tumblr.com/api/read/json?tagged=" + taggie + "&num=50&callback=?";
  1064. $.getJSON(tagdata).done(function (data) {
  1065. var totalPosts = data["posts-total"];
  1066. var totalInt = parseInt(totalPosts);
  1067. if (totalInt < 50) {
  1068. var randomInt = Math.floor(Math.random()*(totalPosts));
  1069. }
  1070. else {
  1071. var randomInt = Math.floor(Math.random()*(50));
  1072. };
  1073. var lastPost = data.posts[randomInt];
  1074. var lastImgUrl = lastPost["photo-url-500"];
  1075. var lastImg = 'background-image:url("' + lastImgUrl + '")';
  1076. var tagpackage = "<a class='small' href='/tagged/" + taggie + "' style='" + lastImg + "'><span>" + "#" + taggie + "<br><span class='hehe'>" + totalPosts + "</span></span></a>";
  1077. if (typeof lastImgUrl == 'undefined') {
  1078. var lastImg = 'background:{color:accents}';
  1079. var tagpackage = "<a class='over' href='/tagged/" + taggie + "' style='" + lastImg + "'><i data-feather='tag'></i><span>" + "#" + taggie + "<br><span class='hehe'>" + totalPosts + "</span></span></a>";
  1080. };
  1081. $('.ftags').append(tagpackage);
  1082. notes('.hehe', 'post');
  1083. feather.replace();
  1084. });
  1085. }
  1086. function printTags() {
  1087. {block:iffeaturedtagone}
  1088. featuredTag('{text:featured tag one}');
  1089. {/block:iffeaturedtagone}
  1090. {block:iffeaturedtagtwo}
  1091. featuredTag('{text:featured tag two}');
  1092. {/block:iffeaturedtagtwo}
  1093. {block:iffeaturedtagthree}
  1094. featuredTag('{text:featured tag three}');
  1095. {/block:iffeaturedtagthree}
  1096. {block:iffeaturedtagfour}
  1097. featuredTag('{text:featured tag four}');
  1098. {/block:iffeaturedtagfour}
  1099. }
  1100. if($(window).width() < 825) {
  1101. $('body').addClass('sub800');
  1102. }
  1103. if($(window).width() < 600) {$('body').addClass('sub600');}
  1104. $(document).ready(function() {
  1105. $(window).on('resize', function() {
  1106. if($(window).width() < 825) {
  1107. $('body').addClass('sub800');
  1108. $('modal').removeClass('slide');
  1109. setTimeout(closemodal,250);
  1110. }
  1111. if ($(window).width() < 600) {$('body').addClass('sub600');}
  1112. if ($(window).width() >= 600) {$('body').removeClass('sub600');}
  1113. if ($(window).width() >= 825) {$('body').removeClass('sub800');}
  1114. });
  1115. {block:ifFeaturedTags}
  1116. if ($('body').is('#page1')) {
  1117. printTags();
  1118. };
  1119. {/block:ifFeaturedTags}
  1120. initPhotosets();
  1121. feather.replace();
  1122. var $audio = $('iframe.tumblr_audio_player');
  1123. $audio.load(function() {
  1124. $(this).contents().find('head').append('<style type="text/css">' +
  1125. '.audio-player { background: {color:background}; color: {color:text} !important; }' + '</style>');
  1126. });
  1127. $('body').tooltip({track:true});
  1128. $('.i nav').clone().appendTo('footer');
  1129. $('footer nav').append('<a class="nomas">back to top</a>');
  1130. $('.nomas').click(function() {$('body, html').animate({scrollTop:0},1000);});
  1131. $('article').find('p').filter(function (){return $.trim(this.innerHTML) == ""}).remove();
  1132. flexFrame();
  1133. {block:permalinkpage}
  1134. setTimeout(showposts, 500);
  1135. setTimeout(showfooter, 600);
  1136. {/block:permalinkpage}
  1137. var $container = $('section');
  1138. var statcounter = 1;
  1139. {block:indexpage}
  1140. $container.imagesLoaded(function(){
  1141. var multiply = statcounter * 10;
  1142. var sback = multiply - 9;
  1143. statcounter++;
  1144. $('article:nth-of-type(' + multiply +')').addClass('big');
  1145. $('article:nth-of-type('+ sback +')').addClass('big');
  1146. $container.isotope({
  1147. itemSelector: 'article',
  1148. masonry: {
  1149. gutter: {select:gutter},
  1150. columnWidth: 150,
  1151. horizontalOrder: true
  1152. }
  1153. });
  1154. });
  1155. $container.on( 'layoutComplete', function(event, laidOutItems) {
  1156. setTimeout(showposts, 500);
  1157. setTimeout(showfooter, 600);
  1158. });
  1159. notes('.not', 'note');
  1160. $('.small, .over').click(function(e){
  1161. e.preventDefault();
  1162. $(this).closest('article').find('.inner').clone().appendTo('modal');
  1163. $('modal').fadeIn(300, "linear");
  1164. $('modal').css('visibility', 'visible');
  1165. setTimeout(function(){$('modal').addClass('slide');},100);
  1166. $('modal').find('iframe.tumblr_audio_player').load(function() {
  1167. $(this).contents().find('head').append('<style type="text/css">' + '.audio-player {background: {color:background} !important;}' + '</style>');
  1168. });
  1169. flexFrame();
  1170. e.stopPropagation();
  1171. });
  1172. $('modal').on('click', function(e) {
  1173. if (e.target !== this) return;
  1174. $('modal').removeClass('slide');
  1175. setTimeout(closemodal,250);
  1176. });
  1177. $('.tm').timeAgo({
  1178. time:"short",
  1179. spaces:true,
  1180. suffix:" ago"
  1181. });
  1182. {block:ifinfinitescroll}
  1183. var $grid = $container.infiniteScroll({
  1184. append: 'article',
  1185. path: '.pagination a.next',
  1186. status: '.page-load-status',
  1187. hideNav: '.pagination',
  1188. scrollThreshold: 0,
  1189. button:'.load',
  1190. loadOnScroll: false,
  1191. });
  1192. $grid.on( 'request.infiniteScroll', function( event, path ) {
  1193. $('.loading').show();
  1194. });
  1195. $grid.on( 'append.infiniteScroll', function( event, response, path, items ) {
  1196. $('footer').removeClass('loaded');
  1197. var $newElems = $( items );
  1198. var $newElemsIDs = $newElems.map(function() {return this.id;}).get();
  1199. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1200. initPhotosets();
  1201. flexFrame();
  1202. $newElems.imagesLoaded(function(){
  1203. var multiply = statcounter * 10;
  1204. var sback = multiply - 9;
  1205. $('article:nth-of-type(' + multiply +')').addClass('big');
  1206. $('article:nth-of-type('+ sback +')').addClass('big');
  1207. $container.isotope( 'appended', $newElems, true );
  1208. statcounter++;
  1209. });
  1210. $newElems.find($audio).load(function() {
  1211. $(this).contents().find('head').append('<style type="text/css">' + '.audio-player { background: {color:background}; color: {color:text} !important; }' + '</style>');
  1212. });
  1213. $container.imagesLoaded().done( function() {
  1214. setTimeout(showposts,100);
  1215. setTimeout(showfooter,400);
  1216. setTimeout(function() {$('.loading').hide();},1000);
  1217. });
  1218. $newElems.find('.tm').timeAgo({
  1219. time:"short",
  1220. spaces:true,
  1221. suffix:" ago"
  1222. });
  1223. notes('.not', 'note');
  1224. $newElems.find('.small, .over').click(function(e){
  1225. e.preventDefault();
  1226. $(this).closest('article').find('.inner').clone().appendTo('modal');
  1227. $('modal').fadeIn(300, "linear");
  1228. $('modal').css('visibility', 'visible');
  1229. setTimeout(function(){$('modal').addClass('slide');},100);
  1230. $('modal').find('iframe.tumblr_audio_player').load(function() {
  1231. $(this).contents().find('head').append('<style type="text/css">' + '.audio-player {background: {color:background} !important;}' + '</style>');
  1232. });
  1233. flexFrame();
  1234. e.stopPropagation();
  1235. });
  1236. $newElems.find('p').filter(function (){return $.trim(this.innerHTML) == ""}).remove();
  1237. feather.replace();
  1238. });
  1239. var $nextLink = $('.pagination a.next');
  1240. if ( !$nextLink.length ) {
  1241. $('.load, .pagination,.infinite-scroll-error,.infinite-scroll-request').hide();
  1242. $('.page-load-status').show();
  1243. }
  1244. $grid.on( 'last.infiniteScroll', function( event, response, path ) {
  1245. $container.imagesLoaded().done( function() {
  1246. setTimeout(showposts, 500);
  1247. setTimeout(showfooter, 600);
  1248. $('.hey').addClass('stay').closest('.pagination').addClass('left');
  1249. });
  1250. });
  1251. $grid.on( 'error.infiniteScroll', function( event, error, path ) {
  1252. $container.imagesLoaded().done( function() {
  1253. setTimeout(showposts, 500);
  1254. setTimeout(showfooter, 600);
  1255. $('.hey').addClass('stay').closest('.pagination').addClass('left');
  1256. });
  1257. });
  1258. {/block:ifinfinitescroll}{/block:indexpage}
  1259. $('footer').append('<span class="etc" style="margin-top:10px;display:block;font-size:.8em;opacity:.7">theme by <a href="https://sorrism.tumblr.com" target="_blank">sorrism</a></span>');
  1260. });
  1261. </script>
  1262. </body>
  1263.  
  1264. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement