API tools faq
paste
Advertisement
phantasyreign

THEME 14: MO GUAN SHAN

phantasyreign
Feb 19th, 2024
930
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 39.02 KB | None | 0 0
raw download clone embed print report
  1.  <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4.                THEME 14: MO GUAN SHAN
  5.                RELEASED DATE: 01.01.2023
  6.                THEME CREATOR: JASMIN @ https://phantasyreign.tumblr.com/
  7.                
  8.                KINDLY DO NOT REMOVE THE CREDITS! THANK YOU.
  9.                
  10.                To view the guideline, visit https://phantasyreign.tumblr.com/guideline/mo-guan-shan
  11. -->
  12. <head>
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <script src="//pull.cappuccicons.com/cpf.js"></script>
  16. <script src="//cdn.jsdelivr.net/npm/jquery@latest/dist/jquery.min.js"></script>
  17. <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/dist/svg-arrow.css"/>
  18. <!--
  19.        NPF images fix v3.0 by @glenthemes [2021]
  20.        💌 git.io/JRBt7
  21. --->
  22. <script src="//npf-images-v3.github.io/script.js"></script>
  23. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  24. <style tmblr-npf>
  25. :root {
  26.     --NPF-Caption-Spacing:1em;
  27.     --NPF-Image-Spacing:4px;
  28. }
  29. </style>
  30.  
  31. <link rel="stylesheet" media="screen" href="//assets.tumblr.com/client/prod/standalone/blog-network-npf/index.build.css">
  32.  
  33. <meta name="viewport" content="width=device-width, initial-scale=1">
  34.  
  35. <meta name="color:Background01" content="#180D1B">
  36. <meta name="color:Background02" content="#160c18">
  37. <meta name="color:Border" content="#2f2532">
  38. <meta name="color:Text" content="#FCEAEA">
  39. <meta name="color:Links" content="#e47446">
  40. <meta name="color:Italics" content="#EBC491">
  41. <meta name="color:Bold" content="#EC927A">
  42. <meta name="color:Text Selection Background" content="#e47446">
  43. <meta name="color:Text Selection" content="#180D1B">
  44.  
  45. <meta name="select:Font Body" content="Gravity">
  46. <meta name="select:Font Body" content="Open Serif">
  47. <meta name="select:Font Body" content="X360">
  48. <meta name="select:Font Body" content="vera humana" title="Vera Humana">
  49.  
  50. <meta name="select:Font Title" content="Bad Behaviour">
  51. <meta name="select:Font Title" content="Cut The Crap">
  52. <meta name="select:Font Title" content="Downcome">
  53. <meta name="select:Font Title" content="Taiganja Type">
  54.  
  55. <meta name="select:Title Bold" content="normal" title="Normal">
  56. <meta name="select:Title Bold" content="600" title="Semi-Bold">
  57. <meta name="select:Title Bold" content="700" title="Bold">
  58.  
  59. <meta name="select:Sidebar Image Size" content="Cover">
  60. <meta name="select:Sidebar Image Size" content="Contain">
  61.  
  62. <meta name="image:Sidebar" content="https://static.tumblr.com/v6akjgz/Cf8rn6yo6/03.jpg">
  63. <meta name="image:Background" content="https://static.tumblr.com/v6akjgz/mZ4rn8uwg/15.png">
  64.  
  65. <meta name="text:Icon01" content="home">
  66. <meta name="text:Icon02" content="question">
  67. <meta name="text:Icon03" content="cloud-upload">
  68. <meta name="text:Icon04" content="flower">
  69. <meta name="text:Icon05" content="\ece8">
  70. <meta name="text:Icon06" content="\eb4c">
  71.  
  72. <meta name="if:Change Sidebar Position" content="1">
  73. <meta name="if:Enable Background Line" content="1">
  74. <meta name="if:Enable Background Repeat" content="0">
  75.  
  76. <style type="text/css">
  77. /*GENERAL STYLING*/
  78. *{
  79.     margin:0;
  80.     padding:0;
  81.     box-sizing:border-box;
  82.     scroll-behavior:smooth;
  83. }
  84.  
  85. body{
  86.     background-color:{color:Background01};
  87.     line-height:1.5;
  88.     font-family:{select:Font Body};
  89.     color:{color:text};
  90. }
  91.  
  92. /*TEXT SELECTION*/
  93. ::selection{
  94.     background:{color:Text selection background};
  95.     color:{color:text selection};
  96. }
  97.  
  98. /*SCROLL BAR*/
  99. ::-webkit-scrollbar{
  100.     height:8px;
  101.     width:8px;
  102. }
  103.  
  104. ::-webkit-scrollbar-track{
  105.     background:{color:text};
  106.     border:3px solid {color:background01};
  107. }
  108.  
  109. ::-webkit-scrollbar-thumb{
  110.     background:{color:links};
  111.     border:3px solid {color:background01};
  112. }
  113.  
  114. /*FONTS*/
  115. h2, h3, h4, h5, h6, pre, p, blockquote, ol, ul, .post-wrapper img{
  116.     margin-bottom:1rem;
  117. }
  118.  
  119. h2{
  120.     font-family:{select:Font Title};
  121.     font-weight:{select:Title Bold};
  122. }
  123.  
  124. h2 a, .post-wrapper a{
  125.     color:{color:links};
  126.     text-decoration:none;
  127. }
  128.  
  129. h2 a:hover, .post-wrapper a:hover{
  130.     color:white;
  131.     text-shadow:0 0 5px {color:links},
  132.     0 0 10px {color:links};
  133. }
  134.  
  135. ol li, ul li{
  136.     margin-left:1rem;
  137.     margin-bottom:.5rem;
  138. }
  139.  
  140. pre{
  141.     border:1px dashed {color:border};
  142.     padding:.5rem .75rem;
  143.     word-break:break-all;
  144.     white-space:pre-wrap;
  145. }
  146.  
  147. blockquote{
  148.     padding:1rem;
  149.     border-inline-start:2px solid;
  150.     border-image-source:linear-gradient({color:links}, transparent);
  151.     border-image-slice:1;
  152.     margin-left:1rem;
  153. }
  154.  
  155. p i{
  156.     color:{color:Italics};
  157. }
  158.  
  159. b, strong{
  160.     color:{color:Bold};
  161. }
  162.  
  163. @font-face { font-family:'gravity'; src: url(https://static.tumblr.com/v6akjgz/Y1nrilsbm/gravity-regular.otf); }
  164. @font-face { font-family:'x360'; src: url(https://static.tumblr.com/v6akjgz/LNtriltlt/x360.ttf); }
  165. @font-face { font-family:'open serif'; src: url(https://static.tumblr.com/v6akjgz/KfBrilt4y/openserif-book.ttf); }
  166. @font-face { font-family:'vera humana'; src: url(https://static.tumblr.com/v6akjgz/svKriltgu/verah___.ttf); }
  167.  
  168. @font-face { font-family:bad behaviour; src: url(https://static.tumblr.com/v6akjgz/bPDqf9uai/bad_behaviour.ttf); }
  169. @font-face { font-family:'cut the crap'; src: url(https://static.tumblr.com/v6akjgz/HkPqoirk5/cut_the_crap.ttf); }
  170. @font-face { font-family:'downcome'; src: url(https://static.tumblr.com/v6akjgz/mQyqoirya/downcome.ttf); }
  171. @font-face { font-family:'taiganja type'; src: url(https://static.tumblr.com/v6akjgz/I5Crinvs4/taiganja_type.ttf); }
  172.  
  173. @font-face { font-family:'barkode'; src: url(https://static.tumblr.com/v6akjgz/2ehringa5/barkode.ttf); }
  174.  
  175. /*BACKGROUND 02*/
  176. .background02{
  177.     width:100%;
  178.     height:34.9vh;
  179.     position:fixed;
  180.     bottom:0;
  181.     {block:ifenablebackgroundline}
  182.     border-top:1px solid {color:border};
  183.     {/block:ifenablebackgroundline}
  184.     z-index:-1;
  185.    
  186.     {block:ifEnableBackgroundRepeat}
  187.     background-image:url('{image:Background}');
  188.     {/block:ifEnableBackgroundRepeat}
  189.     {block:ifNotEnableBackgroundRepeat}
  190.     background: url({image:Background}) no-repeat center center fixed;
  191.     background-size:cover;
  192.     {/block:ifNotEnableBackgroundRepeat}
  193.     background-color:{color:background02};
  194. }
  195.  
  196. /*MAIN GENERAL*/
  197. main{
  198.     display:flex;
  199. }
  200.  
  201. .post-section{
  202.     width:40%;
  203. }
  204.  
  205.  
  206. /*RIGHT SIDEBAR*/
  207. .right-sidebar-wrapper{
  208.     height:50%;
  209.     width:25%;
  210.     padding:0 .5rem;
  211.     position:sticky;
  212.     top:25vh;
  213.     margin:6rem auto;
  214. }
  215.  
  216. .right-sidebar-wrapper img, .left-sidebar-wrapper img{
  217.     width:100%;
  218.     height:50vh;
  219.     object-fit:{select:Sidebar Image Size};
  220.     border-radius:10px 10px 0 0;
  221. }
  222.  
  223. /*BASIC LINKS*/
  224. .basic-links{
  225.     background:{color:background02};
  226.     border:1px dashed {color:border};
  227.     border-radius:10px;
  228.     padding:.25rem .5rem;
  229.     margin-top:1rem;
  230.     display:flex;
  231.     justify-content:space-evenly;
  232. }
  233.  
  234. .basic-links a{
  235.     color:{color:links};
  236.     text-decoration:none;
  237. }
  238.  
  239. .basic-links a:hover{
  240.     color:white;
  241.     text-shadow:0 0 5px {color:links},
  242.     0 0 10px {color:links};
  243. }
  244.  
  245. .basic-links a{
  246.     display:none;
  247. }
  248.  
  249. .basic-links a:nth-of-type(1), .basic-links a:nth-of-type(2), .basic-links a:nth-of-type(3), .basic-links a:nth-of-type(4), .basic-links a:nth-of-type(5), .basic-links a:nth-of-type(6){
  250.     display:block;
  251. }
  252.  
  253. .basic-links a:nth-of-type(5)::before, .basic-links a:nth-of-type(6)::before{
  254.     font-family:'cappuccicons';
  255. }
  256.  
  257. .basic-links a:nth-of-type(5)::before{
  258.     content:'{text:Icon05}';
  259. }
  260.  
  261. .basic-links a:nth-of-type(6)::before{
  262.     content:'{text:Icon06}';
  263. }
  264.  
  265. /*LEFT SIDEBAR GENERAL*/
  266. .left-sidebar-wrapper{
  267.     height:50%;
  268.     width:25%;
  269.     padding:0 .5rem;
  270.     position:sticky;
  271.     top:25vh;
  272.     margin:5rem auto;
  273. }
  274.  
  275. .blog-title, .description, .searchbar{
  276.     border:1px dashed {color:border};
  277.     padding:.5rem;
  278.     background:{color:background01};
  279.     margin-bottom:.25rem;
  280. }
  281.  
  282. .description{
  283.     font-size:.9rem;
  284.     max-height:30vh;
  285.     overflow:auto;
  286. }
  287.  
  288. .description p{
  289.     padding:.5rem 1rem;
  290. }
  291.  
  292. /*BLOG TITLE*/
  293. .blog-title h1 a{
  294.     color:{color:links};
  295.     text-decoration:none;
  296.     font-family:{select:Font Title};
  297.     font-weight:{select:Title Bold};
  298.     padding:.5rem 1rem;
  299. }
  300.  
  301. .blog-title h1 a:hover{
  302.     color:white;
  303.     text-shadow:0 0 5px {color:links},
  304.     0 0 10px {color:links};
  305. }
  306.  
  307. /*LINKS*/
  308. .links-border{
  309.     border:1px dashed {color:border};
  310.     margin:1rem 0;
  311. }
  312.  
  313. .links{
  314.     display:flex;
  315.     justify-content:space-evenly;
  316.     flex-flow:row wrap;
  317.     gap:.5rem;
  318. }
  319.  
  320. .links a{
  321.     color:{color:links};
  322.     text-decoration:none;
  323.     text-transform:capitalize;
  324. }
  325.  
  326. .links a:nth-of-type(1), .links a:nth-of-type(2){
  327.     display:none;
  328. }
  329.  
  330. .links a:hover{
  331.     color:white;
  332.     text-shadow:0 0 5px {color:links},
  333.     0 0 10px {color:links};
  334. }
  335.  
  336. /*SEARCH BAR*/
  337. .searchbar{
  338.     padding:0;
  339. }
  340.  
  341. .searchbar form{
  342.     display:flex;
  343. }
  344.  
  345. .searchbar input[type^="text"]{
  346.     width:100%;
  347.     border:0;
  348.     background-color:{color:background01};
  349.     font-family:{select:font body};
  350.     padding:.5rem .75rem;
  351. }
  352.  
  353. .searchbar input[type^="text"]::placeholder, input:not(:focus){
  354.     color:rgba({RGBcolor:text}, .8);
  355. }
  356.  
  357. .searchbar input[type^="text"]:focus{
  358.     outline:1px solid {color:links};
  359.     color:{color:text};
  360. }
  361.  
  362. /*POST SECTION*/
  363. .post-wrapper{
  364.     width:90%;
  365.     margin:5rem auto;
  366. }
  367.  
  368. /*TIMESTAMP REBLOG LIKE*/
  369. .timestamp-like-reblog{
  370.     display: flex;
  371.     justify-content:space-between;
  372.     align-items:center;
  373.     margin-bottom:1rem;
  374.     font-size:.9rem;
  375. }
  376.  
  377. .timestamp .cp{
  378.     margin-right:.5rem;
  379. }
  380.  
  381. .like-b {
  382.   position:relative;
  383.   display:inline-block;
  384.   height:1em;
  385.   line-height:1em;
  386.   overflow:hidden;
  387.   margin-bottom:-2.5px;
  388. }
  389. .like-b .like_button iframe {
  390.    position:absolute;
  391.    top:0;
  392.    left:0;
  393.    bottom:0;
  394.    right:0;
  395.    z-index:2;
  396.    opacity:0;
  397. }
  398. .like-b .liked + .b {
  399.   color:inherit;
  400. }
  401. .like-b .liked + .b:after {
  402.    content:'d';
  403. }
  404.  
  405. .like-reblog a{
  406.     margin-right:.5rem;
  407. }
  408.  
  409. /*POST INFORMATION*/
  410. .post-information{
  411.     font-size:.9rem;
  412.     padding:1rem 0;
  413.     border-block:2px solid;
  414.     border-image-source:radial-gradient(circle at center, {color:links}, transparent);
  415.     border-image-slice:1;
  416. }
  417.  
  418. .time-clock, .permalink-source, .pinned-post{
  419.     padding-bottom:.5rem;
  420. }
  421.  
  422. .permalink-source{
  423.     display:flex;
  424.     justify-content:space-between;
  425.     flex-flow:row wrap;
  426.     padding-top:.25rem;
  427. }
  428.  
  429. .tags .cp{
  430.     font-size:.7rem;
  431. }
  432.  
  433. /*UNNEST CAPTION*/
  434. .unnest-caption{
  435.     display:flex;
  436.     align-items:center;
  437.     gap:.5rem;
  438.     margin:1rem 0;
  439. }
  440.  
  441. .unnest-caption .cp{
  442.     font-size:.27rem;
  443.     color:white;
  444.     text-shadow:0 0 5px {color:links},
  445.     0 0 10px {color:links};
  446.     margin-bottom:1rem;
  447. }
  448.  
  449. .deactivated{
  450.     color:rgba({RGBcolor:Text}, .7);
  451. }
  452.  
  453. .deactivated:hover{
  454.     cursor:help;
  455. }
  456.  
  457. /*AUDIO POSTS*/
  458. .audio-post{
  459.     margin-bottom:1rem;
  460. }
  461.  
  462. .audio-post iframe{
  463.     height:80px!important;
  464.     width:100%;
  465. }
  466.  
  467. /*VIDEO POSTS*/
  468. .video-post iframe, .tumblr_video_container{
  469.     width:100%!important;
  470. }
  471.  
  472. .video-post{
  473.     margin-bottom:1rem;
  474. }
  475.  
  476. /*PHOTO POSTS*/
  477. .post-wrapper img{
  478.     width:100%;
  479. }
  480.  
  481.  
  482. /*PHOTOSET POSTS*/
  483. .photoset-post, .npf_inst{
  484.     margin-bottom:1rem;
  485. }
  486.  
  487. .post_media_photo .image{
  488.     background:red;
  489.     object-fit:cover;
  490. }
  491.  
  492. .npf_inst{
  493.     width:100%;
  494. }
  495.  
  496. .tmblr-full{
  497.     border-radius:10px;
  498. }
  499.  
  500. /*QUOTE POST*/
  501. .quote-post, .source-quote{
  502.     text-align:center;
  503.     margin-bottom:1rem;
  504. }
  505.  
  506. .quote-post h2::before{
  507.     content:'❝';
  508.     color:{color:links};
  509. }
  510.  
  511. .quote-post h2::after{
  512.     content:'❞';
  513.     color:{color:links};
  514. }
  515.  
  516. /*LINK POSTS*/
  517. .link-post-wrapper{
  518.     border:1px dashed {color:border};
  519.     display:flex;
  520.     flex-flow:column wrap;
  521.     margin-bottom:1rem;
  522. }
  523.  
  524. .link-post{
  525.     display:flex;
  526.     border-bottom:1px dashed {color:border};
  527.     width:100%;
  528. }
  529.  
  530. .link-post-text{
  531.     width:20%;
  532.     writing-mode: vertical-rl;
  533.     rotate:180deg;
  534.     display:flex;
  535.     justify-content:center;
  536.     align-items:center;
  537.     gap:.5rem;
  538.     margin-right:1rem;
  539.     padding:.5rem 0;
  540.     color:{color:text};
  541.     border-left:1px dashed {color:border};
  542.     background:{color:background01};
  543.     font-family:barkode;
  544. }
  545.  
  546. .link-post-content{
  547.     padding:.5rem;
  548. }
  549.  
  550. .link-post-content span:first-child{
  551.     text-transform:uppercase;
  552.     font-size:.9rem;
  553.     display:block;
  554.     word-break:break-all;
  555. }
  556.  
  557. .link-post-content span:last-child{
  558.     font-size:.8rem;
  559.     word-break:break-all;
  560. }
  561.  
  562. .excerpt{
  563.     padding:.5rem 1rem;
  564.     width:100%;
  565.     display: -webkit-box;
  566.     -webkit-box-orient: vertical;
  567.     -webkit-line-clamp: 2;
  568.     overflow: hidden;
  569.     font-size:.8rem;
  570.     color:{color:text};
  571. }
  572.  
  573. .link-post-text:hover{
  574.     font-family:{select:font body};
  575. }
  576.  
  577. .link-post-wrapper a:hover{
  578.     text-shadow:none;
  579. }
  580.  
  581. /*ASK POSTS*/
  582. .ask-wrapper, .answer-wrapper{
  583.     display:flex;
  584.     align-items:center;
  585.     gap:1.5rem;
  586. }
  587.  
  588. .ask-wrapper img, .answer-wrapper img{
  589.     width:64px;
  590.     height:64px;
  591.     margin:auto 0;
  592.     border-radius:50%;
  593.     border:2px dashed {color:border};
  594.     padding:.5rem;
  595. }
  596.  
  597. .question, .answer{
  598.     width:100%;
  599.     position: relative;
  600.     background: {color:background01};
  601.     border-radius: .4em;
  602.     padding:.5rem 1rem;
  603.     border:2px dashed {color:border};
  604.     margin-bottom:1rem;
  605. }
  606.  
  607. .question::after {
  608.     content: '';
  609.     position: absolute;
  610.     left: 0;
  611.     top: 50%;
  612.     width: 0;
  613.     height: 0;
  614.     border: 20px solid transparent;
  615.     border-right-color: {color:border};
  616.     border-left: 0;
  617.     border-bottom: 0;
  618.     margin-top: -10px;
  619.     margin-left: -20px;
  620. }
  621.  
  622. .answer::after {
  623.     content: '';
  624.     position: absolute;
  625.     right: 0;
  626.     top: 50%;
  627.     width: 0;
  628.     height: 0;
  629.     border: 20px solid transparent;
  630.     border-left-color: {color:border};
  631.     border-right: 0;
  632.     border-bottom: 0;
  633.     margin-top: -10px;
  634.     margin-right: -20px;
  635. }
  636.  
  637. .answer p{
  638.     display:block;
  639. }
  640.  
  641. .answer img{
  642.     border-radius:10px;
  643. }
  644.  
  645. /*PAGINATION*/
  646. .pagination{
  647.     display:flex;
  648.     justify-content:space-between;
  649.     align-items:center;
  650.     margin-bottom:3rem;
  651.     border-block:2px double;
  652.     border-image-source:radial-gradient(circle at center, {color:links}, transparent);
  653.     border-image-slice:1;
  654.     padding:.5rem 0;
  655. }
  656.  
  657. .pagination a{
  658.     text-decoration:none;
  659.     padding:.25rem 0.5rem;
  660.     font-size:0.9rem;
  661.     color:{color:links};
  662. }
  663.  
  664. .pagination a:hover{
  665.     color:white;
  666.     text-shadow:0 0 5px {color:links},
  667.     0 0 10px {color:links};
  668. }
  669.  
  670. .current-page{
  671.     font-size:1.3rem;
  672.     cursor:default;
  673. }
  674.  
  675. /*SCROLL TO TOP*/
  676. .scroll-to-top a{
  677.     text-decoration:none;
  678.     color:{color:links};
  679.     padding:.5rem;
  680.     border-radius:10px;
  681.     border:1px dashed {color:border};
  682.     position:fixed;
  683.     bottom:20px;
  684.     right:20px;
  685.     transition:.25s;
  686. }
  687.  
  688. .scroll-to-top a:hover{
  689.     border:1px solid transparent;
  690.     color:white;
  691.     text-shadow:0 0 5px {color:links},
  692.     0 0 10px {color:links};
  693.     transform:scale(1.1);
  694. }
  695.  
  696. /*POST NOTES*/
  697. .notes-box ol{
  698.     margin-top:1rem;
  699.     padding:0;
  700.     list-style-type:none;
  701. }
  702.  
  703. .notes-box{
  704.     font-size:.8rem;
  705. }
  706.  
  707. .notes-box li{
  708.     display:flex;
  709.     flex-wrap:wrap;
  710.     align-items:center;
  711.     gap:.4rem;
  712.     margin:.5rem 0;
  713.     position: relative;
  714. }
  715.  
  716. .notes-box img {
  717.      width: 32px !important;
  718.      height: 32px !important;
  719.      border-radius: 100%;
  720.      object-fit: cover;
  721.      max-width: initial;
  722. }
  723.  
  724. li.note.like::after,
  725. li.note.reblog::after {
  726.    content: '';
  727.    background-image: url(https://static.tumblr.com/v6akjgz/MLbrncia4/like.png);
  728.    position: absolute;
  729.    width: 16px;
  730.    height:16px;
  731.    background-size: cover;
  732.    box-sizing: border-box;
  733.    bottom: 15px;
  734.    left: 20px;
  735. }
  736.  
  737. li.note.reblog::after {
  738.    background-image: url(https://static.tumblr.com/v6akjgz/B1arnciad/rb.png);
  739. }
  740.  
  741. /*KEEP READING*/
  742. .keep-reading{
  743.     text-align:center;
  744.     margin:1rem 0;
  745. }
  746.  
  747. /*TOOLTIPS*/
  748. .tippy-box[data-theme~='theme'] {
  749.     background-color: {color:Text Selection background};
  750.     color: {color:Text Selection};
  751. }
  752.  
  753. .tippy-box[data-theme~='theme'] > .tippy-svg-arrow {
  754.     fill: {color:Text Selection background};
  755. }
  756.  
  757. /*SEARCH AND TAG RESULTS*/
  758. .results{
  759.     margin:2rem auto;
  760.     padding:1rem;
  761.     border:2px solid {color:links};
  762. }
  763.  
  764. .results h2{
  765.     margin:0;
  766.     text-align:center;
  767. }
  768.  
  769. .no-result{
  770.     margin-top:5rem;
  771. }
  772.  
  773. /*THINGS NOT TO BE DISPLAYED*/
  774. header{
  775.     display:none;
  776. }
  777.  
  778. /*RESPONSIVES*/
  779. @media screen and (max-width:1024px){
  780.     .left-sidebar-wrapper, .right-sidebar-wrapper{
  781.         display:none;
  782.     }
  783.    
  784.     .post-section{
  785.         width:98%;
  786.         margin:0 auto;
  787.     }
  788.    
  789.     .scroll-to-top a{
  790.         right:5px;
  791.         background:{color:background01};
  792.     }
  793.    
  794.     header{
  795.         width:100%;
  796.         border-bottom:1px solid {color:border};
  797.         display:block;
  798.         padding-bottom:1rem;
  799.     }
  800.    
  801.     header h1{
  802.         font-family:{select:Font Title};
  803.         font-weight:{select:Title Bold};
  804.     }
  805.    
  806.     header img{
  807.         width:100%;
  808.         height:150px;
  809.         object-fit:cover;
  810.     }
  811.    
  812.     .title-description{
  813.         padding:.5rem 1rem;
  814.         max-height:200px;
  815.         overflow:auto;
  816.     }
  817.    
  818.     .mobile-links{
  819.         display:flex;
  820.         justify-content:space-evenly;
  821.         flex-flow:row wrap;
  822.         gap:.5rem;
  823.     }
  824.    
  825.     .mobile-links a{
  826.         color:{color:links};
  827.         text-decoration:none;
  828.         text-transform:capitalize;
  829.     }
  830. }
  831.  
  832. </style>
  833. </head>
  834. <body>
  835. <!--BACKGROUND--->
  836. <div class="background02"></div>
  837.  
  838. <!---SCROLL TO TOP ANCHOR-->
  839. <div id="top"></div>
  840.  
  841. <header>
  842.     <img src="{image:Sidebar}">
  843.     <div class="title-description">
  844.         <h1>
  845.             {Title}
  846.         </h1>
  847.         <p>{Description}
  848.        
  849.         <hr class="links-border">
  850.        
  851.         <nav class="mobile-links">
  852.             <a href="/">Home</a>
  853.             {block:AskEnabled}
  854.             <a href="/ask">{AskLabel}</a>
  855.             {/block:AskEnabled}
  856.             {block:SubmissionsEnabled}
  857.             <a href="/submit">{SubmitLabel}</a>
  858.             {/block:SubmissionsEnabled}
  859.             <a href="https://phantasyreign.tumblr.com/">Theme by Jasmin</a>
  860.         {block:HasPages}
  861.             {block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}
  862.         {/block:HasPages}
  863.         </nav>
  864.     </div>
  865. </header>
  866.  
  867. <!---MAIN SECTION-->
  868. <main>
  869.     <!---LEFT SIDEBAR-->
  870.     <section class="left-sidebar-wrapper">
  871.         {block:ifNotChangeSidebarPosition}
  872.         <!--BLOG TITLE--->
  873.         <div class="blog-title">
  874.             <h1>
  875.                 <a href="/">
  876.                     {Title}
  877.                 </a>
  878.             </h1>
  879.         </div>
  880.        
  881.         <!---DESCRIPTION-->
  882.         <div class="description">
  883.         {block:Description}
  884.             <p>{Description}
  885.            
  886.             <hr class="links-border">
  887.         {/block:Description}
  888.        
  889.         <!---LINKS-->
  890.         {block:HasPages}
  891.         <nav class="links">
  892.             {block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}
  893.         </nav>
  894.         {/block:HasPages}
  895.         </div>
  896.        
  897.         <!---SEARCH BAR-->
  898.         <div class="searchbar">
  899.             <form action="/search" method="get">
  900.                 <input type="text" name="q" value="{SearchQuery}" autocomplete="off" placeholder="Search..."/>
  901.             </form>
  902.         </div>
  903.         {/block:ifNotChangeSidebarPosition}
  904.        
  905.        
  906.         <!---CHANGES SIDEBAR-->
  907.         {block:ifChangeSidebarPosition}
  908.         <!--SIDEBAR IMAGE--->
  909.             <img src="{image:Sidebar}">
  910.        
  911.         <!--BASIC LINKS-->
  912.         <nav class="basic-links">
  913.             <a href="/" title="Home">
  914.                 <i class="cp cp-{text:Icon01}"></i>
  915.             </a>
  916.            
  917.             {block:AskEnabled}
  918.             <a href="/ask" title="{AskLabel}">
  919.                 <i class="cp cp-{text:Icon02}"></i>
  920.             </a>
  921.             {/block:AskEnabled}
  922.            
  923.             {block:SubmissionsEnabled}
  924.             <a href="/submit" title="{SubmitLabel}">
  925.                 <i class="cp cp-{text:Icon03}"></i>
  926.             </a>
  927.             {/block:SubmissionsEnabled}
  928.            
  929.             <a href="https://phantasyreign.tumblr.com/" title="Theme by Jasmin">
  930.                 <i class="cp cp-{text:Icon04}"></i>
  931.             </a>
  932.            
  933.             {block:HasPages}{block:Pages}<a href="{URL}" title="{Label}"></a>{/block:Pages}{/block:HasPages}
  934.            
  935.             </a>
  936.         </nav>
  937.         {/block:ifChangeSidebarPosition}
  938.     </section>
  939.    
  940.     <!--POSTS SECTION-->
  941.     <section class="post-section">
  942.    
  943.     <!--RESULTS: DAY PAGE-->
  944.         {block:DayPage}
  945.         <div class="results">
  946.            <h2>
  947.                Posts on {Month} {DayOfMonth}, {Year}
  948.            </h2>
  949.        </div>
  950.        {/block:DayPage}
  951.        
  952.        <!--RESULTS: TAG PAGE-->
  953.        {block:TagPage}
  954.        <div class="results">
  955.            <h2>
  956.                Posts on {Month} {DayOfMonth}, {Year}
  957.            </h2>
  958.        </div>
  959.        {/block:TagPage}
  960.        
  961.        <!--RESULTS: SEARCH PAGE-->
  962.        {block:SearchPage}
  963.        <div class="results">
  964.            <h2>
  965.                {lang:SearchResultCount results for SearchQuery}
  966.            </h2>
  967.            
  968.            {block:NoSearchResults}
  969.            <h2>
  970.                {lang:Sorry no search results found}
  971.            </h2>
  972.            {block:NoSearchResults}
  973.        </div>
  974.        {/block:SearchPage}
  975.        
  976.         <!---POSTS-->
  977.        {block:posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  978.        <div class="post-wrapper" id="{PostID}" post-type="{PostType}">
  979.        
  980.        <!--TIMESTAMP REBLOG AND LIKE BUTTONS-->
  981.        {block:Date}
  982.        <div class="timestamp-like-reblog">
  983.        
  984.         <!--TIMESTAMP-->
  985.           <div class="timestamp">
  986.                <i class="cp cp-user"></i> {lang:Posted at FormattedTime}
  987.           </div>
  988.          
  989.           <!--LIKE REBLOG BUTTON-->
  990.           <div class="like-reblog">
  991.               <a href="{ReblogURL}">Reblog</a>
  992.              
  993.               <a class="like-b" href="#">{LikeButton}<span class="b">Like</span></a>
  994.           </div>
  995.        </div>
  996.        {/block:Date}
  997.        
  998.        <!--TEXT POSTS-->
  999.            {block:Text}
  1000.            {block:Title}
  1001.                 <h2>
  1002.                     <a href="{Permalink}">
  1003.                         {Title}
  1004.                     </a>
  1005.                 </h2>
  1006.            {/block:Title}
  1007.            
  1008.            {block:NotReblog}
  1009.            {Body}
  1010.            {/block:NotReblog}
  1011.            
  1012.            {block:RebloggedFrom}
  1013.                 {block:Reblogs}
  1014.                     <div class="unnest-caption source-head">
  1015.                         {block:IsActive}
  1016.                             {block:HasPermalink}
  1017.                                 <a href="{Permalink}" target="_blank">
  1018.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1019.                                 </a>
  1020.                         {/block:HasPermalink}
  1021.                         {/block:IsActive}
  1022.                        
  1023.                         {block:IsDeactivated}
  1024.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1025.                         {/block:IsDeactivated}
  1026.                     </div>
  1027.                     {Body}
  1028.                 {/block:Reblogs}
  1029.            {/block:RebloggedFrom}
  1030.            {/block:Text}
  1031.            
  1032.            <!--AUDIO POSTS-->
  1033.            {block:Audio}
  1034.            <div class="audio-post">
  1035.                {AudioEmbed}
  1036.            </div>
  1037.            
  1038.            {block:Caption}
  1039.            {block:NotReblog}
  1040.            {Caption}
  1041.            {/block:NotReblog}
  1042.            
  1043.            {block:RebloggedFrom}
  1044.                 {block:Reblogs}
  1045.                     <div class="unnest-caption source-head">
  1046.                         {block:IsActive}
  1047.                             {block:HasPermalink}
  1048.                                 <a href="{Permalink}" target="_blank">
  1049.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1050.                                 </a>
  1051.                         {/block:HasPermalink}
  1052.                         {/block:IsActive}
  1053.                        
  1054.                         {block:IsDeactivated}
  1055.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1056.                         {/block:IsDeactivated}
  1057.                     </div>
  1058.                     {Body}
  1059.                 {/block:Reblogs}
  1060.            {/block:RebloggedFrom}
  1061.            {/block:Caption}
  1062.            {/block:Audio}
  1063.            
  1064.            <!--VIDEO POSTS-->
  1065.            {block:Video}
  1066.            <div class="video-post">
  1067.                {Video-500}
  1068.            </div>
  1069.            
  1070.            {block:Caption}
  1071.            {block:NotReblog}
  1072.            {Caption}
  1073.            {/block:NotReblog}
  1074.            
  1075.            {block:RebloggedFrom}
  1076.                 {block:Reblogs}
  1077.                     <div class="unnest-caption source-head">
  1078.                         {block:IsActive}
  1079.                             {block:HasPermalink}
  1080.                                 <a href="{Permalink}" target="_blank">
  1081.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1082.                                 </a>
  1083.                         {/block:HasPermalink}
  1084.                         {/block:IsActive}
  1085.                        
  1086.                         {block:IsDeactivated}
  1087.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1088.                         {/block:IsDeactivated}
  1089.                     </div>
  1090.                     {Body}
  1091.                 {/block:Reblogs}
  1092.            {/block:RebloggedFrom}
  1093.            {/block:Caption}
  1094.            {/block:Video}
  1095.            
  1096.            <!--PHOTO POSTS-->
  1097.            {block:Photo}
  1098.            <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">
  1099.     <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}">
  1100. </a>
  1101.             {block:NotReblog}
  1102.            {Caption}
  1103.            {/block:NotReblog}
  1104.            
  1105.            {block:RebloggedFrom}
  1106.                 {block:Reblogs}
  1107.                     <div class="unnest-caption source-head">
  1108.                         {block:IsActive}
  1109.                             {block:HasPermalink}
  1110.                                 <a href="{Permalink}" target="_blank">
  1111.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1112.                                 </a>
  1113.                         {/block:HasPermalink}
  1114.                         {/block:IsActive}
  1115.                        
  1116.                         {block:IsDeactivated}
  1117.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1118.                         {/block:IsDeactivated}
  1119.                     </div>
  1120.                     {Body}
  1121.                 {/block:Reblogs}
  1122.            {/block:RebloggedFrom}
  1123.            {/block:Caption}
  1124.            {/block:Photo}
  1125.            
  1126.            <!--PHOTOSET POSTS-->
  1127.            {block:Photoset}
  1128.            <div class="photoset-post">
  1129.                {Photoset}
  1130.            </div>
  1131.            
  1132.            {block:NotReblog}
  1133.            {Caption}
  1134.            {/block:NotReblog}
  1135.            
  1136.            {block:RebloggedFrom}
  1137.                 {block:Reblogs}
  1138.                     <div class="unnest-caption source-head">
  1139.                         {block:IsActive}
  1140.                             {block:HasPermalink}
  1141.                                 <a href="{Permalink}" target="_blank">
  1142.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1143.                                 </a>
  1144.                         {/block:HasPermalink}
  1145.                         {/block:IsActive}
  1146.                        
  1147.                         {block:IsDeactivated}
  1148.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1149.                         {/block:IsDeactivated}
  1150.                     </div>
  1151.                     {Body}
  1152.                 {/block:Reblogs}
  1153.            {/block:RebloggedFrom}
  1154.            {/block:Caption}
  1155.            {/block:Photoset}
  1156.            
  1157.            <!--QUOTE POSTS-->
  1158.            {block:Quote}
  1159.            <div class="quote-post">
  1160.                <h2>
  1161.                    {Quote}
  1162.                </h2>
  1163.            </div>
  1164.            {block:Source}
  1165.            <div class="source-quote">
  1166.                {Source}
  1167.            </div>
  1168.            {/block:Source}
  1169.            {/block:Quote}
  1170.            
  1171.            <!--LINK POSTS-->
  1172.            {block:Link}
  1173.            <div class="link-post-wrapper">
  1174.                    <a href="{URL}" target="_blank">
  1175.                        <div class="link-post">
  1176.                            <div class="link-post-text">
  1177.                                Link
  1178.                            </div>
  1179.                            <div class="link-post-content">
  1180.                                <span>{Name}</span>
  1181.                                {block:Host} <span>{Host}</span>{/block:Host}
  1182.                            </div>
  1183.                         </div>
  1184.                        {block:Excerpt}
  1185.                        <div class="excerpt">
  1186.                            {Excerpt}
  1187.                        </div>
  1188.                        {/block:Excerpt}
  1189.                    </a>
  1190.            </div>
  1191.            
  1192.            {block:Description}
  1193.             {block:NotReblog}
  1194.            {Description}
  1195.            {/block:NotReblog}
  1196.            
  1197.            {block:RebloggedFrom}
  1198.                 {block:Reblogs}
  1199.                     <div class="unnest-caption source-head">
  1200.                         {block:IsActive}
  1201.                             {block:HasPermalink}
  1202.                                 <a href="{Permalink}" target="_blank">
  1203.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1204.                                 </a>
  1205.                         {/block:HasPermalink}
  1206.                         {/block:IsActive}
  1207.                        
  1208.                         {block:IsDeactivated}
  1209.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1210.                         {/block:IsDeactivated}
  1211.                     </div>
  1212.                     {Body}
  1213.                 {/block:Reblogs}
  1214.            {/block:RebloggedFrom}
  1215.            {/block:Description}
  1216.            {/block:Link}
  1217.            
  1218.            <!--CHAT POSTS-->
  1219.            {block:Chat}
  1220.                {block:Title}
  1221.                <h2>
  1222.                    <a href="{Permalink}">
  1223.                        {Title}
  1224.                    </a>
  1225.                </h2>
  1226.                {/block:Title}
  1227.                {block:Lines}
  1228.                     <p>{block:Label}<b>{Label}</b>{/block:Label} {Line}
  1229.                {/block:Lines}
  1230.            {/block:Chat}
  1231.            
  1232.            
  1233.            <!--ASK POSTS-->
  1234.            {block:Answer}
  1235.                <div class="ask-wrapper">
  1236.                     <img src="{AskerPortraitURL-128}">
  1237.                     <div class="question">{Asker} sent a message:
  1238.                         <p>{Question}
  1239.                     </div>
  1240.                </div>
  1241.                
  1242.               {block:NotReblog}
  1243.               <p>{Answer}
  1244.               {/block:NotReblog}
  1245.                
  1246.               {block:RebloggedFrom}
  1247.                   {block:Answerer}
  1248.                     <div class="answer-wrapper">
  1249.                         <div class="answer">
  1250.                             {Answerer} responded:
  1251.                             <p>{Answer}
  1252.                         </div>
  1253.                         <img src="{AnswererPortraitURL-128}">
  1254.                     </div>
  1255.                   {/block:Answerer}
  1256.                   {block:Reblogs}
  1257.                     <div class="unnest-caption source-head">
  1258.                         {block:IsActive}
  1259.                             {block:HasPermalink}
  1260.                                 <a href="{Permalink}" target="_blank">
  1261.                                     <i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i>
  1262.                                 </a>
  1263.                         {/block:HasPermalink}
  1264.                         {/block:IsActive}
  1265.                        
  1266.                         {block:IsDeactivated}
  1267.                             <span class="deactivated" title="Deactivated"><i class="cp cp-circle"></i> {Username} <i class="cp cp-circle"></i></span>
  1268.                         {/block:IsDeactivated}
  1269.                     </div>
  1270.                     {Body}
  1271.                 {/block:Reblogs}
  1272.               {/block:RebloggedFrom}
  1273.            {/block:Answer}
  1274.            
  1275.            <!--KEEP READING-->
  1276.            {block:More}
  1277.                 <div class="keep-reading">
  1278.                     <a href="{Permalink}">Keep Reading</a>
  1279.                 </div>
  1280.            {/block:More}
  1281.            
  1282.            {block:Date}
  1283.            <!--POST INFORMATION-->
  1284.            <div class="post-information">
  1285.                 <!--PINNED POST-->
  1286.                 {block:PinnedPostLabel}
  1287.                 <div class="pinned-post">
  1288.                    <i class="cp cp-pin"></i> {PinnedPostLabel}
  1289.                 </div>
  1290.                 {/block:PinnedPostLabel}
  1291.                
  1292.                 <!--TIMESTAMP DATE-->
  1293.                <div class="time-notes">
  1294.                    <i class="cp cp-clock"></i> {lang:Posted on Month DayOfMonth Year with NoteCount notes 2}
  1295.                </div>
  1296.                
  1297.                <!--PERMALINK AND SOURCE-->
  1298.                {block:IndexPage}
  1299.                <div class="permalink-source">
  1300.                    <span>
  1301.                        <i class="cp cp-infinity"></i> <a href="{Permalink}">View Permalink</a>
  1302.                    </span>
  1303.                    {block:ContentSource}
  1304.                    <span>
  1305.                        <i class="cp cp-exit-top-right"></i> <a href="{SourceURL}" target="_blank">
  1306.                        {SourceTitle}
  1307.                    </a>
  1308.                    </span>
  1309.                    {block:ContentSource}
  1310.                </div>
  1311.                {/block:IndexPage}
  1312.                
  1313.                <!--TAGS-->
  1314.                {block:HasTags}
  1315.                <div class="tags">
  1316.                {lang:Tagged with}
  1317.                    {block:Tags}
  1318.                          <i class="cp cp-hashtag"></i> <a href="{TagURL}">
  1319.                             {Tag}
  1320.                         </a>
  1321.                    {/block:Tags}
  1322.                </div>
  1323.                {/block:HasTags}
  1324.            </div>
  1325.            {/block:Date}
  1326.            
  1327.            <!--POST NOTES-->
  1328.             {block:PostNotes}
  1329.                 <div class="post-notes notes-box">
  1330.                     {PostNotes-64}
  1331.                 </div>
  1332.             {/block:PostNotes}
  1333.        </div>
  1334.        {/block:Posts}
  1335.        
  1336.        <!--PAGINATION-->
  1337.        {block:Pagination}
  1338.         <div class="pagination">
  1339.             {block:PreviousPage}
  1340.             <div class="pagination-buttons">
  1341.                 <a href="{PreviousPage}">
  1342.                         Prev
  1343.                 </a>
  1344.             </div>
  1345.             {/block:PreviousPage}
  1346.            
  1347.             {block:JumpPagination length="5"}
  1348.                 {block:CurrentPage}
  1349.                     <span class="current-page">{PageNumber}</span>
  1350.                 {/block:CurrentPage}
  1351.                 {block:JumpPage}
  1352.                     <a class="jump-page" href="{URL}">{PageNumber}</a>
  1353.                 {/block:JumpPage}
  1354.             {/block:JumpPagination}
  1355.            
  1356.             {block:NextPage}
  1357.             <div class="pagination-buttons">
  1358.                 <a href="{NextPage}">
  1359.                         Next
  1360.                 </a>
  1361.             </div>
  1362.             {/block:NextPage}
  1363.            
  1364.         </div>
  1365.        {/block:Pagination}
  1366.     </section>
  1367.    
  1368.     <!--RIGHT SIDEBAR-->
  1369.     <section class="right-sidebar-wrapper">
  1370.     {block:ifNotChangeSidebarPosition}
  1371.         <!--SIDEBAR IMAGE-->
  1372.         <img src="{image:Sidebar}">
  1373.        
  1374.         <!--BASIC LINKS-->
  1375.         <nav class="basic-links">
  1376.             <a href="/" title="Home">
  1377.                 <i class="cp cp-{text:Icon01}"></i>
  1378.             </a>
  1379.            
  1380.             {block:AskEnabled}
  1381.             <a href="/ask" title="{AskLabel}">
  1382.                 <i class="cp cp-{text:Icon02}"></i>
  1383.             </a>
  1384.             {/block:AskEnabled}
  1385.            
  1386.             {block:SubmissionsEnabled}
  1387.             <a href="/submit" title="{SubmitLabel}">
  1388.                 <i class="cp cp-{text:Icon03}"></i>
  1389.             </a>
  1390.             {/block:SubmissionsEnabled}
  1391.            
  1392.             <a href="https://phantasyreign.tumblr.com/" title="Theme by Jasmin">
  1393.                 <i class="cp cp-{text:Icon04}"></i>
  1394.             </a>
  1395.            
  1396.             {block:HasPages}{block:Pages}<a href="{URL}" title="{Label}"></a>{/block:Pages}{/block:HasPages}
  1397.            
  1398.             </a>
  1399.         </nav>
  1400.     {/block:ifNotChangeSidebarPosition}
  1401.    
  1402.     <!--CHANGES SIDEBAR POSITION-->
  1403.     {block:ifChangeSidebarPosition}
  1404.     <!--BLOG TITLE-->
  1405.         <div class="blog-title">
  1406.             <h1>
  1407.                 <a href="/">
  1408.                     {Title}
  1409.                 </a>
  1410.             </h1>
  1411.         </div>
  1412.        
  1413.         <!--DESCRIPTION-->
  1414.         <div class="description">
  1415.         {block:Description}
  1416.             <p>{Description}
  1417.            
  1418.             <hr class="links-border">
  1419.         {/block:Description}
  1420.        
  1421.         <!--LINKS-->
  1422.             {block:HasPages}
  1423.         <nav class="links">
  1424.             {block:Pages}<a href="{URL}">{Label}</a>{/block:Pages}
  1425.         </nav>
  1426.         {/block:HasPages}
  1427.         </div>
  1428.        
  1429.         <!--SEARCHBAR-->
  1430.         <div class="searchbar">
  1431.             <form action="/search" method="get">
  1432.                 <input type="text" name="q" value="{SearchQuery}" autocomplete="off" placeholder="Search..."/>
  1433.             </form>
  1434.         </div>
  1435.     {/block:ifChangeSidebarPosition}
  1436.     </section>
  1437.    
  1438.     <!--SCROLL TO TOP-->
  1439.     <div class="scroll-to-top">
  1440.         <a href="#top" title="Scroll to Top">
  1441.             <i class="cp cp-arrow-up"></i>
  1442.         </a>
  1443.     </div>
  1444. </main>
  1445.  
  1446. <!--TOOLTIPS-->
  1447. <script src="https://unpkg.com/@popperjs/core@2/dist/umd/popper.min.js"></script>
  1448. <script src="https://unpkg.com/tippy.js@6/dist/tippy-bundle.umd.js"></script>
  1449.  
  1450. <script src="https://unpkg.com/@popperjs/core@2"></script>
  1451. <script src="https://unpkg.com/tippy.js@6"></script>
  1452.  
  1453. <script>
  1454.     tippy('a[title]', {
  1455.         theme: 'theme',
  1456.         zIndex: 9999999999,
  1457.         arrow: tippy.roundArrow,
  1458.         placement: 'bottom',
  1459.  
  1460.         content(reference) {
  1461.             const title = reference.getAttribute('title');
  1462.             reference.removeAttribute('title');
  1463.             return title;
  1464.             },
  1465.         });
  1466. </script>
  1467.  
  1468. </body>
  1469. </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!