API tools faq
paste
6THEMES

SWEET PEACH (MUSE TAB) — THEME BY SIX.

6THEMES
Feb 4th, 2018
594
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.68 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3.  
  4.  
  5.  
  6. ✱ khevinday.tumblr.com -- codes by six. ✱
  7.  
  8. - do not redistribute
  9. - do not copy any parts of the following code
  10.  
  11. ✱ thank you for using my themes! ✱
  12.  
  13. -->
  14. <html>
  15. <head>
  16.  
  17. <!-- META TAGS, SCRIPTS & GOOGLE FONTS -->
  18.  
  19.  
  20. <meta name="color:background" content="#eaeaea">
  21. <meta name="color:container" content="#f5f5f5" />
  22. <meta name="color:container border" content="#e2e2e2"/>
  23. <meta name="color:sidebar" content="#f0f0f0"/>
  24. <meta name="color:posts" content="#f8f8f8" />
  25. <meta name="color:borders" content="#e7e7e7"/>
  26. <meta name="color:accent" content="#c0bdb8" />
  27. <meta name="color:accent shadow" content="#bbb9b4" />
  28. <meta name="color:text" content="#c0bdb8" />
  29. <meta name="color:link" content="#c0bdb8" />
  30. <meta name="color:link hover" content="#fdfdfd" />
  31. <meta name="color:bold" content="#777777" />
  32. <meta name="color:italic" content="#bbbbbb"/>
  33.  
  34. <meta name="image:page bg" content=""/>
  35. <meta name="image:header" content=""/>
  36.  
  37. <meta name="text:tab link title" content="navigate." />
  38. <meta name="text:free link url" content="/URLHERE" />
  39. <meta name="text:free link title" content="tba" />
  40. <meta name="text:title" content="title here" />
  41. <meta name="text:subtitle" content="subtitle here" />
  42. <meta name="text:description" content="desc here" />
  43. <meta name="text:tab title" content="title here" />
  44. <meta name="text:tab subtitle" content="subtitle here" />
  45.  
  46. <meta name="if:grayscale" content="1"/>
  47.  
  48. <link rel="shortcut icon" href="{Favicon}" />
  49. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  50. <title>{Title}</title>
  51. {block:Description}<meta name="description" content="{MetaDescription}" /> {/block:Description}
  52.  
  53. <script>
  54. function openCity(evt, cityName) {
  55. var i, tabcontent, tablinks;
  56. tabcontent = document.getElementsByClassName("tabcontent");
  57. for (i = 0; i < tabcontent.length; i++) {
  58. tabcontent[i].style.display = "none";
  59. }
  60. tablinks = document.getElementsByClassName("tablinks");
  61. for (i = 0; i < tablinks.length; i++) {
  62. tablinks[i].className = tablinks[i].className.replace(" active", "");
  63. }
  64. document.getElementById(cityName).style.display = "block";
  65. evt.currentTarget.className += " active";
  66. }
  67. </script>
  68.  
  69. <script type="text/javascript">
  70. $(document).ready(function(){
  71.  
  72. $('ul.tabs li').click(function(){
  73. var tab_id = $(this).attr('data-tab');
  74.  
  75. $('ul.tabs li').removeClass('current');
  76. $('.tab-content').removeClass('current');
  77.  
  78. $(this).addClass('current');
  79. $("#"+tab_id).addClass('current');
  80. })
  81.  
  82. })
  83. </script>
  84.  
  85. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  86. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  87.  
  88. <script>
  89. (function($){
  90. $(document).ready(function() {
  91. $("a[title]").style_my_tooltips({
  92. tip_follows_cursor:true,
  93. tip_delay_time:90,
  94. tip_fade_speed:600,
  95. attribute:"title"
  96. });
  97. });
  98. })(jQuery);
  99. </script>
  100.  
  101. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  102.  
  103. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  104.  
  105. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  106.  
  107. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  108.  
  109. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css">
  110.  
  111. <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
  112. rel="stylesheet">
  113.  
  114. <link href='https://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
  115.  
  116. <style type="text/css">
  117.  
  118. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop{ position:fixed; white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:.2;transition: .8s ease-in-out; -webkit-transition: .8s ease-in-out;-moz-transition: .8s ease-in-out;-o-transition: .8s ease-in-out; margin-top:2px; z-index:999999999999999;}
  119.  
  120. #s-m-t-tooltip { max-width:300px; border-radius: 8px; padding:0px 5px; margin:25px 20px 5px 0px; color:{color:text}; background: {color:container}; border:1px solid {color:borders}; z-index:99999; font-size:7px; text-transform:uppercase; font-family:arial; letter-spacing:2px; font-weight:bold; z-index:999999999999999; }
  121.  
  122. ::-webkit-scrollbar { width: 1px; height:3px; background: transparent;}
  123. ::-webkit-scrollbar-thumb { background-color: transparent; -webkit-border-radius: 1ex; }
  124.  
  125. /* ---- tumblr controls by @CYANTISTS ---- */
  126.  
  127. iframe.tmblr-iframe { z-index:99999999999999!important; top:0!important; right:0!important; opacity:0.4;
  128.  
  129. transform:scale(0.75); transform-origin:100% 0; -webkit-transform:scale(0.75); -webkit-transform-origin:100% 0; -o-transform:scale(0.75); -o-transform-origin:100% 0; -moz-transform:scale(0.75); -moz-transform-origin:100% 0; -ms-transform:scale(0.75); -ms-transform-origin:100% 0; }
  130.  
  131. iframe.tmblr-iframe:hover { opacity:0.6!important; }
  132.  
  133.  
  134. /* ---- TEXTS & CUSTOM FONTS ----*/
  135.  
  136. @font-face{ font-family:"tamoro"; src: url('https://dl.dropboxusercontent.com/s/awqw1tgpb3takgm/TamoroScript_PersonalUseOnly.ttf’)'); }
  137.  
  138. @font-face{ font-family:"roboto"; src: url('https://dl.dropboxusercontent.com/s/i5x37kqbtb40s0b/Roboto-Light.ttf’)'); }
  139.  
  140. @font-face{ font-family:"robold"; src: url('https://dl.dropboxusercontent.com/s/qynix3bz0j8ppva/Roboto-BoldCondensed.ttf’)'); }
  141.  
  142. @font-face{ font-family:"eloquent"; src: url('https://dl.dropboxusercontent.com/s/v2faujqdedjca02/K22%20Didoni.otf’)'); }
  143.  
  144. @font-face{ font-family:"signerica"; src: url('https://dl.dropboxusercontent.com//s/exj78lvoc594ylo/Signerica_Medium.ttf’)'); }
  145.  
  146. a:link, a:active, a:visited { color: {color:link}; text-decoration:none; }
  147.  
  148. a:hover { color:{color:link hover}; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; }
  149.  
  150. small, sub, sup { font-size:9px; }
  151.  
  152. big { font-size:auto; }
  153.  
  154. b, strong { color:{color:bold} }
  155.  
  156. h1 { background-color:{color:sidebar}; border-radius:8px; font-size:18px; text-align:center; font-family: 'Montserrat'; text-transform:uppercase; letter-spacing:3px; color:{color:text}; font-size:7px; padding:10px; }
  157.  
  158. h2 { text-transform:uppercase; text-align:center; font-family: 'Montserrat'; letter-spacing:4px; font-size:7px; color:{color:italic}; }
  159.  
  160. i, em { color:{color:italic}; }
  161.  
  162. p { margin-top:6px; margin-bottom:6px; }
  163.  
  164. blockquote { padding:0px; padding-left:10px; margin:8px; border-left:1px solid {color:borders}; }
  165.  
  166. img a { border:none; width:100%; }
  167.  
  168. .hvr-sweep-to-right { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: color; -transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; }
  169. .hvr-sweep-to-right:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: {color:sidebar}; opacity:0; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
  170. .hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active { color: white; }
  171. .hvr-sweep-to-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); }
  172.  
  173. /* ---- BODY & CONTAINER ---- */
  174.  
  175.  
  176. body {color:{color:text}; background-color:{color:background}; font-family:arial; font-size:10px; line-height:17px; text-align:justify; background-image:url('{image:page bg}');}
  177.  
  178. #holder { width:530px; height:440px; margin: auto; left:0; top:0; bottom:0; right:0; background-color:{color:container}; position:absolute; padding: 35px; border-radius: 15px; border:1px solid {color:borders}; overflow:hidden; }
  179.  
  180.  
  181. /* ---- GRAPHIC ---- */
  182.  
  183. #graphic { position:absolute; width:460px; height:120px; top:-1px; right:-1px; background-color:{color:sidebar}; z-index:999999999; border-bottom-left-radius:80px; overflow:hidden; }
  184.  
  185.  
  186. /* ---- SIDEBAR ---- */
  187.  
  188. #sidebar { position:absolute; width:180px; height:530px; left: 0px; bottom:0px; background-color:{color:sidebar}; border-radius: 15px; border-top-right-radius:0px; border-bottom-right-radius:0px; border-right:1px solid {color:borders}; overflow:hidden;}
  189.  
  190. #topcircle { position:absolute; width:400px; height:220px; left:-80px; top:-120px; background-color:{color:accent}; border-bottom-right-radius:300px; border-bottom-left-radius:300px; }
  191.  
  192. #bottomcircle { position:absolute; width:400px; height:220px; bottom:-170px; left:-150px; background-color:{color:accent}; border-top-right-radius:300px; border-top-left-radius:300px; }
  193.  
  194. #title { position:absolute; width:165px; height:15px; padding:5px; right:5px; bottom:85px; font-family:'tamoro'; font-size:20px; color:{color:bold}; text-shadow: 1px 1px 2px {color:accent shadow}; text-align:right; background-color:{color:sidebar}; letter-spacing:1.5px; border-radius:5px; }
  195.  
  196. #subtitle { position:absolute; width:175px; height:20px; right: 10px; bottom:75px; font-family:'robold'; font-size:7px; text-transform:uppercase; color:{color:accent shadow}; text-align:right; letter-spacing:4.5px; line-height:20px; }
  197.  
  198. #description { position: absolute; width:120px; height:255px; padding:30px; padding-top:10px; padding-bottom:10px; top:130px; left:0px; font-family: 'robold', sans-serif; font-size:7px; letter-spacing:1px; text-transform:uppercase; font-weight:bold; text-align:justify; line-height:20px; overflow:scroll; }
  199.  
  200. #pagination { margin-top: auto; width: 360px; font-size:9px; padding:15px; text-align:center; letter-spacing:5px;}
  201.  
  202. #pagination a { font-family:arial; font-size:7px; font-style:italic; text-transform:uppercase; color:{color:accent shadow}; font-weight:bold; background:{color:accent}; padding:6px; padding-left:9px; border-radius:100px; }
  203.  
  204.  
  205. /* ---- l i n k s / t a b s ---- */
  206.  
  207. #links { position: absolute; width:150px; height:40px; right:3px; bottom:45px; }
  208.  
  209. ul.tab { position:absolute; overflow:hidden; list-style-type: none; margin: 0; padding: 0; background-color: transparent; right:5px; top:5px; z-index:999999999; }
  210.  
  211. ul.tab li { width: 20px; float:left; margin-left:2px; }
  212.  
  213. ul.tab li a{ display:inline-block; color:{color:posts}; font-size:11px; width:11px; height:11px; padding:3px; border-radius:100px; text-shadow: 4px 3px 2px #eaeaea; }
  214.  
  215. ul.tab li i{ color:{color:text}; }
  216.  
  217. .close { position:absolute; top:5px; right:10px; font-weight:bold; color:#a59f93; z-index:9999999; }
  218. .close:hover { cursor: pointer; }
  219.  
  220. .tabcontent { display: none; height:375; width:360px; padding:0px; margin-left:292px; margin-top:0px; background-color:transparent; z-index:9999; -webkit-animation: fadeEffect 1s; animation: fadeEffect 1s; }
  221.  
  222. .tabcontent.current{ display: inherit; }
  223.  
  224. @-webkit-keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;} }
  225.  
  226. @keyframes fadeEffect { from {opacity: 0;} to {opacity: 1;} }
  227.  
  228.  
  229. /* ---- navigation tab ---- */
  230.  
  231. #tabone { position:absolute; right:0px; bottom:0px; width: 419px; height:390px; background-color:{color:container}; overflow:hidden; }
  232.  
  233. #tabdesc { position:absolute; width:350px; height:65px; left:20px; top:20px; border:10px solid transparent; border-radius: 10px; background-color:{color:sidebar}; overflow:auto; font-family:robold; font-size:7px; text-align:justify; text-transform:uppercase; letter-spacing:1.5px; }
  234.  
  235. #tabdesc big { font-size:10px; color:{color:bold};}
  236.  
  237. #navi { position:absolute; width:150px; height:205px; right:20px; bottom:50px; padding:10px; border-radius: 10px; background-color:{color:sidebar}; overflow:scroll;}
  238.  
  239. #navi li { width: 110px; list-style:none; float:left; margin-right:55px;}
  240.  
  241. #navi a { color:{color:text}; font-size:8px; width:110px; height:19px; padding:7px; border-left: 25px solid {color:background}; margin-bottom:10px; font-family: robold; font-weight:bold; text-transform:uppercase; text-align:center; letter-spacing:4px; line-height:18px; background:{color:background}; text-shadow: 0 0 0.2em {color:text}; border-radius:10px; }
  242.  
  243. #navi .icon { position:absolute; background:{color:italic}; width: 13px; left:-20px; height:13px; padding:5px; line-height:10px; text-align:center; border-radius:100px; font-size:13px; color:{color:posts}; top:4px; }
  244.  
  245. #navi .icon i { font-size:13px; color:{color:posts}; text-shadow: none;}
  246.  
  247. #rules { position:absolute; width:170px; height:175px; left:20px; bottom:50px; padding:10px 0px; border:15px solid transparent; border-radius: 10px; background-color:{color:sidebar}; overflow:auto; font-family:robold; font-size:7px; text-align:justify; text-transform:uppercase; letter-spacing:1.5px; }
  248.  
  249. #rules span { float: left; font-family: 'eloquent', sans-serif; font-size: 340%; line-height:60%; width: 1.0em; color:{color:italic}; }
  250.  
  251. #rules tt { float: right; font-family: 'eloquent', sans-serif; font-size: 340%; line-height:60%; width: 1.0em; color:{color:italic}; text-align:right; }
  252.  
  253. #subtitle2 { position:absolute; width:400px; height:15px; left:20px; bottom:30px; border-radius: 10px; font-family:'robold'; font-size:7px; color:{color:bold}; line-height:25px; text-align:center; letter-spacing: 7px; text-transform:uppercase; text-shadow: 0 0 0.1em {color:bold};}
  254.  
  255. #title2 { position:absolute; width:400px; height:15px; left:20px;bottom:18px; border-radius: 10px; font-family:tamoro; font-size:23px; color:{color:italic}; line-height:25px; text-align:center; text-shadow: 0 0 0.1em {color:italic};}
  256.  
  257. /* ---- muse tab ---- */
  258.  
  259. #tabtwo { position:absolute; right:0px; bottom:0px; width: 419px; height:390px; background-color:{color:container}; overflow:hidden; }
  260.  
  261. #muses { position:absolute; width: 419px; height:380px; overflow:auto; top:25px; }
  262.  
  263. #muses li { width:155px; height: 120px; list-style:none; float:left; margin-left: 25px; margin-right:6px; margin-bottom:20px; border: 5px double {color:posts}; border-radius:10px; }
  264.  
  265. #muse { position:absolute; margin-left:8px; margin-top:8px; width:155px; height:120px; border-radius:10px; background-color:{color:posts}; overflow:hidden; 15px; }
  266.  
  267. .name { position: absolute; margin:0px; width:155px; height:120px; background-color: rgba(0,0,0,0.3); text-align:center; line-height:120px; font-family:'tamoro'; font-size:18px; letter-spacing:1px; text-transform:lowercase; font-weight:100; color:{color:posts}; text-shadow: 0 0 0.2em {color:posts}; opacity:0; border-radius:10px; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; transition: all 0.4s linear; }
  268.  
  269. .name a { color:{color:posts}; }
  270.  
  271. .name:hover { opacity:1; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; transition: all 0.4s linear; }
  272.  
  273.  
  274. /* ---- P O S T S ---- */
  275.  
  276. #container { position:absolute; width: 390px; height:395px; right:20px; bottom:0px; overflow:auto; padding-top:15px; }
  277.  
  278. .posts { width:350px; text-align: justify; padding: 10px; padding-top:40px; background-color:{color:posts}; margin:30px 15px 10px 15px; float:left; border:1px solid {color:borders}; border-radius:10px; }
  279.  
  280. .posts a{ {color:link}; }
  281.  
  282. .posts img { max-width:100%; {block:IfGrayscale} -webkit-filter:grayscale(100%); {/block:IfGrayscale} }
  283.  
  284. .photoset { max-width:100%; {block:IfGrayscale} -webkit-filter:grayscale(100%); {/block:IfGrayscale} }
  285.  
  286. .video { {block:IfGrayscale} -webkit-filter:grayscale(100%); {/block:IfGrayscale} }
  287.  
  288. #info { position:absolute; margin-left:-11px; margin-top:-41px; margin-bottom:10px; width:364px; padding:3px; height:24px; overflow:hidden; background-color: {color:sidebar}; text-align:right; font-size:12px; font-weight:bold; border:1px solid {color:borders}; overflow:hidden; border-top-left-radius:10px; border-top-right-radius:10px;}
  289.  
  290. #information { position:absolute; margin-left:-4px; margin-top:-4px; width:296px; padding:3px 10px; height:24px; overflow:hidden; background-color: {color:sidebar}; text-align:right; font-family: 'Montserrat', sans-serif; font-size:7px; letter-spacing:3px; text-transform:uppercase; line-height:26px; border:1px solid {color:borders}; overflow:hidden;}
  291.  
  292. #information i { font-size:10px; letter-spacing:3px;}
  293.  
  294. #tags { padding-top:0px; width:350px;letter-spacing:2px; text-align:justify; font-weight:bold; margin-top:10px; margin-left:-11px; margin-bottom:-11px; background:{color:sidebar}; padding:10px; line-height:12px; border:1px solid {color:borders}; border-bottom-left-radius:10px; border-bottom-right-radius:10px; }
  295.  
  296. #tags a { font-family: 'Montserrat', sans-serif; font-size:7px; padding:0px; font-weight:bold; letter-spacing:1px; text-transform:uppercase; }
  297.  
  298. #tags i { color:{color:text}; font-size:12px; text-shadow:none; }
  299.  
  300. #tags b { font-family:'arial'; letter-spacing:4px; font-size:7px; text-transform:uppercase; font-style:italic; color:{color:italic};}
  301.  
  302. /* ---- a s k s ---- */
  303.  
  304. #question { padding:25px; margin:-11px; margin-bottom:10px; text-align:justify; background-color:{color:posts}; border: 1px solid {color:borders}; }
  305.  
  306. #question b { color:{color:italic}; font-size:7px; text-transform:uppercase; font-family:robold; letter-spacing:2px; font-weight:bold; }
  307.  
  308. #question i { font-size:12px; color:{color:italic}; letter-spacing:8px; }
  309.  
  310. #question tt { font-family:sacramento; font-size:20px; text-transform:lowercase; letter-spacing:1px; }
  311.  
  312. /* ---- a u d i o ---- */
  313.  
  314. .playwrapper { height:60px; padding-bottom:5px; overflow:hidden; position:relative; padding:5px; background:{color:page border}; border:5px solid {color:accent}; border-radius:4px; }
  315.  
  316. .coverart { width:60px; height:60px; position:relative; display:inline-block; background-size:cover; border-top-left-radius:7px; border-bottom-left-radius:7px; {block:IfGrayscale} -webkit-filter:grayscale(100%); {/block:IfGrayscale} }
  317.  
  318. .audio { position:absolute; display:inline-block; top:0px; bottom:0px; left:0px; right:0px; text-align:left; }
  319.  
  320. .player { width:50px; height:50px; margin-top:5px; margin-left:5px; padding:5px; position:absolute; overflow:hidden; background-color:#fff; opacity:0; -o-transition:opacity .25s ease-out; -moz-transition:opacity .25s ease-out; -webkit-transition:opacity .25s ease-out; transition:opacity .25s ease-out; }
  321.  
  322. .player:hover { opacity:.8; }
  323.  
  324. .player .audio_player { width:30px; height:30px; margin-top:15px; margin-left:10px; overflow:hidden; }
  325.  
  326. .songinfo { border-left:5px solid {color:accent}; position:absolute; overflow:hidden; width:200px; height:40px; padding:15px; background:{color:page border}; margin-left:70px; margin-top:0px; text-align:left; font-size:7px; line-height:10px; font-family: 'Montserrat', sans-serif; text-transform:uppercase;letter-spacing:1px; color:{color:text}; text-shadow: 0 0 0.1em {color:text}; }
  327.  
  328. /* ---- q u o t e s ---- */
  329.  
  330. #quote{ text-align:center; font-size:18px; font-family:'georgia'; letter-spacing:1px; padding:15px; font-style:italic;}
  331.  
  332. #source { font-size:7px; font-family: 'Montserrat', sans-serif; text-transform:uppercase;letter-spacing:1px; padding:5px; text-align:right; margin-bottom:-10px;}
  333.  
  334. /* ---- c h a t s ---- */
  335.  
  336. .answer span,.convo li{margin:0 0 10px;border-radius:1em;padding:.5em 10px;max-width:75%;clear:both;position:relative}.answer .them,.user_1,.user_3,.user_5,.user_7,.user_9,.user_11{float:left;background:{color:container};color:{color:text};left:3px}.me::after,.user_1::after,.user_3::after,.user_5::after,.user_7::after,.user_9::after,.user_11::after{content:"";position:absolute;left:-.5em;bottom:0;width:.5em;height:1em;border-right:.5em solid {color:container} ;border-bottom-right-radius:1em .5em}.answer .me,.user_2,.user_4,.user_6,.user_8,.user_10,.user_12{right:3px;float:right;background-color:{color:sidebar};color:{color:text}}.them::after,.user_2::after,.user_4::after,.user_6::after,.user_8::after,.user_10::after,.user_12::after{content:"";position:absolute;right:-.5em;bottom:0;width:.5em;height:1em;border-left:.5em solid {color:sidebar};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  337. .asked p { text-align: left; margin: 0 0px 10px 0px; padding: 0; color: {color:bold}; font-family: 'Inconsolata', Inconsolata; font-size: 12px; line-height: 0px; }
  338. .footerright .viasrc { float: left; }
  339. .asked a { margin:0;padding:0; }
  340. .convo { overflow: hidden; list-style-type: none; padding: 0; margin: 0; }
  341.  
  342. /* ---- p e r m a l i n k ----*/
  343.  
  344. #notecontainer { margin-top: auto; width: 400px; font-size:9px; padding:10px;}
  345.  
  346. #notecontainer img.avatar { margin-right: 10px; width: 16px; height: 16px; border-radius:100px; -webkit-filter:grayscale(100%); }
  347.  
  348. /* ---- credit, do not delete unless you want these hands ---- */
  349.  
  350. #credit { position:fixed; bottom:10px; left:10px; font-size:14px; width:14px; height:14px; font-family:arial; color:{color:text}; font-weight:bold; text-transform:uppercase; letter-spacing: 0px; font-style:normal; background:{color:sidebar}; border-radius:100px; padding:8px;}
  351. #credit a { color:{color:text}; font-weight:bold;letter-spacing:1px; }
  352. #credit i { color:{color:text}; font-size:14px; }
  353.  
  354. /* ---- l i k e & r e b l o g ---- */
  355.  
  356. .buttons { width:50px; height:44px; padding:3px; margin:0px; margin-left:304px; margin-top:-17px; font-size:13px; }
  357.  
  358. svg { width:13px; height:auto; opacity:.5; padding:1px; display:block; overflow:visible; }
  359.  
  360. .controls a { position:relative; display:inline-block; overflow:hidden; padding:5px 0px; width:15px; height:26px; color:{color:link}; text-shadow: 0 0 0.1em {color:link}; }
  361.  
  362. .controls .reblog svg { width:11px; margin-top:1px; }
  363.  
  364. .controls .like .liked + svg path { margin-top:-20px; fill:#ec5a5a; }
  365.  
  366. .controls .like .like_button { position:relative; }
  367.  
  368. .controls .like .like_button iframe { position:absolute; top:0; left:0; bottom:0; right:0; z-index:2; opacity:0; }
  369.  
  370. </style>
  371. </head>
  372.  
  373.  
  374. <body>
  375.  
  376.  
  377.  
  378. <div id="holder">
  379.  
  380.  
  381. <div id="graphic"> <img src="{image:header}"> </div>
  382.  
  383. <div id="sidebar">
  384.  
  385. <div id="topcircle"> </div>
  386.  
  387. <div id="title">{text:title}</div>
  388. <div id="subtitle"> {text:subtitle} </div>
  389.  
  390. <div id="description">{text:description}</div>
  391.  
  392. <div id="links">
  393.  
  394. <ul class="tab">
  395. <li><a href="/" class="tablinks" title="refresh."> <i class="icon-home"></i></a></li>
  396. <li><a href="/ask" class="tablinks" title="message."> <i class="icon-bubbles"></i></a></li>
  397. <li><a href="#" class="tablinks" onclick="openCity(event, 'tabone')" title="{text:tab link title}"> <i class="icon-globe"></i></a></li>
  398. <li><a href="#" class="tablinks" onclick="openCity(event, 'tabtwo')" title="{text:free link title}"> <i class="icon-heart"></i></a></li>
  399. </ul>
  400. </div>
  401.  
  402. <div id="bottomcircle"> </div>
  403.  
  404.  
  405. </div>
  406.  
  407. <!-- N A V I T A B -->
  408.  
  409. <div id="tabone" class="tabcontent">
  410. <span onclick="this.parentElement.style.display='none'" class="close"> x </span>
  411.  
  412. <!-- TAB ONE DESCRIPTION GOES HERE -->
  413.  
  414. <div id="title2"> {text:tab title}</div>
  415. <div id="subtitle2"> {text:tab subtitle} </div>
  416.  
  417. <div id="tabdesc"> <big><i>theme twenty-eight: sweet peach.</i></big> lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </div>
  418.  
  419. <!-- NAVIGATION LINKS GO HERE -->
  420.  
  421. <div id="navi">
  422. <li><a href="/url." class="hvr-sweep-to-right" class="tablinks"> <div class="icon"><i class="material-icons">loyalty</i></div> link tba. </a></li>
  423.  
  424. <li><a href="/url." class="hvr-sweep-to-right" class="tablinks"><div class="icon"><i class="material-icons">healing</i></div> link tba </a></li>
  425.  
  426. <li><a href="/url." class="hvr-sweep-to-right" class="tablinks"> <div class="icon"><i class="material-icons">lightbulb_outline</i></div> link tba. </a></li>
  427.  
  428. <li><a href="/url." class="hvr-sweep-to-right" class="tablinks"><div class="icon"><i class="material-icons">whatshot</i></div> link tba </a></li>
  429.  
  430. <li><a href="/url." class="hvr-sweep-to-right" class="tablinks"> <div class="icon"><i class="material-icons">favorite</i></div> link tba. </a></li>
  431. </div>
  432.  
  433. <!-- GUIDELINES INFORMATION GOES HERE -->
  434.  
  435. <div id="rules">
  436. <span>1</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.<br><br>
  437.  
  438. <tt>2</tt> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.<br><br>
  439.  
  440. <span>3</span> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit.<br><br>
  441.  
  442. <tt>4</tt> Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit,
  443. </div>
  444.  
  445. </div>
  446.  
  447.  
  448. <!-- M U S E T A B -->
  449.  
  450. <div id="tabtwo" class="tabcontent">
  451. <span onclick="this.parentElement.style.display='none'" class="close"> x </span>
  452.  
  453. <div id="muses">
  454.  
  455. <!-- m u s e b o x b e g i n -->
  456.  
  457. <li> <div id="muse">
  458. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  459. <img src="http://i66.tinypic.com/xpmyjr.pngg">
  460. </div> </li>
  461.  
  462. <!-- m u s e b o x e n d. to add more muses, just copy and paste this section. you can add as many as you want. -->
  463.  
  464.  
  465. <li> <div id="muse">
  466. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  467. <img src="http://i66.tinypic.com/xpmyjr.png">
  468. </div> </li>
  469.  
  470. <li> <div id="muse">
  471. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  472. <img src="http://i66.tinypic.com/xpmyjr.png">
  473. </div> </li>
  474.  
  475. <li> <div id="muse">
  476. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  477. <img src="http://i66.tinypic.com/xpmyjr.png">
  478. </div> </li>
  479.  
  480. <li> <div id="muse">
  481. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  482. <img src="http://i66.tinypic.com/xpmyjr.png">
  483. </div> </li>
  484.  
  485. <li> <div id="muse">
  486. <div class="name"><a href="/URLHERE"> NAME. </a></div>
  487. <img src="http://i66.tinypic.com/xpmyjr.png">
  488. </div> </li>
  489.  
  490. </div>
  491.  
  492. </div>
  493. <!-- PLEASE DO NOT REMOVE MY CREDIT -->
  494.  
  495. <div id="credit"><a href="http://khevinday.tumblr.com/" title="codes by six"><i class="icon-star"></i></span></a></div>
  496.  
  497. <!-- YOU CAN TOUCH THE REST IF U WANT THO LMAO -->
  498.  
  499.  
  500.  
  501. <div id="container">
  502. {block:posts}
  503.  
  504. <div class="posts" id="{PostID}">
  505.  
  506. {block:Date}<div id="info">
  507.  
  508. <div id="information"> <i class="icon-graph"></i> <a href="{Permalink}">{TimeAgo} {block:NoteCount} with {NoteCountWithLabel} {/block:NoteCount} </a> {block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  509. {/block:NoRebloggedFrom}</div>
  510. <div class="buttons"><div class="controls">
  511. <a href="{ReblogURL}" target="_blank" class="reblog">
  512. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><span class="lnr lnr-redo"></span></g></g></svg>
  513. </a>
  514. <a href="#" class="like">{LikeButton}
  515. <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><span class="lnr lnr-heart"></span></g></g></svg>
  516. </a>
  517. </div></div>
  518.  
  519. </div>{/block:Date}
  520.  
  521.  
  522. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  523.  
  524. {block:Quote}<div id="quote">“{Quote}” </div> <div id="source">— {Source}</div>{/block:Quote}
  525.  
  526. {block:Link}<a href="{URL}"><h1>{Name}</h1></a>
  527. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  528.  
  529. {block:Photo}<center><img src="{PhotoURL-500}"/></center>
  530. {block:Caption}{Caption}{/block:Caption}{/block:Photo}
  531.  
  532. {block:Photoset}<center>{Photoset-500}</center>
  533. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  534.  
  535. {block:Chat} {block:Title}
  536. <h1>{Title}</h1>{/block:Title}<br>
  537. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  538. {Line}</li>{/block:Lines}</ul> {/block:Chat}
  539.  
  540. {block:Video}<div class="video">{Video-500}</div>{block:Caption}{Caption}{/block:Caption}{/block:Video}
  541.  
  542. {block:Answer}<div id="question"><i class="fa fa-user" aria-hidden="true"> </i><b>{Asker} says: </b> {Question}</div>{Answer}{/block:Answer}
  543.  
  544. {block:Audio}<div class="playwrapper"><div class="coverart" style="{block:AlbumArt}background-image:url({AlbumArtURL});{/block:AlbumArt}"></div><div class="audio">{block:AudioPlayer}<div class="player">{AudioPlayerWhite}</div>{/block:AudioPlayer}<div class="songinfo"> {block:TrackName}{TrackName}{/block:TrackName}<br/>{block:Artist}Artist: {Artist}{/block:Artist}<br/> {block:Album}Album: {Album}{/block:Album}<br/> {PlayCountWithLabel}</div></div></div>{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  545.  
  546. {block:HasTags}
  547. <div id="tags">
  548. <b>filed under:</b> {block:Tags} <a href="{TagURL}">{Tag},</a> {/block:Tags}
  549. </div>{/block:HasTags}
  550.  
  551. </div> <!---posts div--->
  552.  
  553. {block:PostNotes}
  554. <div id="notecontainer">{PostNotes}</div>
  555. {/block:PostNotes}
  556. {/block:Posts}
  557. {block:ContentSource}{SourceURL}
  558. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  559. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}
  560. {/block:ContentSource}
  561.  
  562.  
  563. {block:Pagination}<div id="pagination">{block:PreviousPage}<a href="{PreviousPage}">prev</a> {/block:PreviousPage} {block:NextPage}<a href="{NextPage}">next</a><br />{/block:NextPage}</div>{/block:Pagination}
  564.  
  565. </div> <!---container div--->
  566. </div> <!--- holder div --->
  567.  
  568.  
  569. </body>
  570. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
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!