API tools faq
paste
Advertisement
Sky_Blue

WINDOWS 420 theme

Sky_Blue
Oct 12th, 2022 (edited)
3,124
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 18.09 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!---
  5.  
  6. WINDOWS 420 theme by @puella / @mirainikki
  7.  
  8. i never know what to write here. listen to the chainsaw man opening. stan miku. drink some water
  9.  
  10. CREDITS:
  11. -photosets by @annasthms
  12.  
  13. -98.css from https://jdan.github.io/98.css/
  14.  
  15. -and meeeeee :3
  16.  
  17. --->
  18.  
  19. <link rel="stylesheet" href="https://unpkg.com/98.css">
  20.  
  21. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  22.  
  23. <meta charset="utf-8">
  24. <meta https-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  25. {block:Description}
  26. <meta name="description" content="{MetaDescription}" />
  27. {/block:Description}
  28.    
  29. <title>{Title}</title>
  30.        
  31. <link rel="shortcut icon" href="{image:favicon}">
  32. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  33. <link rel="stylesheet" href="https://static.tumblr.com/qxrkgx6/RWPmgn2qa/normalize.min.css">
  34.  
  35. <script src="https://static.tumblr.com/qxrkgx6/LuRmgn2rm/modernizr-2.6.2.min.js"></script>
  36.  
  37. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  38.  
  39. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  40. <script src="https://static.tumblr.com/rtrqcib/VGGnlh8rf/jquery.style-my-tooltips.min.js"></script>
  41. <script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:0,tip_fade_speed:0,attribute:"title"});});})(jQuery);</script>
  42.  
  43. <script>
  44. function gatherData(images, arr) {
  45.   for (let i = 0; i < images.length; i++) {
  46.    let currentData = {
  47.      "width": images[i].getAttribute('data-width'),
  48.      "height": images[i].getAttribute('data-height'),
  49.      "low_res": images[i].getAttribute('data-lowres'),
  50.      "high_res": images[i].getAttribute('data-highres')
  51.    };
  52.    arr.push(currentData);
  53.  }
  54. }
  55. function getIndex(elem) {
  56.  let i = 0;
  57.  while( (elem = elem.previousElementSibling) != null ) i++;
  58.  return i;
  59. }
  60. function lightbox(elem) {
  61.  let currentPhotoset = elem.parentNode;
  62.  let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  63.  let data = [];
  64.  gatherData(photosetPhotos, data);
  65.  Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  66. }
  67. </script>
  68.        
  69. <meta name="image:favicon" content=""/>
  70. <meta name="image:icon" content="https://64.media.tumblr.com/948d31b3b6b3a9cc63f1150e649fdaaf/f09c667c9f170527-74/s2048x3072/4ccb2cf6e8a2153cd889c694f3a8087a66942790.jpg"/>
  71. <meta name="image:background" content=""/>
  72.  
  73. <meta name="color:background" content=""/>
  74. <meta name="color:post background" content="#fff"/>
  75. <meta name="color:title bar" content="#1a89af"/>
  76. <meta name="color:title color" content="#fff"/>
  77. <meta name="color:window background" content="c0c0c0"/>
  78. <meta name="color:text" content="#000"/>
  79. <meta name="color:links" content="#1a89af"/>
  80. <meta name="color:links hover" content=""/>
  81. <meta name="color:tooltip background" content="#fff"/>
  82. <meta name="color:tooltip text" content="#000"/>
  83. <meta name="color:selection background" content="#1a89af"/>
  84. <meta name="color:selection text" content="#fff"/>
  85.  
  86. <meta name="if:header image" content=""/>
  87. <meta name="if:redirect" content=""/>
  88. <meta name="if:captions" content="1"/>
  89. <meta name="if:background cover" content=""/>
  90.  
  91. <meta name="text:title bar" content="Title"/>
  92. <meta name="text:description" content="Description"/>
  93. <meta name="text:links text" content="Links"/>
  94. <meta name="text:link 1" content="One"/>
  95. <meta name="text:link 1 url" content=""/>
  96. <meta name="text:link 2" content="Two"/>
  97. <meta name="text:link 2 url" content=""/>
  98. <meta name="text:link 3" content="Three"/>
  99. <meta name="text:link 3 url" content=""/>
  100. <meta name="text:link 4" content="Four"/>
  101. <meta name="text:link 4 url" content=""/>
  102. <meta name="text:redirect" content=""/>  
  103.  
  104. </head>
  105.        
  106. <style type="text/css">
  107. .npf_row {
  108.     margin: 0 !important;
  109. }
  110.  
  111. .tmblr-full img{
  112.     border-top:2px ridge grey;
  113.     border-right:2px groove #fff;
  114.     border-bottom:2px groove #fff;
  115.     border-left:2px ridge grey;
  116.     box-sizing:border-box !important;
  117. }
  118.  
  119. ::selection {
  120.     background: {color:selection background};
  121.     color:{color:selection text};
  122. }
  123.  
  124. ::-moz-selection {
  125.     background: {color:selection background};
  126.     color:{color:selection text};
  127. }
  128.  
  129. #s-m-t-tooltip{
  130.     margin: 20px 0 0 10px;
  131.     padding: 5px;
  132.     max-width: 300px;
  133.     background-color:{color:tooltip background};
  134.     color:{color:tooltip text};
  135.     border-top:2px ridge grey;
  136.     border-right:2px groove #fff;
  137.     border-bottom:2px groove #fff;
  138.     border-left:2px ridge grey;
  139.     z-index: 9999;
  140. }
  141.  
  142. body {
  143.     margin:0px;
  144.     background-color: {color:background};
  145.     background-image: url('{image:background}');
  146.     {block:ifbackgroundcover}
  147.     background-size: cover;
  148.     {/block:ifbackgroundcover}
  149.     {block:ifnotbackgroundcover}
  150.     background-repeat:repeat;
  151.     {/block:ifnotbackgroundcover}
  152.     background-attachment:fixed;
  153.     font-family: "Pixelated MS Sans Serif",Arial;
  154.     font-size:13px;
  155. }
  156.  
  157. p{
  158.     margin:5px 0px;
  159.     padding:0;
  160. }
  161.  
  162. pre {
  163.     white-space: pre-wrap;
  164.     white-space: -moz-pre-wrap;
  165.     white-space: -pre-wrap;
  166.     white-space: -o-pre-wrap;
  167.     word-wrap: break-word;
  168. }
  169.  
  170. a{
  171.     color:{color:links};
  172.     text-decoration:none;
  173.     transition:0.5s;
  174. }
  175.  
  176. a:hover{
  177.     color:{color:links hover};
  178.     cursor:help;
  179. }
  180.  
  181. a.tumblr_blog{
  182.     display:inline-block;
  183.     margin-bottom:5px;
  184. }
  185.  
  186. li{
  187.     margin-left:-15px;
  188. }
  189.  
  190. #wrapper{
  191.     {block:ifnotheaderimage}
  192.     width:715px;
  193.     {block:ifnotheaderimage}
  194.     {block:ifheaderimage}
  195.     width:815px;
  196.     {block:ifheaderimage}
  197.     margin:auto;
  198.     animation:fadeEffect 1s;
  199. }
  200.  
  201. @keyframes fadeEffect {
  202.     from {opacity: 0;}
  203.     to {opacity: 1;}
  204. }
  205.  
  206. .title-bar {
  207.     background:{color:title bar};
  208.     color:{color:title color};
  209.     cursor:move;
  210. }
  211.  
  212. .title-bar-text::first-letter {
  213.     text-transform: uppercase;
  214. }
  215.  
  216. .window, button{
  217.     background:{color:window background};
  218.     font-size:13px;
  219. }
  220.  
  221. button, select{
  222.     color:{color:text};
  223. }
  224.  
  225. select{
  226.     background-color:{color:post background};
  227. }
  228.  
  229. .status-bar{
  230.     max-width: 414px;
  231.     flex-wrap: wrap;
  232. }
  233.  
  234. #sidebar{
  235.     position:fixed;
  236.     display: flex;  
  237.     flex-direction:column;
  238.     height:fit-content;
  239.     height:-moz-fit-content;
  240.     top: 0;
  241.     bottom: 0;
  242.     margin: auto;
  243.     {block:ifnotheaderimage}
  244.     width:235px;
  245.     {block:ifnotheaderimage}
  246.     {block:ifheaderimage}
  247.     width:335px;
  248.     {/block:ifheaderimage}
  249. }
  250.  
  251. #content{
  252.     float:right;
  253. }
  254.  
  255. #icon{
  256.     box-sizing:border-box;
  257.     border-top:2px ridge grey;
  258.     border-right:2px groove #fff;
  259.     border-bottom:2px groove #fff;
  260.     border-left:2px ridge grey;
  261.     background-color:{color:post background};
  262. }
  263.  
  264. #icon img{
  265.     display:block;
  266. }
  267.  
  268. #description{
  269.     margin-top:8px;
  270.     box-sizing:border-box;
  271.     padding:8px;
  272.     background-color:{color:post background};
  273.     box-shadow:inset -1px -1px #fff, inset 1px 1px grey, inset -2px -2px #dfdfdf, inset 2px 2px #0a0a0a;
  274.     max-height:100px;
  275.     overflow:auto;
  276.     color:{color:text};
  277. }
  278.  
  279. #links{
  280.     display:flex;
  281.     justify-content:space-between;
  282. }
  283.  
  284. #postcontainer{
  285.     margin:50px 0px 50px 0px;
  286. }
  287.  
  288. .post{
  289.     width:400px;
  290.     overflow:hidden;
  291.     box-sizing:border-box;
  292.     color:{color:text};
  293. }
  294.  
  295. #nav{
  296.     margin-top:8px;
  297.     display:flex;
  298.     justify-content:space-between;
  299. }
  300.  
  301. .answer .embed_iframe{
  302.     width: 340px;
  303. }
  304.  
  305. .nfp_row{
  306.     margin-left:0px;
  307.     margin-right:0px;
  308. }
  309.  
  310. video{
  311.     width:100%;
  312.     max-width:100%;
  313.     height:auto!important;
  314.     border-top:2px ridge grey;
  315.     border-right:2px groove #fff;
  316.     border-bottom:2px groove #fff;
  317.     border-left:2px ridge grey;
  318.     box-sizing:border-box;
  319. }
  320.  
  321. .video-container {
  322.     overflow: hidden;
  323. }
  324.  
  325. .video-container iframe,
  326. .video-container object,
  327. .video-container embed {
  328.     position: center;
  329.     max-width: 460px;
  330.     max-height: 460px;
  331.     border-top:2px ridge grey;
  332.     border-right:2px groove #fff;
  333.     border-bottom:2px groove #fff;
  334.     border-left:2px ridge grey;
  335.     box-sizing:border-box;
  336. }
  337.  
  338. .video-wrapper {
  339.     max-width: 460px;
  340.     max-height: 460px;
  341. }
  342.  
  343. iframe.tumblr_audio_player {
  344.     height: 85px;
  345.     border-top:2px ridge grey;
  346.     border-right:2px groove #fff;
  347.     border-bottom:2px groove #fff;
  348.     border-left:2px ridge grey;
  349.     box-sizing:border-box;
  350.    
  351. }
  352.  
  353. .media{
  354.     margin:0 0 0px 0;
  355.     text-align:center;
  356. }
  357.  
  358. .media img{
  359.     border-top:2px ridge grey;
  360.     border-right:2px groove #fff;
  361.     border-bottom:2px groove #fff;
  362.     border-left:2px ridge grey;
  363.     display:block;
  364.     box-sizing:border-box;
  365. }
  366.  
  367. .title{
  368.     font-size:calc(13px * 2 - 10px);
  369.     font-weight:bold;
  370.     margin:8px 0 8px 0;
  371.     color:{color:text};
  372. }
  373.  
  374. h1, h2, h3, h4, h5, h6{
  375.     font-size:calc(13px * 2 - 10px);
  376.     font-weight:bold;
  377.     margin:8px 0 8px 0;
  378.     color:{color:text};
  379. }
  380.  
  381. .quote{
  382.     font-weight:normal;
  383.     font-size:13px;
  384.     font-style:italic;
  385.     margin:0 0 8px 0;
  386. }
  387.  
  388. .question {
  389.     position: relative;
  390.     box-shadow:inset -1px -1px #fff, inset 1px 1px grey, inset -2px -2px #dfdfdf, inset 2px 2px #0a0a0a;
  391.     background-color:{color:post background};
  392.     padding:8px;
  393.     margin-left:8px;
  394.     width:100%;
  395.     word-break: break-word;
  396. }
  397.  
  398. .asker{
  399.     display:flex;
  400.     align-items: flex-start;
  401. }
  402.  
  403. .asker img{
  404.     border-top:2px ridge grey;
  405.     border-right:2px groove #fff;
  406.     border-bottom:2px groove #fff;
  407.     border-left:2px ridge grey;
  408. }
  409.  
  410. .answer{
  411.     position: relative;
  412.     box-shadow:inset -1px -1px #fff, inset 1px 1px grey, inset -2px -2px #dfdfdf, inset 2px 2px #0a0a0a;
  413.     background-color:{color:post background};
  414.     padding:8px;
  415.     margin-right:8px;
  416.     width:100%;
  417.     word-break: break-word;
  418. }
  419.  
  420. .answerer{
  421.     margin-top:8px;
  422.     display:flex;
  423.     align-items: flex-start;
  424.    
  425. }
  426.  
  427. .answerer img{
  428.     border-top:2px ridge grey;
  429.     border-right:2px groove #fff;
  430.     border-bottom:2px groove #fff;
  431.     border-left:2px ridge grey;
  432. }
  433.  
  434. .caption{
  435.     margin-top:8px;
  436.     padding:8px;
  437.     box-shadow:inset -1px -1px #fff, inset 1px 1px grey, inset -2px -2px #dfdfdf, inset 2px 2px #0a0a0a;
  438.     background-color:{color:post background};
  439. }
  440.  
  441. blockquote{
  442.     margin: 0 0 5px 0;
  443.     padding-left:8px;
  444.     border-left:1px solid #808080;
  445. }
  446.  
  447. blockquote img{
  448.     width:100%;
  449.     height:auto;
  450.     object-fit:cover;
  451.     border-top:2px ridge grey;
  452.     border-right:2px groove #fff;
  453.     border-bottom:2px groove #fff;
  454.     border-left:2px ridge grey;
  455.     box-sizing:border-box;
  456. }
  457.  
  458. img{
  459.     max-width:100%;
  460.     height:auto;
  461. }
  462.  
  463. ol.notes{
  464.     box-shadow:inset -1px -1px #fff, inset 1px 1px grey, inset -2px -2px #dfdfdf, inset 2px 2px #0a0a0a;
  465.     background-color:{color:post background};
  466.     margin-top:8px;
  467.     padding:8px;
  468.     list-style-type:none;
  469.     max-height:200px;
  470.     overflow:auto;
  471.     margin-bottom:0px;
  472. }
  473.  
  474. ol.notes li.note img{
  475.     width:16px;
  476.     height:16px;
  477.     margin-right:3px;
  478. }
  479.  
  480. ol.notes li.note{
  481.     margin:0px;
  482. }
  483.  
  484. [photoset-layout] {
  485.   grid-gap: 8px;
  486. }
  487.  
  488. [photoset-layout] img {
  489.     border-top:2px ridge grey;
  490.     border-right:2px groove #fff;
  491.     border-bottom:2px groove #fff;
  492.     border-left:2px ridge grey;
  493.     background-color:{color:post background};
  494.     display: block;
  495.     height: 100%;
  496.     width: 100%;
  497.     object-fit: cover;
  498. }
  499.  
  500. [photoset-layout] div {
  501.   cursor: help;
  502. }
  503.  
  504. #heartbeat{
  505.     position:fixed;
  506.     left:12px;
  507.     bottom:6px;
  508.     font-size:18px !important;
  509. }
  510.  
  511. #heartbeat:hover{
  512.     animation: heartbeat 1s infinite;
  513. }
  514.  
  515. @keyframes heartbeat
  516. {
  517.   0%
  518.   {
  519.     transform: scale( .90 );
  520.   }
  521.   20%
  522.   {
  523.     transform: scale( 1 );
  524.   }
  525.   40%
  526.   {
  527.     transform: scale( .90 );
  528.   }
  529.   60%
  530.   {
  531.     transform: scale( 1 );
  532.   }
  533.   80%
  534.   {
  535.     transform: scale( .90 );
  536.   }
  537.   100%
  538.   {
  539.     transform: scale( .90 );
  540.   }
  541. }
  542.  
  543. </style>
  544. <body>
  545.  
  546. {block:ifredirect}
  547. {block:IndexPage}
  548. <script type="text/javascript">
  549.     var url = location.href;
  550.     if (url == "{BlogURL}") {
  551.         window.location = "{BlogURL}tagged/{text:redirect}";
  552.     }
  553. </script>
  554. {/block:IndexPage}
  555. {/block:ifredirect}
  556.  
  557. <div id="wrapper">
  558. <div id="sidebar">
  559.     <div class="window windowcolor">
  560.         <div class="title-bar">
  561.             <div class="title-bar-text">{text:title bar}</div>
  562.             <div class="title-bar-controls">
  563.                 <button aria-label="Minimize"></button>
  564.                 <button aria-label="Maximize"></button>
  565.                 <button aria-label="Close"></button>
  566.             </div>
  567.         </div>
  568.         <div class="window-body">
  569.             <div id="icon">
  570.                 <a href="/"><img src="{image:icon}"></a>
  571.             </div>
  572.            
  573.             <div id="description">
  574.                 {text:description}
  575.             </div>
  576.            
  577.             <select style="width:100%;margin-top:10px;" onchange="location = this.value;">
  578.                 <option>{text:links text}</option>
  579.                 <option value="{text:link 1 url}">{text:link 1}</option>
  580.                 <option value="{text:link 2 url}">{text:link 2}</option>
  581.                 <option value="{text:link 3 url}">{text:link 3}</option>
  582.                 <option value="{text:link 4 url}">{text:link 4}</option>
  583.              </select>
  584.              
  585.              {block:Pagination}
  586.              <div id="nav">
  587.                 {block:PreviousPage}
  588.                     <button onclick="location.href='{PreviousPage}'" type="button">< <u>B</u>ack</button>
  589.                 {/block:PreviousPage}
  590.                
  591.                 {block:NextPage}
  592.                     <button onclick="location.href='{NextPage}'" type="button"><u>N</u>ext ></button>
  593.                 {/block:NextPage}
  594.             </div>
  595.             {/block:Pagination}
  596.         </div>
  597.     </div>
  598. </div>
  599.    
  600. <div id="content">
  601.  
  602.  
  603. {block:Posts}
  604. <div id="postcontainer">
  605. <div class="window windowcolor">
  606.     <div class="title-bar">
  607.         <div class="title-bar-text">{PostType}</div>
  608.         <div class="title-bar-controls">
  609.             <button aria-label="Minimize"></button>
  610.             <button aria-label="Maximize"></button>
  611.             <button aria-label="Close"></button>
  612.         </div>
  613.     </div>
  614. <div class="window-body">
  615. <div class="post" post-type="{PostType}">
  616.  
  617. {block:Text}
  618. {block:Title}
  619. <div class="title">{Title}</div>
  620. {/block:Title}
  621. {Body}
  622. {/block:Text}
  623.  
  624. {block:Photo}
  625. <div class="media">{LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}</div>
  626. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  627. {/block:Photo}
  628.  
  629. {block:Photoset}
  630. <div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-400}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>
  631. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  632. {/block:Photoset}
  633.  
  634. {block:Quote}
  635. <div class="quote">"{Quote}"</div>
  636. {block:Source}
  637. <div class="quotesource">{Source}</div>
  638. {/block:Source}
  639. {/block:Quote}
  640.  
  641. {block:Link}
  642. <div class="title"><a href="{URL}">{Name}</a></div>
  643. {block:Description}
  644. <div class="description">{Description}</div>
  645. {/block:Description}
  646. {/block:Link}
  647.  
  648. {block:Chat}
  649. {block:Title}
  650. <div class="title">{Title}</div>
  651. {/block:Title}
  652.  
  653. {block:Lines}
  654. <div class="{Alt} user_{UserNumber}">
  655. {block:Label}
  656. <b>{Label}</b>{/block:Label}
  657. &nbsp;{Line}
  658. </div>
  659. {/block:Lines}
  660. {/block:Chat}
  661.  
  662. {block:Video}
  663. <div class="media"><div class="video-wrapper">
  664. <div class="video-container">{video-400}</div>
  665. </div></div>
  666. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  667. {/block:Video}
  668.  
  669. {block:Audio}
  670. <div class="media">
  671. {block:AudioEmbed}<div class="video-wrapper"><div class="video-container">{AudioEmbed-400}</div></div>{/block:AudioEmbed}
  672. </div>
  673. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  674. {/block:Audio}
  675.  
  676. {block:Answer}
  677. <div class="asker"><img src="{AskerPortraitURL-48}"> <div class="question" style="font-style:italic">{Question}</div></div>
  678.  
  679. <div class="answerer"><div class="answer">{Answer}</div>{block:Answerer}<img src="{AnswererPortraitURL-48}">{/block:Answerer}<img src="{PortraitURL-48}" style="{block:Answerer}display:none{/block:Answerer}"></div>
  680.  
  681. <div style="{block:NotReblog}display:none;margin-top:10px;{/block:NotReblog}">{Replies}</div>
  682. {/block:Answer}
  683.  
  684. {block:PermalinkPage}
  685.     {block:NoteCount}
  686.     {block:PostNotes}{PostNotes}{/block:PostNotes}
  687.     {/block:NoteCount}
  688. {/block:PermalinkPage}
  689.  
  690. </div>
  691.  
  692.  
  693. </div>
  694. {block:Date}
  695.  
  696. <div class="status-bar">
  697.     <p class="status-bar-field"><a href="{Permalink}">Notes: {notecount}</a></p>
  698.     <p class="status-bar-field"><a href="{Permalink}">Permalink</a></p>
  699.     <p class="status-bar-field"><a href="{ReblogURL}">Reblog</a></p>
  700.  
  701. <!-- {block:NoRebloggedFrom}
  702. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  703. {/block:NoRebloggedFrom} -->{block:ContentSource}<!-- {SourceURL}
  704. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  705. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  706. {/block:ContentSource}
  707. </div>
  708.  
  709. {block:HasTags}
  710. <div class="status-bar">
  711.     {block:Tags}<p class="status-bar-field"><a href="{TagURL}">#{Tag}</a></p>{/block:Tags}
  712. </div>
  713. {/block:HasTags}
  714.  
  715. {/block:Date}
  716. </div>
  717. </div>
  718. {/block:Posts}
  719.  
  720. </div>
  721. </div>
  722.  
  723. <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  724. <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  725. <script>
  726.   $( function() {
  727.     $("#sidebar").draggable({handle: ".title-bar", scroll: false});
  728.   } );
  729. $( function() {
  730.     $("[id=postcontainer]").draggable({handle: ".title-bar", scroll: false});
  731.   } );
  732.  
  733. </script>
  734.  
  735. <script src="https://kit.fontawesome.com/f936906ae0.js" crossorigin="anonymous"></script>
  736. <a id="heartbeat" href="https://puella.tumblr.com" title="by @puella / @mirainikki"><i class="fas fa-heart"></i>️</a>
  737.  
  738. </body>
  739. </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!