API tools faq
paste
Advertisement
likesmagic

conceited by @gloriapritchetts

likesmagic
Aug 5th, 2024 (edited)
352
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 46.78 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  5.  
  6. <!--
  7. NPF images fix v3.0 by @glenthemes [2021]
  8. 💌 git.io/JRBt7a
  9. --->
  10. <script src="//npf-images-v3.github.io/script.js"></script>
  11. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  12. <style tmblr-npf>
  13. :root {
  14. --NPF-Caption-Spacing:1em;
  15. --NPF-Image-Spacing:7px;
  16. }
  17. </style>
  18. <script src="https://unpkg.com/phosphor-icons"></script>
  19. <script src="https://unpkg.com/@phosphor-icons/web"></script>
  20. <link rel="preconnect" href="https://fonts.googleapis.com">
  21. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  22. <link href="https://fonts.googleapis.com/css2?family=ABeeZee:ital@0;1&family=Karla:ital,wght@0,200..800;1,200..800&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:[email protected]&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Varela+Round&display=swap" rel="stylesheet">
  23.  
  24. <script src="//pull.cappuccicons.com/cpf.js"></script>
  25. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  26. <title>{Title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:PostSummary}: {PostSummary}{/block:PostSummary}</title>
  27.  
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  31. <meta charset="utf-8">
  32. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  33.  
  34. <!---
  35.  
  36. ♡ CODE BY GLORIAPRITCHETTS ♡
  37. rules and credits @ gloriapritchetts.tumblr.com/themes
  38.  
  39. --->
  40.  
  41. <meta name="image:sidebar" content="https://placehold.co/262x300/EEE/31343C"/>
  42.  
  43. <meta name="color:background" content="#0f0f0f"/>
  44. <meta name="color:posts" content="#121212"/>
  45. <meta name="color:text" content="#fff"/>
  46. <meta name="color:accent" content="#64bffa"/>
  47. <meta name="color:borders" content="#181818"/>
  48. <meta name="color:gradient 1" content="#64bffa"/>
  49. <meta name="color:gradient 2" content="#c7e6f7"/>
  50.  
  51. <meta name="if:quicksand" content="0"/>
  52. <meta name="if:karla" content="0"/>
  53. <meta name="if:roboto" content="0"/>
  54. <meta name="if:nunito" content="0"/>
  55. <meta name="if:abeezee" content="0"/>
  56.  
  57. <meta name="select:border radius" content="0px"/>
  58. <meta name="select:border radius" content="5px"/>
  59. <meta name="select:border radius" content="10px"/>
  60.  
  61. <meta name="text:description" content="this looks best at two lines! la lalalalalal dee lal laal"/>
  62.  
  63. <meta name="text:link 1 url" content="/"/>
  64. <meta name="text:link 1 title" content="link 1"/>
  65. <meta name="text:link 2 url" content="/"/>
  66. <meta name="text:link 2 title" content="link 2"/>
  67.  
  68. <meta name="text:watching" content="watching"/>
  69. <meta name="text:listening to" content="listening to"/>
  70. <meta name="text:reading" content="reading"/>
  71. <meta name="text:working on" content="working on"/>
  72. <meta name="text:status" content="status"/>
  73.  
  74. <meta name="text:name" content="name"/>
  75. <meta name="text:age" content="age"/>
  76. <meta name="text:pronouns" content="pronouns"/>
  77. <meta name="text:zodiac" content="zodiac"/>
  78.  
  79. <meta name="text:popup desc" content="keep this at one line!"/>
  80.  
  81. <meta name="text:popup link 1 url" content="/"/>
  82. <meta name="text:popup link 1 title" content="link 1"/>
  83. <meta name="text:popup link 2 url" content="/"/>
  84. <meta name="text:popup link 2 title" content="link 2"/>
  85. <meta name="text:popup link 3 url" content="/"/>
  86. <meta name="text:popup link 3 title" content="link 3"/>
  87. <meta name="text:popup link 4 url" content="/"/>
  88. <meta name="text:popup link 4 title" content="link 4"/>
  89.  
  90. <!----- css ----->
  91.  
  92. <style type="text/css">
  93.  
  94. /*----- general -----*/
  95.  
  96. ::-webkit-scrollbar {
  97. width: 0px;
  98. background: transparent;
  99. border-radius:{select:border radius};
  100. }
  101.  
  102. ::-webkit-scrollbar-thumb {
  103. background: transparent;
  104. border-radius:{select:border radius};
  105. }
  106.  
  107. body {
  108. font-size: 13.5px;
  109. color: {color:text};
  110. background-color: {color:background};
  111. line-height: 135%;
  112. word-wrap: break-word;
  113. letter-spacing: 0.3px;
  114. margin: 0;
  115. padding: 0;
  116. }
  117.  
  118. {block:ifquicksand}
  119. body {
  120. font-family: quicksand;
  121. font-size: 13.5px;
  122. }
  123. {/block:ifquicksand}
  124.  
  125. {block:ifkarla}
  126. body {
  127. font-family: karla;
  128. font-size: 13.5px;
  129. }
  130. {/block:ifkarla}
  131.  
  132. {block:ifroboto}
  133. body {
  134. font-family: roboto;
  135. font-size: 13.5px;
  136. }
  137. {/block:ifroboto}
  138.  
  139. {block:ifnunito}
  140. body {
  141. font-family: nunito;
  142. font-size: 13.5px;
  143. }
  144. {/block:ifnunito}
  145.  
  146. {block:ifabeezee}
  147. body {
  148. font-family: abeezee;
  149. font-size: 13.5px;
  150. }
  151. {/block:ifabeezee}
  152.  
  153. a {
  154. color: {color:text};
  155. position: relative;
  156. text-decoration: none;
  157. -webkit-transition: all 0.5s ease;
  158. transition: all 0.5s ease;
  159. -moz-transition: all 0.5s ease;
  160. -o-transition: all 0.5s ease;
  161. }
  162.  
  163. a:hover {
  164. border:none;
  165. text-decoration:none;
  166. color:{color:accent};
  167. text-shadow:none;
  168. -webkit-transition: all 0.5s ease;
  169. transition: all 0.5s ease;
  170. -moz-transition: all 0.5s ease;
  171. -o-transition: all 0.5s ease;
  172. }
  173.  
  174. blockquote {
  175. padding: 0 0 0 1.5em;
  176. border-left: 1px solid {color:borders};
  177. margin: 1.5em 0 1.5em 1.5em;
  178. }
  179.  
  180. h1.post-title {
  181. font-size:22px;
  182. color:{color:accent};
  183. text-align:left;
  184. margin-top:0.6em;
  185. border-bottom:1px solid {color:borders};
  186. padding-bottom:10px;
  187. margin-bottom:0em;
  188. }
  189.  
  190. h1 {
  191. font-size:19px;
  192. color:{color:accent};
  193. font-weight:bold;
  194. text-align:left;
  195. line-height:25px;
  196. border:none;
  197. box-shadow:none;
  198. }
  199.  
  200. h1 a {
  201. font-size:19px;
  202. color:{color:accent};
  203. font-weight:bold;
  204. text-align:left;
  205. line-height:25px;
  206. border:none;
  207. box-shadow:none;
  208. }
  209.  
  210. h1 a:hover {
  211. font-size:19px;
  212. color:{color:accent};
  213. font-weight:bold;
  214. text-align:left;
  215. line-height:25px;
  216. border:none;
  217. box-shadow:none;
  218. }
  219.  
  220. h2 {
  221. font-size:19px;
  222. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  223. -webkit-text-fill-color: transparent;
  224. -webkit-background-clip: text;
  225. text-align:center;
  226. line-height:22px;
  227. text-transform:justify;
  228. font-weight:bold;
  229. box-shadow:none;
  230. }
  231.  
  232. h2 a {
  233. font-size:19px;
  234. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  235. -webkit-text-fill-color: transparent;
  236. -webkit-background-clip: text;
  237. text-align:center;
  238. line-height:22px;
  239. text-transform:justify;
  240. font-weight:bold;
  241. border:none;
  242. box-shadow:none;
  243. }
  244.  
  245. h2 a:hover {
  246. font-size:19px;
  247. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  248. -webkit-text-fill-color: transparent;
  249. -webkit-background-clip: text;
  250. text-align:center;
  251. line-height:22px;
  252. text-transform:justify;
  253. font-weight:bold;
  254. border:none;
  255. box-shadow:none;
  256. }
  257.  
  258. bold, b, strong {
  259. font-weight:bold;
  260. color:{color:accent};
  261. }
  262.  
  263. i, em, italic {
  264. color:{color:gradient 2};
  265. }
  266.  
  267. small, sub, sup {
  268. font-size:13px;
  269. }
  270.  
  271. .tmblr-iframe-compact .tmblr-iframe--unified-controls { z-index: 999999999!important;margin-top: 0.3em;padding-right:0.3em;opacity: 0;visibility: hidden;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s; }
  272.  
  273. body.controls-click .tmblr-iframe {
  274. opacity: 1.0;
  275. visibility: visible;
  276. -webkit-transition: all 0.5s;
  277. -moz-transition: all 0.5s;
  278. -ms-transition: all 0.5s;
  279. -o-transition: all 0.5s;
  280. transition: all 0.5s;
  281. }
  282.  
  283. #bg {
  284. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  285. top:0px;
  286. left:0px;
  287. width:100%;
  288. height:200px;
  289. position:fixed;
  290. }
  291.  
  292. /*----- sidebar -----*/
  293.  
  294. #sidebar {
  295. width:320px;
  296. height:445px;
  297. margin-left:45em;
  298. margin-top:0em;
  299. position:fixed;
  300. padding:20px;
  301. background:{color:background};
  302. border-top-right-radius:{select:border radius};
  303. border-bottom-right-radius:{select:border radius};
  304. -webkit-transition: all 0.5s;
  305. -moz-transition: all 0.5s;
  306. -ms-transition: all 0.5s;
  307. -o-transition: all 0.5s;
  308. transition: all 0.5s;
  309. }
  310.  
  311. #sidebarie {
  312. position:absolute;
  313. width:300px;
  314. height:330px;
  315. margin-top:2.77em;
  316. margin-left:1.5em;
  317. object-fit: cover;
  318. z-index:9999999!important;
  319. }
  320.  
  321. #sidebarie img {
  322. width:300px;
  323. height:330px;
  324. object-fit: cover;
  325. }
  326.  
  327. #title {
  328. position:absolute;
  329. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  330. padding:10px;
  331. margin-top:0em;
  332. width:280px;
  333. height:18px;
  334. margin-left:1.28em;
  335. text-align:center;
  336. font-weight:bold;
  337. line-height:17px;
  338. overflow-y:hidden;
  339. z-index:9999999999;
  340. border:none;
  341. color:{color:posts};
  342. font-size:16px;
  343. border-top-left-radius:{select:border radius}!important;
  344. border-top-right-radius:{select:border radius}!important;
  345. }
  346.  
  347. #desc {
  348. position:absolute;
  349. opacity:1;
  350. margin-top:27.2em;
  351. padding:10px;
  352. margin-left:1.5em;
  353. background:{color:posts};
  354. width:280px;
  355. height:40px;
  356. text-align:center;
  357. }
  358.  
  359. #desc a {
  360. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  361. -webkit-text-fill-color: transparent;
  362. -webkit-background-clip: text;
  363. }
  364.  
  365. #desc a:hover {
  366. color:{color:gradient 2};
  367. }
  368.  
  369. #desc2 {
  370. position:absolute;
  371. margin-top:36em;
  372. margin-left:1.5em;
  373. background:{color:posts};
  374. padding:10px;
  375. width:280px;
  376. height:20px;
  377. border-radius:{select:border radius};
  378. border-radius:{select:border radius};
  379. }
  380.  
  381. #desc2 a {
  382. color:{color:accent};
  383. -webkit-transition: all 0.5s ease;
  384. transition: all 0.5s ease;
  385. -moz-transition: all 0.5s ease;
  386. -o-transition: all 0.5s ease;
  387. }
  388.  
  389. #desc2 a:hover {
  390. color:{color:gradient 2};
  391. -webkit-transition: all 0.5s ease;
  392. transition: all 0.5s ease;
  393. -moz-transition: all 0.5s ease;
  394. -o-transition: all 0.5s ease;
  395. letter-spacing:2px;
  396. }
  397.  
  398. #desc2 i {
  399. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  400. -webkit-text-fill-color: transparent;
  401. -webkit-background-clip: text;
  402. font-size:20px;
  403. }
  404.  
  405. .search .query {
  406. position:absolute;
  407. top:0.5em;
  408. left:0.2em;
  409. margin-top:0em;
  410. border: 0;
  411. outline: 0;
  412. width:280px;
  413. padding: 4px;
  414. padding-left:10px;
  415. font-size: 13.5px;
  416. letter-spacing:0.3px;
  417. text-transform:lowercase;
  418. background:transparent;
  419. color:{color:text};
  420. }
  421.  
  422. {block:ifabeezee}
  423. .search .query {
  424. font-family: abeezee;
  425. font-size: 13.5px;
  426. }
  427. {/block:ifabeezee}
  428.  
  429. {block:ifquicksand}
  430. .search .query {
  431. font-family: quicksand;
  432. font-size: 13.5px;
  433. }
  434. {/block:ifquicksand}
  435.  
  436. {block:ifkarla}
  437. .search .query {
  438. font-family: karla;
  439. font-size: 13.5px;
  440. }
  441. {/block:ifkarla}
  442.  
  443. {block:ifroboto}
  444. .search .query {
  445. font-family: roboto;
  446. font-size: 13.5px;
  447. }
  448. {/block:ifroboto}
  449.  
  450. {block:ifnunito}
  451. .search .query {
  452. font-family: nunito;
  453. font-size: 13.5px;
  454. }
  455. {/block:ifnunito}
  456.  
  457.  
  458. ::-webkit-input-placeholder {color: inherit;}
  459. :-moz-placeholder {color: inherit; opacity:1;}
  460. ::-moz-placeholder {color: inherit; opacity:1;}
  461. :-ms-input-placeholder {color: inherit;}
  462.  
  463. input:focus::-webkit-input-placeholder {color: transparent;}
  464. input:focus:-moz-placeholder {color: transparent;}
  465. input:focus::-moz-placeholder {color: transparent;}
  466. input:focus:-ms-input-placeholder { color: transparent;}
  467.  
  468. /*----- heading -----*/
  469.  
  470. #linkiez {
  471. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  472. padding:10px;
  473. width:260px;
  474. height:3px;
  475. position:absolute;
  476. margin-top:31.5em;
  477. margin-left:1.5em;
  478. display:flex;
  479. justify-content:center;
  480. align-items:center;
  481. border-bottom-left-radius:{select:border radius}!important;
  482. border-bottom-right-radius:{select:border radius}!important;
  483. padding:20px;
  484. -webkit-transition: all 0.5s ease;
  485. transition: all 0.5s ease;
  486. -moz-transition: all 0.5s ease;
  487. -o-transition: all 0.5s ease;
  488. }
  489.  
  490. #linkiez li {
  491. margin-top:0.1em;
  492. margin-right:5px;
  493. list-style-type:none;
  494. display:inline-block;
  495. -webkit-transition: all 0.6s ease;
  496. transition: all 0.6s ease;
  497. -moz-transition: all 0.6s ease;
  498. -o-transition: all 0.6s ease;
  499. }
  500.  
  501. #linkiez li:hover {
  502. color:{color:accent};
  503. transform: scale(0.9);
  504. -webkit-transition: all 0.6s ease;
  505. transition: all 0.6s ease;
  506. -moz-transition: all 0.6s ease;
  507. -o-transition: all 0.6s ease;
  508. }
  509.  
  510. #linkiez i {
  511. color:{color:posts};
  512. font-size:22px;
  513. -webkit-transition: all 0.5s ease;
  514. transition: all 0.5s ease;
  515. -moz-transition: all 0.5s ease;
  516. -o-transition: all 0.5s ease;
  517. }
  518.  
  519. #linkiez a {
  520. position:relative;
  521. display:inline-block;
  522. overflow:hidden;
  523. padding:8px;
  524. width:20px;
  525. height:20px;
  526. box-shadow:none;
  527. color:{color:posts};
  528. }
  529.  
  530. #linkiez a:hover {
  531. position:relative;
  532. display:inline-block;
  533. overflow:hidden;
  534. padding:8px;
  535. width:20px;
  536. height:20px;
  537. box-shadow:none;
  538. transform: scale(1.3);
  539. -webkit-transition: all 0.6s ease;
  540. transition: all 0.6s ease;
  541. -moz-transition: all 0.6s ease;
  542. -o-transition: all 0.6s ease;
  543. }
  544.  
  545. #linkiez a:hover i {
  546. color:{color:posts};
  547. -webkit-transition: all 0.6s ease;
  548. transition: all 0.6s ease;
  549. -moz-transition: all 0.6s ease;
  550. -o-transition: all 0.6s ease;
  551. }
  552.  
  553. .theebuttons {
  554. position: fixed;
  555. z-index:99999999999!important;
  556. text-align:center;
  557. bottom:10px;
  558. right:10px;
  559. }
  560.  
  561. .theebuttons i {
  562. color:{color:text};
  563. font-size:20px;
  564. padding:5px;
  565. border-radius:{select:border radius};
  566. background: {color:posts};
  567. -webkit-transition: all 0.6s ease;
  568. transition: all 0.6s ease;
  569. -moz-transition: all 0.6s ease;
  570. -o-transition: all 0.6s ease;
  571. }
  572.  
  573. .theebuttons i:hover {
  574. color:{color:posts};
  575. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  576. box-shadow:0px 0px {select:shadow} {color:borders}!important;
  577. border-radius:{select:border radius};
  578. box-shadow:none;
  579. transform: scale(0.9);
  580. -webkit-transition: all 0.6s ease;
  581. transition: all 0.6s ease;
  582. -moz-transition: all 0.6s ease;
  583. -o-transition: all 0.6s ease;
  584. }
  585.  
  586. .scrollToTop {
  587. position:fixed;
  588. bottom:0px;
  589. right:0.5em;
  590. display:none;
  591. z-index:999999999999999999;
  592. }
  593.  
  594. .scrollToTop:hover{
  595. text-decoration:none;
  596. }
  597.  
  598. .controlz {
  599. position:fixed;
  600. top:50px;
  601. right:0px;
  602. }
  603.  
  604. /*----- posts -----*/
  605.  
  606. main {
  607. position: relative;
  608. width: calc(250px + 540px + 150px);
  609. margin: auto;
  610. }
  611.  
  612. section {
  613. position:relative;
  614. top:50%;
  615. left:50%;
  616. width: 620px;
  617. height:740px;
  618. background:{color:background};
  619. overflow-x:hidden;
  620. overflow-y:scroll;
  621. margin-left: -520px;
  622. margin-top:60px;
  623. padding:20px;
  624. border-top-left-radius:{select:border radius};
  625. }
  626.  
  627. article {
  628. width: 540px;
  629. position: relative;
  630. margin-bottom:50px!important;
  631. background:{color:posts};
  632. padding:20px;
  633.  
  634. border-radius:{select:border radius};
  635.  
  636. margin-left:3.5em;
  637. }
  638.  
  639. article a {
  640. color:{color:text};
  641. box-shadow:0px 2px 0px {color:borders};
  642. }
  643.  
  644. article a:hover {
  645. color:{color:gradient 2};
  646. box-shadow:0px 2px 0px {color:gradient 2};
  647. }
  648.  
  649. .posts li, .posts blockquote, figure, video, iframe, .video, .video iframe, figure.tmblr-embed.tmblr-full, figure.tmblr-embed.tmblr-full iframe, .caption iframe { max-width: 100%; }
  650.  
  651. .caption {
  652. list-style-type: none;
  653. margin-top:0.5em;
  654. margin-left:0.3em;
  655. }
  656.  
  657. .caption .username a {
  658. box-shadow:0px 2px 0px {color:borders};
  659. }
  660.  
  661. .caption .username a:hover {
  662. box-shadow:0px 2px 0px {color:accent};
  663. }
  664.  
  665. li {
  666. list-style-type:circle;
  667. }
  668.  
  669. li::marker {
  670. color: {color:accent};
  671. }
  672.  
  673. .text-caption:first-of-type { margin-top: 0.8em; }
  674.  
  675. .rbinfo {
  676. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  677. padding:5px;
  678. padding-bottom:13px;
  679. padding-top:13px;
  680. border-radius:{select:border radius};
  681. color:{color:posts}!important;
  682. font-weight:normal!important;
  683. line-height:14px;
  684. }
  685.  
  686. .rbinfo span {
  687. font-weight:normal!important;
  688. margin-left:0em;
  689. }
  690.  
  691. .rbinfo a, .rbinfo .username {
  692. border:none;
  693. color:{color:posts}!important;
  694. box-shadow:none;
  695. }
  696.  
  697. .rbinfo .username {
  698. border:none;
  699. color:{color:posts}!important;
  700. margin-left:0.1em;
  701. box-shadow:none;
  702. margin-top:-0.2em;
  703. margin-bottom:0em;
  704. }
  705.  
  706. .rbinfo b {
  707. color:{color:posts}!important;
  708. }
  709.  
  710. .rbinfo .user-icon {
  711. width:2em;
  712. height:2em;
  713. outline:2px solid {color:posts};
  714. outline-offset:0px;
  715. margin-left:10px;
  716. margin-top:-1em!important;
  717. border-radius:100%;
  718. }
  719.  
  720. .rbinfo .user-icon img {
  721. border-radius:100%;
  722. }
  723.  
  724. .user-icon {
  725. display: inline-block;
  726. vertical-align: middle;
  727. width: 6.5px;
  728. height: 6.5px;
  729. margin-right: 0.6em;
  730. margin-top:0em;
  731. border-radius:100%;
  732. background:{color:accent};
  733. }
  734.  
  735. .username, .username a {
  736. display: inline-block;
  737. font-weight: bold;
  738. color:{color:accent};
  739. text-decoration:none;
  740. border-bottom:none;
  741. box-shadow:none!important;
  742. }
  743.  
  744. .username a:hover {
  745. font-weight: bold;
  746. color:{color:gradient 2};
  747. text-decoration:none;
  748. border-bottom:none;
  749. box-shadow:none;
  750. }
  751.  
  752. p.tmblr-attribution {margin-top: 1em !important;}
  753.  
  754. a.link-wrap {
  755. display: block;
  756. border: 1px solid {color:borders};
  757. }
  758.  
  759. .link { padding: 2em; }
  760.  
  761. .link-host, .link-txt { margin-top: 1.5em; }
  762.  
  763. .npf-link-block {
  764. margin-top: 1.5em;
  765. background-color: inherit;
  766. border: 1px solid inherit;
  767. color: inherit;
  768. }
  769.  
  770. img {
  771. margin: 0;
  772. display: block;
  773. height: auto;
  774. max-width: 100%;
  775. margin-bottom:5px;
  776. }
  777.  
  778. article img {
  779. border-radius:{select:border radius};
  780. }
  781.  
  782. .photo-slideshow,
  783. .npf_photoset {
  784. border-radius:{select:border radius};
  785. }
  786.  
  787. .vignette, #vignette {opacity: 0;}
  788. .tmblr-lightbox, #tumblr_lightbox {background-color: rgba(130, 130, 130, 0.75) !important;}
  789.  
  790. .lightbox-image, #tumblr_lightbox img {
  791. box-shadow: none !important;
  792. border-radius: 0 !important;
  793. max-width: none;
  794. }
  795.  
  796. #tumblr_lightbox_caption, .lightbox-caption {
  797. color: #fff !important;
  798. font-family: inherit;
  799. margin-top: 1em !important;
  800. }
  801.  
  802. .post-content div.npf_row, .post div.npf_row, body div.npf_row {
  803. margin-left: 0 !important;
  804. margin-right: 0 !important;
  805. }
  806.  
  807. .quote { line-height: 160%; font-size: 1.25em; }
  808.  
  809. .quote p:first-of-type { margin-top: 0; }
  810. .quote p:last-of-type { margin-bottom: 0; }
  811.  
  812. .source { margin-top: 1.5em; }
  813.  
  814. .chat { padding: 0; margin: 0; }
  815. .chat li { list-style-type: none; margin-top: 1em; }
  816. .chat li:first-of-type { margin-top: 0; }
  817. .chatter { font-weight: bold; }
  818.  
  819. p.npf_chat, p.npf_chat b {font-family: inherit;}
  820.  
  821. /*----- asks -----*/
  822.  
  823. .question {
  824. background:{color:posts};
  825. color:{color:text};
  826. padding:20px;
  827. border-top-right-radius:35px;
  828. border-bottom-right-radius:35px;
  829. border-bottom-left-radius:35px;
  830. margin-top:5px;
  831. text-align:justify;
  832. position:relative;
  833. }
  834.  
  835. .asking {
  836. margin-top:1em;
  837. background:{color:background};
  838. border-radius:{select:border radius};
  839. padding:20px;
  840. color:{color:text};
  841. text-align:justify;
  842. }
  843.  
  844. .asking b, .asking a {
  845. font-weight:bold;
  846. color:{color:accent};
  847. border-bottom:0px solid;
  848. box-shadow:none;
  849. }
  850.  
  851. .asking a:hover {
  852. color:{color:gradient 2};
  853. border-bottom:0px solid;
  854. box-shadow:none;
  855. }
  856.  
  857. .question p:first-of-type { margin-top: 0; }
  858. .question p:last-of-type { margin-bottom: 0; }
  859.  
  860. .answer2 {
  861. font-weight:normal;
  862. text-transform:lowercase;
  863. text-align:justify;
  864. font-family: {text:font};
  865. font-size: 13.5px;
  866. color: {color:text};
  867. padding-top:3px;
  868. }
  869.  
  870. /*----- info -----*/
  871.  
  872. .info {
  873. height:21px;
  874. margin-top: 1.2em;
  875. padding:10px;
  876. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  877. border-radius:{select:border radius};
  878. color:{color:posts};
  879. }
  880.  
  881. .info a {
  882. display: inline-block;
  883. vertical-align: middle;
  884. text-transform:lowercase;
  885. color:{color:posts};
  886. border-bottom:0px solid;
  887. padding-left:3px;
  888. box-shadow:none;
  889. }
  890.  
  891. .info a:hover {
  892. text-decoration:none;
  893. color:{color:posts};
  894. text-shadow:none;
  895. border-bottom:0px solid;
  896. box-shadow:none;
  897. }
  898.  
  899. .infopix {
  900. margin-top:-1.4em;
  901. margin-left:35.2em;
  902. width:100%;
  903. }
  904.  
  905. .info img {
  906. width: 1em;
  907. height: 1em;
  908. border-radius:100%;
  909. outline:2px solid {color:posts};
  910. outline-offset:0px;
  911. margin:2.2px;
  912. }
  913.  
  914. .but {
  915. margin-top:-19px;
  916. text-align:right;
  917. padding-right:5px;
  918. }
  919.  
  920. {block:ifquicksand}
  921. .info a {
  922. margin-top:-2px;
  923. }
  924.  
  925. .but {
  926. margin-top:-18px;
  927. }
  928. {/block:ifquicksand}
  929.  
  930. {block:ifkarla}
  931. .info a {
  932. margin-top:-3px;
  933. }
  934.  
  935. .but {
  936. margin-top:-18px;
  937. }
  938. {/block:ifkarla}
  939.  
  940. {block:ifroboto}
  941. .info a {
  942. margin-top:0px;
  943. }
  944.  
  945. .but {
  946. margin-top:-19px;
  947. }
  948. {/block:ifroboto}
  949.  
  950. {block:ifnunito}
  951. .info a {
  952. margin-top:1.2px;
  953. }
  954.  
  955. .but {
  956. margin-top:-19px;
  957. }
  958. {/block:ifnunito}
  959.  
  960. {block:ifpoppins}
  961. .info a {
  962. margin-top:0.6px;
  963. }
  964.  
  965. .but {
  966. margin-top:-17px!important;
  967. }
  968.  
  969. .buttons {
  970. top:0em;
  971. left:47.5em!important;
  972. position:absolute;
  973. z-index:999999!important;
  974. }
  975.  
  976. {/block:ifpoppins}
  977.  
  978. .buttons {
  979. top:0em;
  980. right:44em;
  981. position:absolute;
  982. z-index:999999!important;
  983. }
  984.  
  985. .buttons i {
  986. font-size:20px;
  987. -webkit-transition: all 0.5s ease;
  988. transition: all 0.5s ease;
  989. -moz-transition: all 0.5s ease;
  990. -o-transition: all 0.5s ease;
  991. color:{color:text};
  992. }
  993.  
  994. .buttonscontrols a {
  995. background: {color:posts};
  996. position:relative;
  997. display:inline-block;
  998. overflow:hidden;
  999. padding:8px;
  1000. width:20px;
  1001. height:20px;
  1002. border-radius:{select:border radius};
  1003. margin-bottom:0.3em;
  1004. box-shadow:none;
  1005. }
  1006.  
  1007. .buttonscontrols a:hover {
  1008. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  1009. position:relative;
  1010. display:inline-block;
  1011. overflow:hidden;
  1012. padding:8px;
  1013. width:20px;
  1014. height:20px;
  1015. border-radius:{select:border radius};
  1016. transform: scale(0.9);
  1017. box-shadow:none;
  1018. -webkit-transition: all 0.6s ease;
  1019. transition: all 0.6s ease;
  1020. -moz-transition: all 0.6s ease;
  1021. -o-transition: all 0.6s ease;
  1022. }
  1023.  
  1024. .buttons a:hover i {
  1025. color:{color:posts};
  1026. -webkit-transition: all 0.6s ease;
  1027. transition: all 0.6s ease;
  1028. -moz-transition: all 0.6s ease;
  1029. -o-transition: all 0.6s ease;
  1030. }
  1031.  
  1032. .buttonscontrols .like .like_button {
  1033. position:relative;
  1034. }
  1035.  
  1036. .buttonscontrols .like .like_button iframe {
  1037. position:absolute;
  1038. top:0;
  1039. left:0;
  1040. bottom:0;
  1041. right:0;
  1042. z-index:2;
  1043. opacity:0;
  1044. }
  1045.  
  1046. .tags {
  1047. word-wrap: break-word;
  1048. margin-top:1em!important;
  1049. margin-left:0em;
  1050. }
  1051.  
  1052. .tags a {
  1053. margin-right:0em;
  1054. color:{color:text};
  1055. font-weight:normal;
  1056. padding-right:0.4em;
  1057. box-shadow:none;
  1058. }
  1059.  
  1060. .tags a:hover {
  1061. text-decoration:none;
  1062. color:{color:accent};
  1063. text-shadow:none;
  1064. box-shadow:none;
  1065. }
  1066.  
  1067. .tags a:before {
  1068. content: '#';
  1069. }
  1070.  
  1071. /*----- notes -----*/
  1072.  
  1073. .notes { margin-top:-1em; }
  1074. .notes a { color:{color:accent}; text-decoration:none;border-bottom:0px solid;box-shadow:none; }
  1075. .notes a:hover { color:{color:gradient 2}; text-decoration:none;border-bottom:0px solid;box-shadow:none; }
  1076.  
  1077. ol.notes {
  1078. max-width: 100%;
  1079. padding: 0;
  1080. margin: 2em 0 0 0;
  1081. text-align:left;
  1082. }
  1083.  
  1084. ol.notes li.note { padding: 0.3em 0; list-style-type: none; }
  1085.  
  1086. ol.notes li.note img.avatar {
  1087. margin-right: 0.5em;
  1088. margin-top:0.4em;
  1089. vertical-align: middle;
  1090. display: inline-block;
  1091. width: 1em;
  1092. height: 1em;
  1093. border-radius:100%;
  1094. border:2px solid {color:accent};
  1095. }
  1096.  
  1097. /*----- pagination -----*/
  1098.  
  1099. #page-navigation { text-align: center; }
  1100. #page-navigation a, .current-page { margin: 0 0.5em;box-shadow:none;-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1101. #page-navigation a:hover, #page-navigation i:hover { color:{color:gradient 2};-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1102. #page-navigation i { color:{color:accent};font-size:20px;-webkit-transition: all 0.6s ease;transition: all 0.6s ease;-moz-transition: all 0.6s ease;-o-transition: all 0.6s ease; }
  1103. .current-page { font-weight: bold; color: {color:accent}; }
  1104.  
  1105. {CustomCSS}
  1106.  
  1107. /*----- tooltips -----*/
  1108.  
  1109. .tippy-tooltip.custom-theme {
  1110. background-color: {color:posts};
  1111. color: {color:text};
  1112. text-align:center;
  1113. font-size:12.5px;
  1114. text-transform:lowercase;
  1115.  
  1116. border-radius:{select:border radius};
  1117. box-shadow:0px 0px 10px {color:borders};
  1118. }
  1119.  
  1120. {block:ifpoppins}
  1121. .tippy-tooltip.custom-theme {
  1122. font-size:12px;
  1123. }
  1124. {/block:ifpoppins}
  1125.  
  1126. /*----- popup box -----*/
  1127.  
  1128. #pop {
  1129. width:100%;
  1130. height:100%;
  1131. top:0;left:0;
  1132. position:fixed;
  1133. z-index:999999999!important;
  1134. background:rgba(255, 255, 255, .6);
  1135. display:none;
  1136. }
  1137.  
  1138. .fade {
  1139. top:0;
  1140. left:0;
  1141. position:fixed;
  1142. z-index:1000;
  1143. width:100%;
  1144. height:100%;
  1145. }
  1146.  
  1147. .popup {
  1148. top:50%;
  1149. left:50%;
  1150. transform:translate(-50%,-50%);
  1151. position:fixed;
  1152. background:{color:posts}; /* background of popup box */
  1153. padding:0px; /* padding of popup box */
  1154. z-index:10000;
  1155. width:500px; /* width of popup */
  1156. height:468px;
  1157.  
  1158. border-radius:{select:border radius};
  1159. box-shadow:0px 0px 10px {color:borders};
  1160. line-height:30px;
  1161. }
  1162.  
  1163. .grad2 {
  1164. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  1165. border-radius:{select:border radius};
  1166. width:100%;
  1167. height:40px;
  1168. }
  1169.  
  1170. .grad {
  1171. margin-top:-2.4em;
  1172. margin-left:0.5em;
  1173. z-index:99999999!important;;
  1174. }
  1175.  
  1176. .grad img {
  1177. width:21px;
  1178. height:21px;
  1179. border-radius:100%;
  1180. border:2px solid {color:posts};
  1181. }
  1182.  
  1183. .grad i {
  1184. color:{color:text};
  1185. padding:4px;
  1186. border-radius:100%;
  1187. font-size:15px!important;
  1188. }
  1189.  
  1190. .grad a:hover {
  1191. padding-left:0px!important;
  1192. }
  1193.  
  1194. .grad3 {
  1195. margin-top:-2em;
  1196. text-align:center;
  1197. font-size:16px;
  1198. color:{color:posts};
  1199. }
  1200.  
  1201. .popup p {
  1202. background:{color:background};
  1203. border-radius:{select:border radius};
  1204. padding:10px;
  1205. text-align:center;
  1206. padding-top:35px;
  1207. padding-left:30px;
  1208. padding-bottom:35px;
  1209. }
  1210.  
  1211. .popup a {
  1212. color:{color:accent};
  1213. border:none;
  1214. -webkit-transition: all 0.5s ease;
  1215. transition: all 0.5s ease;
  1216. -moz-transition: all 0.5s ease;
  1217. -o-transition: all 0.5s ease;
  1218. }
  1219.  
  1220. .popup a:hover {
  1221. color:{color:gradient 2};
  1222. border:none;
  1223. padding-left:30px;
  1224. -webkit-transition: all 0.5s ease;
  1225. transition: all 0.5s ease;
  1226. -moz-transition: all 0.5s ease;
  1227. -o-transition: all 0.5s ease;
  1228. }
  1229.  
  1230. .popup li {
  1231. list-style-type:none;
  1232. padding:5px;
  1233. text-align:left;
  1234. color:{color:accent};
  1235. border-bottom:1px solid {color:borders};
  1236. margin-bottom:0.6em;
  1237. }
  1238.  
  1239. .popup b {
  1240. background:{color:gradient 1};
  1241. color:{color:posts};
  1242. padding:5px;
  1243. padding-left:7px;
  1244. padding-right:7px;
  1245. border-radius:{select:border radius};
  1246. }
  1247.  
  1248. .popup bb {
  1249. background:{color:gradient 2};
  1250. color:{color:posts};
  1251. padding:5px;
  1252. padding-left:7px;
  1253. padding-right:7px;
  1254. border-radius:{select:border radius};
  1255. font-weight:bold;
  1256. }
  1257.  
  1258. .popup h1 {
  1259. transform: rotate(-90deg);
  1260. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  1261. color:{color:posts};
  1262. padding:5px;
  1263. border-radius:{select:border radius};
  1264. width:140px;
  1265. font-size:15px;
  1266. box-shadow:0px 3px 0px {color:borders};
  1267. }
  1268.  
  1269. .etc {
  1270. position:absolute;
  1271. top:0px;
  1272. left:1em;
  1273. margin-top:30.6em;
  1274. width:460px;
  1275. height:30px;
  1276. text-align:center;
  1277. padding:4px;
  1278. padding-left:0.6em;
  1279. background:{color:background};
  1280. color:{color:text};
  1281. border-radius:{select:border radius};
  1282. }
  1283.  
  1284. .etc b {
  1285. background: linear-gradient(to right, {color:gradient 1}, {color:gradient 2});
  1286. -webkit-text-fill-color: transparent;
  1287. -webkit-background-clip: text;
  1288. padding:0px;
  1289. padding-left:0px;
  1290. padding-right:0px;
  1291. }
  1292.  
  1293. {block:ifabeezee}
  1294. .etc {
  1295. font-family: abeezee;
  1296. font-size: 13.5px;
  1297. }
  1298. {/block:ifabeezee}
  1299.  
  1300. .etc a:hover {
  1301. color:{color:gradient 2};
  1302. border:none;
  1303. padding-left:0px;
  1304. -webkit-transition: all 0.5s ease;
  1305. transition: all 0.5s ease;
  1306. -moz-transition: all 0.5s ease;
  1307. -o-transition: all 0.5s ease;
  1308. }
  1309.  
  1310. </style>
  1311.  
  1312. <!--✻✻✻✻✻✻ UN-BLUE POLLS by @glenthemes ✻✻✻✻✻✻--> <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet"> <style> .poll-post { --Poll-Question-Font-Size: 16px; --Poll-Option-Background-Color: {color:accent}; --Poll-Option-Corner-Rounding: 18px; --Poll-Option-Border-Size: 0px; --Poll-Option-Border-Color: {color:borders}; --Poll-Option-Padding: 10px; --Poll-Option-Font-Size: 13.5px; --Poll-Option-Spacing: 10px; --Poll-Option-Text-Color: {color:posts}; --Poll-Option-HOVER-Border-Color: none; --Poll-Option-HOVER-Background-Color: {color:gradient 2}; --Poll-Option-HOVER-Text-Color: {color:accent}; --Poll-Option-HOVER-Speed: 0.5s; } </style>
  1313.  
  1314. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>
  1315. $(document).ready(function(){
  1316. $('.click,.fade').click(function() {
  1317. $('#pop').fadeToggle();
  1318. });
  1319. });
  1320. </script>
  1321.  
  1322. </head>
  1323.  
  1324. <!----- html ----->
  1325.  
  1326. <body>
  1327.  
  1328. <!--✻✻✻✻✻✻ npf audio player by @glenthemes ✻✻✻✻✻✻-->
  1329. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  1330. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  1331. <script>
  1332. tumblr_npf_audio({
  1333. emptyTitleText: "Untitled track",
  1334. emptyArtistText: "Untitled artist",
  1335. emptyAlbumText: "Untitled album",
  1336.  
  1337. titleLabel: "Track:",
  1338. artistLabel: "Artist:",
  1339. albumLabel: "Album:"
  1340. });
  1341. </script>
  1342. <style edit-npf-audio-player>
  1343. .npf-audio-wrapper {
  1344. --NPF-Audio-Buttons-Size: 1.4rem;
  1345. --NPF-Audio-Buttons-Color: {color:accent};
  1346. --NPF-Audio-Buttons-Spacing: 1.3rem;
  1347. --NPF-Audio-Image-Size: 72px;
  1348. --NPF-Audio-Image-Spacing: 5px;
  1349. }
  1350.  
  1351. .npf-audio-background {
  1352. background-color: {color:background};
  1353. padding: 1.5rem;
  1354. border-radius:{select:border radius};
  1355. margin-top:-0.4em;
  1356. }
  1357.  
  1358. .npf-audio-title-label,
  1359. .npf-audio-artist-label,
  1360. .npf-audio-album-label {
  1361. font-weight: bold;
  1362. color:{color:accent};
  1363. }
  1364.  
  1365. .npf-audio-title,
  1366. .npf-audio-artist,
  1367. .npf-audio-album {
  1368. color: {color:text};
  1369. }
  1370.  
  1371. /*----- updates -----*/
  1372.  
  1373. .tab {
  1374. right:-11px;
  1375. bottom:10px;
  1376. position:fixed;
  1377. width:350px;
  1378. height:auto;
  1379. max-height:100%;
  1380. overflow:hidden;
  1381. z-index:999999999999999;}
  1382.  
  1383. .tab_content {
  1384. color:{color:text};
  1385. display:none;
  1386. padding:20px;
  1387. width:250px;
  1388. height:160px;
  1389. background:{color:posts};
  1390.  
  1391. border-radius:{select:border radius};
  1392. }
  1393.  
  1394. .tab_content li {
  1395. list-style-type:none;
  1396. margin-bottom:8.5px;
  1397. line-height:25px;
  1398. }
  1399.  
  1400. .tab_content b {
  1401. background:{color:gradient 1};
  1402. color:{color:posts};
  1403. padding:5px;
  1404. padding-left:7px;
  1405. padding-right:7px;
  1406. border-radius:{select:border radius};
  1407. font-weight:bold;
  1408. margin-right:0.3em;
  1409. }
  1410.  
  1411. .tab_content bb {
  1412. background:{color:gradient 2};
  1413. color:{color:posts};
  1414. padding:5px;
  1415. padding-left:7px;
  1416. padding-right:7px;
  1417. border-radius:{select:border radius};
  1418. font-weight:bold;
  1419. margin-right:0.3em;
  1420. }
  1421.  
  1422. .tab_content i {
  1423. font-size:20px;
  1424. }
  1425.  
  1426. </style>
  1427.  
  1428. <div id="bg"></div>
  1429.  
  1430. <main>
  1431.  
  1432. <!----- sidebar ----->
  1433.  
  1434. <div id="sidebar">
  1435. <div id="title">{Title}</div>
  1436. <img src="{image:sidebar}" id="sidebarie">
  1437.  
  1438. <div id="desc">{text:description}</div>
  1439.  
  1440. <div id="linkiez">
  1441. <li><a href="/"title="refresh"><i class="ph ph-house"></i></a></li>
  1442. <li><a href="/ask"title="message"><i class="ph ph-chats"></i></a></li>
  1443. <li><a href="/archive"title="archive"><i class="ph ph-archive"></i></a></li>
  1444. <li><a href="{text:link 1 url}"title="{text:link 1 title}"><i class="ph ph-magic-wand"></i></a></li>
  1445. <li><a href="{text:link 2 url}"title="{text:link 2 title}"><i class="ph ph-compass"></i></a></li>
  1446. <li><a title="about"><div class="click"><i class="ph ph-user"></i></div></a></li>
  1447. <li><a title="updates"><div class="tabs"><i class="ph ph-list"></i></div></a></li>
  1448. </div>
  1449.  
  1450. <div id="desc2"><form class="search" action="javascript:return false">
  1451. <input type="text" class="query" placeholder="looking for something?">
  1452. </form><div id="desc2i"style="position:absolute;margin-top:-0.1em;margin-left:19.3em;"><i class="ph ph-magnifying-glass"></i></div></div>
  1453.  
  1454. </div> <!----- sidebar end ----->
  1455.  
  1456. <!----- popup ----->
  1457.  
  1458. <div id="pop"> <div class="fade"></div>
  1459. <div class="popup">
  1460.  
  1461. <h1 style="text-align:center;margin-top:6.3em;margin-left:-2.9em;position:absolute;">about me</h1>
  1462. <div class="bio"style="margin-top:1.2em;width:457px;margin-left:2em;">
  1463. <p><b>name</b> &nbsp;{text:name}<br>
  1464. <bb>age</bb> &nbsp;{text:age}<br>
  1465. <b>pronouns</b> &nbsp;{text:pronouns}<br>
  1466. <bb>zodiac</bb> &nbsp;{text:zodiac}</p>
  1467. </div>
  1468.  
  1469. <div class="bio"style="margin-top:-0.5em;margin-left:1em;width:470px;">
  1470. <li><a href="{text:popup link 1 url}">{text:popup link 1 title}</a><div style="margin-top:-2em;margin-left:33.6em;"><i class="ph ph-caret-right"></i></div></li>
  1471.  
  1472. <li><a href="{text:popup link 2 url}">{text:popup link 2 title}</a><div style="margin-top:-2em;margin-left:33.6em;"><i class="ph ph-caret-right"></i></div>
  1473.  
  1474. <li><a href="{text:popup link 3 url}">{text:popup link 3 title}</a><div style="margin-top:-2em;margin-left:33.6em;"><i class="ph ph-caret-right"></i></div>
  1475.  
  1476. <li style="border-bottom:none;"><a href="{text:popup link 4 url}">{text:popup link 4 title}</a><div style="margin-top:-2em;margin-left:33.6em;"><i class="ph ph-caret-right"></i></div>
  1477. </div>
  1478.  
  1479. <div class="etc">{text:popup desc}</div>
  1480.  
  1481. {block:ifquicksand}
  1482. <div class="etc"><div style="margin-top:-0.1em;">{text:popup desc}</div></div>{/block:ifquicksand}
  1483.  
  1484. {block:ifkarla}
  1485. <div class="etc"><div style="margin-top:-0.1em;">{text:popup desc}</div></div>{/block:ifkarla}
  1486.  
  1487. </div>
  1488. </div> <!----- popup end ----->
  1489.  
  1490. <div class="theebuttons">
  1491. <a class="controls-button"title="controls"style="top:-35px;left:2.2em;"><i class="ph ph-gear"></i></a>
  1492. <a class="scrollToTop"title="scroll to top"style="right:0.8em;bottom:80px;"><i class="ph ph-arrow-circle-up"></i></a>
  1493. <a href="https://gloriapritchetts.tumblr.com/"title="credit"style="left:0em;"><i class="ph ph-butterfly"></i></a>
  1494. </div>
  1495.  
  1496. <section>
  1497.  
  1498. {block:TagPage}
  1499. <article>
  1500. <b>posts tagged under:</b> #{Tag}
  1501. </article>
  1502. {/block:TagPage}
  1503.  
  1504. <!----- posts ----->
  1505.  
  1506. {block:Posts}
  1507. <article class="posts" id="{PostID}">
  1508.  
  1509. <!----- rb/via ----->
  1510.  
  1511. <div class="rbinfo">
  1512. {block:RebloggedFrom}
  1513. <div class="user-icon"style="margin-top:0em;"><img src="{ReblogParentPortraitURL-64}"></div>
  1514. <div class="username"><a href="{Permalink}">{Name}</a><br><span>reblogged from <a href="{ReblogParentURL}"title="{ReblogParentTitle}">{ReblogParentName}</a></span></div>
  1515. {/block:RebloggedFrom}
  1516. {block:NotReblog}
  1517. <div class="user-icon"style="margin-top:0em;"><img src="{PortraitURL-64}"></div>
  1518. <div class="username"><a href="{Permalink}">{Name}</a><br><span>original post</span></div>
  1519. {/block:NotReblog}
  1520. </div> <!----- rb/via end ----->
  1521.  
  1522. <!----- buttons ----->
  1523.  
  1524. {block:Date}
  1525. <div class="buttons">
  1526. <div class="buttonscontrols">
  1527. {block:PinnedPostLabel}<a href="{Permalink}" class="pinned-post"title="pinned"><i class="ph ph-push-pin-simple"></i></a>{/block:PinnedPostLabel}
  1528.  
  1529. <a href="{ReblogURL}" target="_blank" class="reblog"title="reblog"><i class="ph ph-repeat"></i></a>
  1530.  
  1531. <a href="#" class="like"title="like"style="padding-bottom:8.5px;">{LikeButton}<i class="ph ph-heart"></i></a>
  1532.  
  1533. {block:ContentSource}<a href="{SourceURL}"title="source"><i class="ph ph-link"></i></a>{/block:ContentSource}
  1534. </div>
  1535. </div>
  1536. {/block:Date}
  1537.  
  1538. {block:Text}
  1539. {block:Title}<h1 class="post-title">{Title}</h1>{/block:Title}
  1540. {block:NotReblog}
  1541. <li class="caption text-caption">
  1542. {Body}
  1543. </li>
  1544. {/block:NotReblog}
  1545. {block:RebloggedFrom}
  1546. {block:Reblogs}
  1547. <li class="caption text-caption">
  1548. <div class="user-icon"></div>
  1549. <div class="username"><a href="{Permalink}">{Username}</a></div>
  1550. {Body}
  1551. </li>
  1552. {/block:Reblogs}
  1553. {/block:RebloggedFrom}
  1554. {/block:Text}
  1555.  
  1556. {block:Link}
  1557. <a href="{URL}" class="link-wrap">
  1558. {block:Thumbnail}<img src="{Thumbnail-HighRes}">{/block:Thumbnail}
  1559. <div class="link">
  1560. <div class="title">{Name}</div>
  1561. {block:Excerpt}<div class="link-txt">{Excerpt}</div>{/block:Excerpt}
  1562. {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  1563. </div>
  1564. </a>
  1565. {block:Description}
  1566. {block:NotReblog}
  1567. <li class="caption">
  1568. {Description}
  1569. </li>
  1570. {/block:NotReblog}
  1571. {/block:Description}
  1572. {block:RebloggedFrom}
  1573. {block:Reblogs}
  1574. <li class="caption">
  1575. <div class="user-icon"></div>
  1576. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1577. {Body}
  1578. </li>
  1579. {/block:Reblogs}
  1580. {/block:RebloggedFrom}
  1581. {/block:Link}
  1582.  
  1583. {block:Photo}
  1584. <div class="photo">
  1585. {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}
  1586. </div>
  1587. {block:Caption}
  1588. {block:NotReblog}
  1589. <li class="caption">
  1590. {Caption}
  1591. </li>
  1592. {/block:NotReblog}
  1593. {block:RebloggedFrom}
  1594. {block:Reblogs}
  1595. <li class="caption">
  1596. <div class="user-icon"></div>
  1597. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1598. {Body}
  1599. </li>
  1600. {/block:Reblogs}
  1601. {/block:RebloggedFrom}
  1602. {/block:Caption}
  1603. {/block:Photo}
  1604.  
  1605. {block:Photoset}
  1606. <div class="photo"style="margin-top:1em;">{Photoset-700}</div>
  1607. {block:Caption}
  1608. {block:NotReblog}
  1609. <li class="caption">
  1610. {Caption}
  1611. </li>
  1612. {/block:NotReblog}
  1613. {block:RebloggedFrom}
  1614. {block:Reblogs}
  1615. <li class="caption">
  1616. <div class="user-icon"></div>
  1617. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1618. {Body}
  1619. </li>
  1620. {/block:Reblogs}
  1621. {/block:RebloggedFrom}
  1622. {/block:Caption}
  1623. {/block:Photoset}
  1624.  
  1625. {block:Video}
  1626. <div class="video">{Video-500}</div>
  1627. {block:Caption}
  1628. {block:NotReblog}
  1629. <li class="caption">
  1630. {Caption}
  1631. </li>
  1632. {/block:NotReblog}
  1633. {block:RebloggedFrom}
  1634. {block:Reblogs}
  1635. <li class="caption">
  1636. <div class="user-icon"></div>
  1637. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1638. {Body}
  1639. </li>
  1640. {/block:Reblogs}
  1641. {/block:RebloggedFrom}
  1642. {/block:Caption}
  1643. {/block:Video}
  1644.  
  1645. {block:Quote}
  1646. <div class="quote">{Quote}</div>
  1647. {block:Source}<div class="source">{Source}</div>{/block:Source}
  1648. {/block:Quote}
  1649.  
  1650. {block:Chat}
  1651. {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  1652. <ul class="chat">{block:Lines}
  1653. <li>
  1654. {block:Label}<div class="chatter">{Label}</div>{/block:Label}
  1655. {Line}
  1656. </li>
  1657. {/block:Lines}</ul>
  1658. {/block:Chat}
  1659.  
  1660. {block:Answer}
  1661. <div class="asking"><b>{Asker}</b> sent a message
  1662. <div class="question">{Question}</div></div>
  1663. {block:Answerer}
  1664. <div class="answer2">{Answer}</div>
  1665. {/block:Answerer}
  1666. {block:NotReblog}
  1667. <li class="caption">
  1668. {Replies}
  1669. </li></div>
  1670. {/block:NotReblog}
  1671. {block:RebloggedFrom}
  1672. {block:Reblogs}
  1673. <li class="caption">
  1674. <div class="user-icon"></div>
  1675. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1676. {Body}
  1677. </li>
  1678. {/block:Reblogs}
  1679. {/block:RebloggedFrom}
  1680. {/block:Answer}
  1681.  
  1682. {block:Audio}
  1683. <div class="audiopost">
  1684. <div class="audiobox">
  1685. <div class="button">
  1686. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1687. </div>
  1688. </div>
  1689. {block:AlbumArt}
  1690. <img src="{AlbumArtURL}" class="album-art">
  1691. {/block:AlbumArt}
  1692. <div class="audioinfo">
  1693. {block:TrackName}<li class="track">{TrackName}</li>{/block:TrackName}
  1694. {block:Artist}<li>{Artist}</li>{/block:Artist}
  1695. {block:Album}<li>{Album}</li>{/block:Album}
  1696. </div>
  1697. </div>
  1698. {block:Caption}
  1699. {block:NotReblog}
  1700. <li class="caption">
  1701. {Caption}
  1702. </li>
  1703. {/block:NotReblog}
  1704. {block:RebloggedFrom}
  1705. {block:Reblogs}
  1706. <li class="caption">
  1707. <div class="user-icon"></div>
  1708. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1709. {Body}
  1710. </li>
  1711. {/block:Reblogs}
  1712. {/block:RebloggedFrom}
  1713. {/block:Caption}
  1714. {/block:Audio}
  1715.  
  1716. <!----- info ----->
  1717.  
  1718. {block:Date}
  1719. <div class="info">
  1720. <a href="{Permalink}"title="{TimeAgo}">{Month} {DayofMonth}, {Year}</a>
  1721.  
  1722. <div class="but">
  1723. {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  1724. </div>
  1725.  
  1726. </div>
  1727. {/block:Date}
  1728.  
  1729. <!----- tags ----->
  1730.  
  1731. {block:HasTags}
  1732. <div class="tags">
  1733. {block:Tags}
  1734. <a href="{TagURL}">{Tag}</a>
  1735. {/block:Tags}
  1736. </div>
  1737. {/block:HasTags}
  1738.  
  1739. <!----- notes ----->
  1740.  
  1741. {block:PermalinkPage}{block:Date}
  1742. {block:NoteCount}{block:PostNotes}
  1743. <div class="notes">
  1744. {PostNotes-64}
  1745. </div>
  1746. {/block:PostNotes}{/block:NoteCount}
  1747. {/block:Date}{/block:PermalinkPage}
  1748.  
  1749. </article>
  1750.  
  1751. {/block:Posts}
  1752.  
  1753. <!----- pagination ----->
  1754.  
  1755. {block:Pagination}
  1756. <article id="page-navigation">
  1757.  
  1758. {block:PreviousPage}
  1759. <div style="position:absolute; left:10px; margin-top:-0.15em;"><a href="{PreviousPage}"title="previous page"><i class="ph ph-arrow-circle-left"></i></a></div>
  1760. {/block:PreviousPage}
  1761.  
  1762. {block:JumpPagination length="5"}
  1763. {block:CurrentPage}<span class="current-page">{PageNumber}</span>{/block:CurrentPage}
  1764. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1765. {/block:JumpPagination}
  1766.  
  1767. {block:NextPage}
  1768. <div style="position:absolute; right:10px;margin-top:-1.5em;"><a href="{NextPage}"title="next page"><i class="ph ph-arrow-circle-right"></i></a></div>{/block:NextPage}
  1769. </article>
  1770. {/block:Pagination}
  1771.  
  1772. </section>
  1773. </main>
  1774.  
  1775. <!----- tooltips ----->
  1776.  
  1777. <script src="https://unpkg.com/popper.js@1"></script>
  1778. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script>
  1779. <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  1780.  
  1781. <script>
  1782.  
  1783. $(document).ready(function(){
  1784.  
  1785. //Check to see if the window is top if not then display button
  1786. $('section').scroll(function(){
  1787. if ($(this).scrollTop() > 100) {
  1788. $('.scrollToTop').fadeIn(0);
  1789. } else {
  1790. $('.scrollToTop').fadeOut(0);
  1791. }
  1792. });
  1793.  
  1794. //Click event to scroll to top
  1795. $('.scrollToTop').click(function(){
  1796. $('html, body, section').animate({scrollTop : 0},800);
  1797. return false;
  1798. });
  1799.  
  1800. });
  1801.  
  1802.  
  1803. tippy('a[title]', {
  1804. theme: 'custom',
  1805. arrow: tippy.round,
  1806. zIndex: 9999999999,
  1807. maxWidth: 300,
  1808.  
  1809. content(reference) {
  1810. const title = reference.getAttribute('title');
  1811. reference.removeAttribute('title');
  1812. return title;
  1813. },
  1814. });
  1815. </script>
  1816.  
  1817. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1818.  
  1819. <script>
  1820. $(document).ready(function(){
  1821. $('.controls-button').click(function(){
  1822. $('body').toggleClass('controls-click');
  1823. });
  1824. });
  1825. </script>
  1826.  
  1827. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  1828. <script>
  1829. $(document).ready(function(){
  1830. $('.search').submit(function(event){
  1831. var value = $('input:first').val();
  1832. location.replace('https://{Name}.tumblr.com/tagged/' + value);
  1833. });
  1834. });
  1835. </script>
  1836.  
  1837. </body>
  1838.  
  1839. <!-- script for clickable updates tab (wouldn't recommend changing anything except "slow") -->
  1840. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1841. <script>
  1842. $(document).ready(function(){
  1843. $(".tabs").click(function(){
  1844. $(".tab_content").slideToggle("slow"); /* <- can be "slow" or "fast" */
  1845. });
  1846. });
  1847. </script>
  1848.  
  1849. <!-- script for clickable updates tab (wouldn't recommend changing anything except "slow") -->
  1850. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1851. <script>
  1852. $(document).ready(function(){
  1853. $(".tabs2").click(function(){
  1854. $(".tab_content2").slideToggle("slow"); /* <- can be "slow" or "fast" */
  1855. });
  1856. });
  1857. </script>
  1858.  
  1859. <!----- updates ----->
  1860.  
  1861. <div class="tab">
  1862. <div class="tab_content">
  1863.  
  1864. <li><i class="ph ph-television"style="color:{color:accent};"></i>
  1865. <div style="margin-top:-2.2em;margin-left:2em;"><b>watching</b> {text:watching}</div></li>
  1866.  
  1867. <li><i class="ph ph-headphones"style="color:{color:gradient 2};"></i>
  1868. <div style="margin-top:-2.2em;margin-left:2em;"><bb>listening to</bb> {text:listening to}</div></li>
  1869.  
  1870. <li><i class="ph ph-book"style="color:{color:accent};"></i>
  1871. <div style="margin-top:-2.2em;margin-left:2em;"><b>reading</b> {text:reading} </div></li>
  1872.  
  1873. <li><i class="ph ph-magic-wand"style="color:{color:gradient 2};"></i>
  1874. <div style="margin-top:-2.2em;margin-left:2em;"><bb>working on</bb> {text:working on} </div></li>
  1875.  
  1876. <li><i class="ph ph-info"style="color:{color:accent};"></i>
  1877. <div style="margin-top:-2.2em;margin-left:2em;"><b>status</b> {text:status}</div></li>
  1878.  
  1879. </div>
  1880. </div> <!----- updates end ----->
  1881.  
  1882. </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!