API tools faq
paste
Advertisement
likesmagic

stuck on you by @gloriapritchetts

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