API tools faq
paste
Advertisement
softcodesthemes

blush / theme

softcodesthemes
Sep 9th, 2022
186
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 38.17 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <!---
  4.  
  5.  
  6.  
  7. blush by @softcodes
  8. softcodes.tumblr.com/credits
  9.  
  10.  
  11.  
  12. --->
  13. <head>
  14. <title>{Title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:PostSummary}: {PostSummary}{/block:PostSummary}</title>
  15.  
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  19. <meta charset="utf-8">
  20. <meta name="viewport" contentx="width=device-width, initial-scale=1.0">
  21.  
  22. <script src="//glenthemes.github.io/iconsax/geticons.js"></script>
  23. <link href="//glenthemes.github.io/iconsax/style.css" rel="stylesheet">
  24.  
  25. <!----- VARIABLES AND OPTIONS ----->
  26.  
  27. <meta name="color:background" content="#ffffff"/>
  28. <meta name="color:post background" content="#ffffff"/>
  29. <meta name="color:post outline" content="#f8f8f8"/>
  30. <meta name="color:accent" content="#d6a4a4"/>
  31. <meta name="color:light accent" content="#f5e7e7"/>
  32. <meta name="color:text" content="#555555"/>
  33. <meta name="color:link" content="#aaaaaa"/>
  34. <meta name="color:headings" content="#222222"/>
  35. <meta name="color:borders" content="#eeeeee"/>
  36.  
  37. <meta name="image:icon" content=""/>
  38. <meta name="image:sidebar" content=""/>
  39. <meta name="image:post section background" content=""/>
  40.  
  41. <meta name="select:letterspacing" content="0.25px"/>
  42. <meta name="select:letterspacing" content="0.5px"/>
  43. <meta name="select:letterspacing" content="0px"/>
  44.  
  45. <meta name="select:Post Width" content="400px" title="400px"/>
  46. <meta name="select:Post Width" content="425px" title="425px"/>
  47. <meta name="select:Post Width" content="450px" title="450px"/>
  48. <meta name="select:Post Width" content="500px" title="500px"/>
  49. <meta name="select:Post Width" content="540px" title="540px"/>
  50.  
  51. <meta name="select:photoset gutter" content="1px" title="1px"/>
  52. <meta name="select:photoset gutter" content="2px" title="2px"/>
  53. <meta name="select:photoset gutter" content="3px" title="3px"/>
  54. <meta name="select:photoset gutter" content="4px" title="4px"/>
  55.  
  56. <meta name="text:body font" content="Inter"/>
  57. <meta name="text:font size" content="12px"/>
  58. <meta name="text:title" content="your title here">
  59. <meta name="text:post padding rgba color" content="255, 255, 255"/>
  60. <meta name="text:post margin" content="125px"/>
  61.  
  62. <meta name="text:home icon" content="home-2"/>
  63. <meta name="text:home link" content="home"/>
  64. <meta name="text:ask icon" content="messages-2"/>
  65. <meta name="text:ask link" content="ask"/>
  66. <meta name="text:archive icon" content="folder-2"/>
  67. <meta name="text:archive link" content="archive"/>
  68. <meta name="text:link 1 icon" content="user-2"/>
  69. <meta name="text:link 1 URL" content=""/>
  70. <meta name="text:link 1 text" content=""/>
  71. <meta name="text:link 2 icon" content="edit-1"/>
  72. <meta name="text:link 2 URL" content=""/>
  73. <meta name="text:link 2 text" content=""/>
  74. <meta name="text:link 3 icon" content="map-1"/>
  75. <meta name="text:link 3 URL" content=""/>
  76. <meta name="text:link 3 text" content=""/>
  77.  
  78. <link rel="preconnect" href="https://fonts.googleapis.com">
  79. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  80. <link href="https://fonts.googleapis.com/css2?family={text:body font}:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap" rel="stylesheet">
  81.  
  82. <link rel="preconnect" href="https://fonts.googleapis.com">
  83. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  84. <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
  85.  
  86. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  87.  
  88. <!----- CSS ----->
  89.  
  90. <style type="text/css">
  91.  
  92. /* --- fade in --- */
  93.  
  94. @-webkit-keyframes fadein {
  95. 0% {opacity: 0;}
  96. 100% { opacity: 1; } }
  97.  
  98. @-moz-keyframes fadein {
  99. 0% { opacity: 0; }
  100. 100% { opacity: 1; } }
  101.  
  102. @keyframes fadein {
  103. 0% { opacity: 0; }
  104. 100% { opacity: 1; } }
  105.  
  106. ::-webkit-scrollbar {width:10px;height:9px;}
  107. ::-webkit-scrollbar {background-color:transparent;}
  108. ::-webkit-scrollbar-track {border:4px solid {color:background};background-color:#ddd;}
  109. ::-webkit-scrollbar-thumb {border:4px solid {color:background};background-color:{color:accent};min-height:50px;min-width:50px;}
  110.  
  111. ::-moz-selection {background:{color:selection background};color:{color:selection text};}
  112. ::selection {background:{color:selection background};color:{color:selection text};}
  113.  
  114. /*----- BASIC STYLING -----*/
  115.  
  116. body {
  117. font-family: {text:body font}, sans-serif;
  118. font-size: {text:font size};
  119. color: {color:text};
  120. background-color: {color:background};
  121. text-align: left;
  122. letter-spacing:{select:letterspacing};
  123. line-height: 175%;
  124. word-wrap: break-word;
  125. margin: 0;
  126. padding: 0;
  127. -moz-osx-font-smoothing:grayscale;
  128. -webkit-font-smoothing:antialiased;
  129. font-smoothing:antialiased;
  130. -webkit-animation: fadein 1.5s;
  131. -moz-animation:fadein 1.5s;
  132. animation:fadein 1.5s;
  133. }
  134.  
  135. a {
  136. color: {color:link};
  137. text-decoration: none;
  138. -webkit-transition: all 0.3s;
  139. -moz-transition: all 0.3s;
  140. -ms-transition: all 0.3s;
  141. -o-transition: all 0.3s;
  142. transition: all 0.3s;
  143. }
  144.  
  145. a:hover {
  146. color: {color:accent};
  147. -webkit-transition: all 0.3s;
  148. -moz-transition: all 0.3s;
  149. -ms-transition: all 0.3s;
  150. -o-transition: all 0.3s;
  151. transition: all 0.3s;
  152. }
  153.  
  154. blockquote {
  155. padding:0 0 0 1em;
  156. border-left: 1px solid {color:borders};
  157. margin: 1em 0 1em 1em;
  158. }
  159.  
  160. h1, h2, h3, h4, h5 {
  161. line-height: 145%;
  162. font-size:calc({text:font size} + 1px);
  163. font-weight:700;
  164. color:{color:headings};
  165. text-transform:uppercase;
  166. }
  167.  
  168. small {font-size:{text:font size};}
  169. big {font-size:calc({text:font size} + 1px);}
  170.  
  171. hr {
  172. height: 1px;
  173. border: none;
  174. box-shadow: none;
  175. background-color: {color:borders};
  176. }
  177.  
  178. pre {
  179. line-height: inherit;
  180. font-size: inherit;
  181. white-space: pre-wrap;
  182. white-space: -moz-pre-wrap;
  183. white-space: -pre-wrap;
  184. white-space: -o-pre-wrap;
  185. word-wrap: break-word;
  186. }
  187.  
  188. li {
  189. max-width:100%;
  190. list-style-type: circle;
  191. }
  192.  
  193. ul {
  194. padding:0 0 0 2em;
  195. margin:1em 0;
  196. }
  197.  
  198. .tmblr-iframe-compact .tmblr-iframe--unified-controls {z-index: 999999999!important;}
  199.  
  200. /*----- sidebar -----*/
  201.  
  202. aside {
  203. display:block;
  204. position:fixed;
  205. top:100px;
  206. width:225px;
  207. height:auto;
  208. }
  209.  
  210. #icon {
  211. position:relative;
  212. width:50px;
  213. height:50px;
  214. border-radius:100%;
  215. padding:7px;
  216. margin:0 auto -28px auto;
  217. background-color:{color:accent};
  218. }
  219.  
  220. #icon img {
  221. width:50px;
  222. height:50px;
  223. border-radius:100%;
  224. border:4px solid #fff;
  225. margin-left:-4px;
  226. margin-top:-4px;
  227. }
  228.  
  229. #sidebarimg {
  230. width:100%;
  231. height:auto;
  232. margin-bottom:2.25em;
  233. z-index:-1;
  234. }
  235.  
  236. #sidebarimg img {
  237. width:100%;
  238. height:auto;
  239. border-radius:3px;
  240. }
  241.  
  242. .title-line {
  243. height:1px;
  244. background-color:{color:borders};
  245. display:block;
  246. margin-bottom:-27px;
  247. margin-top:1em;
  248. }
  249.  
  250. #blogtitle {
  251. display:inline-block;
  252. padding-right:5px;
  253. background-color:{color:background};
  254. font-size:calc({text:font size} + 3px);
  255. font-weight:600;
  256. letter-spacing:-0.25px;
  257. margin:1em 0 0.6em 0;
  258. }
  259.  
  260. #blogtitle a {color:{color:headings};}
  261. #blogtitle a:hover {color:{color:accent};}
  262.  
  263. #description {
  264. display:block;
  265. text-align:justify;
  266. border-bottom:1px solid {color:borders};
  267. margin-bottom:1.5em;
  268. padding-bottom:1.5em;
  269. }
  270.  
  271. nav {
  272. display: flex;
  273. flex-direction: row;
  274. align-items: flex-start;
  275. justify-content: space-between;
  276. }
  277.  
  278. nav a .iconsax {
  279. --Iconsax-Size:calc({text:font size} + 4px);
  280. --Iconsax-Color:{color:text};
  281. vertical-align:middle;
  282. transition: ease-in-out 0.3s;
  283. }
  284.  
  285. nav a {
  286. display:block;
  287. color:{color:text};
  288. }
  289.  
  290. nav a:hover {color:{color:accent};}
  291.  
  292. nav a:hover .iconsax {
  293. --Iconsax-Color:{color:accent};
  294. }
  295.  
  296.  
  297. /*----- POSTS -----*/
  298.  
  299. main {
  300. position: relative;
  301. width:calc({select:post width} + 475px);
  302. margin: auto;
  303. }
  304.  
  305. section {
  306. position:relative;
  307. top:0;
  308. padding:100px 50px 50px 50px;
  309. height:100%;
  310. min-height:100vh;
  311. width:calc({select:post width} + 70px);
  312. margin-left:325px;
  313. background-image:url({image:post section background});
  314. background-repeat:repeat;
  315. background-attachment:fixed;
  316. }
  317.  
  318. article {
  319. width:{select:post width};
  320. position: relative;
  321. background-color:{color:post background};
  322. padding:20px;
  323. border-radius:3px;
  324. }
  325.  
  326. .article-wrap {
  327. padding:15px;
  328. width:calc({select:post width} + 40px);
  329. background-color:rgba({text:post padding rgba color}, .5);
  330. border:1px solid {color:post outline};
  331. border-radius:3px;
  332. margin:0px auto {text:post margin} auto;
  333. }
  334.  
  335. .article-wrap:last-of-type {
  336. margin-bottom:0px;
  337. }
  338.  
  339. /* video */
  340.  
  341. .tumblr_video_container {
  342. width:{select:post width}!important;
  343. height:auto;
  344. margin-bottom:1em;
  345. }
  346.  
  347. .posts li, .posts blockquote, figure, video, iframe, .video, .video iframe, figure.tmblr-embed.tmblr-full, figure.tmblr-embed.tmblr-full iframe {max-width: 100%;}
  348.  
  349. /*----- CAPTIONS -----*/
  350.  
  351. .caption {
  352. list-style-type:none;
  353. padding-bottom:2em;
  354. }
  355.  
  356. .caption:only-of-type, .caption:last-of-type {
  357. border-bottom:1px solid {color:borders};
  358. }
  359.  
  360. .caption a {
  361. box-shadow:0 -4px 0 {color:light accent} inset;
  362. color:{color:text};
  363. -webkit-transition: all 0.5s;
  364. -moz-transition: all 0.5s;
  365. -ms-transition: all 0.5s;
  366. -o-transition: all 0.5s;
  367. transition: all 0.5s;
  368. }
  369.  
  370. .caption a:hover {
  371. box-shadow:0 -18px 0 {color:light accent} inset;
  372. color:{color:headings};
  373. -webkit-transition: all 0.5s;
  374. -moz-transition: all 0.5s;
  375. -ms-transition: all 0.5s;
  376. -o-transition: all 0.5s;
  377. transition: all 0.5s;
  378. }
  379.  
  380. .caption p {margin:1em 0;}
  381. .caption p:last-of-type {margin-bottom: 0;}
  382.  
  383. .caption blockquote p:first-of-type {margin-top: 0;}
  384.  
  385. .original-caption p:first-of-type {margin-top: 0;}
  386. .text-caption:first-of-type {margin-top: 0;}
  387. .caption iframe, .caption img {max-width: 100%;}
  388.  
  389. .icon-wrap {
  390. background-color:{color:background};
  391. padding-right:5px;
  392. display:inline-block;
  393. }
  394.  
  395. .user-icon {
  396. display: inline-block;
  397. vertical-align: middle;
  398. border-radius: 50%;
  399. width:1.75em;
  400. height:1.75em;
  401. margin-right:0.75em;
  402. padding:3px;
  403. border:2px solid {color:light accent};
  404. }
  405.  
  406. .line {
  407. height:1px;
  408. background-color:{color:borders};
  409. display:block;
  410. margin-bottom:-16px;
  411. margin-top:1em;
  412. }
  413.  
  414. .username {
  415. font-weight:700;
  416. display: inline-block;
  417. vertical-align: middle;
  418. text-transform:lowercase;
  419. }
  420.  
  421. .username a {
  422. color:{color:headings};
  423. background:none!important;
  424. box-shadow:0 0 0 inset;
  425. }
  426.  
  427. .username a:hover {color:{color:accent};box-shadow:0 0 0 inset;}
  428.  
  429. .deactive::after {
  430. content: '(deactivated)';
  431. margin-left: 0.5em;
  432. opacity: 0.75;
  433. color: {color:text};
  434. }
  435.  
  436. p.tmblr-attribution {margin-top: 1em !important;}
  437.  
  438. /*----- TEXT -----*/
  439.  
  440. h1.post-title {
  441. margin:0 0 1em 0;
  442. font-size:calc({text:font size} + 5px);
  443. font-weight:400;
  444. letter-spacing:0px;
  445. text-transform:lowercase;
  446. padding:0;
  447. }
  448.  
  449. h1.post-title a {
  450. color:{color:headings};
  451. }
  452.  
  453. /*---- BORDER RADIUS ----*/
  454.  
  455. .border-radius, .photo, .video, a.link-wrap, .npf-link-block, .photo-slideshow {
  456. border-radius:3px!important;
  457. overflow:hidden;
  458. }
  459.  
  460. /*----- LINK -----*/
  461.  
  462. a.link-wrap {display: block; border: 1px solid {color:borders};}
  463.  
  464. .linkwrap-image, .linkwrap-image img {
  465. border-radius:3px 3px 0 0;
  466. }
  467.  
  468. .link {padding: 2em;}
  469. .link-host, .link-txt {margin-top: 1.5em;}
  470.  
  471. .npf-link-block {
  472. margin-top: 1.5em;
  473. border-radius: 0;
  474. background-color: initial;
  475. }
  476.  
  477. .npf-link-block a {box-shadow:0 0 0 inset;}
  478. .npf-link-block a:hover {box-shadow:0 0 0 inset;}
  479.  
  480. .npf-link-block .poster .title {padding: 1.5em;}
  481. .npf-link-block.no-poster .title {padding: 1.5em 1.5em 0 1.5em;}
  482. .npf-link-block .title {font-size: 1.25em; border-bottom: none;}
  483. .npf-link-block .bottom {padding: 1.5em !important;}
  484.  
  485. /*----- PHOTO -----*/
  486.  
  487. img {
  488. margin: 0;
  489. display: block;
  490. height: auto;
  491. max-width: 100%;
  492. }
  493.  
  494. .photo img {width: 100%;}
  495.  
  496. .photo {padding-bottom:1em;}
  497.  
  498. /* npf-created single photo */
  499. figure.tmblr-full a.post_media_photo_anchor {
  500. display: inherit;
  501. }
  502.  
  503. .vignette, #vignette {opacity: 0;}
  504. .tmblr-lightbox, #tumblr_lightbox {
  505. background-color:rgba(255,255,255, .7)!important;
  506. backdrop-filter:blur(2px);
  507. }
  508.  
  509. .lightbox-image, #tumblr_lightbox img {
  510. box-shadow: none !important;
  511. border-radius: 0 !important;
  512. max-width: none;
  513. }
  514.  
  515. #tumblr_lightbox_caption, .lightbox-caption {
  516. color: #fff !important;
  517. font-family: inherit;
  518. margin-top: 1em !important;
  519. }
  520.  
  521. /*----- PHOTOSET -----*/
  522.  
  523. .post-content div.npf_row, .post div.npf_row, body div.npf_row {
  524. margin-left: 0 !important;
  525. margin-right: 0 !important;
  526. }
  527.  
  528. .npf_inst, .npf_row_parent, .photo img, [photoset-layout], iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track'], .tmblr-full > video, .npf-link-block {
  529. border-radius:3px!important;
  530. overflow:hidden!important;
  531. }
  532.  
  533. .photo-slideshow {visibility: hidden;} .photo-slideshow.processed {visibility: visible;margin-bottom:1.5em;} .photo-slideshow .row {clear: both;width: 100%;} .photo-slideshow .pxu-photo {display: block;float: clear;width: 100%;overflow: hidden;} .photo-slideshow .pxu-photo img {display: block;} .photo-slideshow.processed .pxu-photo img {width:100%;height: auto;} .photo-slideshow .pxu-photo:first-child img {margin:auto;} .photo-slideshow .count-1 {max-width:100%;height: auto;} .set {margin-left:10px;} .photo-slideshow .count-2 {width:50%;height: auto;} .photo-slideshow .count-3 {width:33.33%;height: auto;}
  534.  
  535. /*----- QUOTE -----*/
  536.  
  537. .quote, p.npf_quote {
  538. line-height: 150%;
  539. font-size:calc({text:font size} + 4px);
  540. color:{color:headings};
  541. font-weight:300;
  542. }
  543.  
  544. .quote .iconsax {
  545. --Iconsax-Size:16px;
  546. --Iconsax-Color:{color:accent};
  547. vertical-align:middle;
  548. margin-top:-3px;
  549. }
  550.  
  551. .right {margin-right:0.5em;}
  552.  
  553. .left {margin-left:0.5em;}
  554.  
  555. .quote p:first-of-type {margin-top: 0;}
  556. .quote p:last-of-type {margin-bottom: 0;}
  557. p.npf_quote {font-family: inherit; margin-bottom: 1em;}
  558.  
  559. .source {
  560. margin-top:1em;
  561. font-weight:700;
  562. text-align:right;
  563. }
  564.  
  565. .source .iconsax {
  566. --Iconsax-Size:16px;
  567. --Iconsax-Color:{color:text};
  568. margin-right:0.25em;
  569. vertical-align:middle;
  570. margin-top:-1px;
  571. }
  572.  
  573. /* audio */
  574.  
  575. iframe.tumblr_audio_player {
  576. width:100%;
  577. border-radius:3px;
  578. margin-bottom:5px;
  579. }
  580.  
  581.  
  582. /*----- CHAT -----*/
  583.  
  584. .chat {
  585. margin:0;
  586. padding:0;
  587. }
  588.  
  589. .chat li {
  590. list-style-type: none;
  591. margin-top: 0.25em;
  592. border-radius:3px;
  593. padding:1em 1.5em;
  594. }
  595.  
  596. .chat li:nth-of-type(odd) {
  597. background-color:#fafafa;
  598. }
  599.  
  600. .chat li:nth-of-type(even) {
  601. background-color:#f2f2f2;
  602. }
  603.  
  604. .chat li:first-of-type {margin-top:0;}
  605.  
  606. .chatter {
  607. display:inline-block;
  608. margin-right:5px;
  609. font-weight:700;
  610. color:{color:headings};
  611. }
  612.  
  613. .chattxt {display:inline-block;}
  614.  
  615. p.npf_chat {font-family: inherit; margin-top: 1em;}
  616. p.npf_chat b {font-family: inherit;}
  617.  
  618. /*----- answer -----*/
  619.  
  620. .ask-wrap {
  621. display:block;
  622. }
  623.  
  624. .ask-padding {
  625. height:1em;
  626. display:block;
  627. background-color:{color:background};
  628. }
  629.  
  630. .asker {
  631. display:inline-block;
  632. float:left;
  633. text-transform:lowercase;
  634. color:{color:headings};
  635. font-weight:700;
  636. }
  637.  
  638. .asker a {color:{color:headings};display:inline-block;}
  639.  
  640. .asker a:hover {color:{color:accent};}
  641.  
  642. .askerimg {
  643. display:block;
  644. position:relative;
  645. width:100%;
  646. margin:0px auto -15px auto;
  647. width:26px;
  648. height:26px;
  649. border-radius:100%;
  650. padding:3px;
  651. border:2px solid {color:accent};
  652. background-color:#fff;
  653. }
  654.  
  655. .askerimg img {
  656. width:26px;
  657. height:26px;
  658. border-radius:100%;
  659. }
  660.  
  661. .question {
  662. display:block;
  663. padding:1.75em;
  664. border-radius:3px;
  665. border:1px solid {color:borders};
  666. margin-bottom:1.5em;
  667. }
  668.  
  669. .question p:first-of-type {margin-top: 0;}
  670. .question p:last-of-type {margin-bottom: 0;}
  671.  
  672. /*----- INFO -----*/
  673.  
  674. .info {
  675. margin:1.75em 0em 0em 0em;
  676. display: flex;
  677. flex-direction: row;
  678. align-items: flex-start;
  679. justify-content: space-between;
  680. text-transform:lowercase;
  681. }
  682.  
  683. .info a {
  684. display: inline-block;
  685. vertical-align: middle;
  686. color:{color:text};
  687. margin-right:1em;
  688. }
  689.  
  690. .info a:hover {color:{color:accent};}
  691.  
  692. .info a:last-of-type {margin-right:0px;}
  693.  
  694. .info .iconsax {
  695. --Iconsax-Size:calc({text:font size} + 2px);
  696. --Iconsax-Color:{color:text};
  697. vertical-align:middle;
  698. margin-top:-2px;
  699. margin-right:0.5em;
  700. }
  701.  
  702. .likeb {
  703. position: relative;
  704. display: inline-block;
  705. height: inherit;
  706. }
  707.  
  708. .notecount {
  709. font-weight:400!important;
  710. }
  711.  
  712. .likeb .like_button iframe {
  713. position: absolute;
  714. top: 0;
  715. left: 0;
  716. bottom: 0;
  717. right: 0;
  718. z-index: 2;
  719. opacity: 0;
  720. }
  721.  
  722. .like_button iframe {width:100%!important;height:100%!important;}
  723. .likeb .liked + .actual-button {color: red;}
  724. .likeb .liked + .actual-button:after {content: 'd';}
  725.  
  726. /* pinned post */
  727.  
  728. .pinned-post {
  729. display:inline-block;
  730. font-weight:600;
  731. }
  732.  
  733. .pinned-post a {
  734. color:{color:accent};
  735. }
  736.  
  737. .pinned-post .iconsax {
  738. --Iconsax-Size:16px;
  739. --Iconsax-Color:{color:accent};
  740. margin-right:0.4em!important;
  741. }
  742.  
  743. /* source info */
  744.  
  745. .source-info {
  746. margin:3.5em 0;
  747. }
  748.  
  749. .source-info li {
  750. list-style-type: none;
  751. text-transform:lowercase;
  752. }
  753.  
  754. .source-info li:first-of-type {
  755. margin-top:2em;
  756. }
  757.  
  758.  
  759. /*---- tags -----*/
  760.  
  761. .tags {display:block;margin:0.75em 0 0 0;}
  762.  
  763. .tags a {margin-right:1.2em;color:{color:link};vertical-align:middle;}
  764.  
  765. .tags a:hover {color:{color:text};}
  766.  
  767.  
  768. /*---- tagday page ----*/
  769.  
  770. .tagday-page {
  771. text-align:center;
  772. text-transform:lowercase;
  773. }
  774.  
  775. .tag-day {
  776. display:block;
  777. font-size:calc({text:font size} + 3px);
  778. font-weight:600;
  779. color:{color:accent};
  780. }
  781.  
  782. /*---- POST NOTES -----*/
  783.  
  784. .notes {
  785. margin:0;
  786. text-transform:lowercase;
  787. }
  788.  
  789. ol.notes {
  790. max-width: 100%;
  791. padding:0;
  792. margin:0;
  793. }
  794.  
  795. ol.notes li.note {padding: 0.5em 0; list-style-type: none;text-align:left!important;}
  796.  
  797. ol.notes li.note img.avatar {
  798. border-radius: 50%;
  799. margin-right: 1em;
  800. vertical-align: middle;
  801. display: inline-block;
  802. width: 1.25em;
  803. height: 1.25em;
  804. }
  805.  
  806. /*---- PAGINATION -----*/
  807.  
  808. #page-navigation {
  809. text-align: center;
  810. font-weight:400;
  811. }
  812.  
  813. #page-navigation a {margin: 0 1em;}
  814.  
  815. .current-page {
  816. color: {color:accent};
  817. margin: 0 1em;
  818. }
  819.  
  820. #page-navigation .iconsax {
  821. --Iconsax-Size:16px;
  822. --Iconsax-Color:{color:link};
  823. vertical-align:middle;
  824. margin-top:-1px;
  825. }
  826.  
  827. /* tooltip */
  828.  
  829. .tippy-box[data-theme~='rosemary'] {
  830. background-color:#333;
  831. color:#fff;
  832. font-size:10px;
  833. letter-spacing:0.5px;
  834. text-transform:lowercase;
  835. }
  836.  
  837. /* scroll to top */
  838.  
  839. .scrollToTopBtn {
  840. background-color:transparent;
  841. border: none;
  842. --Iconsax-Size:16px;
  843. --Iconsax-Color:{color:link};
  844. cursor: pointer;
  845. width:20px;
  846. height:16px;
  847. position: fixed;
  848. bottom:45px;
  849. right:16px;
  850. z-index:9999999;
  851. opacity: 0;
  852. transition: all .5s ease
  853. }
  854.  
  855. .showBtn {
  856. opacity: 1;
  857. }
  858.  
  859. /* credit */
  860.  
  861. #soft {
  862. position: fixed;
  863. bottom: 15px;
  864. right: 20px;
  865. --Iconsax-Size:16px;
  866. --Iconsax-Color:{color:link};
  867. }
  868.  
  869. iframe.tmblr-iframe {
  870. z-index:99999999999999!important;
  871. top:2px!important;
  872. right:0!important;
  873. opacity:0.5;
  874. /* delete invert(1) from here */
  875. filter:invert(1) contrast(150%);
  876. -webkit-filter:invert(1) contrast(150%);
  877. -o-filter:invert(1) contrast(150%);
  878. -moz-filter:invert(1) contrast(150%);
  879. -ms-filter:invert(1) contrast(150%);
  880. /* to here if your blog has a dark background */
  881. transform:scale(0565);
  882. transform-origin:100% 0;
  883. -webkit-transform:scale(0.65);
  884. -webkit-transform-origin:100% 0;
  885. -o-transform:scale(0.65);
  886. -o-transform-origin:100% 0;
  887. -moz-transform:scale(0.65);
  888. -moz-transform-origin:100% 0;
  889. -ms-transform:scale(0.65);
  890. -ms-transform-origin:100% 0;
  891. -moz-transition-duration: 0.3s;
  892. -o-transition-duration: 0.3s;
  893. -webkit-transition-duration: 0.3s;
  894. transition-duration: 0.3s;
  895. }
  896.  
  897. iframe.tmblr-iframe:hover {
  898. opacity:0.8!important;
  899. -moz-transition-duration: 0.3s;
  900. -o-transition-duration: 0.3s;
  901. -webkit-transition-duration: 0.3s;
  902. transition-duration: 0.3s;
  903. }
  904.  
  905. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  906. height:80px!important;
  907. width:100%;
  908. }
  909.  
  910. #toggle {
  911. position:fixed;
  912. z-index:9999999999999;
  913. width:15px;
  914. height:15px;
  915. top:20px;
  916. left:18px;
  917. cursor:pointer;
  918. display: flex;
  919. align-items: center;
  920. justify-content: center;
  921. }
  922.  
  923. #toggle .iconsax {
  924. --Iconsax-Size:16px;
  925. --Iconsax-Color:{color:text};
  926. }
  927.  
  928. #myDIV {
  929. display:none;
  930. position:fixed;
  931. z-index:9999999999999;
  932. top:20px;
  933. left:20px;
  934. width:180px;
  935. height:auto;
  936. margin:30px 0 0 0;
  937. }
  938.  
  939. #updates:hover {opacity:1;}
  940.  
  941. #updates span {display:block;}
  942.  
  943. #updates a {display:inline-block;}
  944.  
  945. #updates h2 {
  946. font-size:11px;
  947. font-weight:bold;
  948. text-transform:lowercase;
  949. letter-spacing:0.5px;
  950. margin:1em 0;
  951. padding:0;
  952. }
  953.  
  954. /*--- for small desktop/tablet screens. converts sidebar to header ---*/
  955.  
  956. @media only screen and (max-width: 1100px) {
  957. main {width: {select:post width};}
  958.  
  959. #sidebar {
  960. position: relative;
  961. margin: {text:post margin}px auto;
  962. width: 100%;
  963. top:50px;
  964. left:0;
  965. }
  966.  
  967. section {margin-left: 0;}
  968. }
  969.  
  970. /*--- for mobile devices ---*/
  971.  
  972. @media only screen and (max-width: 720px) {
  973. main, section {width: 80vw;}
  974. }
  975.  
  976. /*---- END OF MEDIA QUERIES -----*/
  977.  
  978. {CustomCSS}
  979.  
  980. </style>
  981.  
  982. </head>
  983.  
  984. <script src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script>
  985.  
  986. <!--
  987. NPF images fix v3.0 by @glenthemes [2021]
  988. 💌 git.io/JRBt7
  989. --->
  990. <script src="//npf-images-v3.github.io/script.js"></script>
  991. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  992. <style tmblr-npf>
  993. :root {
  994. --NPF-Caption-Spacing:1em;
  995. --NPF-Image-Spacing:{select:photoset gutter};
  996. }
  997. </style>
  998.  
  999. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  1000.  
  1001. <body>
  1002.  
  1003. <!-- scroll to top -->
  1004. <div class="scrollToTopBtn"><i class="iconsax" icon-name="arrow-up"></i>️</div>
  1005.  
  1006. <!------------------------------------->
  1007. <!------------ UPDATES TAB ------------>
  1008. <!------------------------------------->
  1009.  
  1010. <div id="toggle" onclick="myFunction()"><i class="iconsax" icon-name="menu-hamburger"></i>️</div>
  1011.  
  1012. <div id="myDIV">
  1013. <div id="updates">
  1014. <span><b>currently:</b> in summer hell</span>
  1015. <span><b>reading:</b> a book</span>
  1016. <span><b>watching:</b> a tv show</span>
  1017. <span><b>listening:</b> an album</span>
  1018. </div>
  1019. </div>
  1020.  
  1021. <!------------------------------------->
  1022. <!---------- END UPDATES TAB ---------->
  1023. <!------------------------------------->
  1024.  
  1025. <!-- main = main container -->
  1026.  
  1027. <main>
  1028.  
  1029. <!----- sidebar ----->
  1030.  
  1031. <aside>
  1032. <div id="icon"><img src="{image:icon}"/></div>
  1033. <div id="sidebarimg"><img src="{image:sidebar}"/></div>
  1034.  
  1035. <div class="title-line"></div>
  1036. <div id="blogtitle"><a href="/">{text:title}</a></div>
  1037.  
  1038. <div id="description">{Description}</div>
  1039.  
  1040. <nav>
  1041. <a href="/" title="️{text:home link}"><i class="iconsax" icon-name="{text:home icon}"></i></a>
  1042. <a href="/ask" title="️{text:ask link}"><i class="iconsax" icon-name="{text:ask icon}"></i></a>
  1043. <a href="/archive" title="{text:archive link}"><i class="iconsax" icon-name="{text:archive icon}"></i></a>
  1044. <a href="{text:link 1 url}" title="{text:link 1 text}"><i class="iconsax" icon-name="{text:link 1 icon}"></i></a>
  1045. <a href="{text:link 2 url}" title="{text:link 2 text}"><i class="iconsax" icon-name="{text:link 2 icon}"></i></a>
  1046. <a href="{text:link 3 url}" title="{text:link 3 text}"><i class="iconsax" icon-name="{text:link 3 icon}"></i></a>
  1047. </nav>
  1048. </aside>
  1049.  
  1050. <!----- TAG AND DAY PAGES ----->
  1051.  
  1052. <!-- section = your post container -->
  1053.  
  1054. <section>
  1055.  
  1056. {block:TagPage}
  1057. <div class="article-wrap">
  1058. <article class="tagday-page">
  1059. Viewing posts filed under <span class="tag-day">#{Tag}</span>
  1060. </article>
  1061. </div>
  1062. {/block:TagPage}
  1063.  
  1064. {block:DayPage}
  1065. <div class="article-wrap">
  1066. <article class="tagday-page">
  1067. Viewing posts made on <span class="tag-day">{Month} {DayOfMonth}, {Year}</span>
  1068. </article>
  1069. </div>
  1070. {/block:DayPage}
  1071.  
  1072. <!----- POSTS ----->
  1073.  
  1074. {block:posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  1075.  
  1076. <div class="article-wrap">
  1077. <article class="posts" id="{PostID}" post-type="{PostType}">
  1078.  
  1079. {block:Text}
  1080. {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  1081. {block:NotReblog}
  1082. <li class="caption original-caption text-caption">
  1083. <div class="caption-text">{Body}</div>
  1084. </li>
  1085. {/block:NotReblog}
  1086. {block:RebloggedFrom}
  1087. <div class="reblog-wrap">
  1088. {block:Reblogs}
  1089. <li class="caption text-caption">
  1090. <div class="line"></div>
  1091. <div class="icon-wrap">
  1092. <img src="{PortraitURL-64}" class="user-icon">
  1093. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1094. </div>
  1095. <div class="caption-text">{Body}</div>
  1096. </li>
  1097. {/block:Reblogs}
  1098. </div>
  1099. {/block:RebloggedFrom}
  1100. {/block:Text}
  1101.  
  1102. {block:Link}
  1103. <a href="{URL}" class="link-wrap">
  1104. {block:Thumbnail}<div class="linkwrap-image"><img src="{Thumbnail-HighRes}"></div>{/block:Thumbnail}
  1105. <div class="link">
  1106. <div class="title">{Name}</div>
  1107. {block:Excerpt}<div class="link-txt">{Excerpt}</div>{/block:Excerpt}
  1108. {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  1109. </div>
  1110. </a>
  1111. {block:Description}
  1112. {block:NotReblog}
  1113. <li class="caption original-caption">
  1114. <div class="caption-text">{Description}</div>
  1115. </li>
  1116. {/block:NotReblog}
  1117. {/block:Description}
  1118. {block:RebloggedFrom}
  1119. <div class="reblog-wrap">
  1120. {block:Reblogs}
  1121. <li class="caption">
  1122. <div class="line"></div>
  1123. <div class="icon-wrap">
  1124. <img src="{PortraitURL-64}" class="user-icon">
  1125. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1126. </div>
  1127. <div class="caption-text">{Body}</div>
  1128. </li>
  1129. {/block:Reblogs}
  1130. </div>
  1131. {/block:RebloggedFrom}
  1132. {/block:Link}
  1133.  
  1134. {block:Photo}
  1135. <div class="photo">
  1136. {LinkOpenTag}<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"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>{LinkCloseTag}
  1137. </div>
  1138. {block:Caption}
  1139. {block:NotReblog}
  1140. <li class="caption original-caption">
  1141. <div class="caption-text">{Caption}</div>
  1142. </li>
  1143. {/block:NotReblog}
  1144. {block:RebloggedFrom}
  1145. <div class="reblog-wrap">
  1146. {block:Reblogs}
  1147. <li class="caption">
  1148. <div class="line"></div>
  1149. <div class="icon-wrap">
  1150. <img src="{PortraitURL-64}" class="user-icon">
  1151. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1152. </div>
  1153. <div class="caption-text">{Body}</div>
  1154. </li>
  1155. {/block:Reblogs}
  1156. </div>
  1157. {/block:RebloggedFrom}
  1158. {/block:Caption}
  1159. {/block:Photo}
  1160.  
  1161. <!-- photoset -->
  1162.  
  1163. {block:Photoset}
  1164. <div class="border-radius"><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></div>
  1165. {block:Caption}
  1166. {block:NotReblog}
  1167. <li class="caption original-caption">
  1168. <div class="caption-text">{Caption}</div>
  1169. </li>
  1170. {/block:NotReblog}
  1171. {block:RebloggedFrom}
  1172. <div class="reblog-wrap">
  1173. {block:Reblogs}
  1174. <li class="caption">
  1175.  
  1176. <div class="line"></div>
  1177. <div class="icon-wrap">
  1178. <img src="{PortraitURL-64}" class="user-icon">
  1179. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1180. </div>
  1181.  
  1182. <div class="caption-text">{Body}</div>
  1183. </li>
  1184. {/block:Reblogs}
  1185. </div>
  1186. {/block:RebloggedFrom}
  1187. {/block:Caption}
  1188. {/block:Photoset}
  1189.  
  1190. {block:Video}
  1191. <div class="video">{Video-700}</div>
  1192. {block:Caption}
  1193. {block:NotReblog}
  1194. <li class="caption original-caption">
  1195. <div class="caption-text">{Caption}</div>
  1196. </li>
  1197. {/block:NotReblog}
  1198. {block:RebloggedFrom}
  1199. <div class="reblog-wrap">
  1200. {block:Reblogs}
  1201. <li class="caption">
  1202. <div class="line"></div>
  1203. <div class="icon-wrap">
  1204. <img src="{PortraitURL-64}" class="user-icon">
  1205. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1206. </div>
  1207. <div class="caption-text">{Body}</div>
  1208. </li>
  1209. {/block:Reblogs}
  1210. </div>
  1211. {/block:RebloggedFrom}
  1212. {/block:Caption}
  1213. {/block:Video}
  1214.  
  1215. {block:Quote}
  1216. <div class="caption" style="border-bottom:1px solid {color:borders};">
  1217. <div class="quote">{Quote}</div>
  1218. {block:Source}<div class="source"><i class="iconsax" icon-name="minus"></i>{Source}</div>{/block:Source}
  1219. </div>
  1220. {/block:Quote}
  1221.  
  1222. {block:Chat}
  1223. {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  1224. <ul class="chat">{block:Lines}
  1225. <li>
  1226. {block:Label}<div class="chatter">{Label}</div>{/block:Label}
  1227. <div class="chattxt">{Line}</div>
  1228. </li>
  1229. {/block:Lines}</ul>
  1230. {/block:Chat}
  1231.  
  1232. {block:Audio}
  1233. <div class="audio">
  1234. {AudioEmbed}
  1235. </div>
  1236. {block:Caption}
  1237. {block:NotReblog}
  1238. <li class="caption original-caption">
  1239. <div class="caption-text">{Caption}</div>
  1240. </li>
  1241. {/block:NotReblog}
  1242. {block:RebloggedFrom}
  1243. <div class="reblog-wrap">
  1244. {block:Reblogs}
  1245. <li class="caption">
  1246. <div class="line"></div>
  1247. <div class="icon-wrap">
  1248. <img src="{PortraitURL-64}" class="user-icon">
  1249. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1250. </div>
  1251. <div class="caption-text">{Body}</div>
  1252. </li>
  1253. {/block:Reblogs}
  1254. </div>
  1255. {/block:RebloggedFrom}
  1256. {/block:Caption}
  1257. {/block:Audio}
  1258.  
  1259. <!-- answer -->
  1260.  
  1261. {block:Answer}
  1262. <div class="ask-wrap">
  1263. <div class="askerimg">
  1264. <img src="{AskerPortraitURL-64}"/>
  1265. </div>
  1266.  
  1267. <div class="question">
  1268. <div class="asker">{asker}&nbsp;said:&nbsp;</div>
  1269.  
  1270. {Question}
  1271. </div>
  1272. </div>
  1273. {block:Answerer}
  1274. <li class="caption">
  1275. <img src="{AnswererPortraitURL-64}" class="user-icon">
  1276. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Answerer} answered:</a></div>
  1277. <div class="caption-text answer">{Answer}</div>
  1278. </li>
  1279. {/block:Answerer}
  1280. {block:NotReblog}
  1281. <li class="caption original-caption">
  1282. <div class="caption-text answer">{Replies}</div>
  1283. </li>
  1284. {/block:NotReblog}
  1285. {block:RebloggedFrom}
  1286. <div class="reblog-wrap">
  1287. {block:Reblogs}
  1288. <li class="caption">
  1289. <img src="{PortraitURL-64}" class="user-icon">
  1290. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username} answered:</a></div>
  1291. <div class="caption-text">{Body}</div>
  1292. </li>
  1293. {/block:Reblogs}
  1294. </div>
  1295. {/block:RebloggedFrom}
  1296. {/block:Answer}
  1297.  
  1298. <!----- INFO ----->
  1299.  
  1300. {block:Date}
  1301. <div class="info">
  1302. {block:PinnedPostLabel}
  1303. <div class="pinned-post">
  1304. <a href="{Permalink}" class="pinned-post"><i class="iconsax" icon-name="info-badge"></i> pinned</a>
  1305. </div>{/block:PinnedPostLabel}
  1306.  
  1307. <a href="{Permalink}" title="{timeago}"><i class="iconsax" icon-name="calendar-1"></i>{ShortMonth} {DayofMonth}</a>
  1308.  
  1309. <a href="{Permalink}"><i class="iconsax" icon-name="messages-2"></i><span class="notecount">{NoteCountWithLabel}</span></a>
  1310. <a class="likeb" href="#">{LikeButton}<span class="actual-button"><i class="iconsax" icon-name="heart"></i>like</span></a>
  1311. <a href="{ReblogURL}" target="_blank"><i class="iconsax" icon-name="repeat"></i>reblog</a>
  1312. </div>
  1313.  
  1314. <!----- TAGS ----->
  1315.  
  1316. {block:HasTags}
  1317. <div class="tags">
  1318. {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  1319. </div>
  1320. {/block:HasTags}
  1321.  
  1322. <!-- content source on permalink pages -->
  1323. {block:PermalinkPage}
  1324. <div class="source-info">
  1325. {block:RebloggedFrom}
  1326. <li><b>reblogged via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a></li>
  1327. <li><b>originally from:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a></li>
  1328. {/block:RebloggedFrom}
  1329. {block:ContentSource}<li>{lang:Source}: <a href="{SourceURL}">{SourceTitle}</a></li>{/block:ContentSource}
  1330. </div>
  1331. {/block:PermalinkPage}
  1332. {/block:Date}
  1333.  
  1334. <!----- POST NOTES ----->
  1335.  
  1336. {block:PermalinkPage}{block:Date}
  1337. {block:NoteCount}{block:PostNotes}
  1338. <div class="notes">
  1339. {PostNotes-64}
  1340. </div>
  1341. {/block:PostNotes}{/block:NoteCount}
  1342. {/block:Date}{/block:PermalinkPage}
  1343.  
  1344. </article>
  1345. </div>
  1346. {/block:Posts}
  1347.  
  1348. <!-- end of posts container -->
  1349.  
  1350. <!----- PAGINATION ----->
  1351.  
  1352. {block:Pagination}
  1353. <div class="article-wrap">
  1354. <article id="page-navigation">
  1355. {block:PreviousPage}<a href="{PreviousPage}" title="previous page"><i class="iconsax" icon-name="arrow-left"></i></a>{/block:PreviousPage}
  1356. {block:JumpPagination length="5"}
  1357. {block:CurrentPage}<span class="current-page">{PageNumber}</span>{/block:CurrentPage}
  1358. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1359. {/block:JumpPagination}
  1360. {block:NextPage}<a href="{NextPage}" title="next page"><i class="iconsax" icon-name="arrow-right"></i></a>{/block:NextPage}
  1361. </article>
  1362. </div>
  1363. {/block:Pagination}
  1364.  
  1365. </section>
  1366.  
  1367. <!-- end of main container -->
  1368.  
  1369. </main>
  1370.  
  1371. <a href="https://softcodes.tumblr.com" title="theme by @softcodes" id="soft"><i class="iconsax" icon-name="heart"></i></a>
  1372.  
  1373. <!-- scripts -->
  1374. <script src="https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js"></script>
  1375. <script src="https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js"></script>
  1376. <script src="https://unpkg.com/@popperjs/core@2"></script>
  1377. <script src="https://unpkg.com/tippy.js@6"></script>
  1378. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  1379. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1380. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  1381.  
  1382.  
  1383. <script>
  1384. $(document).ready(function(){
  1385. $('.photo-slideshow').pxuPhotoset({
  1386. lightbox: true,
  1387. highRes: true,
  1388. gutter: '{select:photoset gutter}',
  1389. borderRadius: '0px',
  1390. photoset: '.photo-slideshow',
  1391. photoWrap: '.photo-data',
  1392. photo: '.pxu-photo'
  1393. });
  1394.  
  1395. }); </script>
  1396.  
  1397. <script>
  1398. var $container = $('.posts');
  1399. $container.find('.notecount').each(function(){
  1400. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  1401. if (n > 999) {
  1402. n = Math.floor(n / 100) / 10;
  1403. $(this).text(n + 'k notes');
  1404. }
  1405. });
  1406. </script>
  1407.  
  1408. <script>
  1409. var scrollToTopBtn = document.querySelector(".scrollToTopBtn")
  1410. var rootElement = document.documentElement
  1411.  
  1412. function handleScroll() {
  1413. var scrollTotal = rootElement.scrollHeight - rootElement.clientHeight
  1414. if ((rootElement.scrollTop / scrollTotal ) > 0.05) {
  1415. scrollToTopBtn.classList.add("showBtn")
  1416. } else {
  1417. scrollToTopBtn.classList.remove("showBtn")
  1418. }
  1419. }
  1420.  
  1421. function scrollToTop() {
  1422. rootElement.scrollTo({
  1423. top: 0,
  1424. behavior: "smooth"
  1425. })
  1426. }
  1427. scrollToTopBtn.addEventListener("click", scrollToTop)
  1428. document.addEventListener("scroll", handleScroll)
  1429. </script>
  1430.  
  1431. <script>
  1432. tippy('[title]', {
  1433. role: 'tooltip',
  1434. theme: 'rosemary',
  1435. arrow: false,
  1436. placement: 'bottom',
  1437.  
  1438. content(reference) {
  1439. const title = reference.getAttribute('title');
  1440. reference.removeAttribute('title');
  1441. return title;
  1442. },
  1443. });
  1444. </script>
  1445.  
  1446. <script>
  1447. $(document).ready(function() {
  1448. // audio player
  1449. var $audio = $('iframe.tumblr_audio_player');
  1450. $audio.load(function() {
  1451. $(this).contents().find('head').append('<style type="text/css">' +
  1452. '.audio-player { background-color: {color:accent}; color:#fff!important; }' +
  1453. '.audio-player .audio-info .track-artist { color:#fff!important; }' +
  1454. '</style>');
  1455. });
  1456. });
  1457. </script>
  1458.  
  1459. <script>
  1460. function myFunction() {
  1461. var x = document.getElementById("myDIV");
  1462. if (x.style.display === "block") {
  1463. x.style.display = "none";
  1464. } else {
  1465. x.style.display = "block";
  1466. }
  1467. }
  1468. </script>
  1469.  
  1470. </body>
  1471. </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!