API tools faq
paste
Advertisement
likesmagic

snooze by @gloriapritchetts

likesmagic
Jun 11th, 2024
408
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 36.63 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/JRBt7
  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:4px;
  16. }
  17. </style>
  18. <script src="https://unpkg.com/phosphor-icons"></script>
  19. <link rel="preconnect" href="https://fonts.googleapis.com">
  20. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  21. <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">
  22.  
  23. <script src="//pull.cappuccicons.com/cpf.js"></script>
  24. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  25. <title>{Title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:PostSummary}: {PostSummary}{/block:PostSummary}</title>
  26.  
  27. <link rel="shortcut icon" href="{Favicon}">
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  30. <meta charset="utf-8">
  31. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  32.  
  33. <!---
  34.  
  35. ♡ CODE BY GLORIAPRITCHETTS ♡
  36. rules and credits @ gloriapritchetts.tumblr.com/themes
  37.  
  38. --->
  39.  
  40. <meta name="image:sidebar" content="https://placehold.co/60x60/EEE/31343C"/>
  41. <meta name="image:header" content="https://placehold.co/580x200/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="select:font" content="karla"/>
  52. <meta name="select:font" content="roboto"/>
  53. <meta name="select:font" content="quicksand"/>
  54. <meta name="select:font" content="nunito"/>
  55. <meta name="select:font" content="poppins"/>
  56. <meta name="select:font" content="abeezee"/>
  57. <meta name="select:font" content="montserrat"/>
  58. <meta name="select:font" content="varela round"/>
  59.  
  60. <meta name="select:borders" content="0px"/>
  61. <meta name="select:borders" content="1px"/>
  62.  
  63. <meta name="select:border radius" content="0px"/>
  64. <meta name="select:border radius" content="5px"/>
  65. <meta name="select:border radius" content="10px"/>
  66.  
  67. <meta name="text:link 1 url" content="/"/>
  68. <meta name="text:link 1 title" content="about"/>
  69. <meta name="text:link 2 url" content="/"/>
  70. <meta name="text:link 2 title" content="gifs"/>
  71. <meta name="text:link 3 url" content="/"/>
  72. <meta name="text:link 3 title" content="links"/>
  73.  
  74. <meta name="text:dni" content="dni"/>
  75.  
  76. <meta name="text:title" content="title"/>
  77. <meta name="text:subtitle" content="subtitle"/>
  78. <meta name="text:description" content="this looks best at two lines! la la lalalalallaa la la la la lalalalal"/>
  79.  
  80. <meta name="text:name" content="name"/>
  81. <meta name="text:age" content="age"/>
  82. <meta name="text:pronouns" content="pronouns"/>
  83.  
  84. <meta name="text:side link 1 url" content="/"/>
  85. <meta name="text:side link 1 title" content="link"/>
  86. <meta name="text:side link 2 url" content="/"/>
  87. <meta name="text:side link 2 title" content="link"/>
  88. <meta name="text:side link 3 url" content="/"/>
  89. <meta name="text:side link 3 title" content="link"/>
  90.  
  91. <meta name="text:tracking tag" content="tag"/>
  92.  
  93. <!----- css ----->
  94.  
  95. <style type="text/css">
  96.  
  97. /*----- general -----*/
  98.  
  99. ::-webkit-scrollbar {
  100. width: 3px;
  101. background: {color:background};
  102. border-radius:{select:border radius};
  103. }
  104.  
  105. ::-webkit-scrollbar-thumb {
  106. background: {color:accent};
  107. border-radius:{select:border radius};
  108. }
  109.  
  110. body {
  111. font-family: {select:font};
  112. font-size: 13.5px;
  113. color: {color:text};
  114. background-color: {color:background};
  115. line-height: 135%;
  116. word-wrap: break-word;
  117. letter-spacing: 0.3px;
  118. margin: 0;
  119. padding: 0;
  120. }
  121.  
  122. a {
  123. color: {color:accent};
  124. border-bottom:1px solid {color:gradient 1};
  125. position: relative;
  126. text-decoration: none;
  127. -webkit-transition: all 0.4s ease;
  128. transition: all 0.4s ease;
  129. -moz-transition: all 0.4s ease;
  130. -o-transition: all 0.4s ease;
  131. }
  132.  
  133. a:hover {
  134. border-bottom:1px solid {color:gradient 2};
  135. text-decoration:none;
  136. color:{color:gradient 2};
  137. text-shadow:none;
  138. -webkit-transition: all 0.4s ease;
  139. transition: all 0.4s ease;
  140. -moz-transition: all 0.4s ease;
  141. -o-transition: all 0.4s ease;
  142. }
  143.  
  144. blockquote {
  145. padding: 0 0 0 1.5em;
  146. border-left: 1px solid {color:borders};
  147. margin: 1.5em 0 1.5em 1.5em;
  148. }
  149.  
  150. h1.post-title {
  151. font-size:23px;
  152. color:{color:accent};
  153. text-align:left;
  154. }
  155.  
  156. h1 {
  157. font-size:16px;
  158. color:{color:accent};
  159. text-align:left;
  160. line-height:22px;
  161. border:none;
  162. }
  163.  
  164. h1 a {
  165. font-size:16px;
  166. color:{color:accent};
  167. text-align:left;
  168. line-height:22px;
  169. border:none;
  170. }
  171.  
  172. h1 a:hover {
  173. font-size:16px;
  174. color:{color:accent};
  175. text-align:left;
  176. line-height:22px;
  177. border:none;
  178. }
  179.  
  180. h2 {
  181. font-size:15px;
  182. color:{color:posts};
  183. border-radius:{select:border radius};
  184. padding:10px;
  185. text-align:center;
  186. line-height:22px;
  187. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  188. text-transform:justify;
  189. }
  190.  
  191. h2 a {
  192. font-size:15px;
  193. color:{color:posts};
  194. border:none;
  195. }
  196.  
  197. h2 a:hover {
  198. font-size:15px;
  199. color:{color:posts};
  200. border:none;
  201. }
  202.  
  203. bold, b, strong {
  204. font-weight:bold;
  205. color:{color:accent};
  206. }
  207.  
  208. i, em, italic {
  209. color:{color:accent};
  210. }
  211.  
  212. small, sub, sup {
  213. font-size:13px;
  214. }
  215.  
  216. .tmblr-iframe-compact .tmblr-iframe--unified-controls { z-index: 999999999!important;margin-top: 4em;padding-right:0.4em;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; }
  217.  
  218. body.controls-click .tmblr-iframe {
  219. opacity: 1.0;
  220. visibility: visible;
  221. -webkit-transition: all 0.5s;
  222. -moz-transition: all 0.5s;
  223. -ms-transition: all 0.5s;
  224. -o-transition: all 0.5s;
  225. transition: all 0.5s;
  226. }
  227.  
  228. /*----- sidebar -----*/
  229.  
  230. #sidebar {
  231. width: 350px!important;
  232. height:105px;
  233. position: fixed;
  234. top: 120px;
  235. margin-left:620px!important;
  236. background:{color:posts};
  237. padding:20px;
  238. border-radius:{select:border radius};
  239. border:{select:borders} solid {color:borders};
  240. }
  241.  
  242. #side-header {
  243. position:absolute;
  244. z-index:99999999!important;
  245. text-align:center!important;
  246. width:390px;
  247. margin-left:-1.5em;
  248. margin-top:-1.5em;
  249. height:38px;
  250. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  251. border-top-right-radius:{select:border radius};
  252. border-top-left-radius:{select:border radius};
  253. color:{color:posts};
  254. }
  255.  
  256. #title {
  257. width:360px;
  258. border-radius:{select:border radius};
  259. background:{color:posts};
  260. color:{color:accent};
  261. margin-top:1.1em;
  262. margin-left:1.1em;
  263. font-size:9px;
  264. letter-spacing:3px;
  265. padding-left:1em;
  266. text-transform:uppercase;
  267. text-align:left!important;
  268. }
  269.  
  270. #sidebar2 {
  271. width: 350px!important;
  272. height:65px;
  273. position: fixed;
  274. top: 275px;
  275. margin-left:620px!important;
  276. background:{color:posts};
  277. padding:20px;
  278. border-radius:{select:border radius};
  279. border:{select:borders} solid {color:borders};
  280. }
  281.  
  282. #description {
  283. margin-top:-0.2em;
  284. margin-left:0em;
  285. position:absolute;
  286. width:330px;
  287. height:45px;
  288. padding:10px;
  289. padding-top:15px;
  290. text-align:center;
  291. line-height:20px;
  292. overflow-y:hidden;
  293. background:{color:background};
  294. border-radius:{select:border radius};
  295. }
  296.  
  297. #about {
  298. margin-top:21.6em;
  299. margin-left:46em;
  300. position:fixed;
  301. border-radius:{select:border radius};
  302. width:150px;
  303. height:143px;
  304. padding:20px;
  305. line-height:17px;
  306. text-align:left;
  307. overflow-y:hidden;
  308. background:{color:posts};
  309. border:{select:borders} solid {color:borders};
  310. }
  311.  
  312. #about h1 {
  313. background: {color:background};
  314. color:{color:accent};
  315. padding:10px;
  316. text-align:center;
  317. border-radius:{select:border radius};
  318. }
  319.  
  320. #about kook {
  321. padding:5px;
  322. border-radius:{select:border radius};
  323. background:{color:gradient 2};
  324. color:{color:posts};
  325. margin-right:0.5em;
  326. }
  327.  
  328. #about yoongi {
  329. padding:5px;
  330. border-radius:{select:border radius};
  331. background:{color:accent};
  332. color:{color:posts};
  333. margin-right:0.5em;
  334. }
  335.  
  336. #about li {
  337. list-style-type:none;
  338. margin-bottom:1.23em;
  339. }
  340.  
  341. #quickiez {
  342. margin-top:21.6em;
  343. margin-left:60.9em;
  344. position:fixed;
  345. border-radius:{select:border radius};
  346. width:150px;
  347. height:143px;
  348. padding:20px;
  349. line-height:17px;
  350. text-align:left;
  351. overflow-y:hidden;
  352. background:{color:posts};
  353. border:{select:borders} solid {color:borders};
  354. }
  355.  
  356. #quickiez h1 {
  357. background: {color:background};
  358. color:{color:accent};
  359. padding:10px;
  360. text-align:center;
  361. border-radius:{select:border radius};
  362. }
  363.  
  364. #quickiez li {
  365. text-align:center;
  366. padding:5px;
  367. width:140px;
  368. background:{color:accent};
  369. border-radius:{select:border radius};
  370. color:{color:posts};
  371. margin-bottom:0.5em;
  372. list-style-type:none;
  373. -webkit-transition: all 0.4s ease;
  374. transition: all 0.4s ease;
  375. -moz-transition: all 0.4s ease;
  376. -o-transition: all 0.4s ease;
  377. }
  378.  
  379. #quickiez li:hover {
  380. background:{color:gradient 2};
  381. color:{color:posts};
  382. -webkit-transition: all 0.4s ease;
  383. transition: all 0.4s ease;
  384. -moz-transition: all 0.4s ease;
  385. -o-transition: all 0.4s ease;
  386. }
  387.  
  388. #quickiez a {
  389. border:none;
  390. color:{color:posts};
  391. -webkit-transition: all 0.4s ease;
  392. transition: all 0.4s ease;
  393. -moz-transition: all 0.4s ease;
  394. -o-transition: all 0.4s ease;
  395. }
  396.  
  397. #title2 {
  398. margin-top:-3.8em;
  399. margin-left:4.2em;
  400. padding:15px;
  401. color:{color:accent};
  402. font-size:20px;
  403. text-align:center;
  404. line-height:12px;
  405. font-weight:bold;
  406. }
  407.  
  408. #title2 span {
  409. font-size:10px;
  410. text-transform:uppercase;
  411. letter-spacing:3px;
  412. font-weight:normal;
  413. color:{color:gradient 2};
  414. }
  415.  
  416. #icon {
  417. width:60px;
  418. height:60px;
  419. margin-left:0.3em;
  420. margin-top:2.9em;
  421. border-radius:100%;
  422. outline:2px solid {color:accent};
  423. outline-offset:3px;
  424. object-fit: cover;
  425. }
  426.  
  427. #icon img {
  428. width:60px;
  429. height:60px;
  430. border-radius:100%;
  431. object-fit: cover;
  432. }
  433.  
  434. #follow {
  435. width:300px;
  436. margin-top:-0.6em;
  437. margin-left:5em;
  438. position:absolute;
  439. text-align:center;
  440. }
  441.  
  442. #follow li {
  443. list-style-type:none;
  444. display:inline-block;
  445. width:115px!important;
  446. margin:3.3px;
  447. padding:5px;
  448. border-radius:{select:border radius};
  449. background:{color:accent};
  450. color:{color:posts};
  451. -webkit-transition: all 0.4s ease;
  452. transition: all 0.4s ease;
  453. -moz-transition: all 0.4s ease;
  454. -o-transition: all 0.4s ease;
  455. }
  456.  
  457. #follow a {
  458. color:{color:posts};
  459. text-align:center;
  460. border:none;
  461. -webkit-transition: all 0.4s ease;
  462. transition: all 0.4s ease;
  463. -moz-transition: all 0.4s ease;
  464. -o-transition: all 0.4s ease;
  465. }
  466.  
  467. #follow li:hover {
  468. border-radius:{select:border radius};
  469. background:{color:gradient 2};
  470. color:{color:posts};
  471. border:none;
  472. -webkit-transition: all 0.4s ease;
  473. transition: all 0.4s ease;
  474. -moz-transition: all 0.4s ease;
  475. -o-transition: all 0.4s ease;
  476. }
  477.  
  478. #sidebar3 {
  479. width: 350px!important;
  480. height:35px;
  481. position: fixed;
  482. top: 43.5em;
  483. margin-left:620px!important;
  484. background:{color:posts};
  485. padding:20px;
  486. border-radius:{select:border radius};
  487. border:{select:borders} solid {color:borders};
  488. }
  489.  
  490. #tracking {
  491. margin-top:-0.2em;
  492. margin-left:0em;
  493. position:absolute;
  494. width:330px;
  495. height:19px;
  496. padding:10px;
  497. text-align:center;
  498. overflow-y:hidden;
  499. background:{color:background};
  500. border-radius:{select:border radius};
  501. }
  502.  
  503. /*----- header -----*/
  504.  
  505. #header {
  506. width:540px;
  507. height:275px;
  508. background:{color:posts};
  509. padding:20px;
  510. position:relative;
  511. border:{select:borders} solid {color:borders};
  512. border-radius:{select:border radius};
  513. }
  514.  
  515. #headerg {
  516. margin-top:0.7em;
  517. margin-left:0em;
  518. width:580px;
  519. height:200px;
  520. z-index:99999999999!important;
  521. object-fit: cover;
  522. }
  523.  
  524. #headerg img {
  525. width:580px;
  526. height:200px;
  527. object-fit: cover;
  528. }
  529.  
  530. #joon {
  531. background:{color:background};
  532. width:530px;
  533. padding:5px;
  534. border-radius:{select:border radius};
  535. text-align:center;
  536. }
  537.  
  538. #joon a {
  539. border:0px;
  540. text-transform:uppercase;
  541. font-size:10px;
  542. letter-spacing:3px;
  543. margin:0.5em;
  544. }
  545.  
  546. #joonie {
  547. margin-top:1em;
  548. background:{color:background};
  549. width:530px;
  550. height:16px;
  551. padding:5px;
  552. border-radius:{select:border radius};
  553. text-align:center;
  554. text-transform:uppercase;
  555. font-size:10px;
  556. letter-spacing:3px;
  557. }
  558.  
  559. /*----- heading -----*/
  560.  
  561. #heading {
  562. background: {color:posts};
  563. width: 100%;
  564. position: fixed;
  565. z-index:99999999999!important;
  566. text-align:center;
  567. height:55px;
  568. top:0px;
  569. left:0px;
  570. border-bottom:{select:borders} solid {color:borders};
  571. }
  572.  
  573. #heading a {
  574. border-bottom:0px;
  575. margin:1em!important;
  576. }
  577.  
  578. #heading i {
  579. margin-top:0.57em!important;
  580. color:{color:accent};
  581. font-size:25px;
  582. -webkit-transition: all 0.4s ease;
  583. transition: all 0.4s ease;
  584. -moz-transition: all 0.4s ease;
  585. -o-transition: all 0.4s ease;
  586. }
  587.  
  588. #heading i:hover {
  589. color:{color:gradient 2};
  590. -webkit-transition: all 0.4s ease;
  591. transition: all 0.4s ease;
  592. -moz-transition: all 0.4s ease;
  593. -o-transition: all 0.4s ease;
  594. }
  595.  
  596. #boywithluv {
  597. font-size:20px;
  598. text-align:center;
  599. color:{color:accent};
  600. padding-top:0.9em;
  601. font-weight:bold;
  602. }
  603.  
  604. /*----- taehyung's military wife -----*/
  605.  
  606. .credit {
  607. position:fixed;
  608. top:0px;
  609. left:0px;
  610. }
  611.  
  612. .scrollToTop {
  613. text-decoration: none;
  614. position:fixed;
  615. top:-1em;
  616. right:2.5em;
  617. display:none;
  618. }
  619.  
  620. .scrollToTop:hover{
  621. text-decoration:none;
  622. }
  623.  
  624. .controlz {
  625. position:fixed;
  626. top:0px;
  627. right:0px;
  628. }
  629.  
  630. /*----- posts -----*/
  631.  
  632. main {
  633. position: relative;
  634. width: calc(250px + 540px + 150px);
  635. margin: auto;
  636. }
  637.  
  638. section {
  639. position:relative;
  640. top:50%;
  641. left:50%;
  642. width: 580px;
  643. margin-left: -570px;
  644. margin-top:100px;
  645. padding:20px;
  646. }
  647.  
  648. article {
  649. width: 540px;
  650. position: relative;
  651. margin-bottom:100px!important;
  652. background:{color:posts};
  653. padding:20px;
  654. border:{select:borders} solid {color:borders};
  655. border-radius:{select:border radius};
  656. }
  657.  
  658. .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%; }
  659.  
  660. .caption {
  661. margin-top: 1em;
  662. list-style-type: none;
  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; }
  674.  
  675. .user-icon {
  676. display: inline-block;
  677. vertical-align: middle;
  678. width: 1em;
  679. height: 1em;
  680. margin-right: 1em;
  681. margin-top:0.45em;
  682. border-radius:100%;
  683. outline:2px solid {color:accent};
  684. outline-offset:2px;
  685. }
  686.  
  687. .username, .username a {
  688. display: inline-block;
  689. vertical-align: middle;
  690. font-weight: bold;
  691. color:{color:accent};
  692. text-decoration:none;
  693. border-bottom:0px solid;
  694. }
  695.  
  696. .username a:hover {
  697. font-weight: bold;
  698. color:{color:gradient 2};
  699. text-decoration:none;
  700. border-bottom:0px solid;
  701. }
  702.  
  703. .deactive::after {
  704. content: '(deactivated)';
  705. margin-left: 0.5em;
  706. opacity: .25;
  707. color: {color:text};
  708. }
  709.  
  710. p.tmblr-attribution {margin-top: 1em !important;}
  711.  
  712. a.link-wrap {
  713. display: block;
  714. border: 1px solid {color:borders};
  715. }
  716.  
  717. .link { padding: 2em; }
  718.  
  719. .link-host, .link-txt { margin-top: 1.5em; }
  720.  
  721. .npf-link-block {
  722. margin-top: 1.5em;
  723. background-color: inherit;
  724. border: 1px solid inherit;
  725. color: inherit;
  726. }
  727.  
  728. img {
  729. margin: 0;
  730. display: block;
  731. height: auto;
  732. max-width: 100%;
  733. margin-bottom:5px;
  734. border-radius:{select:border radius};
  735. }
  736.  
  737. .photo-slideshow,
  738. .npf_photoset {
  739. border-radius:{select:border radius};
  740. }
  741.  
  742. .vignette, #vignette {opacity: 0;}
  743. .tmblr-lightbox, #tumblr_lightbox {background-color: rgba(130, 130, 130, 0.75) !important;}
  744.  
  745. .lightbox-image, #tumblr_lightbox img {
  746. box-shadow: none !important;
  747. border-radius: 0 !important;
  748. max-width: none;
  749. }
  750.  
  751. #tumblr_lightbox_caption, .lightbox-caption {
  752. color: #fff !important;
  753. font-family: inherit;
  754. margin-top: 1em !important;
  755. }
  756.  
  757. .post-content div.npf_row, .post div.npf_row, body div.npf_row {
  758. margin-left: 0 !important;
  759. margin-right: 0 !important;
  760. }
  761.  
  762. .quote { line-height: 160%; font-size: 1.25em; }
  763.  
  764. .quote p:first-of-type { margin-top: 0; }
  765. .quote p:last-of-type { margin-bottom: 0; }
  766.  
  767. .source { margin-top: 1.5em; }
  768.  
  769. .chat { padding: 0; margin: 0; }
  770. .chat li { list-style-type: none; margin-top: 1em; }
  771. .chat li:first-of-type { margin-top: 0; }
  772. .chatter { font-weight: bold; }
  773.  
  774. p.npf_chat, p.npf_chat b {font-family: inherit;}
  775.  
  776. /*----- asks -----*/
  777.  
  778. .ask-wrap {
  779. background:{color:background};
  780. padding:15px;
  781. border-radius:{select:border radius};
  782. text-align:right;
  783. }
  784.  
  785. .ask-wrap .asking {
  786. display: inline-block;
  787. margin-left: 0em;
  788. font-weight: bold;
  789. color:{color:accent};
  790. text-transform:justify;
  791. word-spacing:0px;
  792. padding-left:2.5px;
  793. }
  794.  
  795. .asking a {
  796. border-bottom:0px solid;
  797. }
  798.  
  799. .asking a:hover {
  800. color:{color:gradient 2};
  801. border-bottom:0px solid;
  802. }
  803.  
  804. .question { margin-top: 0.5em; }
  805. .question p:first-of-type { margin-top: 0; }
  806. .question p:last-of-type { margin-bottom: 0; }
  807.  
  808. .answer {
  809. margin-top:1em;
  810. display: inline-block;
  811. font-weight: bold;
  812. font-size:13.5px;
  813. color:{color:accent};
  814. text-align:left;
  815. text-transform:justify;
  816. word-spacing:0px;
  817. }
  818.  
  819. .answer a {
  820. border-bottom:0px solid;
  821. }
  822.  
  823. .answer a:hover {
  824. color:{color:gradient 2};
  825. border-bottom:0px solid;
  826. }
  827.  
  828. .answer2 {
  829. margin-top:1em;
  830. font-weight:normal;
  831. text-transform:lowercase;
  832. text-align:left;
  833. font-family: {text:font};
  834. font-size: 13.5px;
  835. color: {color:text};
  836. background:{color:background};
  837. padding:15px;
  838. border-radius:{select:border radius};
  839. }
  840.  
  841. .ask-icon {
  842. display: inline-block;
  843. vertical-align: middle;
  844. width: 1em;
  845. height: 1em;
  846. margin-right: 0.4em;
  847. margin-top:0.4em;
  848. border-radius:100%;
  849. outline:2px solid {color:accent};
  850. outline-offset:2px;
  851. }
  852.  
  853. /*----- info -----*/
  854.  
  855. .info {
  856. height:21px;
  857. margin-top: 1.3em;
  858. padding:10px;
  859. background: linear-gradient(to right, {color:Gradient 1}, {color:Gradient 2});
  860. border-radius:{select:border radius};
  861. }
  862.  
  863. .info a {
  864. display: inline-block;
  865. vertical-align: middle;
  866. text-transform:lowercase;
  867. font-weight:bold;
  868. color:{color:posts};
  869. border-bottom:0px solid;
  870. }
  871.  
  872. .info a:hover {
  873. text-decoration:none;
  874. color:{color:posts};
  875. text-shadow:none;
  876. border-bottom:0px solid;
  877. }
  878.  
  879. .info i {
  880. color:{color:posts};
  881. font-size:13px;
  882. margin-right:0.5em;
  883. }
  884.  
  885. .pinned {
  886. width:10px;
  887. padding:10px;
  888. height:10px;
  889. top:-0.7em;
  890. left:13.6em;
  891. background: {color:accent};
  892. position:absolute;
  893. border-radius:{select:border radius};
  894. z-index:999999!important;
  895. font-size:20px;
  896. color:{color:background};
  897. text-align:center;
  898. -webkit-transition: all 0.4s ease;
  899. transition: all 0.4s ease;
  900. -moz-transition: all 0.4s ease;
  901. -o-transition: all 0.4s ease;
  902. }
  903.  
  904. .pinned a {
  905. text-decoration:none;
  906. text-shadow:none;
  907. border:none;
  908. color:{color:background};
  909. }
  910.  
  911. .pinned i {
  912. color:{color:background};
  913. }
  914.  
  915. .likeb {
  916. position: relative;
  917. display: inline-block;
  918. height: 1.6em;
  919. margin-bottom: 0px;
  920. margin-top:2px;
  921. }
  922.  
  923. .likeb .like_button iframe {
  924. position: absolute;
  925. top: 0;
  926. left: 0;
  927. bottom: 0;
  928. right: 0;
  929. z-index: 2;
  930. opacity: 0;
  931. }
  932.  
  933. .like_button iframe {width: 100% !important; height: 100% !important;}
  934. .likeb .liked + .actual-button {}
  935. .likeb .liked + .actual-button:after {content: '';}
  936.  
  937. .buttons {
  938. margin-top:-19px;
  939. text-align:right;
  940. }
  941.  
  942. .buttons a {
  943. margin-left:0em;
  944. margin-right:0.4em;
  945. color:{color:posts};
  946. border-bottom:0px solid;
  947. -webkit-transition: all 0.4s ease;
  948. transition: all 0.4s ease;
  949. -moz-transition: all 0.4s ease;
  950. -o-transition: all 0.4s ease;
  951. }
  952.  
  953. .buttons i {
  954. font-size:13px;
  955. margin-right:0.3em;
  956. color:{color:posts};
  957. -webkit-transition: all 0.4s ease;
  958. transition: all 0.4s ease;
  959. -moz-transition: all 0.4s ease;
  960. -o-transition: all 0.4s ease;
  961. }
  962.  
  963. .buttons i:hover, .buttons a:hover {
  964. color:{color:posts};
  965. border-bottom:0px solid;
  966. -webkit-transition: all 0.4s ease;
  967. transition: all 0.4s ease;
  968. -moz-transition: all 0.4s ease;
  969. -o-transition: all 0.4s ease;
  970. }
  971.  
  972. .tags {
  973. word-wrap: break-word;
  974. margin-top:1em!important;
  975. margin-left:0em;
  976. }
  977.  
  978. .tags a {
  979. margin-right:0em;
  980. color:{color:text};
  981. font-weight:normal;
  982. padding-right:0.4em;
  983. border-bottom:0px solid;
  984. }
  985.  
  986. .tags a:hover {
  987. text-decoration:none;
  988. color:{color:gradient 2};
  989. text-shadow:none;
  990. border-bottom:0px solid;
  991. }
  992.  
  993. .tags a:before {
  994. content: '#';
  995. }
  996.  
  997. .tags a:after {
  998. content: ',';
  999. }
  1000.  
  1001. .tags a:last-child:after {
  1002. content: '.';
  1003. }
  1004.  
  1005. .tags b {
  1006. color:{color:accent};
  1007. margin-right:0.5em;
  1008. text-transform:lowercase;
  1009. }
  1010.  
  1011. /*----- notes -----*/
  1012.  
  1013. .notes { margin-top:-1em; }
  1014. .notes a { color:{color:accent}; text-decoration:none;border-bottom:0px solid; }
  1015. .notes a:hover { color:{color:gradient 2}; text-decoration:none;border-bottom:0px solid; }
  1016.  
  1017. ol.notes {
  1018. max-width: 100%;
  1019. padding: 0;
  1020. margin: 2em 0 0 0;
  1021. text-align:left;
  1022. }
  1023.  
  1024. ol.notes li.note { padding: 0.3em 0; list-style-type: none; }
  1025.  
  1026. ol.notes li.note img.avatar {
  1027. margin-right: 0.5em;
  1028. vertical-align: middle;
  1029. display: inline-block;
  1030. width: 1em;
  1031. height: 1em;
  1032. border-radius:100%;
  1033. border:3px solid {color:accent};
  1034. }
  1035.  
  1036. /*----- pagination -----*/
  1037.  
  1038. #page-navigation {text-align: center;}
  1039. #page-navigation a, .current-page {margin: 0 0.5em;}
  1040. #page-navigation a { border-bottom:none; }
  1041.  
  1042. {CustomCSS}
  1043.  
  1044. /*----- tooltips -----*/
  1045.  
  1046. .tippy-tooltip.custom-theme {
  1047. background-color: {color:accent};
  1048. color: {color:posts};
  1049. text-align:center;
  1050. font-size:12.5px;
  1051. border-radius:{select:border radius};
  1052. }
  1053.  
  1054. </style>
  1055.  
  1056. <!--✻✻✻✻✻✻ 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.4s; } </style>
  1057.  
  1058. </head>
  1059.  
  1060. <!----- html ----->
  1061.  
  1062. <body>
  1063.  
  1064. <!--✻✻✻✻✻✻ npf audio player by @glenthemes ✻✻✻✻✻✻-->
  1065. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  1066. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  1067. <script>
  1068. tumblr_npf_audio({
  1069. emptyTitleText: "Untitled track",
  1070. emptyArtistText: "Untitled artist",
  1071. emptyAlbumText: "Untitled album",
  1072.  
  1073. titleLabel: "Track:",
  1074. artistLabel: "Artist:",
  1075. albumLabel: "Album:"
  1076. });
  1077. </script>
  1078. <style edit-npf-audio-player>
  1079. .npf-audio-wrapper {
  1080. --NPF-Audio-Buttons-Size: 1.4rem;
  1081. --NPF-Audio-Buttons-Color: {color:accent};
  1082. --NPF-Audio-Buttons-Spacing: 1.3rem;
  1083. --NPF-Audio-Image-Size: 72px;
  1084. --NPF-Audio-Image-Spacing: 5px;
  1085. }
  1086.  
  1087. .npf-audio-background {
  1088. background-color: {color:background};
  1089. padding: 1.5rem;
  1090. border-radius:{select:border radius};
  1091. margin-top:-0.4em;
  1092. }
  1093.  
  1094. .npf-audio-title-label,
  1095. .npf-audio-artist-label,
  1096. .npf-audio-album-label {
  1097. font-weight: bold;
  1098. color:{color:accent};
  1099. }
  1100.  
  1101. .npf-audio-title,
  1102. .npf-audio-artist,
  1103. .npf-audio-album {
  1104. color: {color:text};
  1105. }
  1106.  
  1107. </style>
  1108.  
  1109. <main>
  1110.  
  1111. <!----- sidebar ----->
  1112.  
  1113. <aside id="sidebar">
  1114.  
  1115. <div id="side-header">
  1116. <div id="title">{Name}.tumblr.com</div>
  1117. </div>
  1118.  
  1119. <div id="icon"><img src="{image:sidebar}"></div>
  1120. <div id="title2">{text:title}<br><span>{text:subtitle}</span></div>
  1121. <div id="follow">
  1122. <li><a href="https://tumblr.com/follow/{Name}">follow</a></li>
  1123. <li><a href="https://tumblr.com/message/{Name}">message</a></li>
  1124. </div>
  1125.  
  1126. </aside>
  1127.  
  1128. <aside id="sidebar2">
  1129. <div id="description">{text:description}</div>
  1130. </aside>
  1131.  
  1132. <div id="about">
  1133. <h1 style="margin-top:0em;">about</h1>
  1134. <div style="margin-top:1em;">
  1135. <li><kook>name</kook> {text:name}</li>
  1136. <li><yoongi>age</yoongi> {text:age}</li>
  1137. <li><kook>pronouns</kook> {text:pronouns}</li>
  1138. </div>
  1139. </div>
  1140.  
  1141. <div id="quickiez">
  1142. <h1 style="margin-top:0em;">guide</h1>
  1143. <div style="margin-top:-0.2em;">
  1144. <li><a href="{text:side link 1 url}">{text:side link 1 title}</a></li>
  1145. <li><a href="{text:side link 2 url}">{text:side link 2 title}</a></li>
  1146. <li><a href="{text:side link 3 url}">{text:side link 3 title}</a></li>
  1147. </div>
  1148. </div>
  1149.  
  1150. <aside id="sidebar3">
  1151. <div id="tracking"><b>tracking</b> #{text:tracking tag}</div>
  1152. </aside>
  1153.  
  1154. <!----- heading ----->
  1155.  
  1156. <div id="heading">
  1157.  
  1158. <div id="boywithluv"><a href="/">{Title}</a></div>
  1159.  
  1160. <!----- taehyung's military wife ----->
  1161.  
  1162. <div class="credit"><a href="https://gloriapritchetts.tumblr.com"title="credit"><i class="ph ph-butterfly"></i></a></div>
  1163.  
  1164. <!----- updates ----->
  1165.  
  1166. <a href="#" class="scrollToTop"title="scroll to top"><i class="ph ph-caret-double-up"></i></a>
  1167.  
  1168. <div class="controlz"><a class="controls-button"title="controls"><i class="ph ph-gear"></i></a></div>
  1169.  
  1170. </div>
  1171.  
  1172. <section>
  1173.  
  1174. <!----- header ----->
  1175.  
  1176. {block:IndexPage}
  1177.  
  1178. <div id="header">
  1179.  
  1180. <div id="joon">
  1181. <a href="/">home</a>
  1182. <a href=“/ask”>inbox</a>
  1183. <a href="/archive">archive</a>
  1184. <a href="{text:link 1 url}">{text:link 1 title}</a>
  1185. <a href="{text:link 2 url}">{text:link 2 title}</a>
  1186. <a href="{text:link 3 url}">{text:link 3 title}</a>
  1187. </div>
  1188.  
  1189. <img src="{image:header}" id="headerg">
  1190.  
  1191. <div id="joonie">
  1192. <marquee>{text:dni}</marquee>
  1193. </div>
  1194.  
  1195. </div>
  1196. <br><br><br><br><br>
  1197. {/block:IndexPage}
  1198.  
  1199. <!----- posts ----->
  1200.  
  1201. {block:Posts}
  1202. <article class="posts" id="{PostID}">
  1203.  
  1204. {block:PinnedPostLabel}
  1205. <div class="pinned">
  1206. <a href="{Permalink}" class="pinned-post"title="pinned post"><div style="margin-left:-0.25em;margin-top:-0.3em!important;"><i class="ph ph-push-pin-simple"></i></a></div>
  1207. </div>
  1208. {/block:PinnedPostLabel}
  1209.  
  1210. {block:Text}
  1211. {block:Title}<h1 class="post-title">{Title}</h1>{/block:Title}
  1212. {block:NotReblog}
  1213. <li class="caption text-caption">
  1214. {Body}
  1215. </li>
  1216. {/block:NotReblog}
  1217. {block:RebloggedFrom}
  1218. {block:Reblogs}
  1219. <li class="caption text-caption">
  1220. <img src="{PortraitURL-64}" class="user-icon">
  1221. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1222. {Body}
  1223. </li>
  1224. {/block:Reblogs}
  1225. {/block:RebloggedFrom}
  1226. {/block:Text}
  1227.  
  1228. {block:Link}
  1229. <a href="{URL}" class="link-wrap">
  1230. {block:Thumbnail}<img src="{Thumbnail-HighRes}">{/block:Thumbnail}
  1231. <div class="link">
  1232. <div class="title">{Name}</div>
  1233. {block:Excerpt}<div class="link-txt">{Excerpt}</div>{/block:Excerpt}
  1234. {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  1235. </div>
  1236. </a>
  1237. {block:Description}
  1238. {block:NotReblog}
  1239. <li class="caption">
  1240. {Description}
  1241. </li>
  1242. {/block:NotReblog}
  1243. {/block:Description}
  1244. {block:RebloggedFrom}
  1245. {block:Reblogs}
  1246. <li class="caption">
  1247. <img src="{PortraitURL-64}" class="user-icon">
  1248. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1249. {Body}
  1250. </li>
  1251. {/block:Reblogs}
  1252. {/block:RebloggedFrom}
  1253. {/block:Link}
  1254.  
  1255. {block:Photo}
  1256. <div class="photo">
  1257. {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}
  1258. </div>
  1259. {block:Caption}
  1260. {block:NotReblog}
  1261. <li class="caption">
  1262. {Caption}
  1263. </li>
  1264. {/block:NotReblog}
  1265. {block:RebloggedFrom}
  1266. {block:Reblogs}
  1267. <li class="caption">
  1268. <img src="{PortraitURL-64}" class="user-icon">
  1269. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1270. {Body}
  1271. </li>
  1272. {/block:Reblogs}
  1273. {/block:RebloggedFrom}
  1274. {/block:Caption}
  1275. {/block:Photo}
  1276.  
  1277. {block:Photoset}
  1278. <div class="photo">{Photoset-700}</div>
  1279. {block:Caption}
  1280. {block:NotReblog}
  1281. <li class="caption">
  1282. {Caption}
  1283. </li>
  1284. {/block:NotReblog}
  1285. {block:RebloggedFrom}
  1286. {block:Reblogs}
  1287. <li class="caption">
  1288. <img src="{PortraitURL-64}" class="user-icon">
  1289. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1290. {Body}
  1291. </li>
  1292. {/block:Reblogs}
  1293. {/block:RebloggedFrom}
  1294. {/block:Caption}
  1295. {/block:Photoset}
  1296.  
  1297. {block:Video}
  1298. <div class="video">{Video-500}</div>
  1299. {block:Caption}
  1300. {block:NotReblog}
  1301. <li class="caption">
  1302. {Caption}
  1303. </li>
  1304. {/block:NotReblog}
  1305. {block:RebloggedFrom}
  1306. {block:Reblogs}
  1307. <li class="caption">
  1308. <img src="{PortraitURL-64}" class="user-icon">
  1309. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1310. {Body}
  1311. </li>
  1312. {/block:Reblogs}
  1313. {/block:RebloggedFrom}
  1314. {/block:Caption}
  1315. {/block:Video}
  1316.  
  1317. {block:Quote}
  1318. <div class="quote">{Quote}</div>
  1319. {block:Source}<div class="source">{Source}</div>{/block:Source}
  1320. {/block:Quote}
  1321.  
  1322. {block:Chat}
  1323. {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  1324. <ul class="chat">{block:Lines}
  1325. <li>
  1326. {block:Label}<div class="chatter">{Label}</div>{/block:Label}
  1327. {Line}
  1328. </li>
  1329. {/block:Lines}</ul>
  1330. {/block:Chat}
  1331.  
  1332. {block:Answer}
  1333. <div class="ask-wrap">
  1334. <img src="{AskerPortraitURL-64}" class="ask-icon">
  1335. <div class="asking"><a href="{Permalink}">{Asker}</a> sent:</div>
  1336. <div class="question">{Question}</div>
  1337. </div>
  1338. {block:Answerer}
  1339. <div class="answer"><img src="{AnswererPortraitURL-64}" class="ask-icon"style="margin-right:9px;"><a href="{Permalink}">{Answerer}</a> replied:</div>
  1340. <div class="answer2">{Answer}</div>
  1341. {/block:Answerer}
  1342. {block:NotReblog}
  1343. <li class="caption">
  1344. {Replies}
  1345. </li>
  1346. {/block:NotReblog}
  1347. {block:RebloggedFrom}
  1348. {block:Reblogs}
  1349. <li class="caption">
  1350. <img src="{PortraitURL-64}" class="user-icon">
  1351. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1352. {Body}
  1353. </li>
  1354. {/block:Reblogs}
  1355. {/block:RebloggedFrom}
  1356. {/block:Answer}
  1357.  
  1358. {block:Audio}
  1359. <div class="audiopost">
  1360. <div class="audiobox">
  1361. <div class="button">
  1362. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1363. </div>
  1364. </div>
  1365. {block:AlbumArt}
  1366. <img src="{AlbumArtURL}" class="album-art">
  1367. {/block:AlbumArt}
  1368. <div class="audioinfo">
  1369. {block:TrackName}<li class="track">{TrackName}</li>{/block:TrackName}
  1370. {block:Artist}<li>{Artist}</li>{/block:Artist}
  1371. {block:Album}<li>{Album}</li>{/block:Album}
  1372. </div>
  1373. </div>
  1374. {block:Caption}
  1375. {block:NotReblog}
  1376. <li class="caption">
  1377. {Caption}
  1378. </li>
  1379. {/block:NotReblog}
  1380. {block:RebloggedFrom}
  1381. {block:Reblogs}
  1382. <li class="caption">
  1383. <img src="{PortraitURL-64}" class="user-icon">
  1384. <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
  1385. {Body}
  1386. </li>
  1387. {/block:Reblogs}
  1388. {/block:RebloggedFrom}
  1389. {/block:Caption}
  1390. {/block:Audio}
  1391.  
  1392. {/block:HasTags}
  1393. <!----- info ----->
  1394.  
  1395. {block:Date}
  1396. <div class="info">
  1397. <a href="{Permalink}"title="{TimeAgo}"style="padding-left:7px;margin-top:1px;">{DayOfWeek}</a>
  1398.  
  1399. <!----- buttons ----->
  1400. <div class="buttons">
  1401. {block:NoteCount}<a href="{Permalink}"title="{NoteCountWithLabel}"style="margin-top:0px;"><i class="ph-note-pencil"></i></a>{/block:NoteCount}
  1402. <a href="{ReblogURL}" target="_blank"title="reblog"style="margin-top:-4.5px;"><i class="cp cp-reblog-alt"style="font-size:11px;"></i></a>
  1403. <a class="likeb" href="#"title="like"style="margin-top:2px;">{LikeButton}<span class="actual-button"><i class="ph ph-heart"></i></span></a>
  1404. {block:ContentSource}<a href="{SourceURL}"title="source"style="margin-top:-1.4px!important;"><i class="ph-ph-export"></i></a>{/block:ContentSource}
  1405. </div>
  1406. </div>
  1407. {/block:Date}
  1408.  
  1409. <!----- tags ----->
  1410.  
  1411. {block:HasTags}
  1412. <div class="tags">
  1413. {block:Tags}
  1414. <a href="{TagURL}">{Tag}</a></li>
  1415. {/block:Tags}
  1416. </div>
  1417. {/block:HasTags}
  1418.  
  1419. <!----- notes ----->
  1420.  
  1421. {block:PermalinkPage}{block:Date}
  1422. {block:NoteCount}{block:PostNotes}
  1423. <div class="notes">
  1424. {PostNotes-64}
  1425. </div>
  1426. {/block:PostNotes}{/block:NoteCount}
  1427. {/block:Date}{/block:PermalinkPage}
  1428.  
  1429. </article>
  1430.  
  1431. {/block:Posts}
  1432.  
  1433. <!----- pagination ----->
  1434.  
  1435. {block:Pagination}
  1436. <article id="page-navigation">
  1437. {block:PreviousPage}<a href="{PreviousPage}"title="previous"><i class="ph ph-caret-double-left"></i></a>{/block:PreviousPage}
  1438. {block:NextPage}<a href="{NextPage}"title="forward"><i class="ph ph-caret-double-right"></i></a>{/block:NextPage}
  1439. </article>
  1440. {/block:Pagination}
  1441.  
  1442. </section>
  1443.  
  1444. </main>
  1445.  
  1446. <!----- tooltips ----->
  1447.  
  1448. <script src="https://unpkg.com/popper.js@1"></script>
  1449. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script>
  1450. <link rel="stylesheet" href="https://unpkg.com/tippy.js@5/dist/svg-arrow.css" />
  1451.  
  1452. <script>
  1453.  
  1454. $(document).ready(function(){
  1455.  
  1456. //Check to see if the window is top if not then display button
  1457. $(window).scroll(function(){
  1458. if ($(this).scrollTop() > 100) {
  1459. $('.scrollToTop').fadeIn();
  1460. } else {
  1461. $('.scrollToTop').fadeOut();
  1462. }
  1463. });
  1464.  
  1465. //Click event to scroll to top
  1466. $('.scrollToTop').click(function(){
  1467. $('html, body').animate({scrollTop : 0},800);
  1468. return false;
  1469. });
  1470.  
  1471. });
  1472.  
  1473.  
  1474. tippy('a[title]', {
  1475. theme: 'custom',
  1476. arrow: tippy.round,
  1477. zIndex: 9999999999,
  1478. maxWidth: 300,
  1479.  
  1480. content(reference) {
  1481. const title = reference.getAttribute('title');
  1482. reference.removeAttribute('title');
  1483. return title;
  1484. },
  1485. });
  1486. </script>
  1487.  
  1488. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  1489.  
  1490. <script>
  1491. $(document).ready(function(){
  1492. $('.controls-button').click(function(){
  1493. $('body').toggleClass('controls-click');
  1494. });
  1495. });
  1496. </script>
  1497.  
  1498. </body>
  1499. </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!