Advertisement
t-offee

Memories Theme (NEW)

Jan 12th, 2014
1,312
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.76 KB | None | 0 0
  1. <!------------------------------------------------------------------------
  2.  
  3.  
  4. /// memories theme by ally
  5.  
  6. © 2014 stahrfruits.tumblr.com
  7.  
  8.  
  9. -------------------------------------------------------------------------->
  10.  
  11. <!DOCTYPE html><html>
  12. <head>
  13.  
  14. <!------Meta Tags---------------------------------------------------->
  15.  
  16. <meta name="color:background" content="#ffffff" />
  17. <meta name="color:text" content="#000000" />
  18. <meta name="color:title" content="#000000" />
  19. <meta name="color:link" content="#000000" />
  20. <meta name="color:link hover" content="#cccccc" />
  21. <meta name="color:scrollbar" content="#000000" />
  22. <meta name="color:post background" content="#f0f0f0">
  23. <meta name="color:post border color" content="#000000">
  24.  
  25. <meta name="if:show banner" content="0">
  26. <meta name="if:post background" content="0">
  27.  
  28. <meta name="text:link 1" content="link1">
  29. <meta name="text:link 1 url" content="/">
  30. <meta name="text:link 2" content="link2">
  31. <meta name="text:link 2 url" content="/">
  32.  
  33. <meta name="text:home" content="refresh">
  34. <meta name="text:message" content="message">
  35. <meta name="text:ask link" content="/ask">
  36. <meta name="text:archive" content="archive">
  37. <meta name="text:body font family" content="times new">
  38. <meta name="text:body font size" content="11px">
  39.  
  40. <meta name="image:background" content="" />
  41.  
  42. <!------Essential Scripts-------------------------------------------->
  43.  
  44. <script>
  45. var IsOpen = "no";
  46. function ShowMenu()
  47. {
  48. if (IsOpen == "no")
  49. {
  50. $("#page_menu").slideDown("slow");
  51. document.getElementById('page_plus').innerHTML = ' - ';
  52. IsOpen="yes";
  53. }else
  54. {
  55. $("#page_menu").slideUp("slow");
  56. document.getElementById('page_plus').innerHTML = '+ ';
  57. IsOpen="no";
  58. }
  59. }
  60. </script>
  61. <script>
  62. var IsOpen2 = "no";
  63. function ShowMenu2()
  64. {
  65. if (IsOpen2 == "no")
  66. {
  67.  
  68. $("#header_menu").slideDown("slow");
  69. $("#page_menu").slideDown("slow");
  70.  
  71. document.getElementById('page_plus').innerHTML = '';
  72. IsOpen2="yes";
  73. }else
  74. {
  75. $("#header_menu").slideUp("slow");
  76. $("#page_menu").slideUp("slow");
  77. document.getElementById('page_plus').innerHTML = '';
  78. IsOpen2="no";
  79. }
  80. }
  81. </script>
  82. <script type="text/javascript">
  83. function changeText(){
  84.  
  85. }
  86. </script>
  87.  
  88.  
  89. <script>
  90. $(document).ready(function() {
  91. /* This is basic - uses default settings */
  92. $("a#single_image").fancybox();
  93. /* Using custom settings */
  94. $("a#inline").fancybox({
  95. 'hideOnContentClick': true
  96. });
  97.  
  98.  
  99. $(".various3").fancybox({
  100. 'width' : '50%',
  101. 'height' : '30%',
  102. 'autoScale' : false,
  103. 'transitionIn' : 'none',
  104. 'transitionOut' : 'none',
  105. 'type' : 'iframe'
  106. });
  107. });
  108. </script>
  109.  
  110. <script src="http://www.themecloud.co/themes/narnia/totop.js";
  111.  
  112. type="text/javascript"></script>
  113. <script type="text/javascript">
  114. $(document).ready(function() {
  115. /*
  116. var defaults = {
  117. containerID: 'moccaUItoTop', // fading element id
  118. containerHoverClass: 'moccaUIhover', // fading element
  119.  
  120. hover class
  121. scrollSpeed: 1200,
  122. easingType: 'linear'
  123. };
  124. */
  125.  
  126. $().UItoTop({ easingType: 'easeOutQuart' });
  127. });
  128. </script>
  129.  
  130. <title>{Title}</title>
  131. <link rel="shortcut icon" href="{Favicon}">
  132. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  133. {block:Description}
  134. <meta name="description" content="{MetaDescription}" />
  135. {/block:Description}
  136.  
  137. {block:IndexPage}
  138.  
  139. <script type="text/javascript"
  140. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  141.  
  142. <script type="text/javascript"
  143.  
  144. src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  145.  
  146. <script type="text/javascript"
  147.  
  148. src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  149. <script type="text/javascript">
  150. $(window).load(function () {
  151. var $content = $('#content');
  152. $content.masonry({itemSelector: '.entry'}),
  153. $content.infinitescroll({
  154. navSelector : 'div#pagination',
  155. nextSelector : 'div#pagination a#nextPage',
  156. itemSelector : '.entry',
  157. loading: {
  158. finishedMsg: '',
  159. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  160. },
  161. bufferPx : 600,
  162. debug : false,
  163. },
  164. // call masonry as a callback.
  165. function( newElements ) {
  166. var $newElems = $( newElements );
  167. $newElems.hide();
  168. // ensure that images load before adding to masonry layout
  169. $newElems.imagesLoaded(function(){
  170. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);}
  171.  
  172. );});});});</script>
  173. {/block:IndexPage}
  174.  
  175. <!------Styling and Customization------------------------------------>
  176.  
  177. <style type="text/css">
  178.  
  179. .ttitle {
  180. background: #fff;
  181. padding: 5px;
  182. font-size: 12px;
  183. }
  184.  
  185. ::-webkit-scrollbar {width: 3px; height: 0px; background:{color:scrollbar};}
  186. ::-webkit-scrollbar-thumb {background: {color:scrollbar}; border-radius:10px;}
  187.  
  188. iframe#tumblr_controls {position:fixed; z-index:9999999999; top: 3px; margin: 0 0 0 0;
  189.  
  190. right:4px; -webkit-filter: invert(100%);}
  191.  
  192.  
  193. body {
  194. background-color: {color:background};
  195. background-image:url({image:Background});
  196. background-attachment: fixed;
  197. background-repeat: repeat;
  198. font-size:{text:body font size};
  199. font-family:{text:body font family};
  200. line-height:14px;
  201. text-transform:none;
  202. color: {color:text};
  203. }
  204.  
  205. #header{
  206. position:absolute;
  207. top:0px;
  208. padding-top:7px;
  209. padding-bottom:12px;
  210. width:700px;
  211. align:center;
  212. left:50%;
  213. margin-left:-350px;
  214. width:100%;
  215. left:0px;
  216. margin-left:0px;
  217. text-align:center;
  218. background-image:url('{image:header}');
  219. background-color:transparent;
  220. z-index:999;
  221. }
  222.  
  223. #nav{
  224. word-spacing:10px;
  225. text-transform:uppercase;
  226. }
  227.  
  228. #nav a{
  229. font-size:12px;
  230. line-height:23px;
  231. text-transform:uppercase;
  232. display:inline;
  233. font-weight:300;
  234. -moz-transition: all 0.4s ease-in-out;
  235. -webkit-transition: all 0.4s ease-in-out;
  236. -o-transition: all 0.4s ease-in-out;
  237. -ms-transition: all 0.4s ease-in-out;
  238. transition: all 0.4s ease-in-out;
  239. }
  240.  
  241. .speclink{
  242. word-spacing:1px;
  243. }
  244.  
  245. .answer{
  246. }
  247. .answer img {
  248. width:230px;
  249. height:auto;
  250. {block:permalinkpage}
  251. width:auto;
  252. height:auto;
  253. {/block:permalinkpage}
  254. }
  255.  
  256. a {
  257. text-decoration:none;
  258. color:{color:link};
  259. -webkit-transition: all 0.4s linear;
  260. -moz-transition: all 0.4s linear;
  261. transition: all 0.4s linear;
  262. }
  263.  
  264. a:link, a:active, a:visited{
  265. color: {color:link};
  266. }
  267.  
  268. a:hover{
  269. color: {color:link hover};
  270. }
  271.  
  272. #content {
  273. position: absolute;
  274. width:1240px;
  275. margin-left:-540px;
  276. left:50%;
  277. margin-top:-10px;
  278. float:center;
  279. }
  280.  
  281. .entry{
  282. margin:30px;
  283. float:left;
  284. height:auto;
  285. padding-top:10px;
  286. padding-left:10px;
  287. padding-right:10px;
  288. padding-bottom:7px;
  289. border:1px double {color:post border color};
  290. {block:ifpostbackground}
  291. background-color: {color:post background};
  292. {/block:ifpostbackground}
  293. {block:IndexPage}
  294. width:210px;
  295. {/block:IndexPage}
  296. {block:PermalinkPage}
  297. margin-left:65px;
  298. width:500px;
  299. height:auto;
  300. {/block:PermalinkPage}
  301. }
  302.  
  303.  
  304. .entry img{
  305. {block:IndexPage}
  306. width:210px;
  307. {block:iffourcolumns}
  308. width:210px;
  309. {/block:iffourcolumns}
  310. {block:ifthreecolumns}
  311. width:210px;
  312. {/block:ifthreecolumns}
  313. {/block:IndexPage}
  314. }
  315.  
  316. .title{
  317. font-family:times new;
  318. {block:iftitlefontone}
  319. font-family: Lobster Two;
  320. {/block:iftitlefontone}
  321. {block:iftitlefonttwo}
  322. font-family: satisfy;
  323. {/block:iftitlefonttwo}
  324. {block:iftitlefontthree}
  325. font-family: handlee;
  326. {/block:iftitlefontthree}
  327. font-size:17px;
  328. line-height:18px;
  329. text-transform:none;
  330. color: {color:text};
  331. }
  332.  
  333. blockquote{
  334. padding:0px 0px 0px 10px;
  335. margin:0px 0px 0px 2px;
  336. border-left: 1px solid #000;
  337. }
  338.  
  339. .creditstothistheme{
  340. font-family:
  341. this is a stahrfruits theme
  342. and you should probably abide
  343. by the rules because if i see
  344. this on your theme ill know
  345. its mine and ill report you if
  346. there isnt a credit;
  347. }
  348.  
  349. .perma{
  350. position:absolute;
  351. top:15px;
  352. left:7px;
  353. text-transform:uppercase;
  354. text-align:center;
  355. line-height:40px;
  356. overflow:hidden;
  357. overflow:hidden;
  358. opacity: 0;
  359. -webkit-transition: all 0.2s linear;
  360. -webkit-transition: all 0.2s linear;
  361. -moz-transition: all 0.2s linear;
  362. transition: all 0.2s linear;
  363. }
  364.  
  365. .perma img{
  366. border-radius:100%;
  367. margin-left:3px;
  368. height:35px;
  369. width:35px;
  370. }
  371.  
  372. .entry:hover .perma{
  373. opacity:1;
  374. top:10px;
  375. -webkit-transition: all 0.2s linear;
  376. -webkit-transition: all 0.2s linear;
  377. -moz-transition: all 0.2s linear;
  378. transition: all 0.2s linear;
  379. }
  380.  
  381. .my-like {
  382. background-image: url("http://static.tumblr.com/j1tjexd/aeQmam5ia/like1.png") !
  383.  
  384. important;
  385. height:35px;
  386. width:35px;
  387. cursor:pointer;
  388. display:inline-block;
  389. vertical-align:top;
  390. border-radius:100%;
  391. margin-left:3px;
  392. }
  393.  
  394. .my-like img{
  395. height:35px;
  396. width:35px;
  397. }
  398.  
  399. .my-liked, .my-like:hover {
  400. background-image: url("http://static.tumblr.com/j1tjexd/5YOmanh18/like2.png") !
  401.  
  402. important;
  403. height:35px;
  404. width:35px;
  405. cursor:pointer;
  406. display:inline-block;
  407. vertical-align:top;
  408. border-radius:100%;
  409. margin-left:3px;
  410. }
  411.  
  412. .entry:hover .permalink{
  413. line-height:10px;
  414. opacity:1;
  415. -webkit-transition: all 0.4s linear;
  416. -webkit-transition: all 0.4s linear;
  417. -moz-transition: all 0.4s linear;
  418. transition: all 0.4s linear;
  419. }
  420.  
  421. .permalink{
  422. font-family:{text:body font family};
  423. font-size:10px;
  424. line-height:0;
  425. text-transform:uppercase;
  426. text-align:center;
  427. opacity:0;
  428. -webkit-transition: all 0.4s linear;
  429. -webkit-transition: all 0.4s linear;
  430. -moz-transition: all 0.4s linear;
  431. transition: all 0.4s linear;
  432. }
  433.  
  434. .notess{
  435. position:absolute;
  436. left:600px;
  437. top:10px;
  438. height:400px;
  439. width:500px;
  440. overflow:scroll;
  441. }
  442.  
  443. .answerimg img{
  444. position:relative;
  445. top:5px;
  446. left:0px;
  447. height:30px;
  448. width:30px;
  449. border:1px solid #ccc;
  450. margin:2px;
  451. padding:3px;
  452. }
  453.  
  454. #blogtitle {
  455. position:fixed;
  456. width: 100px;
  457. font-size:90px;
  458. font-family:times new;
  459. font-style:italic;
  460. text-decoration:none;
  461. text-transform:lowercase;
  462. margin-top:550px;
  463. -webkit-transform: rotate(-90deg);
  464. -moz-transform: rotate(-90deg);
  465. -ms-transform: rotate(-90deg);
  466. -o-transform: rotate(-90deg);
  467. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  468. }
  469.  
  470. #blogtitle a:link {
  471. color:{color:title};
  472. text-decoration:none;
  473. }
  474.  
  475. {CustomCSS}
  476. </style>
  477. </head>
  478.  
  479. <!------Blog Appearance---------------------------------------------->
  480.  
  481. <body onkeydown="return false">
  482.  
  483. <!------Blog Title--------------------------------------------------->
  484.  
  485. <div id="blogtitle">
  486. <a href="/">{Title}</a>
  487. </div>
  488.  
  489. <!------Header Links------------------------------------------------->
  490.  
  491. <header id="header">
  492. <span id="nav">
  493. <a href="/">{text:home}</a> /
  494. <a href="{text:ask link}">{text:message}</a> /
  495. <a href="/archive">{text:archive}</a> /
  496. <a href="{text:link 1 url}">{text:link 1}</a> /
  497. <a href="{text:link 2 url}">{text:link 2}</a> /
  498. <a href="http://stahrfruits.tumblr.com/stahrfruitsthemes">theme</a>
  499. </span>
  500. </header><br><br>
  501.  
  502. <!------Blog Posts--------------------------------------------------->
  503.  
  504. <div id="content">
  505. {block:Posts}
  506.  
  507. {block:ContentSource}
  508. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  509. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  510. {/block:SourceLogo}
  511. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  512. {/block:ContentSource}
  513.  
  514. <div class="entry">
  515.  
  516. {block:Text}
  517. {block:Title}<center><span class="title">{Title}</span></center>{/block:Title}<div
  518.  
  519. class="answer">
  520. <div style="margin-left:1px;">{Body}</div></div>
  521. <div class="permalink"><a href="{ReblogUrl}">Purchase</a>&nbsp;for&nbsp;<a
  522.  
  523. href="{permalink}">${NoteCount}</a></div>
  524. {/block:Text}
  525.  
  526. {block:Link}
  527. <center><a href="{URL}"><span class="title">{Name}</span></a></center>
  528. <div style="margin-left:3px;">{block:Description}{Description}{/block:Description}</div>
  529. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  530.  
  531. href="{permalink}">{NoteCountwithLabel}</a></div>
  532. {block:Link}
  533.  
  534. {block:Photo}
  535. {block:IndexPage}{LinkOpenTag}<div class="photo"><a href="{permalink}"><img
  536.  
  537. src="{PhotoURL-500}" alt="{PhotoAlt}" /></a></div>{LinkCloseTag}
  538. <div class="perma">
  539. <a href="{reblogurl}"><img
  540.  
  541. src="http://static.tumblr.com/j1tjexd/nGmmam5hg/reblog.png"></a>
  542. <div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}"></div>
  543. </div>
  544. {/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}"
  545.  
  546. alt="{PhotoAlt}"width=450px/>{LinkCloseTag}{/block:PermalinkPage}
  547. {/block:Photo}
  548.  
  549. {block:Photoset}
  550. <center>
  551. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  552. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  553. </center>
  554. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  555.  
  556. href="{permalink}">{NoteCountwithLabel}</a></div>
  557. {/block:IndexPage}
  558. {/block:Photoset}
  559.  
  560. {block:Quote}
  561. <div style="margin-left:3px;">
  562. <span class="title">{Quote}</span><br>{Source}
  563. </div>
  564. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  565.  
  566. href="{permalink}">{NoteCountwithLabel}</a></div>
  567. {/block:Quote}
  568.  
  569. {block:Chat}
  570. <div style="margin-left:3px;">
  571. {block:Title}<span class="title">{Title}</span>{/block:Title}
  572. <ul class="chat">
  573. {block:Lines}
  574. <li class="user_{UserNumber}">
  575. {block:Label}
  576. <span class="label">{Label}</span>
  577. {/block:Label}
  578. {Line}
  579. </li>
  580. {/block:Lines}
  581. </ul>
  582. </div>
  583. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  584.  
  585. href="{permalink}">{NoteCountwithLabel}</a></div>
  586. {/block:Chat}
  587.  
  588. {block:Audio}<div style="height:0px;background-
  589.  
  590. color:black;opacity:0.1;width:100%;margin-top:10px;margin-bottom:5px;"></div>
  591. <center>{AudioPlayerBlack}
  592. {block:Caption}{Caption}{/block:Caption}</center>
  593. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  594.  
  595. href="{permalink}">{NoteCountwithLabel}</a></div>
  596. {/block:Audio}
  597.  
  598. {block:Answer}<span class="answerimg"><p align="right"><img src="{AskerPortraitURL-30}"
  599.  
  600. align="right"></p></span> {Asker} inquired: <i>{Question}</i><div class="answer">
  601.  
  602. {Answer}</div>
  603. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;for&nbsp;<a
  604.  
  605. href="{permalink}">${NoteCount}</a></div>
  606. {/block:Answer}
  607.  
  608. {block:Video}
  609. {block:IndexPage}
  610. <center>
  611. {Video-250}</center>
  612. <div class="permalink"><a href="{ReblogUrl}">{text:reblog}</a>&nbsp;with&nbsp;<a
  613.  
  614. href="{permalink}">{NoteCountwithLabel}</a></div>
  615. {/block:IndexPage}
  616. {block:PermalinkPage}
  617. <center>
  618. {Video-500}</center>
  619. {/block:PermalinkPage}
  620. {block:Video}
  621.  
  622. {block:PermalinkPage}
  623. {block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}
  624.  
  625. {/block:hasTags}
  626. {/block:PermalinkPage}
  627.  
  628. {block:PostNotes}
  629. <div class="notess">{block:Caption}{Caption}{/block:Caption}
  630. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  631. <br>{PostNotes}</div>
  632. {/block:PostNotes}
  633. </div>
  634.  
  635. {/block:Posts}
  636.  
  637. {block:IndexPage}
  638. {block:Pagination}
  639. <div id="pagination">
  640. {block:NextPage}
  641. <a id="nextPage" href="{NextPage}"></a>
  642. {/block:NextPage}
  643. {block:PreviousPage}
  644. <a href="{PreviousPage}"></a>
  645. {/block:PreviousPage}
  646. </div>
  647. {/block:Pagination}
  648. {/block:IndexPage}
  649. </div>
  650.  
  651. <script>
  652. window.onload = function () {
  653. document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame"
  654.  
  655. style="display:none;"></iframe>' );
  656. document.addEventListener( 'click', function ( event ) {
  657. var myLikeLink = event.target;
  658. if( myLikeLink.className.indexOf( 'my-like' ) > -1 ) {
  659. var myLikeFrame = document.getElementById( 'my-like-frame' ),
  660. liked = ( myLikeLink.className == 'my-liked' ),
  661. command = liked ? 'unlike' : 'like',
  662. reblog = myLikeLink.getAttribute( 'data-reblog' ),
  663. postId = myLikeLink.getAttribute( 'data-id' ),
  664. oauth = reblog.slice( -8 ),
  665. likeUrl = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + postId;
  666. myLikeFrame.src = likeUrl;
  667. liked ? myLikeLink.className = 'my-like'
  668. : myLikeLink.className = 'my-liked';
  669. };
  670. }, false );
  671. };
  672. </script>
  673.  
  674. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement