API tools faq
paste
Advertisement
themesbygeorgia

Theme #62 - Amour

themesbygeorgia
Dec 23rd, 2016
2,040
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.19 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5. <!--Theme #62 - Amour by wonderfullythemes
  6. please dont tamper w my credit thanks!-->
  7.  
  8. <title>{Title}</title>
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  12.  
  13. <link href="https://fonts.googleapis.com/css?family=Muli:300|Playfair+Display:400,900|Shrikhand" rel="stylesheet">
  14.  
  15. <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
  16.  
  17. <!--BACK TO TOP-->
  18. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  19. <script type="text/javascript">
  20.  
  21. $(document).ready(function(){
  22.  
  23. $('a.back-to-top').click(function() {
  24. $('html, body').animate({ scrollTop: 0}, 960);
  25. return false;
  26. });
  27.  
  28. });
  29.  
  30. </script>
  31.  
  32. <!--MASONRY -->
  33. <!---------------DO NOT REMOVE THESE SCRIPTS--------------->
  34.  
  35. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  36.  
  37. <stsss>
  38. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  39. <script>
  40. (function($){
  41. $(document).ready(function(){
  42. $("a[title]").style_my_tooltips({
  43. tip_follows_cursor:true,
  44. tip_delay_time:150,
  45. tip_fade_speed:250,
  46. attribute:"title"
  47. });
  48. });
  49. })(jQuery);
  50. </script>
  51.  
  52. {block:IndexPage}
  53. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  54. {block:ifInfiniteScroll}<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>{/block:ifInfiniteScroll}
  55.  
  56. <script type="text/javascript">
  57. $(window).load(function(){
  58. var $wall = $('#entries');
  59. $wall.imagesLoaded(function(){
  60. $wall.masonry({
  61. itemSelector: '#post, #post_photo',
  62. isAnimated : false
  63. });
  64. });
  65.  
  66. $wall.infinitescroll({
  67. navSelector : '#pagination',
  68. nextSelector : '#pagination a',
  69. itemSelector : '#post, #post_photo',
  70. bufferPx : 2000,
  71. debug : false,
  72. errorCallback: function() {
  73. $('#scroll').fadeOut('normal');
  74. $('.load-more').hide();
  75. }},
  76. function( newElements ) {
  77. var $newElems = $( newElements );
  78. $newElems.hide();
  79. $newElems.imagesLoaded(function(){
  80. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  81. });
  82.  
  83. var $newElems = $( newElements ).css({ opacity: 0 });
  84. $newElems.unnest();
  85. $newElems.animate({ opacity: 1 });
  86.  
  87. }); $('#entries').show(500);
  88.  
  89. {block:ifManualLoad}
  90. //thanks @ neothms!
  91. $(window).unbind('.infscr'); //where ‘window’ is what scrolls; if your theme is contained, replace ‘window’ by the “binder” of your infinite scroll script.
  92.  
  93. $('a.load-more').click(function(){ //where “load more link” is the name, id or class of the link you’re using to retrieve the content
  94. $('#entries').infinitescroll('retrieve'); //the name, id, or class of your articles’ container
  95. //if the footer disappears in the process: $('FOOTER NAME/ID/CLASS').show();
  96. //if the load more button stays in place while the content is appended under it (this goes in your infinitescroll’s callback): $('YOUR POSTS NAME/CLASS').last().after($('LOAD MORE LINK'));
  97. return false; //blocks any other behaviour the link could have
  98. });
  99. {/block:ifManualLoad}
  100. });
  101.  
  102.  
  103. </script>
  104. {/block:IndexPage}
  105.  
  106. <!--unnestting captions, credit to @neothm and @magnusthemes-->
  107. <script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  108. <script> $(window).load(function(){ $('article').unnest({
  109. yourCaption: ".caption", //your caption selector, the div wrapping {Caption}
  110. wrapName: ".tumblr_parent", //the name of the captions’ new wrapper
  111. newCaptionUsername: false, //if the user adds a new caption, following a series of captions, show their username above the caption
  112. originalPostCaptionUsername: false, //for the original captions, or a user-added caption that previously didn’t have any, have their username on it
  113. tumblrAvatars: true, //”dashboard style” caption, have the avatar of the blog next to the username
  114. tumblrAvatarClass: ".tumblr_avatar", //class of the avatar next to the username
  115. usernameColon: true //if turned to false, removes the colon at the end of usernames
  116. }); }); </script>
  117.  
  118. <meta name="color:Background" content="#fff" />
  119. <meta name="color:Link" content="#1bcc5c" />
  120. <meta name="color:Hover" content="#444" />
  121. <meta name="color:Text" content="#444" />
  122. <meta name="color:Caption BG" content="#eee" />
  123.  
  124. <meta name="image:Sidebar" content="" />
  125.  
  126. <meta name="text:Link1" content="/" />
  127. <meta name="text:Link1 Text" content="Link 1" />
  128. <meta name="text:Link2" content="/" />
  129. <meta name="text:Link2 Text" content="Link 2" />
  130. <meta name="text:Link3" content="/" />
  131. <meta name="text:Link3 Text" content="Link 3" />
  132. <meta name="text:Link4" content="/" />
  133. <meta name="text:Link4 Text" content="Link 4" />
  134. <meta name="text:Word1" content="word 1" />
  135. <meta name="text:Word2" content="word 2" />
  136. <meta name="text:Word3" content="word 3" />
  137.  
  138. <meta name="if:InfiniteScroll" content="1" />
  139. <meta name="if:ManualLoad" content="0" />
  140.  
  141.  
  142. <style type="text/css">
  143.  
  144. ::-webkit-scrollbar-thumb {
  145. height:auto;
  146. background-color:{color:Text};
  147. }
  148.  
  149. ::-webkit-scrollbar {
  150. height:4px;
  151. width:3px;
  152. padding-right:2px;
  153. background-color:white;
  154. }
  155.  
  156. #s-m-t-tooltip {
  157. max-width:200px;
  158. font-size:11px;
  159. background-color:{color:Caption BG};
  160. color:{color:Text};
  161. box-shadow:3px 3px 3px {color:Hover};
  162. line-height:9px;
  163. display:none;
  164. position:absolute;
  165. letter-spacing:1px;
  166. text-transform:uppercase;
  167. padding:9px 11px 9px 11px;
  168. margin:15px 0px 0px 15px;
  169. z-index:99999999999999;
  170. }
  171.  
  172. body {
  173. background:{color:Background};
  174. color:{color:Text};
  175. font-family: 'Muli', sans-serif;
  176. font-size:10.5px;
  177. letter-spacing:1px;
  178. line-height:14px;
  179. text-decoration:none;
  180. text-transform:none;
  181. margin:0px;
  182. }
  183.  
  184. a {
  185. color:{color:Link};
  186. text-decoration:none;
  187. -moz-transition-duration:0.3s;
  188. -webkit-transition-duration:0.3s;
  189. -o-transition-duration:0.3s;
  190. }
  191.  
  192. a:hover {
  193. color:{color:Hover};
  194. -moz-transition-duration:0.3s;
  195. -webkit-transition-duration:0.3s;
  196. -o-transition-duration:0.3s;
  197. }
  198.  
  199. h1, h2 { font-family:arial black; color:{color:Link}; }
  200.  
  201. li {
  202. list-style:square;
  203. }
  204.  
  205. blockquote {
  206. border-left:1px solid {color:Link};
  207. padding-left:7px;
  208. margin-left:10px;
  209. }
  210.  
  211. img, blockquote, li, h2 {
  212. max-width:100%;
  213. }
  214.  
  215. .content {
  216. width:500px;
  217. position:relative;
  218. top:40px;
  219. left: calc(50% - 250px);
  220. float:left;
  221. }
  222.  
  223. /*--------------------------SIDEBAR-----------------------------*/
  224. #sidebar {
  225. width:500px;
  226. height:300px;
  227. position:relative;
  228. margin:auto;
  229. }
  230.  
  231. .title {
  232. font-family:'Shrikhand', cursive;
  233. text-transform:lowercase;
  234. font-size:30px;
  235. line-height:38px;
  236. }
  237.  
  238. .organize {
  239. height:120px;
  240. }
  241.  
  242. .sidebarpic img {
  243. width:120px;
  244. height:120px;
  245. border-radius:5px;
  246. }
  247.  
  248. .links {
  249. font-size:10px;
  250. width:150px;
  251. margin-top:3px;
  252. margin-left:130px;
  253. position:absolute;
  254. font-style:none;
  255. text-decoration:none;
  256. letter-spacing:1px;
  257. text-transform:uppercase;
  258. }
  259.  
  260. .links a {
  261. display:block;
  262. padding:7.5px;
  263. color:{color:Link};
  264. }
  265.  
  266. .links a:hover {
  267. background-color:{color:Hover};
  268. color:white;
  269. }
  270.  
  271. .keyword {
  272. position:absolute;
  273. width:180px;
  274. padding:10px;
  275. margin-top:56px;
  276. right:0px;
  277. text-align:right;
  278. line-height:18px;
  279. text-transform:lowercase;
  280. font-size:15px;
  281. font-family:'Shrikhand', cursive;
  282. }
  283.  
  284. .arrow-up {
  285. width: 0;
  286. height: 0;
  287. border-left: 15px solid transparent;
  288. border-right: 15px solid transparent;
  289. margin-left: calc(100% - 60px);
  290. margin-top:10px;
  291. border-bottom: 15px solid {color:Caption BG};
  292. }
  293.  
  294. .description {
  295. width:calc(100% - 20px);
  296. padding:10px;
  297. font-size:10px;
  298. letter-spacing:1px;
  299. position:relative;
  300. background:{color:Caption BG};
  301. border-radius:5px;
  302. text-transform:uppercase;
  303. }
  304.  
  305. /*--------------------------POSTS---------------------------------*/
  306. #entries {
  307. width:500px;
  308. margin:auto;
  309. position:relative;
  310. margin-top:100px;
  311. {block:PermalinkPage}margin-top:60px;{/block:PermalinkPage}
  312. }
  313.  
  314. #post {
  315. width:500px;
  316. margin-bottom:200px;
  317. border-radius:10px;
  318. }
  319.  
  320. #post img { border-radius:5px; }
  321.  
  322. .quotepost {
  323. font-family:'Playfair Display', serif;
  324. font-weight:400;
  325. font-size:32px;
  326. text-transform:none;
  327. line-height:34px;
  328. margin-top:15px;
  329. z-index:2;
  330. }
  331.  
  332. .quotemark {
  333. font-weight:initial;
  334. font-size:170px;
  335. margin-top:35px;
  336. position:absolute;
  337. opacity:.4;
  338. z-index:-1;
  339. }
  340.  
  341. .quotesource {
  342. font-family:"Shrikhand", cursive;
  343. margin-top:16px;
  344. font-size:16px;
  345. text-align:right;
  346. }
  347.  
  348. .chatpost ul {
  349. padding:0;
  350. }
  351.  
  352. .chatpost li {
  353. list-style:none;
  354. }
  355.  
  356. .label {
  357. font-family:'Playfair Display';
  358. text-transform:none;
  359. font-weight:900;
  360. line-height:16px;
  361. font-size:14px;
  362. }
  363.  
  364. /*--CAPTION--*/
  365. .caption { margin-top:10px; width:500px; }
  366.  
  367. .tumblr_parent {
  368. width: calc(100% - 20px);
  369. margin:0 10px 10px 0;
  370. padding:10px;
  371. background:{color:Caption BG};
  372. border-left:none;
  373. border-radius:5px;
  374. }
  375.  
  376. .tumblr_parent blockquote{
  377. margin-top:20px;
  378. }
  379.  
  380. .tumblr_avatar {
  381. margin-right: 10px;
  382. }
  383.  
  384. /*--INFO AND TAGS--*/
  385. .info {
  386. border-radius:5px;
  387. font-size:12.5px;
  388. letter-spacing:2px;
  389. font-style:italic;
  390. width: calc(100% - 20px);
  391. padding:10px;
  392. background:{color:Caption BG};
  393. margin-bottom:10px;
  394. }
  395.  
  396. .info a {
  397. font-size:8.5px;
  398. color:{color:Link};
  399. }
  400.  
  401. .info a:hover {
  402. color:{color:Hover};
  403. }
  404.  
  405. .tags {
  406. margin-top:10px;
  407. text-transform:lowercase;
  408. font-family:'Shrikhand', cursive;
  409. }
  410.  
  411. .tags a { font-size:10px; font-family:'Muli', sans-serif; }
  412.  
  413. .tags a:hover { font-style:italic; }
  414.  
  415. .perma {
  416. margin-top:20px;
  417. text-transform:lowercase;
  418. font-family:'Shrikhand', cursive;
  419. font-size:13px;
  420. line-height:16px;
  421. word-spacing:1px;
  422. }
  423.  
  424. .perma a { font-size:13px; font-family:'Muli', sans-serif; }
  425.  
  426. /*--BOTTOM INFO--*/
  427. #bottominfo {
  428. text-align:center;
  429. margin-bottom:200px;
  430. font-size:11.5px;
  431. letter-spacing:1px;
  432. word-spacing:3px;
  433. }
  434.  
  435. #bottominfo a {
  436. font-size:9px;
  437. text-transform:uppercase;
  438. letter-spacing:1px;
  439. }
  440.  
  441. /*---PAGINATION----*/
  442. #pagination {
  443. opacity:0;
  444. }
  445.  
  446. #pagination a { color:{color:Link}; }
  447.  
  448. /*---LOAD MORE BUTTON----*/
  449. a:hover.load-more { cursor:crosshair; }
  450.  
  451. a:hover.back-to-top { cursor:crosshair; }
  452.  
  453. #scroll{
  454. bottom:-20px;
  455. position: absolute;
  456. left: 50%;
  457. width:10px;
  458. height:5px;
  459. overflow:hidden;
  460. margin-bottom:80px;
  461. }
  462.  
  463. .postnotes { font-size:10px; width: calc(100% - 20px); padding:10px; background:{color:Caption BG}; line-height:16px; margin-top:20px; }
  464.  
  465. .postnotes li { list-style:none; }
  466. .postnotes img { display:none; }
  467.  
  468.  
  469. /*--CREDIT--*/
  470. #spectrum {
  471. bottom:9px;
  472. right:9px;
  473. font-size:8px;
  474. letter-spacing:1px;
  475. position:fixed;
  476. text-transform:uppercase;
  477. }
  478.  
  479. {CustomCSS}</style></head><body>
  480.  
  481. <div class="content">
  482.  
  483. <div id="sidebar">
  484. <div class="title"><a href="/" title="home">{Title};</a></div>
  485.  
  486. <div class="organize">
  487. <div class="links">
  488. <a href="{text:Link1}">{text:Link1 Text}</a>
  489. <a href="{text:Link2}">{text:Link2 Text}</a>
  490. <a href="{text:Link3}">{text:Link3 Text}</a>
  491. <a href="{text:Link4}">{text:Link4 Text}</a>
  492. </div>
  493.  
  494. <div class="keyword">{text:Word1}<br>{text:Word2}<br>{text:Word3}</div>
  495.  
  496. <div class="sidebarpic"><img src="{image:Sidebar}" /></div>
  497.  
  498. </div><!--end .organize-->
  499.  
  500. <div class="arrow-up"></div>
  501. <div class="description">{Description}</div>
  502.  
  503. </div>
  504.  
  505. <div id="entries">{block:Posts}
  506. {block:ContentSource}
  507. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  508. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  509. {/block:SourceLogo}
  510. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  511. {/block:ContentSource}
  512. <div id="post">
  513.  
  514. {block:IndexPage}
  515. <div class="info">
  516. {block:Date}&#215; <a href="{Permalink}">{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</a>
  517. {block:NoteCount} &#215; <a href="{Permalink}">{NoteCount}</a>{/block:NoteCount}
  518. {block:RebloggedFrom} &#215; <a href="{ReblogParentURL}" target="blank">via</a>{/block:RebloggedFrom}
  519. {block:RebloggedFrom} &#215; <a href="{ReblogRootURL}" target="blank">source</a>{/block:RebloggedFrom}
  520. &#215; <a href="{ReblogURL}" target="blank">reblog</a>
  521. {/block:Date}</div><!--end .info-->
  522. {/block:IndexPage}
  523.  
  524. {block:Text}
  525. {block:Title}<h1>{Title}</h1>{/block:Title}
  526. {Body}
  527. {/block:Text}
  528.  
  529. {block:Answer}
  530. {Asker} asked: {Question}
  531. {Answer}
  532. {/block:Answer}
  533.  
  534. {block:Quote}
  535. <div class="quotepost"><a class="quotemark">&#147;</a>{Quote}</div>
  536. {block:Source}<div class="quotesource">&#8213; {Source}</div>{/block:Source}
  537. {/block:Quote}
  538.  
  539. {block:Link}
  540. <h2><a href="{URL}">{Name}</a></h2>
  541. {block:Description}{Description}{/block:Description}
  542. {/block:Link}
  543.  
  544. {block:Chat}
  545. {block:Title}<h1>{Title}</h1>{/block:Title}
  546. <div class="chatpost">
  547. <ul>{block:Lines}
  548. <li class="line_{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>
  549. {/block:Lines}</ul>
  550. </div>
  551. {/block:Chat}
  552.  
  553. {block:Photo}
  554. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{LinkCloseTag}
  555. {/block:Photo}
  556.  
  557. {block:Photoset}
  558. {Photoset-500}
  559. {/block:Photoset}
  560.  
  561. {block:Audio}
  562. {AudioPlayerWhite}
  563. {block:TrackName}{TrackName}{/block:Trackname}
  564. {AudioPlayerBack}
  565. {/block:Audio}
  566.  
  567. {block:Video}
  568. {Video-500}
  569. {/block:Video}
  570.  
  571. {block:Caption}<article><div class="caption">{Caption}</div></article>{/block:Caption}
  572.  
  573. {block:IndexPage}{block:HasTags}<div class="tags">filed under: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}</div>{/block:HasTags}{/block:IndexPage}
  574.  
  575. {block:PermalinkPage}
  576. <div class="perma">
  577. {block:Date}Posted: <a href="{Permalink}">{Month} {DayOfMonthWithZero}, {Year}</a>
  578. {block:NoteCount}<br>with: <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  579. {block:RebloggedFrom}<br>Reblogged From: <a href="{ReblogParentURL}" target="blank">{ReblogParentName}</a>{/block:RebloggedFrom}
  580. {block:RebloggedFrom}<br>Originally From: <a href="{ReblogRootURL}" target="blank">{ReblogRootName}</a>{/block:RebloggedFrom}
  581. {/block:Date}
  582. {block:HasTags}<br>filed under: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}{/block:HasTags}
  583. </div><!--end .tags-->
  584. {/block:PermalinkPage}
  585.  
  586. {block:PostNotes}<div class="postnotes">{PostNotes}</div>{/block:PostNotes}
  587.  
  588. </div><!--end #post-->
  589.  
  590. {/block:Posts}</div><!--end #entries-->
  591.  
  592. {block:IndexPage}
  593. <div id="bottominfo">
  594. &#215; <a href="#top" class="back-to-top">scroll up</a>
  595.  
  596. {block:ifManualLoad} &#215; <a href="#" class="load-more">load more</a> &#215;{/block:ifManualLoad}
  597.  
  598. {block:ifNotManualLoad}
  599. {block:PreviousPage} &#215; <a href="{PreviousPage}">newer</a>{/block:PreviousPage}{block:NextPage} &#215; <a href="{NextPage}">older</a>{/block:NextPage}
  600. &#215;
  601. {/block:ifNotManualLoad}
  602. </div><!--end #bottominfo-->
  603. {/block:IndexPage}
  604.  
  605. <!--end .content-->
  606.  
  607.  
  608. <div id="spectrum">
  609. <a href="http://wonderfullythemes.tumblr.com" title="wonderfullythemes" target="blank">theme</a>
  610. </div>
  611.  
  612.  
  613. {block:IndexPage}
  614. {block:Pagination}
  615. <div id="pagination">
  616. {block:NextPage}
  617. <a id="nextPage" href="{NextPage}"></a>
  618. {/block:NextPage}
  619. {block:PreviousPage}
  620. <a id="previousPage" href="{PreviousPage}"></a>
  621. {/block:PreviousPage}
  622. </div>
  623. {/block:Pagination}
  624. {/block:IndexPage}
  625.  
  626. </body>
  627. </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!