API tools faq
paste
Advertisement
destinatia

THEME 001: ✧ * º • ☾ EVERLONG. ❜ — destinatiia

destinatia
Apr 18th, 2016
3,648
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.78 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. ✧ * ☾ destinatiia.tumblr.com * ✧
  8.  
  9. - you're allowed edit as much as you want, but don't repost and claim as your own afterwards.
  10. - don't move the credit or put it in another page
  11. - don't take fragments from this code and paste it on your own. it's rude as i worked real hard on this one so.
  12. - base code made by neonbikethemes as always,,,, absolutely blessed for their existence thank u
  13. - also credits to animalites for the imessage chat code !!
  14. -the icons in the preview were NOT made by me so credit to their rightful owners
  15. -enjoy !! and if you have any questions and/or problems just hmu
  16.  
  17. -->
  18.  
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}" />
  21. {/block:Description}
  22. <meta charset="utf-8">
  23. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  24. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27.  
  28. <meta name="color:background" content="#ffffff" />
  29. <meta name="color:sidebar bg" content="#ffffff" />
  30. <meta name="color:container bg" content="#ffffff" />
  31. <meta name="color:question bg" content="#ffffff" />
  32. <meta name="color:tags bg" content="#ffffff" />
  33. <meta name="color:title color" content=""/>
  34. <meta name="color:borders" content=""/>
  35. <meta name="color:icon shadow" content=""/>
  36. <meta name="color:description bg" content=""/>
  37. <meta name="color:sidebar links" content="#000000" />
  38. <meta name="color:links" content="#000000" />
  39. <meta name="color:links hover" content="#a0a0a0" />
  40. <meta name="color:tooltip color" content="#a0a0a0" />
  41. <meta name="color:text" content="#000000" />
  42. <meta name="color:text shadow" content="#eee" />
  43. <meta name="color:posts" content="#ffffff" />
  44. <meta name="color:box shadow" content="#999" />
  45. <meta name="color:bold" content="#ffffff" />
  46. <meta name="color:italic" content="#ffffff" />
  47. <meta name="color:accent" content="#ffffff" />
  48.  
  49. <meta name="image:background" content=""/>
  50. <meta name="image:icon" content=""/>
  51. <meta name="image:icon2" content=""/>
  52. <meta name="image:nav img 1" content=""/>
  53. <meta name="image:nav img 2" content=""/>
  54. <meta name="image:nav img 3" content=""/>
  55. <meta name="image:nav img 4" content=""/>
  56.  
  57. <meta name="text:link one" content="" />
  58. <meta name="text:link one title" content="" />
  59. <meta name="text:link one text" content="UN" />
  60. <meta name="text:link two" content="" />
  61. <meta name="text:link two title" content="" />
  62. <meta name="text:link two text" content="DEUX" />
  63. <meta name="text:link three" content="" />
  64. <meta name="text:link three title" content="" />
  65. <meta name="text:link three text" content="TROIS" />
  66. <meta name="text:tab 1 title" content="title" />
  67. <meta name="text:tab 2 title" content="title" />
  68. <meta name="text:tab 3 title" content="title" />
  69. <meta name="text:your user goes here" content="for example,, destinatiia" />
  70.  
  71. <meta name="if:text as links" content="0"/>
  72. <meta name="if:full opacity for sidebar and container" content="0"/>
  73.  
  74.  
  75.  
  76.  
  77. <!-- this is just a whole bunch of scripts AND I'D SUGGEST YOU NOT TO TOUCH THEM yeah thank you -->
  78.  
  79. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  80.  
  81. <link href='https://fonts.googleapis.com/css?family=Kaushan+Script' rel='stylesheet' type='text/css'>
  82.  
  83.  
  84. <script src="http://static.tumblr.com/me5sfsd/1YFl414t0/jquery142.js"></script>
  85. <script type="text/javascript">
  86. $(document).ready(function () {
  87. $('li.drawer div:nth-child(2)').hide();
  88. $('li.drawer h4').click(function () {
  89. if ($(this).hasClass('open')) {
  90. $('li.drawer div:visible:nth-child(2)').slideUp().prev().removeClass('open');}
  91. else {
  92. $('li.drawer div:visible:nth-child(2)').slideUp().prev().removeClass('open');
  93. $(this).next().slideDown();
  94. $(this).addClass('open');}
  95. });
  96. });
  97. </script>
  98.  
  99.  
  100. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  101. <link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
  102.  
  103. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  104. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  105.  
  106. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  107.  
  108.  
  109.  
  110. <script type="text/javascript">
  111. /* Photoset Resize Code by Kevin - EXCOLO.TUMBLR.COM */
  112. $(document).ready(function() {
  113. function photosetResize() {
  114. $('iframe.photoset').each(function(){
  115. var newSize = 380;
  116. var newSrc = $(this).attr('src').replace('500',newSize);
  117. $(this).attr('src', newSrc).width(newSize);
  118. var high = $(this).css('height');
  119. var calculate = parseInt(high, 10)* newSize/500;
  120. $(this).css('height', calculate);
  121. });
  122. }
  123. photosetResize();
  124. });
  125. </script>
  126.  
  127.  
  128.  
  129. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  130.  
  131. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  132. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  133. <script>
  134. (function($){
  135. $(document).ready(function(){
  136. $("a[title]").style_my_tooltips({
  137. tip_follows_cursor:true,
  138. tip_delay_time:90,
  139. tip_fade_speed:600,
  140. attribute:"title"
  141. });
  142. });
  143. })(jQuery);
  144. </script>
  145.  
  146. <script type="text/javascript">
  147. <!--
  148. function toggle_visibility(id) {
  149. var e = document.getElementById(id);
  150. if(e.style.display == 'block')
  151. e.style.display = 'none';
  152. else
  153. e.style.display = 'block';
  154. }
  155. //-->
  156. </script>
  157.  
  158.  
  159. <style type="text/css">
  160.  
  161.  
  162. /* ---------------------------- GENERAL ----------------------------- */
  163.  
  164. /* -------- SELECTION TOOL ------- */
  165.  
  166. ::-moz-selection {
  167. background: {color:text};
  168. color: {color:background};
  169. }
  170.  
  171. ::selection {
  172. background: {color:text};
  173. color: {color:background};
  174. }
  175.  
  176. /* -------- SCROLLBAR ------- */
  177.  
  178. ::-webkit-scrollbar {
  179. width: 9px;
  180. visibility:hidden;
  181. }
  182.  
  183. /* Track */
  184. ::-webkit-scrollbar-track {
  185. background:{color:background};
  186. visibility:hidden;
  187. }
  188.  
  189. /* Handle */
  190. ::-webkit-scrollbar-thumb {
  191. background:{color:text};
  192. visibility:hidden;
  193. }
  194. ::-webkit-scrollbar-thumb:window-inactive {
  195. background: transparent;
  196. visibility:hidden;
  197. }
  198.  
  199. /* ------- TOOLTIPS ------ */
  200.  
  201. #s-m-t-tooltip {
  202. max-width:300px;
  203. padding:7px;
  204. border-radius:20px;
  205. margin:10px 0px 0px 10px;
  206. background-color:{color:tooltip color};
  207. font-family:'montserrat',sans serif;
  208. font-size:10px;
  209. color:{color:bold};
  210. box-shadow: 3px 3px 5px {color:box shadow};
  211. z-index:999999999999999999999999999999999999;
  212. }
  213.  
  214. /* -------- BASICS ------- */
  215.  
  216. body {
  217. background:url('{image:background}');
  218. background-color:{color:background};
  219. color: {color:text};
  220. overflow-y:hidden;
  221. font-family: calibri;
  222. font-size: 10px;
  223. margin: 0;
  224. letter-spacing:0.5px;
  225. text-shadow: 2px 2px 2px {color:text shadow};
  226. padding: 0;
  227. word-wrap: break-word;
  228. line-height:160%;
  229. }
  230.  
  231. sup, sub, small {
  232. font-size:9px;
  233. }
  234.  
  235. h1 {
  236. font-family:'montserrat', sans serif;
  237. font-size:24px;
  238. color: {color:bold};
  239. }
  240.  
  241.  
  242. h2 {
  243. font-family:'montserrat', sans serif;
  244. font-size:18px;
  245. font-style:italic;
  246. color: {color:bold};
  247. }
  248.  
  249.  
  250. a {
  251. color: {color:links};
  252. text-decoration: none;
  253. -webkit-transition: all .3s;
  254. -moz-transition: all .3s;
  255. -o-transition: all .3s;
  256. -ms-transition: all .3s;
  257. transition: all .3s;
  258. }
  259.  
  260. b, strong {
  261. color: {color:bold};
  262. font-family:'montserrat', sans serif;
  263. }
  264.  
  265. i, em {
  266. color: {color:italic};
  267. font-family:'montserrat', sans serif;
  268. }
  269.  
  270. s, strike {
  271. color: {color:bold};
  272. font-family:'montserrat', sans serif;
  273. }
  274.  
  275. u,underline {
  276. color: {color:italic};
  277. font-family:'montserrat', sans serif;
  278. }
  279.  
  280. a:hover{
  281. color:{color:links hover};
  282. -webkit-transition: all .3s;
  283. -moz-transition: all .3s;
  284. -o-transition: all .3s;
  285. -ms-transition: all .3s;
  286. transition: all .3s;
  287. }
  288.  
  289. blockquote {
  290. border-left: 1px solid {color:text};
  291. margin: 10px;
  292. padding-left:25px;
  293. padding-top:3px;
  294. padding-bottom:3px;
  295. }
  296.  
  297. iframe, img, embed, object, video {
  298. max-width: 100%;
  299. }
  300.  
  301. p{
  302. margin-bottom:10px;
  303. }
  304.  
  305. img {
  306. height: auto;
  307. width:auto;
  308. max-width:100%;
  309. }
  310.  
  311. ul{
  312. list-style-type:square;
  313. }
  314.  
  315. ol{
  316. list-style-type:;
  317. }
  318.  
  319. #bigcon{
  320. width:520px;
  321. margin-left:auto;
  322. margin-right:auto;
  323. }
  324.  
  325. .tabcontent {
  326. position:static;
  327. margin-left:305px;
  328. margin-right:auto;
  329. margin-top:14px;
  330. width: 380px;
  331. padding:20px;
  332. height:460px;
  333. overflow-y:auto;
  334. overflow-x:hidden;
  335. text-align:center;
  336. margin-bottom:200px;
  337. }
  338.  
  339. #postcontainer {
  340. position:static;
  341. margin-left:310px;
  342. margin-right:auto;
  343. margin-top:14px;
  344. width: 420px;
  345. height:500px;
  346. overflow-y:auto;
  347. overflow-x:hidden;
  348. text-align:center;
  349. margin-bottom:150px;
  350. }
  351.  
  352. /* ----------------------------- HEADER STUFF ---------------------------*/
  353.  
  354. #topbar{
  355. position:static;
  356. margin-top:80px;
  357. margin-bottom:50px;
  358. text-align:center;
  359. }
  360.  
  361. .blogtitle{
  362. margin-bottom:20px;
  363. text-transform:uppercase;
  364. font-size:12px;
  365. letter-spacing:2px;
  366. font-weight:bold;
  367. visibility:hidden;
  368. }
  369.  
  370. .description{
  371. margin-bottom:20px;
  372. }
  373.  
  374. #navbar{
  375. display:inline-block;
  376. text-align:center;
  377. zoom: 0.8; /* Old IE only */
  378. -moz-transform: scale(0.8);
  379. -webkit-transform: scale(0.8);
  380. transform: scale(0.8);
  381. position:fixed;
  382. margin-left:450px;
  383. margin-top:-10px;
  384. }
  385.  
  386.  
  387. /*-- credits to lmthemes thnks --*/
  388. #bx {height: 15px; overflow: hidden;
  389. transition: all 0.4s ease-out;
  390. -o-transition: all 0.4s ease-out;
  391. -webkit-transition: all 0.4s ease-out;
  392. -moz-transition: all 0.4s ease-out;}
  393.  
  394. #bx:hover {height: auto;
  395. transition: all 0.4s ease-out;
  396. -o-transition: all 0.4s ease-out;
  397. -webkit-transition: all 0.4s ease-out;
  398. -moz-transition: all 0.4s ease-out;}
  399. /* ------------------------------ TABS ------------------------------ */
  400.  
  401. .tabs {
  402. width:100%;
  403. margin-left:0px;
  404. display:inline-block;
  405. }
  406.  
  407. /*----- Tab Links -----*/
  408.  
  409. /* Clearfix */
  410. .tab-links:after {
  411. display:block;
  412. clear:both;
  413. content:'';
  414. }
  415.  
  416. .tab-links li {
  417. margin-right:5px;
  418. display:inline-block;
  419. list-style:none;
  420. text-transform:uppercase;
  421. }
  422. .tab-links a {
  423. padding:7px;
  424. display:inline-block;
  425. color:{color:links};
  426. color:#000;
  427. width:1px;
  428. box-shadow: 3px 3px 5px {color:box shadow};
  429. background:#fff;
  430. height:1px;
  431. border-radius:15px;
  432. border: 3px solid #fff;
  433. transition:all linear 0.15s;
  434. }
  435.  
  436. .tab-links a:hover {
  437. text-decoration:none;
  438. color:#000;
  439. width:-1px;
  440. height:-1px;
  441. border-radius:15px;
  442. background-color:#fff;
  443. border: 3px solid #fff;
  444. }
  445.  
  446. li.active a, li.active a:hover {
  447. background-color:transparent;
  448. border-radius:15px;
  449. -webkit-transition: all .3s;
  450. -moz-transition: all .3s;
  451. -o-transition: all .3s;
  452. -ms-transition: all .3s;
  453. transition: all .3s;
  454. }
  455.  
  456. /*----- Content of Tabs -----*/
  457. .tab-content {
  458. }
  459.  
  460. .tab {
  461. display:none;
  462. }
  463.  
  464. .tab.active {
  465. display:block;
  466. }
  467.  
  468. /* --------------------------- POSTS (articles) --------------------- */
  469.  
  470. article {
  471. float:left;
  472. background:{color:posts};
  473. padding: 10px;
  474. box-shadow: 3px 3px 5px {color:box shadow};
  475. width: 380px;
  476. text-align:left;
  477. margin-bottom:20px;
  478. }
  479.  
  480. /* ---------------------------- POST INFO -----------------------------*/
  481.  
  482. .postinfo{
  483. margin-top:10px;
  484. text-align:center;
  485. font-weight:bold;
  486. font-size:8.5px;
  487. padding-top:10px;
  488. border-top: {color:borders} 1px solid;
  489. text-transform:uppercase;
  490. letter-spacing:1px;
  491. }
  492.  
  493. .tags {
  494. margin-top:5px;
  495. background:{color:tags bg};
  496. opacity:0.7;
  497. font-weight:normal;
  498. }
  499.  
  500.  
  501. /* ---------------------------- POST NOTES ------------------------- */
  502.  
  503. ol.notes {
  504. display:block;
  505. text-align:left;
  506. list-style-type:none;
  507. margin-left:-40px;
  508. }
  509.  
  510. ol.notes li.note{
  511. margin-bottom:5px;
  512. }
  513.  
  514. .pagenotes {
  515. text-align:left;
  516. margin-top:15px;
  517. }
  518.  
  519. .pagenotes img{
  520. padding-right:5px;
  521. padding-top:5px;
  522. margin-bottom:-5px;
  523. }
  524.  
  525.  
  526. /* -------------------------- POST TYPES -------------------------- */
  527.  
  528. /* CHAT */
  529.  
  530. /* IMESSAGE CHAT POST */
  531. .answer span,.convo li{margin:0 0 5px;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 bg};color:#000;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 bg};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:accent};color:#000}.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:accent};border-bottom-left-radius:1em .5em}.me p,.answer,.asked span{padding:0;margin:0}.answer{overflow:hidden}
  532. .asked p {
  533. text-align: left;
  534. margin: 0 0px 10px 0px;
  535. padding: 0;
  536. color: #666666;
  537. font-family: 'Inconsolata', Inconsolata;
  538. font-size: 12px;
  539. line-height: 0px;
  540. }
  541. .footerright .viasrc {
  542. float: left;
  543. }
  544. .asked a {
  545. margin:0;padding:0;
  546. }
  547. .user_4{background-color:{color: accent};color:{color:text}}.user_4::after{border-color:{color: accent}}.user_6{background-color:{color: accent};color:{color:text}}.user_6::after{border-color:{color: accent}}.user_5{background-color:{color: accent};color:#000}.user_5::after{border-color:{color: accent}}.user_3{background-color:{color: accent};color:{color:text}}.user_3::after{border-color:{color: accent}}.user_7{background-color:{color: accent};color:{color:text}}.user_7::after{border-color:{color: accent}}.user_8{background-color:{color: accent};color:{color:text}}.user_8::after{border-color:{color: accent}}.user_9{background-color:{color: accent};color:{color:text}}.user_9::after{border-color:{color: accent}}
  548. .convo {
  549. overflow: hidden;
  550. list-style-type: none;
  551. padding: 0;
  552. margin: 0;
  553. }
  554.  
  555.  
  556. /* QUOTES */
  557.  
  558. .quote{
  559. font-size:20px;
  560. padding:20px;
  561. line-height:150%;
  562. text-transform:uppercase;
  563. text-align:center;
  564. text-shadow: 2px 2px 5px {color:text shadow};
  565. color:{color:bold};
  566. font-style:italic;
  567. font-family: 'montserrat', sans serif;
  568. }
  569.  
  570. .quotesource{
  571. text-align:center;
  572. font-size:13px;
  573. padding:20px;
  574. opacity:0.7;
  575. width:200px;
  576. margin-bottom:20px;
  577. margin-left:70px;
  578. background:{color:container bg};
  579. font-family: 'montserrat', sans serif;
  580. text-transform:lowercase;
  581. }
  582.  
  583. /* QUESTIONS */
  584.  
  585. .question{
  586. margin-bottom:15px;
  587. padding:10px;
  588. }
  589.  
  590. .answer {
  591. font-size:11px;
  592. }
  593.  
  594. .askerimg{
  595. position:relative;
  596. display:inline-block;
  597.  
  598. margin-right:10px;
  599. }
  600.  
  601. /* AUDIO */
  602.  
  603. .playerbuttonbg {
  604. position: absolute;
  605. left: 20px;
  606. top: 20px;
  607. width: 19px;
  608. height: 19px;
  609. background-color: #ffffff;
  610. padding: 10px;
  611. -webkit-border-radius: 40px;
  612. -moz-border-radius: 40px;
  613. border-radius: 40px;
  614. opacity: .4;
  615. filter: alpha(opacity=40);
  616. -moz-opacity: 0.4;
  617. -khtml-opacity: 0.4;
  618. transition: opacity .7s ease-in-out;
  619. -moz-transition: opacity .7s ease-in-out;
  620. -webkit-transition: opacity .7s ease-in-out;
  621. }
  622.  
  623. .playerbuttonbg:hover {
  624. opacity: 1;
  625. filter: alpha(opacity=100);
  626. -moz-opacity: 1;
  627. -khtml-opacity: 1;
  628. }
  629.  
  630. .newplayerbutton {
  631. position: relative;
  632. width: 19px;
  633. height: 19px;
  634. overflow: hidden;
  635. }
  636.  
  637. .playerbuttonhug {
  638. position: absolute;
  639. top: -18px;
  640. left: -7px;
  641. }
  642.  
  643. .tumblr_audio_player {
  644. height: 90px;
  645. width: 270px;
  646. -moz-transform: scale(0.60, 0.60);
  647. -webkit-transform: scale(0.60, 0.60);
  648. -o-transform: scale(0.60, 0.60);
  649. -ms-transform: scale(0.60, 0.60);
  650. transform: scale(0.60, 0.60);
  651. -moz-transform-origin: top left;
  652. -webkit-transform-origin: top left;
  653. -o-transform-origin: top left;
  654. -ms-transform-origin: top left;
  655. transform-origin: top left;
  656. }
  657.  
  658. .audioimgwrapper {
  659. position: absolute;
  660. left: 0px;
  661. top: 0px;
  662. -webkit-border-radius: 40px;
  663. -moz-border-radius: 40px;
  664. border-radius: 40px;
  665. overflow: hidden;
  666. width: 79px;
  667. height: 79px;
  668. }
  669.  
  670. .audioimgwrapper img {
  671. width: 100%;
  672. height: auto;
  673. -webkit-border-radius: 40px;
  674. -moz-border-radius: 40px;
  675. border-radius: 40px;
  676. }
  677.  
  678. .trackdetails {
  679. width: 255px;
  680. height:auto;
  681. margin-top:8px;
  682. box-shadow: 3px 3px 5px {color:box shadow};
  683. background:{color:container bg};
  684. display:inline-block;
  685. margin-left: 90px;
  686. padding:10px;
  687. margin-bottom:17px;
  688. }
  689.  
  690. .audiowrapper {
  691. position: relative;
  692. display:inline-block;
  693. }
  694.  
  695.  
  696. /* ------------------------- PAGINATION ------------------------- */
  697.  
  698. #pagination{
  699. position:static;
  700. margin-top:100px;
  701. text-align:center;
  702. }
  703.  
  704. .pagibutton{
  705. position:relative;
  706. text-align:center;
  707. display:inline-block;
  708. color:{color:bold};
  709. background:{color:posts};
  710. padding:10px;
  711. }
  712. #yo {
  713. color: {color:links};
  714. font-size:7.5px;
  715. float:right;
  716. right:0;
  717. text-shadow:none;
  718. bottom:0;
  719. margin-right:10px;
  720. margin-bottom:10px;
  721. padding:10px;
  722. position:fixed;
  723. font-weight:bold;
  724. text-align:center;
  725.  
  726. }
  727.  
  728. /* --------------------------- Custom CSS -------------------------- */
  729. {CustomCSS}
  730. </style>
  731. </head>
  732.  
  733. <body>
  734.  
  735.  
  736.  
  737.  
  738. <!--dont remove !!-->
  739. <div id="yo">
  740. <a href="http://destinatiia.tumblr.com/"target="_blank"> <i class="fa fa-paint-brush fa-4x"style="color:{color:bold}"></i> </a>
  741. </div>
  742.  
  743.  
  744. <div style="margin-left:200px;position:absolute;margin-top:-80px;">
  745. <img src="{image:icon}" style="width:100px;height:100px;position:fixed;margin-top:180px;margin-left:40px; z-index:999999;border-radius:50px;box-shadow: 3px 3px {color:icon shadow};"/>
  746. <img src="{image:icon2}" style="width:100px;height:100px;position:fixed;margin-top:180px;margin-left:160px; z-index:999999;border-radius:50px;box-shadow: 3px 3px {color:icon shadow};"/>
  747.  
  748.  
  749. <div style="background:{color:description bg}; width:190px; height:auto;margin-top:300px; position:fixed; z-index:999999;margin-left:40px;box-shadow: 3px 3px 5px #999;padding:15px; line-height:160%; text-align:justify;">
  750. {description}
  751. <div style="border-top:1px solid {color:sidebar links};margin-top:10px; width:100px; margin-left:40px;"></div>
  752.  
  753. <!--PAGINATION-->
  754. {block:Pagination}
  755. <div class="pagination" style="margin-top:5px; width:200px; margin-left:68px;">
  756. {block:PreviousPage}
  757. <a href="{PreviousPage}">
  758. <div class="pagibutton"><b>before</b></div></a>
  759. {/block:PreviousPage}
  760.  
  761. {block:NextPage}
  762. <a href="{NextPage}">
  763. <div class="pagibutton"><b>after</b></div></a>
  764. {/block:NextPage}
  765. </div>
  766. {/block:Pagination}
  767. <!--Close of article-->
  768.  
  769.  
  770. </div>
  771. {block:IfNotTextAsLinks}
  772. <div style="margin-top:595px;position:fixed;z-index:999999999999;margin-left:70px;text-shadow: 3px 3px 5px {color:text shadow};letter-spacing:10px;">
  773.  
  774.  
  775. <a href="{text:link one}" title="{text:link one title}"><i class="fa fa-star fa-4x" style="color:{color:sidebar links};"></i></a> <a href="{text:link two}"title="{text:link two title}"> <i class="fa fa-paper-plane fa-4x" style="color:{color:sidebar links};"></i></a> <a href="{text:link three}" title="{text:link three title}"> <i class="fa fa-rocket fa-4x" style="color:{color:sidebar links};"></i></a>
  776.  
  777. </div>
  778. {/block:IfNotTextAsLinks}
  779.  
  780. {block:IfTextAsLinks}
  781. <div style="margin-top:595px;position:fixed;z-index:999999999999;margin-left:20px;text-shadow: 3px 3px 5px {color:text shadow};width:260px; text-align:center; font-family:'montserrat',sans serif; font-size:16px;">
  782.  
  783. <a href="{text:link one}"style="color:{color:sidebar links};" title="{text:link one title}">{text:link one text}</a> • <a href="{text:link two}"style="color:{color:sidebar links};"title="{text:link two title}"> {text:link two text}</a> • <a href="{text:link three}" style="color:{color:sidebar links};"title="{text:link three title}"> {text:link three text}</a>
  784.  
  785. </div>
  786. {/block:IfTextAsLinks}
  787.  
  788.  
  789.  
  790.  
  791. <!-- dont delete pls -->
  792. {block:IfFullOpacityForSidebarAndContainer}
  793. <div id="sidebar" style="background-color:{color:sidebar bg}; width:230px;height:489px;padding:15px;position:fixed; margin-left:20px; margin-top:150px; box-shadow: 3px 3px 5px {color:box shadow};">
  794. </div>
  795.  
  796. <div id="behind"style="background-color:{color:container bg};width:420px; height:520px; position:fixed;z-index:-99;margin-top:150px; margin-left:300px; box-shadow: 3px 3px 5px {color:box shadow};"></div>
  797.  
  798.  
  799. {/block:IfFullOpacityForSidebarAndContainer}
  800.  
  801. {block:IfNotFullOpacityForSidebarAndContainer}
  802.  
  803. <div id="sidebar" style="background-color:{color:sidebar bg}; opacity:0.7; width:230px;height:489px;padding:15px;position:fixed; margin-left:20px; margin-top:150px; box-shadow: 3px 3px 5px {color:box shadow};">
  804. </div>
  805.  
  806.  
  807. <div id="behind"style="background:{color:container bg};width:420px; height:520px; position:fixed;z-index:-99;margin-top:150px; margin-left:300px; box-shadow: 3px 3px 5px {color:box shadow}; opacity:0.7;"></div>
  808.  
  809. {/block:IfNotFullOpacityForSidebarAndContainer}
  810.  
  811. <!---->
  812.  
  813. <div id="bigcon">
  814.  
  815.  
  816. <!--TOPBAR-->
  817.  
  818. <div id="topbar">
  819.  
  820. <div class="blogtitle">
  821. <a href="/">{Title}</a>
  822. </div>
  823.  
  824. <div class="description"></div>
  825. <div style="margin-top:0px; position:fixed;color:{color:title color}; font-size:28px; margin-left:300px;font-family:'montserrat',sans serif; text-shadow: 3px 3px 5px {color:text shadow};">{title}</div>
  826. <div id="navbar">
  827. <div class="tabs">
  828. <ul class="tab-links">
  829. <li class="active" style="">
  830. <a href="#tab1" title="{text:tab 1 title}"> </a></li>
  831.  
  832. <li><a href="#tab2" title="{text:tab 2 title}"> </i></a></li>
  833.  
  834. <li><a href="#tab3" title="{text:tab 3 title}"> </i></a></li>
  835. </ul>
  836. </div>
  837. </div>
  838.  
  839. </div>
  840.  
  841.  
  842. <!-- --------------------------- TABS -------------------------- -->
  843.  
  844.  
  845. <div class="tabs">
  846.  
  847.  
  848. <!-- --------------------------- TAB 1 -------------------------- -->
  849.  
  850. <div class="tab-content">
  851. <div id="tab1" class="tab active">
  852.  
  853.  
  854.  
  855. <div id="postcontainer">
  856.  
  857. {block:Posts}
  858. <article>
  859.  
  860.  
  861.  
  862. <!--TEXT POST-->
  863. {block:Text}
  864. {block:Title}
  865. <h1 class="title">
  866. <a href="{Permalink}">{Title}</a></h1>
  867. {/block:Title}
  868. {Body}
  869. {/block:Text}
  870.  
  871.  
  872. <!--PHOTO POST-->
  873. {block:Photo}
  874. {block:IndexPage}
  875. {LinkOpenTag}
  876. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  877. {LinkCloseTag}
  878. {/block:IndexPage}
  879. {block:PermalinkPage}
  880. {LinkOpenTag}
  881. <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  882. {LinkCloseTag}{/block:PermalinkPage}
  883. {/block:Photo}
  884.  
  885.  
  886. <!--PHOTOSET POST-->
  887. {block:Photoset}
  888. {block:IndexPage}{Photoset-500}{/block:IndexPage}
  889. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  890. {/block:Photoset}
  891.  
  892.  
  893. <!--QUOTE POST-->
  894. {block:Quote}
  895. <div class="quote">❝ {Quote} ❞</div>
  896. {block:Source}
  897. <div class="quotesource">{Source}</div>
  898. {/block:Source}
  899. {/block:Quote}
  900.  
  901.  
  902. <!--LINK POST-->
  903. {block:Link}
  904. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  905. {block:Description}{Description}{/block:Description}
  906. {/block:Link}
  907.  
  908.  
  909. <!--CHAT POST-->
  910. {block:Chat}
  911. {block:Title}
  912. <h1>{Title}</h1>{/block:Title}<br>
  913. <ul class="convo">{block:Lines}<li class="line_{Alt} user_{UserNumber}">{block:Label}<span class="label"><strong>{Label}</strong></span>{/block:Label}
  914. {Line}</li>{/block:Lines}</ul>
  915. {/block:Chat}
  916.  
  917.  
  918. <!--AUDIO POST-->
  919. {block:AudioPlayer}
  920. <div class="audiowrapper">
  921. {block:AlbumArt}
  922. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  923. {/block:AlbumArt}
  924.  
  925. <div class="playerbuttonbg">
  926. <div class="newplayerbutton">
  927. <div class="playerbuttonhug">
  928.  
  929. {AudioPlayerWhite}
  930.  
  931. </div>
  932. </div>
  933. </div>
  934.  
  935. <div class="trackdetails">
  936.  
  937. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  938. {block:Artist}<b><i>artist:</i></b> {Artist}{/block:Artist}<br/>
  939. {block:Album}<i><b>album:</i></b {Album}{/block:Album}<br/>
  940. {PlayCountWithLabel}
  941.  
  942. </div>
  943. </div>
  944. {/block:AudioPlayer}
  945.  
  946. {block:Caption}{/block:Caption}
  947.  
  948.  
  949. <!--VIDEO POST-->
  950. {block:Video}
  951. <div class="video">
  952. <div class="video-player">{Video}</div>
  953. {/block:Video}
  954.  
  955.  
  956. <!--ANSWER POST-->
  957. {block:Answer}
  958. <div class="askerimg"><img src="{AskerPortraitURL-40}" style="border-radius:50px;margin-left:10px;"></div>
  959. <div style="padding:10px; background:{color:question bg}; width:300px; height:auto;margin-left:60px;margin-top:-43px; margin-bottom:30px;">
  960. <b>{Asker} whispered </b></span>
  961. <span class="question">❛ {Question} ❜</span></div>
  962. <p><div class="answer">{Answer}</div>
  963. {/block:Answer}
  964.  
  965. <!--CAPTIONS-->
  966. {block:Caption}
  967. {Caption}
  968. {/block:Caption}
  969.  
  970. <!--POST INFORMATION-->
  971. <div class="postinfo">
  972.  
  973. <!--PERMALINK-->
  974. <a href="{Permalink}">
  975. {block:Date}
  976. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {12Hour}:{Minutes} {AmPm}
  977. {/block:Date}
  978. </a>
  979.  
  980. <!--NOTES-->
  981. {block:NoteCount}
  982. <a href="{Permalink}"> + {NoteCount} </a>
  983. {/block:NoteCount}
  984.  
  985. <!--VIA AND SOURCE-->
  986. {block:RebloggedFrom}
  987. ( <a href="{ReblogParentURL}">Via</a>
  988. {/block:RebloggedFrom}
  989. {block:ContentSource}
  990. & <a href="{SourceURL}">Source</a>
  991. {/block:ContentSource}
  992. {block:RebloggedFrom} ){/block:RebloggedFrom}
  993.  
  994. <!--TAGS-->
  995. {block:HasTags}
  996. <div class="tags">
  997. {block:Tags}
  998. <a href="{TagURL}">#{Tag},</a>
  999. {/block:Tags}
  1000. </div>
  1001. {/block:HasTags}
  1002.  
  1003. </div>
  1004.  
  1005. <!--POST NOTES-->
  1006. {block:PostNotes}
  1007. <div class="pagenotes">{PostNotes-16}</div>
  1008. {/block:PostNotes}
  1009.  
  1010.  
  1011.  
  1012.  
  1013. </article>
  1014. {/block:Posts}
  1015.  
  1016.  
  1017. </div>
  1018.  
  1019. </div>
  1020.  
  1021. <!-- -------------------------- TAB 2 -------------------------- -->
  1022.  
  1023. <div id="tab2" class="tab">
  1024. <div class="tabcontent">
  1025.  
  1026.  
  1027. <div style="margin-left:-10px;"><p><iframe frameborder="0" scrolling="no" width="350px" height="280" src="http://www.tumblr.com/ask_form/{text:your user goes here}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p></div>
  1028.  
  1029. </div>
  1030. </div>
  1031.  
  1032.  
  1033. <!-- -------------------------- TAB 3 -------------------------- -->
  1034.  
  1035. <div id="tab3" class="tab">
  1036. <div class="tabcontent">
  1037.  
  1038. <div style="margin-left: 250px; margin-top: -10px;position:fixed;">
  1039. <p><img src="{image:nav img 1}" style="border-radius: 50px; width: 100px;" /></p>
  1040. <p><img src="{image:nav img 2}" style="border-radius: 50px; width: 100px;" /></p>
  1041. <p><img src="{image:nav img 3}" style="border-radius: 50px; width: 100px;" /></p>
  1042. <p><img src="{image:nav img 4}" style="border-radius: 50px; width: 100px;" /></p>
  1043.  
  1044. </div>
  1045.  
  1046. <div style="margin-top:5px;">
  1047. <div style="float: left; width: 200px; margin-left: 0px; height: 100px; margin-top: 0px; padding: 10px; overflow: auto;text-align:justify;background:{color:description bg} "><big><big><strong><em>+ ur name, wtv. </em></strong></big></big>breathe out so i can breathe you in hold you in and now i know you've always been out of your head out of my head i sang and i wonder when i sing along with you if everything could ever feel this real forever.</div>
  1048.  
  1049. <div style="margin-top:20px; float:left;">
  1050. <a href="/LINK." title="MUSES"><i class="fa fa-heartbeat fa-5x"></i></a> <a href="/LINK" title="WANTED PAIRING"><i class="fa fa-key fa-5x"></i></a> <a href="/LINK" title="MEMES"><i class="fa fa-gamepad fa-5x"></i></a> <a href="/LINK" title="WISHLIST"><i class="fa fa-cloud fa-5x"></i></a>
  1051. </div>
  1052.  
  1053. <div style="position:fixed;margin-top:210px; margin-left:17px;">
  1054. <div style="margin-top: 2px;margin-left:-15px; width: 200px; height: 200px; padding: 10px; overflow: auto; background:{color:description bg}">
  1055. <h1>RULES</h1>
  1056. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis lacinia tellus ut ante ultrices, sit amet feugiat metus elementum. Donec id gravida tellus. Sed vulputate mollis enim, at commodo massa viverra non. Pellentesque convallis tortor augue, sit amet gravida justo euismod at. Ut sed facilisis arcu. Aliquam facilisis ante est, ut facilisis velit eleifend sed. Integer scelerisque laoreet nisi, et mattis justo luctus non. Cras eget egestas elit, sit amet tempor lacus. <br /> Nulla fringilla tortor id urna consequat, non molestie nunc sagittis. Sed mollis, urna non mattis fermentum, lacus tortor finibus mauris, et bibendum est libero vel velit. Donec dictum augue odio, at cursus odio porta a. Nullam vulputate, elit in placerat mattis, augue risus bibendum ante, et porttitor elit odio non odio. Mauris imperdiet scelerisque pellentesque. Etiam ullamcorper, velit congue volutpat eleifend, purus dolor pretium dui, quis commodo lectus nibh ultrices ante. Nulla vestibulum nulla eget augue suscipit, a convallis nisi ornare. Aliquam feugiat, dolor venenatis porttitor porttitor, felis lacus laoreet quam, in gravida lorem mauris quis orci. Mauris convallis odio urna, nec aliquet velit dictum non. Ut pellentesque lacus ac malesuada placerat. Nullam faucibus ligula quis arcu scelerisque auctor. Mauris ultrices, orci at tincidunt volutpat, orci nisl porta quam, ac ornare enim purus vitae risus. Pellentesque suscipit turpis ut mauris suscipit, auctor molestie sapien hendrerit. Cras a justo purus.</div>
  1057. </div>
  1058. </div>
  1059.  
  1060. </div>
  1061. </div>
  1062. </div>
  1063.  
  1064.  
  1065. <!-- END OF TABS -->
  1066.  
  1067. </div>
  1068. </div>
  1069. </div>
  1070. </div>
  1071. </div>
  1072.  
  1073. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  1074.  
  1075. <script>
  1076. $(document).ready(function() {
  1077. $('.tabs .tab-links a').on('click', function(e) {
  1078. var currentAttrValue = $(this).attr('href');
  1079.  
  1080. // Show/Hide Tabs
  1081. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  1082.  
  1083. // Change/remove current tab to active
  1084. $(this).parent('li').addClass('active').siblings().removeClass('active');
  1085.  
  1086. e.preventDefault();
  1087. });
  1088. });
  1089. </script>
  1090.  
  1091. <script>
  1092. $(document).ready(function() {
  1093. $('#filterOptions li a').click(function() {
  1094. // fetch the class of the clicked item
  1095. var ourClass = $(this).attr('class');
  1096.  
  1097. // reset the active class on all the buttons
  1098. $('#filterOptions li').removeClass('active');
  1099. // update the active state on our clicked button
  1100. $(this).parent().addClass('active');
  1101.  
  1102. if(ourClass == 'all') {
  1103. // show all our items
  1104. $('#ourHolder').children('div.item').show();
  1105. }
  1106. else {
  1107. // hide all elements that don't share ourClass
  1108. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1109. // show all elements that do share ourClass
  1110. $('#ourHolder').children('div.' + ourClass).show();
  1111. }
  1112. return false;
  1113. });
  1114. });
  1115. </script>
  1116.  
  1117.  
  1118. </body>
  1119. </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!