sashatheme

CURIOUS CHAMELEON THEME

Aug 24th, 2022 (edited)
642
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.21 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <head>
  4.  
  5. <!--CREDIT EEEK-->
  6.  
  7. <style>
  8.  
  9. #credit {
  10.  
  11. position: fixed;
  12.  
  13. left: 12px;
  14.  
  15. bottom: 6px;
  16.  
  17. font-size: 14px;
  18.  
  19. }
  20.  
  21. </style>
  22.  
  23. <meta name="select:font" content="arial" />
  24. <meta name="select:font" content="comic sans ms" />
  25. <meta name="select:font" content="times" />
  26. <meta name="select:font" content="ms gothic" />
  27. <meta name="select:font" content="Caveat" />
  28. <meta name="select:font" content="DynaPuff" />
  29. <meta name="select:font" content="Silkscreen" />
  30. <meta name="select:font" content="Fredoka One" />
  31.  
  32. <meta name="image:background" contents="" />
  33. <meta name="color:background" contents="" />
  34.  
  35. <meta name="color:links" contents="" />
  36. <meta name="color:tags" contents="" />
  37. <meta name="color:permalink" contents="" />
  38. <meta name="text:permalink emoji" contents="" />
  39.  
  40. <meta name="image:post background" contents="" />
  41. <meta name="color:post background" contents="" />
  42. <meta name="color:post font" contents="" />
  43. <meta name="color:post borders" contents="" />
  44.  
  45. <meta name="image:icon" contents="" />
  46. <meta name="color:icon border" contents="" />
  47.  
  48. <meta name="color:desc font" contents="" />
  49. <meta name="text:desc" contents="" />
  50.  
  51. <meta name="text:track name" contents="" />
  52. <meta name="text:mp3 link here" contents="" />
  53.  
  54. <meta name="color:music border" contents="" />
  55. <meta name="color:music background" contents="" />
  56. <meta name="color:music font" contents="" />
  57.  
  58. <meta name="color:calendar" contents="" />
  59. <meta name="color:calendar day" contents="" />
  60.  
  61. <meta name="color:scrollbar background" contents="" />
  62. <meta name="color:scrollbar" contents="" />
  63.  
  64. <meta name="select:icon border" content="solid" />
  65. <meta name="select:icon border" content="dashed" />
  66. <meta name="select:icon border" content="dotted" />
  67. <meta name="select:icon border" content="double" />
  68. <meta name="select:icon border" content="groove" />
  69. <meta name="select:icon border" content="ridge" />
  70. <meta name="select:icon border" content="inset" />
  71. <meta name="select:icon border" content="outset" />
  72.  
  73. <meta name="select:music border" content="solid" />
  74. <meta name="select:music border" content="dashed" />
  75. <meta name="select:music border" content="dotted" />
  76. <meta name="select:music border" content="double" />
  77. <meta name="select:music border" content="groove" />
  78. <meta name="select:music border" content="ridge" />
  79. <meta name="select:music border" content="inset" />
  80. <meta name="select:music border" content="outset" />
  81.  
  82. <style>
  83.  
  84. @import url('https://fonts.googleapis.com/css2?family=Caveat&family=DynaPuff&family=Silkscreen&display=swap');
  85.  
  86. @import url('https://fonts.googleapis.com/css2?family=Caveat&family=DynaPuff&family=Silkscreen&display=swap');
  87.  
  88. @import url('https://fonts.googleapis.com/css2?family=Caveat&family=DynaPuff&family=Silkscreen&display=swap');
  89.  
  90. @import url('https://fonts.googleapis.com/css2?family=Caveat&family=DynaPuff&family=Fredoka+One&family=Silkscreen&display=swap');
  91.  
  92. </style>
  93.  
  94. <style>
  95.  
  96. body {
  97.  
  98. font-family: {select:font};
  99.  
  100. background-color: {color:background};
  101.  
  102. background-image: url('{image:background}');
  103.  
  104. background-size: cover;
  105.  
  106. margin-top: 50px;
  107.  
  108. }
  109.  
  110. a, ahref {
  111.  
  112. color: {color:links};
  113. }
  114.  
  115. .npf_row {
  116.  
  117. margin: 0 !important;
  118.  
  119. }
  120.  
  121. iframe, img, embed, object, video {
  122.  
  123. max-width: 100%;
  124.  
  125. }
  126.  
  127. .wrap {
  128.  
  129. width: 1000px;
  130. }
  131.  
  132. .sidebar {
  133.  
  134. width: 280px;
  135.  
  136. overflow: auto;
  137.  
  138. padding: 10px;
  139.  
  140. border: 1px solid transparent;
  141.  
  142. float: left;
  143.  
  144. position: fixed;
  145. }
  146.  
  147. .posts {
  148.  
  149. width: 540px;
  150.  
  151. padding: 10px;
  152.  
  153. margin-left: 220px;
  154.  
  155. color: {color:post font};
  156.  
  157. background-color: {color:post background};
  158.  
  159. background-image: url('{image:post background}');
  160.  
  161. background-size: cover;
  162.  
  163. text-align: justify;
  164.  
  165. -webkit-box-shadow: 0 0 5px 6px {color:post borders};
  166.  
  167. -moz-box-shadow: 0 0 5px 6px {color:post borders};
  168.  
  169. box-shadow: 0 0 5px 6px {color:post borders};
  170. }
  171.  
  172. .icon {
  173.  
  174. width: 134px;
  175.  
  176. height: 134px;
  177.  
  178. padding: 2px;
  179.  
  180. border: 3px {select:icon border} {color:icon border};
  181.  
  182. background-image: url('{image:icon}');
  183.  
  184. background-size: cover;
  185. }
  186.  
  187. .desc {
  188.  
  189. width: 134px;
  190.  
  191. height: 20px;
  192.  
  193. padding: 0px;
  194.  
  195. margin-top: 10px;
  196.  
  197. margin-bottom: 10px;
  198.  
  199. overflow: auto;
  200.  
  201. text-align: justify;
  202.  
  203. color: {color:desc font};
  204.  
  205. }
  206.  
  207. .desc img {
  208.  
  209. max-width: 100%;
  210. }
  211.  
  212. .desc::-webkit-scrollbar {
  213.  
  214. width: 0px;
  215. }
  216.  
  217. .musicbox {
  218.  
  219. width: 134px;
  220.  
  221. height: 20px;
  222.  
  223. padding: 2px;
  224.  
  225. border: 3px {select:music border} {color:music border};
  226.  
  227. overflow: hidden;
  228.  
  229. background-color: {color:music background};
  230.  
  231. text-align: justify;
  232.  
  233. color: {color:music font};
  234.  
  235. display: flex;
  236.  
  237. justify-content: center;
  238.  
  239. align-items: center;
  240.  
  241. }
  242.  
  243. #hvr-shrink {
  244. display: inline-block;
  245. -webkit-transform: perspective(1px) translateZ(0);
  246. transform: perspective(1px) translateZ(0);
  247. box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  248. -webkit-transition-duration: 0.3s;
  249. transition-duration: 0.3s;
  250. -webkit-transition-property: transform;
  251. transition-property: transform;
  252. }
  253. #hvr-shrink:hover, #hvr-shrink:focus, #hvr-shrink:active {
  254. -webkit-transform: scale(0.9);
  255. transform: scale(0.9);
  256. }
  257.  
  258. .spotify_audio_player {
  259.  
  260. height: 80px!important;
  261.  
  262. width: 100%!important;
  263.  
  264. }
  265.  
  266. .soundcloud_audio_player {
  267.  
  268. height: 150px!important;
  269.  
  270. width: 100%!important;
  271.  
  272. }
  273.  
  274. .trackback {
  275.  
  276. position: absolute;
  277.  
  278. left: 20px;
  279.  
  280. top: 20px;
  281.  
  282. width: 19px;
  283.  
  284. height: 19px;
  285.  
  286. background-color: #fff;
  287.  
  288. padding: 10px;
  289.  
  290. opacity: .4;
  291.  
  292. }
  293.  
  294. .pressplay {
  295.  
  296. position: relative;
  297.  
  298. width: 25px;
  299.  
  300. height: 25px;
  301.  
  302. overflow: hidden;
  303.  
  304. left: -6px;
  305.  
  306. top: -3px;
  307.  
  308. }
  309.  
  310. .albumpic {
  311.  
  312. position: absolute;
  313.  
  314. left: 0px;
  315.  
  316. top: 0px;
  317.  
  318. width: 79px;
  319.  
  320. height: 79px;
  321.  
  322. }
  323.  
  324. .albumpic img {
  325.  
  326. width: 100%;
  327.  
  328. height: auto;
  329.  
  330. border: 1px solid {color:font color};
  331.  
  332. }
  333.  
  334. .trackinfo {
  335.  
  336. width: auto;
  337.  
  338. position: relative;
  339.  
  340. display: inline-block;
  341.  
  342. margin-left: 90px;
  343.  
  344. min-height: 85px;
  345.  
  346. }
  347.  
  348. .audiowrapper {
  349.  
  350. position: relative;
  351.  
  352. display: inline-block;
  353.  
  354. margin-top: 10px;
  355.  
  356. }
  357.  
  358. ::-webkit-scrollbar {
  359.  
  360. width: 5px;
  361.  
  362. background: {color:scrollbar background};
  363.  
  364. }
  365.  
  366. ::-webkit-scrollbar-thumb {
  367.  
  368. background: {color:scrollbar};
  369.  
  370. }
  371.  
  372. </style>
  373.  
  374. </head>
  375.  
  376. <body>
  377.  
  378. <center>
  379.  
  380. <div class="wrap">
  381.  
  382. <div class="sidebar">
  383.  
  384. {block:Pagination}
  385.  
  386. {block:NextPage}<a href="{NextPage}" style="float: left;">next</a>{/block:NextPage}
  387.  
  388. {block:PreviousPage}<a href="{PreviousPage}" style="float: right;">prev</a>{/block:PreviousPage}
  389.  
  390. {/block:Pagination}
  391.  
  392. <div class="icon"></div> <!--ICON CLOSE-->
  393.  
  394. <div class="desc">
  395.  
  396. {text:desc}
  397.  
  398. </div> <!--PIXELS CLOSE-->
  399.  
  400. <div class="musicbox">
  401.  
  402. <a href="#" style="float: left; text-decoration: none; border-right: 1px dashed {color:music border}; margin-top: -1px;" onclick="document.getElementById('music').play()">
  403.  
  404. <span style="font-family: Fredoka One; font-size: 16px; color: {color:music font};">&nbsp;&nbsp;▶&nbsp;&nbsp;</span>
  405.  
  406. </a>
  407.  
  408. <marquee scrolldelay="120" style="float: right; width: 115px; margin-left: 2px; margin-top: -2px;">
  409.  
  410. {text:track name}
  411.  
  412. </marquee>
  413.  
  414. <audio id="music" src="{text:mp3 link here}">
  415.  
  416. </audio>
  417.  
  418. </div>
  419.  
  420. <br>
  421.  
  422. <div align="center" width="100" height="190">
  423. <script language="JavaScript">
  424.  
  425. monthnames = new Array(
  426. "JAN",
  427. "FEB",
  428. "MAR",
  429. "APR",
  430. "MAY",
  431. "JUN",
  432. "JUL",
  433. "AUG",
  434. "SEP",
  435. "OCT",
  436. "NOV",
  437. "DEC");
  438. var linkcount=0;
  439. function addlink(month, day, href) {
  440. var entry = new Array(3);
  441. entry[0] = month;
  442. entry[1] = day;
  443. entry[2] = href;
  444. this[linkcount++] = entry;
  445. }
  446. Array.prototype.addlink = addlink;
  447. linkdays = new Array();
  448. monthdays = new Array(12);
  449. monthdays[0]=31;
  450. monthdays[1]=28;
  451. monthdays[2]=31;
  452. monthdays[3]=30;
  453. monthdays[4]=31;
  454. monthdays[5]=30;
  455. monthdays[6]=31;
  456. monthdays[7]=31;
  457. monthdays[8]=30;
  458. monthdays[9]=31;
  459. monthdays[10]=30;
  460. monthdays[11]=31;
  461. todayDate=new Date();
  462. thisday=todayDate.getDay();
  463. thismonth=todayDate.getMonth();
  464. thisdate=todayDate.getDate();
  465. thisyear=todayDate.getYear();
  466. thisyear = thisyear % 100;
  467. thisyear = ((thisyear < 50) ? (2000 + thisyear) : (1900 + thisyear));
  468. if (((thisyear % 4 == 0)
  469. && !(thisyear % 100 == 0))
  470. ||(thisyear % 400 == 0)) monthdays[1]++;
  471. startspaces=thisdate;
  472. while (startspaces > 7) startspaces-=7;
  473. startspaces = thisday - startspaces + 1;
  474. if (startspaces < 0) startspaces+=7;
  475. document.write("<font face='{select:font}'>");
  476. document.write("<table border=0 ");
  477. document.write("bordercolor=black style='font-size : 12px; color : {color:calendar};' cellpadding=1 cellspacing=3>");
  478. document.write("<tr><td colspan=7><center>"
  479. + monthnames[thismonth] + " " + thisyear
  480. + "</strong></center></font></td></tr>");
  481. document.write("<tr>");
  482. document.write("<td align=center><b>S</b></td>");
  483. document.write("<td align=center><b>M</b></td>");
  484. document.write("<td align=center><b>T</b></td>");
  485. document.write("<td align=center><b>W</b></td>");
  486. document.write("<td align=center><b>T</b></td>");
  487. document.write("<td align=center><b>F</b></td>");
  488. document.write("<td align=center><b>S</b></td>");
  489. document.write("</tr>");
  490. document.write("<tr>");
  491. for (s=0;s<startspaces;s++) {
  492. document.write("<td> </td>");
  493. }
  494. count=1;
  495. while (count <= monthdays[thismonth]) {
  496. for (b = startspaces;b<7;b++) {
  497. linktrue=false;
  498. document.write("<td>");
  499. for (c=0;c<linkdays.length;c++) {
  500. if (linkdays[c] != null) {
  501. if ((linkdays[c][0]==thismonth + 1) && (linkdays[c][1]==count)) {
  502. document.write("<a href=\"" + linkdays[c][2] + "\">");
  503. linktrue=true;
  504. }
  505. }
  506. }
  507. if (count==thisdate) {
  508. document.write("<b><font color='{color:calendar day}'></b>");
  509. }
  510. if (count <= monthdays[thismonth]) {
  511. document.write(count);
  512. }
  513. else {
  514. document.write(" ");
  515. }
  516. if (count==thisdate) {
  517. document.write("</font>");
  518. }
  519. if (linktrue)
  520. document.write("</a>");
  521. document.write("</td>");
  522. count++;
  523. }
  524. document.write("</tr>");
  525. document.write("<tr>");
  526. startspaces=0;
  527. }
  528. document.write("</table></p>");
  529. // End -->
  530. </script>
  531.  
  532. </font></div> <!--CALCLOSE-->
  533.  
  534. </div> <!--SIDEBAR CLOSE-->
  535.  
  536. <div class="postwrap">
  537.  
  538. {block:Posts}
  539.  
  540. <div class="posts">
  541.  
  542. {block:Text}
  543. {block:Title}<a href="{Permalink}">{Title}</a>{/block:Title}
  544. {Body}
  545. {/block:Text}
  546.  
  547. {block:Quote}
  548. <div class="quote"><h2 style="margin-top: 2px; margin-bottom: 2px;"><b>"</b> <i>{Quote}</i> <b>"</b></h2></div>
  549. {block:Source}<div class="source">&mdash; {Source}</div>{/block:Source}
  550. {/block:Quote}
  551.  
  552. {block:Link}
  553. <big><a href="{URL}">{Name}</a></big>
  554. {block:Description}{Description}{/block:Description}
  555. {/block:Link}
  556.  
  557. {block:Chat}
  558. {block:Title}{Title}{/block:Title}
  559. {block:Lines}
  560. <div class="{Alt} user_{UserNumber}">
  561. {block:Label}{Label}{/block:Label} {Line}
  562. </div>
  563. {/block:Lines}
  564. {/block:Chat}
  565.  
  566. {block:Answer}
  567. <span style="float: right;"><i>{Asker}</i></span><br>
  568. <div class="question"><blockquote>{Question}</blockquote></div><hr>
  569. {Answer}
  570. {/block:Answer}
  571.  
  572. <center>
  573. {block:Photo}
  574. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{Permalink}"/>{LinkCloseTag}
  575. </center>
  576. {block:Caption}{Caption}{/block:Caption}
  577. {/block:Photo}
  578.  
  579. <center>
  580. {block:Photoset}
  581. {Photoset-400}</center>
  582. {block:Caption}{Caption}{/block:Caption}
  583. {/block:Photoset}
  584.  
  585. {block:Video}
  586. {Video-400}
  587. {block:Caption}{Caption}{/block:Caption}
  588. {/block:Video}
  589.  
  590. {block:AudioPlayer}
  591. <div class="audiowrapper">
  592. {block:AlbumArt}
  593. <div class="albumpic"><img src="{AlbumArtURL}"></div>
  594. {/block:AlbumArt}
  595. <div class="trackback">
  596. <div class="pressplay">
  597. {AudioPlayer}
  598. </div></div>
  599. <div class="trackinfo">
  600. {block:TrackName}{TrackName}{/block:TrackName}<br>
  601. {block:Artist}<b>{Artist}</b>{/block:Artist}<br>
  602. {block:Album}<i>{Album}</i>{/block:Album}<br>
  603. </div></div>
  604. {block:Caption}{Caption}{/block:Caption}
  605. {/block:AudioPlayer}
  606.  
  607. <span style="text-align: justify;">
  608.  
  609. {block:Date}
  610.  
  611. {block:PermalinkPage}
  612. {/block:PermalinkPage}
  613.  
  614. {block:PermalinkPage}
  615. {block:NoteCount}
  616. {block:PostNotes}{PostNotes}{/block:PostNotes}
  617. {/block:NoteCount}
  618. {/block:PermalinkPage}
  619. {/block:Date}
  620. </span>
  621.  
  622. </div>
  623.  
  624. <div class="post-footer" style="height: auto; width: 540px; margin-left: 220px; text-align: left; padding: 10px;">
  625.  
  626. <a href="{Permalink}" style="margin-left: -10px; color: {color:permalink};">{DayOfMonth} {ShortMonth} {ShortYear}</a> &nbsp;<span style="color: {color:permalink};">{text:permalink emoji}</span>&nbsp;
  627.  
  628. {block:HasTags}
  629.  
  630. {block:Tags}
  631.  
  632. <a href="{TagURL}" style="text-decoration: none; color: {color:tags}" id="hvr-shrink">
  633.  
  634. #{Tag}</a> &nbsp;
  635. {/block:Tags}
  636.  
  637. {/block:HasTags}
  638.  
  639. </div>
  640.  
  641. <br>
  642.  
  643. {/block:Posts}
  644.  
  645. </div> <!--POSTS CLOSE-->
  646.  
  647. </div> <!--POST WRAP CLOSE-->
  648.  
  649. </div> <!--WRAPPER CLOSE-->
  650.  
  651. </center>
  652.  
  653. <!--CREEEDDDIT-->
  654. <div id="credit">
  655.  
  656. <a href="https://cod.tumblr.com/" target="_blank" title="CODED BY JOYBOY">🦩</a>
  657.  
  658. </div>
  659.  
  660. </body>
  661.  
  662. </html>
  663.  
Advertisement
Add Comment
Please, Sign In to add comment