API tools faq
paste
Advertisement
raingurl

hi high ! theme by salemcer.

raingurl
Apr 20th, 2024
10
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.20 KB | None | 0 0
raw download clone embed print report diff
  1. <!--
  2.  
  3. não sei o nome made by salemcer
  4.  
  5. ⇢ DO NOT remove the credit
  6. ⇢ you can change anything you want for your personal use, but remember, this is NOT a base code so don't make it available to anyone (free or not)!
  7. ⇢ feel free to ask me if you have problems with the code, i will help u
  8. ⇢ please, do not use any parts of this code without permission. i had a lot of difficulty and needed to see a lot of tutorials to update myself and i know you can do the same without stealing my codes.
  9.  
  10. -->
  11.  
  12. <html>
  13. <head>
  14.  
  15. <title>{title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18. {block:Description}
  19. <meta name="description" content="{MetaDescription}" />
  20. {/block:Description}
  21.  
  22. <script src="//pull.cappuccicons.com/cpf.js"></script>
  23.  
  24. <script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>
  25.  
  26. <link rel="preconnect" href="https://fonts.googleapis.com">
  27. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  28. <link href="https://fonts.googleapis.com/css2?family=ABeeZee&display=swap" rel="stylesheet">
  29.  
  30. <link rel="preconnect" href="https://fonts.googleapis.com">
  31. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  32. <link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
  33.  
  34. <meta name="color:background" content="#fefefe"/>
  35. <meta name="color:sidebar" content="#f5f5f5"/>
  36. <meta name="color:posts" content="#ededed"/>
  37. <meta name="color:container" content="#f3f3f3"/>
  38. <meta name="color:borders" content="#dcdcdc"/>
  39. <meta name="color:accent1" content="#f3aa77"/>
  40. <meta name="color:accent2" content="#e88f98"/>
  41. <meta name="color:accent3" content="#c29fc5"/>
  42. <meta name="color:accent4" content="#bad878"/>
  43. <meta name="color:gridbg" content="#bad878"/>
  44.  
  45. <meta name="color:title" content="#787878"/>
  46. <meta name="color:links" content="#252525"/>
  47. <meta name="color:text" content="#252525"/>
  48. <meta name="color:bold" content="#787878"/>
  49. <meta name="color:italic" content="#787878"/>
  50.  
  51. <meta name="if:icon" content="0"/>
  52.  
  53. <meta name="image:background" content=""/>
  54. <meta name="image:sidebar" content="https://placehold.it/220x120"/>
  55. <meta name="image:icon" content="https://placehold.it/48x48"/>
  56. <meta name="image:sidebar png" content="https://placehold.it/100x140"/>
  57. <meta name="image:sidebar img one" content="https://placehold.it/110x90"/>
  58. <meta name="image:sidebar img two" content="https://placehold.it/130x90"/>
  59.  
  60. <meta name="text:title" content="all"/>
  61. <meta name="text:subtitle" content="hi high"/>
  62. <meta name="text:rules" content="your rules here or idk about???"/>
  63. <meta name="text:bsubtitle" content="so poor..."/>
  64. <meta name="text:symbol" content="cp cp-icon-name"/>
  65.  
  66. <meta name="text:sidebar extra link" content="/"/>
  67. <meta name="text:sidebar extra link title" content="extra link here"/>
  68.  
  69. <meta name="text:link one" content="/"/>
  70. <meta name="text:link one title" content="link 1"/>
  71. <meta name="text:link two" content="/"/>
  72. <meta name="text:link two title" content="link 2"/>
  73. <meta name="text:link three" content="/"/>
  74. <meta name="text:link three title" content="link 3"/>
  75. <meta name="text:link four" content="/"/>
  76. <meta name="text:link four title" content="link 4"/>
  77.  
  78. <meta name="text:link extra url" content="/"/>
  79. <meta name="text:link extra title" content="extra"/>
  80.  
  81. <link rel="stylesheet" href="stylesheet.css" type="text/css" charset="utf-8" />
  82.  
  83. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  84. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  85.  
  86. <script>
  87.  
  88. function openNav() {
  89. document.getElementById("mySidenav").style.width = "200px";
  90. }
  91.  
  92. function closeNav() {
  93. document.getElementById("mySidenav").style.width = "0";
  94. }
  95. </script>
  96.  
  97. <script>
  98. // When the user clicks on div, open the popup
  99. function myFunction() {
  100. var popup = document.getElementById("myPopup");
  101. popup.classList.toggle("show");
  102. }
  103. </script>
  104.  
  105. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  106. <script>
  107. $(document).ready(function(){
  108. $('.search').submit(function(event){
  109. var value = $('input:first').val();
  110. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  111. });
  112. });
  113. </script>
  114.  
  115. <!--- VIDEO SCRIPT BY SHYTHEMES ---->
  116.  
  117. <script> $(document).ready(function(){ $('.video iframe').each(function(){ var scale = $(this).parents('.video').width() / 250; $(this).attr({ width: Math.floor($(this).attr('width') * scale), height: Math.floor($(this).attr('height') * scale) });});}); </script>
  118.  
  119. <script>
  120. function openAlytut(evt, alytutName) {
  121. var i, x, tablinks;
  122. x = document.getElementsByClassName("alytut");
  123. for (i = 0; i < x.length; i++) {
  124. x[i].style.display = "none";
  125. }
  126. tablinks = document.getElementsByClassName("tablink")
  127. for (i = 0; i < x.length; i++) {
  128. tablinks[i].className = tablinks[i].className.replace(" tabzact", "");
  129. }
  130. document.getElementById(alytutName).style.display = "block";
  131. evt.currentTarget.className += " tabzact";
  132. }
  133. </script>
  134.  
  135. <style type="text/css">
  136.  
  137. body {
  138. background: {color:background};
  139. background-image: url({image:background});
  140. font-family: 'ABeeZee', sans-serif;
  141. font-size: 11px;
  142. background-repeat: repeat;
  143. color: {color:text};
  144. text-transform: lowercase;
  145. overflow-x: hidden;
  146. }
  147.  
  148. ::-webkit-scrollbar {
  149. display:none;
  150. overflow-x: hidden;
  151. }
  152.  
  153. a { text-decoration: none; color: {color:links}; font-weight: bold;}
  154.  
  155. a:hover { color: {color:accent1}; transition: 0.35s ease-in-out; }
  156.  
  157. b, strong { color: {color:bold}; font-weight: bold; font-size: 11px;}
  158.  
  159. i, italic, em { color: {color:italic}; }
  160.  
  161. u, underline { color: {color:text}; }
  162.  
  163. stroke { color: {color:text}; }
  164.  
  165. h1 { color: {color:accent2}; font-size: 15px; font-weight: bold; font-family: 'Poppins', sans-serif; margin-top: 10px; letter-spacing: 2px; text-align: center; padding-bottom: 8px;}
  166.  
  167. h2 { color: {color:bold}; font-size: 15px; font-weight: bold; font-family:'Poppins', sans-serif; text-align: center; margin-left: -8px;}
  168.  
  169. h3 { font-size: 11px; font-family: 'Poppins', sans-serif; border-top: 1px solid {color:borders}; padding-top: 20px; text-align: center; margin-left: -22px; width: 250px; margin-bottom: 0px;}
  170.  
  171. blockquote {
  172. padding: 0px 8px 0px 18px;
  173. margin: 10px 8px 8px;
  174. border-left:1px solid {color:sideshadow};
  175. }
  176.  
  177. blockquote img {
  178. max-width:100%;
  179. height:auto;
  180. }
  181.  
  182. img {
  183. max-width: 100%;
  184. }
  185.  
  186. ul {list-style: none;
  187. }
  188.  
  189. li {color: color: {color:accent2};}
  190.  
  191. ul li:before {
  192. content: url('https://api.iconify.design/ei:heart.svg?color=%23ed5995&height=8');
  193. vertical-align: -0.125em;
  194. margin-right: 5px;
  195. margin-left: -35px;
  196. color: {color:accent1};
  197. }
  198.  
  199. ::-webkit-scrollbar {
  200. display:none;
  201. }
  202.  
  203. .tmblr-iframe, #tumblr_controls {
  204. position:fixed!important;
  205. z-index: 9!important;
  206. }
  207.  
  208. /* container */
  209.  
  210. .conta {
  211. background: {color:container};
  212. width: 710px;
  213. height: 540px;
  214. top: 50px;
  215. margin-left:calc(50% - 350px);
  216. position: absolute;
  217. border: 1px solid {color:borders};
  218. }
  219.  
  220. /* sidebar 1 */
  221.  
  222. .sidebar {
  223. background: transparent;
  224. width:150px;
  225. height: 217px;
  226. left: 20px;
  227. top: 37px;
  228. position: absolute;
  229. border-radius: 10px;
  230. z-index: 1;
  231. border: 1px solid {color:borders};
  232. }
  233.  
  234. .magenta {
  235. background: {color:posts};
  236. background-image: url({image:sidebar});
  237. width: 88px;
  238. height: 204px;
  239. left: 160px;
  240. top: 0px;
  241. position: absolute;
  242. border-radius: 10px;
  243. border: 1px solid {color:borders};
  244.  
  245. }
  246.  
  247. .subtitle {
  248. background: transparent;
  249. width: 55px;
  250. height: auto;
  251. left: 17px;
  252. top: 12px;
  253. position: absolute;
  254. font-size: 12px;
  255. color: {color:title};
  256. font-family: 'ABeeZee', sans-serif;
  257. text-align: left;
  258. font-weight: bold;
  259. }
  260.  
  261. .tagsa {
  262. background: transparent;
  263. width: 88px;
  264. height: auto;
  265. left: 17px;
  266. top: 30px;
  267. position: absolute;
  268. font-size: 9px;
  269. color: {color:title};
  270. font-family: 'ABeeZee', sans-serif;
  271. text-align: left;
  272. font-weight: bold;
  273. margin-bottom: 2px;
  274. display: inline-block;
  275. }
  276.  
  277. .tagsa li {margin-left: 10px; margin-top: 2px;}
  278.  
  279. .tagsat {width: 42px;
  280. padding: 4px 10px 5px 10px;
  281. background: {color:sidebar};
  282. display: inline-block;
  283. margin-bottom: 0px;
  284. margin-top: 5px;
  285. border-radius: 10px;
  286. margin-left: -5px;
  287. border: 1px solid {color:borders};
  288. z-index: 8;
  289. font-weight: 500;
  290. }
  291.  
  292. .tagsat b {color: {color:accent2}; font-size: 9px;}
  293.  
  294. .verde {
  295. background: {color:posts};
  296. background-image: url({image:sidebar});
  297. width: 150px;
  298. height: 217px;
  299. left: 0px;
  300. top: 0px;
  301. position: absolute;
  302. border-radius: 10px;
  303.  
  304. }
  305.  
  306. .triste {
  307. background: transparent;
  308. width: 48px;
  309. height: 48px;
  310. left: 10px;
  311. top: 69px;
  312. position: absolute;
  313. color: {color:accent3};
  314. font-family: 'ABeeZee', sans-serif;
  315. font-size: 35px;
  316. text-align: center;
  317. font-weight: bold;
  318. }
  319.  
  320. .triste img {
  321. background: transparent;
  322. width: 48px;
  323. height: 48px;
  324. border-radius: 15px;
  325. }
  326.  
  327. .triplex {
  328. background: transparent;
  329. width: 190px;
  330. height: 11px;
  331. left: 0px;
  332. top: 71px;
  333. position: absolute;
  334. color: {color:accent1};
  335. font-family: 'ABeeZee', sans-serif;
  336. font-size: 23px;
  337. text-align: right;
  338. font-weight: bold;
  339. }
  340.  
  341. .triplex i {color: {color:accent1};}
  342.  
  343. .title {
  344. background: transparent;
  345. width: 134px;
  346. height: auto;
  347. left: 17px;
  348. top: 12px;
  349. position: absolute;
  350. font-size: 12px;
  351. color: {color:title};
  352. font-family: 'ABeeZee', sans-serif;
  353. text-align: left;
  354. font-weight: bold;
  355. }
  356.  
  357. .alllinks {
  358. background: transparent;
  359. width: 134px;
  360. height: auto;
  361. left: 17px;
  362. top: 30px;
  363. position: absolute;
  364. font-size: 9px;
  365. color: {color:title};
  366. font-family: 'ABeeZee', sans-serif;
  367. text-align: left;
  368. font-weight: bold;
  369. margin-bottom: 2px;
  370. display: inline-block;
  371. }
  372.  
  373. .alllinks a {color: {color:accent2};}
  374.  
  375. .alllinks li {margin-left: 10px; margin-top: 2px; font-weight: 500;}
  376.  
  377. .ltitle {width: 134px;
  378. display: inline-block;
  379. margin-bottom: 2px;
  380. margin-top: 5px;
  381. }
  382.  
  383. .searchbar {
  384. background: transparent;
  385. width: 134px;
  386. height: auto;
  387. left: 10px;
  388. top: 185px;
  389. position: absolute;
  390. font-size: 9px;
  391. color: {color:title};
  392. font-family: 'ABeeZee', sans-serif;
  393. text-align: left;
  394. font-weight: bold;
  395. }
  396.  
  397. .search .query {
  398. border: 0;
  399. outline: 0;
  400. padding: 5px 13px 6px 10px;
  401. font-family: inherit;
  402. font-size: inherit;
  403. color: inherit;
  404. background-color: {color:sidebar};
  405. border: 1px solid {color:borders};
  406. border-radius: 10px;
  407. }
  408.  
  409. ::-webkit-input-placeholder {color: inherit;}
  410. :-moz-placeholder {color: inherit; opacity:1;}
  411. ::-moz-placeholder {color: inherit; opacity:1;}
  412. :-ms-input-placeholder {color: inherit;}
  413.  
  414. input:focus::-webkit-input-placeholder {color: transparent;}
  415. input:focus:-moz-placeholder {color: transparent;}
  416. input:focus::-moz-placeholder {color: transparent;}
  417. input:focus:-ms-input-placeholder { color: transparent;}
  418.  
  419. .azul {
  420. background: transparent;
  421. width: 220px;
  422. height: 10px;
  423. left: 23px;
  424. top: -20px;
  425. position: absolute;
  426. z-index: 5;
  427. }
  428.  
  429. .baby {
  430. background: {color:sidebar};
  431. width: 100px;
  432. height: auto;
  433. left: -12px;
  434. top: 0px;
  435. position: absolute;
  436. border-radius: 25px;
  437. padding: 7px 15px 7px 15px;
  438. font-size: 9px;
  439. text-align: left;
  440. border: 1px solid {color:borders};
  441. }
  442.  
  443.  
  444. .icons {
  445. background: transparent;
  446. width: 220px;
  447. height: 10px;
  448. left: 0px;
  449. top: 0px;
  450. position: absolute;
  451. border-radius: 25px;
  452. text-align: right;
  453. }
  454.  
  455. .icons a {font-size: 10px; margin-right: 5px;}
  456.  
  457. /* sidebar 2 */
  458.  
  459. #sidebar2 {
  460. background: {color:gridbg};
  461. border-left: 1px solid {color:borders};
  462. border-right: 2px solid {color:borders};
  463. border-bottom: 2px solid {color:borders};
  464. border-top: 19px solid {color:borders};
  465. width:248px;
  466. height:237px;
  467. left: 20px;
  468. top: 265px;
  469. position: absolute;
  470. z-index: 5;
  471. }
  472.  
  473. .carro {
  474. background: transparent;
  475. width: 220px;
  476. height: 11px;
  477. left: 0px;
  478. top: -23px;
  479. position: absolute;
  480. padding: 0px 15px;
  481. color: {color:title};
  482. font-family: 'ABeeZee', sans-serif;
  483. font-size: 9px;
  484. text-align: center;
  485. }
  486.  
  487. .icon {
  488. display: inline;
  489. width: 10px;
  490. height: 10px;
  491. top: 10px;
  492. left: 10px;
  493. stroke-width: 0;
  494. stroke: {color:accent1};
  495. fill: currentColor;
  496. }
  497.  
  498. .icon-one {
  499. color: {color:accent1}; }
  500.  
  501. .icon-two {
  502. color: {color:accent2}; }
  503.  
  504. .icon-three {
  505. color: {color:accent3}; }
  506.  
  507. .chuu {
  508. background: transparent;
  509. width: 100px;
  510. height: 140px;
  511. left: 20px;
  512. top: 80px;
  513. position: absolute;
  514. color: {color:accent3};
  515. font-family: 'ABeeZee', sans-serif;
  516. font-size: 35px;
  517. text-align: center;
  518. font-weight: bold;
  519. z-index: 5;
  520. }
  521.  
  522. .chuu img {
  523. background: transparent;
  524. width: 100px;
  525. height: 140px;
  526. border-radius: 10px 0px 10px 0px;
  527. }
  528.  
  529. .chuubg {
  530. width: 100px;
  531. height: 120px;
  532. background: {color:accent2};
  533. border-left: 1px solid {color:accent3};
  534. border-right: 1px solid {color:accent3};
  535. border-bottom: 1px solid {color:accent3};
  536. border-top: 10px solid {color:accent3};
  537. top: 90px;
  538. left: 19px;
  539. position: absolute;
  540. border-radius: 10px;
  541. z-index: 5;
  542. }
  543.  
  544. .olivia img {
  545. background: transparent;
  546. width: 110px;
  547. height: 90px;
  548. border-radius: 0px 0px 10px 10px;
  549. }
  550.  
  551. .olivia {
  552. width: 110px;
  553. height: 90px;
  554. background: {color:accent2};
  555. border-left: 1px solid {color:accent3};
  556. border-right: 1px solid {color:accent3};
  557. border-bottom: 1px solid {color:accent3};
  558. border-top: 10px solid {color:accent3};
  559. top: 15px;
  560. left: 90px;
  561. position: absolute;
  562. border-radius: 10px;
  563. z-index: 1;
  564. }
  565.  
  566. .gowon img {
  567. background: transparent;
  568. width: 130px;
  569. height: 90px;
  570. border-radius: 0px 0px 10px 10px;
  571. }
  572.  
  573. .gowon {
  574. width: 130px;
  575. height: 90px;
  576. background: {color:accent2};
  577. border-left: 1px solid {color:accent3};
  578. border-right: 1px solid {color:accent3};
  579. border-bottom: 1px solid {color:accent3};
  580. border-top: 10px solid {color:accent3};
  581. top: 109px;
  582. left: 100px;
  583. position: absolute;
  584. border-radius: 10px;
  585. z-index: 6;
  586. }
  587. /* posts */
  588.  
  589. .container {
  590. background: transparent;
  591. width: 400px;
  592. height: 495px;
  593. right: 20px;
  594. top: 22px;
  595. position: absolute;
  596. overflow: scroll;
  597. overflow-x: hidden;
  598. }
  599.  
  600. .posts {
  601. background: {color:posts};
  602. width: 358px;
  603. padding: 8px 20px 20px 20px;
  604. margin-bottom: 20px;
  605. border: 1px solid {color:borders};
  606. margin-top: 0px;
  607. }
  608.  
  609. .perma {
  610. background: {color:sidebar};
  611. height: 15px;
  612. padding: 11px 10px 8px 10px;
  613. border-top: 1px solid {color:borders};
  614. border-left: 1px solid {color:borders};
  615. border-right: 1px solid {color:borders};
  616. }
  617.  
  618. .perma a {
  619. text-decoration:none;
  620. font-size: 10px;
  621. padding: 4px 5px 2px 5px;
  622. color: {color:italic};
  623. font-family: 'ABeeZee', sans-serif;
  624. font-weight: 600;
  625. display: inline;
  626. }
  627.  
  628. .perma a:hover {
  629. color:{color:accent2};
  630. }
  631.  
  632. .tags {
  633. width: 363px;
  634. margin-top: 20px;
  635. text-align: right;
  636. padding: 19px 18px 0px 17px;
  637. border-top: 1px solid {color:borders};
  638. margin-left: -20px;
  639. }
  640.  
  641. .tags a {
  642. text-decoration:none;
  643. font-size: 11px;
  644. text-transform:lowercase;
  645. font-weight: 500;
  646. color:{color:links};
  647. }
  648.  
  649. .tags a:hover {
  650. color: {color:accent3};
  651. }
  652.  
  653. /* muses */
  654.  
  655. #muses {
  656. background: {color:posts};
  657. border-left: 2px solid {color:borders};
  658. border-right: 2px solid {color:borders};
  659. border-bottom: 2px solid {color:borders};
  660. border-top: 19px solid {color:borders};
  661. width:247px;
  662. height:237px;
  663. left: 20px;
  664. top: 265px;
  665. position: absolute;
  666. z-index: 2;
  667. }
  668.  
  669. .musess {
  670. width: 209px;
  671. height: 217px;
  672. top: 20px;
  673. left: 25px;
  674. position:absolute;
  675. background: transparent;
  676. }
  677.  
  678. .musess img {
  679. width: 60px;
  680. width: 60px;
  681. margin-right: 5px;
  682. margin-bottom: 5px;
  683. border-radius: 10px;
  684. }
  685.  
  686. .names {
  687. width: 167px;
  688. height: 42px;
  689. left: 24px;
  690. top: 158px;
  691. padding: 5px 15px 10px 15px;
  692. position: absolute;
  693. background: {color:sidebar};
  694. border-radius: 10px;
  695. border: 1px solid {color:borders};
  696. overflow: scroll;
  697. }
  698.  
  699. .names li {border-bottom: 1px solid {color:borders}; list-style-type: none; margin-bottom: 2px; padding-bottom: 4px; padding-top: 1px; margin-left: -15px; padding-left: 10px; padding-right: 15px; width: 174px; }
  700.  
  701. /* photoset */
  702.  
  703. .pset {
  704. width: auto;
  705. background: transparent;
  706. padding-top: 0px;
  707. margin-left: 10px;
  708. }
  709.  
  710. .pset img {
  711. width: 100%;
  712. margin-left: -10px;
  713. }
  714.  
  715. .photoset-img { width: 380px; /* can be any value you want */ }
  716.  
  717. /* chat */
  718.  
  719. .chatchat {
  720. display: inline-block;
  721. padding-top: 15px;
  722. width: 100%;
  723. }
  724.  
  725. .chatchat b { font-size: 11px; font-weight: bold; padding: 0px 3px 0px 3px; color: {color:accent3};}
  726.  
  727. .chatchat li {
  728. text-align: left;
  729. list-style-type: none;
  730. background: {color:sidebar};
  731. padding: 5px 10px 6px 10px;
  732. margin-bottom: 6px;
  733. border: 1px solid {color:borders};
  734. }
  735.  
  736. /* links */
  737.  
  738. .blebs { text-align: left; padding-top: 10px;}
  739.  
  740. .blebs b { font-size: 17px; font-weight: bold; font-family: 'Poppins', sans-serif; padding: 0px 3px 0px 3px; color: {color:links};}
  741.  
  742. /* quotes */
  743.  
  744. .quotes { padding-top: 18px; font-family: 'Poppins', sans-serif; text-align: center;}
  745.  
  746. .quotes b { font-size: 15px; font-family: 'Poppins', sans-serif; color: {color:bold}; padding: 0px 0px 0px 0px; margin-right: 3px; text-align: center; }
  747.  
  748. /* asks */
  749.  
  750. .askboxx {padding-top: 0px; width: 400px;}
  751.  
  752. .question {
  753. width: 358px;
  754. height: auto;
  755. text-align: justify;
  756. margin-left: -20px;
  757. margin-top: -8px;
  758. padding: 10px 20px 10px 20px;
  759. background-color: {color:sidebar};
  760. border-bottom: 1px solid {color:borders};
  761. }
  762.  
  763. .asker2 {
  764. width: 368px;
  765. padding: 10px 15px;
  766. margin-bottom: 10px;
  767. margin-top: 0px;
  768. margin-left: -20px;
  769. text-align: center;
  770. font-size: 9px;
  771. background: {color:sidebar};
  772. border-bottom: 1px solid {color:borders};
  773. }
  774.  
  775. .asker2 a {color: {color:accent2}; font-size: 9px;}
  776.  
  777. .asker2 b {color: {color:accent2}; font-size: 9px;}
  778.  
  779. .answer {
  780. width: 358px;
  781. margin-top: 17px;
  782. margin-left: -20px;
  783. background: transparent;
  784. padding: 0px 20px 0px 20px;
  785. }
  786.  
  787. /*audio*/
  788.  
  789. .audioall {text-align: left; padding-top: 13px;}
  790.  
  791. #audioplayer {
  792. width:33px;
  793. height:26px;
  794. overflow:hidden;
  795. position:absolute;
  796. margin-top: 10px;
  797. margin-left: 13px;
  798. margin-bottom:45px;
  799. opacity: 0.5;
  800. filter:alpha(opacity=70);
  801. -moz-opacity: 0.7;
  802. -khtml-opacity: 0.7;
  803. border-radius: 30px;
  804. }
  805.  
  806. #albumart { float:left; margin:0px 7px; }
  807.  
  808. #audioartist {
  809. width:204px;
  810. background: {color:background};
  811. height:30px;
  812. margin-top: 8px;
  813. padding: 10px 25px 5px 13px;
  814. overflow:hidden;
  815. }
  816.  
  817. /* video */
  818.  
  819. .tumblr_video_container {
  820. width:auto!important;
  821. height:auto!important;
  822. }
  823.  
  824. /* tabs */
  825.  
  826. .popup {
  827. position: relative;
  828. display: inline-block;
  829. -webkit-user-select: none;
  830. -moz-user-select: none;
  831. -ms-user-select: none;
  832. user-select: none;
  833. }
  834.  
  835. .popup .popuptext {
  836. visibility: hidden;
  837. width: 120px;
  838. height: 163px;
  839. background-color: {color:posts};
  840. color: {color:text};
  841. text-align: justify;
  842. border-radius: 6px;
  843. font-size: 9px;
  844. padding: 0px 15px 0px 15px;
  845. position: absolute;
  846. z-index: 1;
  847. left: -23px;
  848. border-bottom: 8px solid {color:posts};
  849. top: 30px;
  850. overflow: scroll;
  851. }
  852.  
  853. .popup .show {
  854. visibility: visible;
  855. -webkit-animation: fadeIn 1s;
  856. animation: fadeIn 1s;
  857. }
  858.  
  859. @-webkit-keyframes fadeIn {
  860. from {opacity: 0;}
  861. to {opacity: 1;}
  862. }
  863.  
  864. @keyframes fadeIn {
  865. from {opacity: 0;}
  866. to {opacity:1 ;}
  867. }
  868.  
  869. /* notes */
  870.  
  871. .notes {padding: 0px 3px 5px 3px; list-style-type: none; font-size: 10px; border-top: 1px solid {color:posts}; text-align: justify;}
  872.  
  873. .notes li {list-style-type: none; padding-bottom: 5px; text-align: justify;}
  874.  
  875. .notes img {display:none;}
  876.  
  877. .notes a {color: {color:accent2}; font-size: 10px;}
  878.  
  879. /* pagination */
  880.  
  881. .pagina {
  882. width: 38px;
  883. height: auto;
  884. background: {color:sidebar};
  885. position: absolute;
  886. top: 193px;
  887. padding: 4px 10px 5px 10px;
  888. left: 12px;
  889. font-size: 10px;
  890. text-align: center;
  891. border: 1px solid {color:borders};
  892. border-radius: 10px;
  893. }
  894.  
  895. .pagina a {color:{color:title}; font-size: 10px; font-family: 'Poppins', sans-serif; background: transparent; border-radius: 20px; margin-left: 2px;}
  896.  
  897. /* credits. do not touch here!!!!! */
  898.  
  899. .credit {
  900. background: transparent;
  901. color: {color:accent3};
  902. width: auto;
  903. height: auto;
  904. padding: 10px;
  905. left: 10px;
  906. bottom: 10px;
  907. text-align: center;
  908. font-size: 20px;
  909. position: absolute;
  910. }
  911.  
  912. .credit a {color:{color:accent3}; font-size: 20px; font-weight: 800;}
  913.  
  914. </style>
  915.  
  916. <body>
  917.  
  918. <svg> <symbol id="icon-heart" viewBox="0 0 32 32">
  919. <path d="M16.042 8.345c0 0-2-4.262-6.5-4.262-4.917 0-7.5 4.167-7.5 8.333 0 6.917 14 15.5 14 15.5s13.916-8.5 13.916-15.5c0-4.25-2.666-8.333-7.416-8.333s-6.5 4.262-6.5 4.262z"></path>
  920. </symbol>
  921. </svg>
  922.  
  923. <div class="credit"><a href="https://salemcer.tumblr.com" title="theme by salemcer"><i class="cp cp-peach" style="color: {color:accent2}"></i></a></div>
  924.  
  925. <div class="conta">
  926.  
  927. <div id="muses">
  928.  
  929. <div class="carro"><p style="text-align: left; padding-left: 2px;"> <svg class="icon icon-one"><use xlink:href="#icon-heart"></use></svg>
  930. <svg class="icon icon-two"><use xlink:href="#icon-heart"></use></svg>
  931. <svg class="icon icon-three"><use xlink:href="#icon-heart"></use></svg>
  932.  
  933. <i style="text-align: right; padding-left: 115px; vertical-align:2px;">my muses.psd</i></p></div>
  934.  
  935. <div class="musess">
  936. <img src="https://placehold.it/60x60">
  937. <img src="https://placehold.it/60x60">
  938. <img src="https://placehold.it/60x60">
  939. <img src="https://placehold.it/60x60">
  940. <img src="https://placehold.it/60x60">
  941. <img src="https://placehold.it/60x60">
  942. </div>
  943.  
  944. <div class="names">
  945. <li>muse one
  946. <li>muse two
  947. <li>muse three
  948. <li>muse four
  949. <li>muse five
  950. <li>muse six
  951. </div>
  952. </div>
  953.  
  954. <div id="sidebar2">
  955.  
  956. <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" style="margin-left: 0px;">
  957. <defs>
  958. <pattern id="smallGrid" width="10" height="10" patternUnits="userSpaceOnUse">
  959. <path d="M 10 0 L 0 0 0 10" fill="none" stroke="{color:borders}" stroke-width="0.9"/>
  960. </pattern>
  961. <pattern id="grid" width="250" height="237" patternUnits="userSpaceOnUse">
  962. <rect width="250" height="237" fill="url(#smallGrid)"/>
  963. <path d="M 100 0 L 0 0 0 100" fill="none" stroke="none" stroke-width="1"/>
  964. </pattern>
  965. </defs>
  966. <rect width="100%" height="100%" fill="url(#grid)" />
  967. </svg>
  968.  
  969. <div class="olivia"><img src="{image:sidebar img one}"></div>
  970.  
  971. <div class="chuubg"></div>
  972. <div class="chuu"><img src="{image:sidebar png}"></div>
  973.  
  974. <div class="gowon"><img src="{image:sidebar img two}"></div>
  975.  
  976. <div class="carro"><p style="text-align: left; padding-left: 2px;"> <svg class="icon icon-one"><use xlink:href="#icon-heart"></use></svg>
  977. <svg class="icon icon-two"><use xlink:href="#icon-heart"></use></svg>
  978. <svg class="icon icon-three"><use xlink:href="#icon-heart"></use></svg>
  979.  
  980. <i style="text-align: right; padding-left: 118px; vertical-align:2px;">drag me!.psd</i></p></div></div>
  981.  
  982. <div class="sidebar">
  983.  
  984. <div class="magenta">
  985. <div class="subtitle">{text:subtitle}</div>
  986. <div class="tagsa">
  987. <div class="tagsat">algorithm</div>
  988. <div class="tagsat"><b>#tag</b> <b>#tag</b> <b>#tag</b> <b>#tag</b> <b>#tag</b> <b>#tag</b></div>
  989. </div>
  990.  
  991. <div class="triste">
  992. <img src="{image:icon}" class="triste">
  993. </div>
  994.  
  995. <div class="pagina">{block:Pagination}
  996. {block:PreviousPage}
  997. <a href="{PreviousPage}"><</a>
  998. {/block:PreviousPage}
  999. {block:NextPage}
  1000. <a href="{NextPage}">></a>
  1001. {/block:NextPage}{/block:Pagination}</div>
  1002.  
  1003. </div>
  1004.  
  1005. <div class="verde">
  1006. <div class="title">{text:title}</div>
  1007. <div class="alllinks">
  1008. <div class="ltitle"><a href="{text:sidebar extra link}">{text:sidebar extra link title} <i style="color:{color:accent2}">!</i></a></div>
  1009. <div class="ltitle">some links</div>
  1010. <li><a href="{text:link one}">{text:link one title}</a></li>
  1011. <li><a href="{text:link two}">{text:link two title}</a></li>
  1012. <li><a href="{text:link three}">{text:link three title}</a></li>
  1013. <li><a href="{text:link four}">{text:link four title}</a></li>
  1014. <div class="ltitle">infos</div>
  1015. <li>salem</li>
  1016. <li>her/she</li>
  1017. <li>1998</li>
  1018. <li>pisces</li>
  1019. </div>
  1020.  
  1021. <div class="searchbar"><form action="/search" method="get" class="search">
  1022. <input type="text" name="q" value="{SearchQuery}" class="query" placeholder="search tags">
  1023. </form>
  1024. </form></div>
  1025.  
  1026. <div class="triplex"> <i class="{text:symbol}"></i></div>
  1027. </div>
  1028.  
  1029. <div class="azul">
  1030.  
  1031. <div class="baby">{text:bsubtitle}</div>
  1032. <div class="icons">
  1033. <a href="/" title="index"><i class="cp cp-circle" style="color: {color:accent1}"></i></a>
  1034.  
  1035. <a href="/ask" title="askbox"><i class="cp cp-circle" style="color: {color:accent2}"></i></a>
  1036.  
  1037. <a href="#?w=200" class="popup" onclick="myFunction()" title="about"><i class="cp cp-circle" style="color: {color:accent3}"></i>
  1038. </a>
  1039.  
  1040. <a href="{text:link extra url}" title="{text:link extra title}"><i class="cp cp-circle" style="color: {color:accent4}"></i></a>
  1041.  
  1042. </div>
  1043.  
  1044. <div class="popup"><span class="popuptext" id="myPopup">
  1045.  
  1046. <p style="padding-left: 15px;">{text:rules}
  1047. </span></div>
  1048.  
  1049. </div>
  1050.  
  1051.  
  1052. </div>
  1053.  
  1054. <div class="container">
  1055.  
  1056. {block:Posts}
  1057.  
  1058. <div class="perma">
  1059.  
  1060. <span style="float:left;"><a href="{Permalink}" title="{Month} {DayOfMonthWithZero}, {Year} "> <span class="iconify" data-icon="bx:bx-calendar-heart" data-inline="false" style="font-size:13px; vertical-align:-3px; padding-right:2px;"></span> when?</a></span>
  1061.  
  1062. <span style="float:right;">
  1063. {block:ContentSource}<a href="{SourceURL}"> <span class="iconify" data-icon="fluent:bookmark-16-filled" data-inline="false" style="font-size:13px; vertical-align:-4px; padding-right:2px;"></span> source</a>{/block:contentsource}
  1064.  
  1065. {block:NoteCount}<a href="{ReblogURL}" title ="{NoteCountWithLabel}"> <span class="iconify" data-icon="gridicons:reblog" data-inline="false" style="font-size:13px; vertical-align:-4px; padding-right:2px;"></span> reblog </a>{/block:NoteCount}</span>
  1066. </div>
  1067.  
  1068. <div class="posts">
  1069.  
  1070. {block:Title}<h1>{Title}</h1>{/block:Title}
  1071.  
  1072. {block:Text}{Body}{/block:Text}
  1073.  
  1074. {block:Photo}<p><img src="{PhotoURL-400}" alt="{PhotoAlt}"/> {block:Caption}<div class="pset">{Caption}</div>{/block:Caption} {/block:Photo}
  1075.  
  1076. {block:Panorama}{LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/><br>{LinkCloseTag}{block:Caption}<div class="pset">{Caption}</div>{/block:Caption}{/block:Panorama}
  1077.  
  1078. {block:Photoset}<p style="margin-top: -1px;">{Photoset}</p> {block:Caption}<p style="margin-top: 2px;">{Caption}</p>{/block:Caption}{/block:Photoset}
  1079.  
  1080. {block:Quote}<div class="quotes"><b><i>"</i> {Quote}<i>"</i></b><br>{block:Source}<br><h3>— {Source}</h3>{/block:Source}</div>{/block:Quote}
  1081.  
  1082. {block:Link}<div class="blebs"><a href="{URL}" class="link" {Target}><b> <span class="iconify" data-icon="akar-icons:link-chain" data-inline="false" style="vertical-align:-4px; padding-right:5px;";></span> {Name}</b></a>{block:Description}{Description}{/block:Description}</div>{/block:Link}
  1083.  
  1084. {block:Chat}<div class="chatchat">{block:Title}{Title}</a>{/block:Title}
  1085. {block:Lines}<li>{block:Label}<b>{Label}</b>{/block:Label} {Line}</li>{/block:Lines}</div>{/block:Chat}
  1086.  
  1087. {block:Video}<div class="video">{Video-500}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  1088.  
  1089. {block:Audio}<div class="audioall">
  1090.  
  1091. {block:audioplayer} <div id="audioplayer"> {audioplayer} </div> {/block:audioplayer}
  1092.  
  1093. {block:AlbumArt}<div id="albumart"><img src="{AlbumArtURL}" width="45"></div>{/block:AlbumArt}
  1094.  
  1095. {block:trackname} <div id="audioartist">{trackname} {/block:trackname}
  1096.  
  1097. {block:artist} {artist} </div> {/block:artist}
  1098.  
  1099. {block:Caption}<div class="pset">{Caption}</div>{/block:Caption}
  1100. </div>
  1101. {/block:Audio}
  1102.  
  1103. {block:Answer}
  1104. <div class="askboxx">
  1105.  
  1106. <div class="question"> {Question}</div>
  1107.  
  1108. <div class="asker2"><b>{Asker}</b> asked</div>
  1109.  
  1110. <div class="answer">{Answer}</div>
  1111. </div>
  1112.  
  1113.  
  1114. {/block:Answer}
  1115.  
  1116. {block:HasTags}<div class="tags"> {block:Tags} <a href="{TagUrl}"> <span class="iconify" data-icon="fluent:tag-16-regular" data-inline="false"style="font-size:10px; vertical-align:-2px; padding-left:3px; padding-right: 1px;"></span> {Tag} </a>{/block:Tags}</div>{/block:HasTags}
  1117.  
  1118. {block:PermalinkPage}
  1119. {block:PostNotes}
  1120. <div class="notes">{PostNotes}</div>
  1121. {/block:PostNotes}
  1122. {/block:PermalinkPage}
  1123.  
  1124. </div>
  1125. {/block:Posts}
  1126.  
  1127. </div></div>
  1128. <script>
  1129.  
  1130. dragElement(document.getElementById("sidebar2"));
  1131.  
  1132. function dragElement(elmnt) {
  1133. var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
  1134. if (document.getElementById(elmnt.id + "sidebar2")) {
  1135.  
  1136. document.getElementById(elmnt.id + "sidebar2").onmousedown = dragMouseDown;
  1137. } else {
  1138.  
  1139. elmnt.onmousedown = dragMouseDown;
  1140. }
  1141.  
  1142. function dragMouseDown(e) {
  1143. e = e || window.event;
  1144. e.preventDefault();
  1145.  
  1146. pos3 = e.clientX;
  1147. pos4 = e.clientY;
  1148. document.onmouseup = closeDragElement;
  1149.  
  1150. document.onmousemove = elementDrag;
  1151. }
  1152.  
  1153. function elementDrag(e) {
  1154. e = e || window.event;
  1155. e.preventDefault();
  1156.  
  1157. pos1 = pos3 - e.clientX;
  1158. pos2 = pos4 - e.clientY;
  1159. pos3 = e.clientX;
  1160. pos4 = e.clientY;
  1161.  
  1162. elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
  1163. elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
  1164. }
  1165.  
  1166. function closeDragElement() {
  1167. document.onmouseup = null;
  1168. document.onmousemove = null;
  1169. }
  1170. }
  1171. </script>
  1172.  
  1173. </body>
  1174.  
  1175. </html>
  1176.  
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!