API tools faq
paste
jamidanielle_

BeYouBeHappyLove

jamidanielle_
May 31st, 2016
106
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.86 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <html>
  4. <head>
  5.  
  6.  
  7.  
  8.  
  9. <!--------------------------------->
  10. <!-----------[CUSTOM THEME]-------->
  11. <!-----THEME BY FOLKLORE THEMES---->
  12. <!--------------MAY 2016----------->
  13. <!--DO NOT STEAL OR REMOVE CREDIT-->
  14. <!--------------------------------->
  15. <!--------------------------------->
  16.  
  17.  
  18.  
  19.  
  20. <meta name="color:Background" content=""/>
  21.  
  22. <meta name="color:Text" content=""/>
  23. <meta name="color:Links" content=""/>
  24. <meta name="color:Link Hover" content=""/>
  25. <meta name="color:Border" content=""/>
  26. <meta name="color:Scrollbar" content=""/>
  27. <meta name="text:Link 1 URL" content=""/>
  28. <meta name="text:Link 1 Title" content=""/>
  29. <meta name="text:Link 2 URL" content=""/>
  30. <meta name="text:Link 2 Title" content=""/>
  31. <meta name="text:Link 3 URL" content=""/>
  32. <meta name="text:Link 3 Title" content=""/>
  33. <meta name="select:Font" content="poiret-one" title="Poiret One"/>
  34. <meta name="select:Font" content="raleway" title="Raleway"/>
  35. <meta name="select:Font" content="overlock" title="Overlock"/> <meta name="select:Font" content="josefin-sans" title="Josefin Sans"/>
  36. <meta name="select:Font" content="bubbler-one" title="Bubbler One"/>
  37. <meta name="select:Font" content="quicksand" title="Quicksand"/>
  38.  
  39.  
  40. <script src="//use.edgefonts.net/poiret-one;raleway;overlock;josefin-sans;bubbler-one;quicksand.js"></script>
  41.  
  42.  
  43.  
  44.  
  45. <style type="text/css">
  46.  
  47. ::-webkit-scrollbar-thumb:vertical {
  48.  
  49. background-color:{color:Scrollbar};
  50. /*scrollbar's slider color*/
  51. height:100px;
  52. padding:2px;
  53. -moz-border-radius: 0px; /*these make bar rounded*/
  54. border-radius: 0px;
  55. }
  56.  
  57. ::-webkit-scrollbar-thumb:horizontal {
  58. background-color:#fff; /*scrollbar's slider color*/
  59. height:100px !important;
  60. }
  61.  
  62. ::-webkit-scrollbar {
  63. height:10px;
  64. padding:2px;
  65. width:4px; /*width of slider*/
  66. background-color:#fff;
  67. /*scrollbar's main color*/
  68. }
  69.  
  70.  
  71.  
  72.  
  73.  
  74. body{
  75. background-color:{color:Background};
  76. font-family:{select:Font};
  77. color:{color:Text};
  78. }
  79.  
  80.  
  81. a {
  82. text-decoration:none;
  83. color:{color:Links};
  84. -moz-transition-duration: 0.5s;
  85. -o-transition-duration: 0.5s;
  86. -webkit-transition-duration: 0.5s;
  87. transition-duration: 0.5s;
  88. }
  89.  
  90. a:hover{
  91.  
  92. -moz-transition-duration: 0.5s;
  93. -o-transition-duration: 0.5s;
  94. -webkit-transition-duration: 0.5s;
  95. transition-duration: 0.5s;
  96. color:{color:Link Hover};
  97. }
  98.  
  99.  
  100. #header{
  101. width:100%;
  102. height:100px;
  103. }
  104.  
  105.  
  106. #title{
  107. text-align:center;
  108. font-size:50px;
  109.  
  110. margin-top:25px;
  111. color:{color:Links};
  112. }
  113.  
  114.  
  115. #desc{
  116. text-align:center;
  117. margin:30px 0 15px 0;
  118. font-size:14px;
  119. }
  120.  
  121.  
  122.  
  123. .raleway{
  124. font-family:'Raleway',arial,sans-serif;
  125. font-weight:200;
  126. }
  127.  
  128.  
  129.  
  130.  
  131.  
  132. #wrapper{
  133. width:1150px;
  134. margin:60px auto;
  135. position:relative;
  136.  
  137.  
  138. }
  139.  
  140. .posts {
  141.  
  142.  
  143. width:250px;
  144. float:left;
  145.  
  146. padding:7px;
  147. margin:10px;
  148. background-color:{color:Posts bg};
  149. border:1px solid {color:Border};
  150.  
  151.  
  152.  
  153.  
  154. }
  155.  
  156.  
  157.  
  158. .posts img {
  159.  
  160. margin:0 auto;
  161. width:350px;
  162. }
  163.  
  164.  
  165. .posts .title {
  166. color:{color:Links};
  167. font-size:18px;
  168. font-family:'PT Sans Narrow', sans-serif;
  169. padding:3px 2px 2px 2px;
  170. text-transform:uppercase;
  171.  
  172. }
  173.  
  174. .posts .text {
  175. font-size:11px;
  176. font-family:arial;
  177. }
  178.  
  179. .posts h2 {
  180. font-size:14px;
  181. font-weight:normal;
  182. margin:0px;
  183.  
  184. }
  185.  
  186. .posts h2 a {
  187. font-size:12px;
  188. }
  189.  
  190. blockquote {
  191. border-left: solid 1px {color:Text};
  192. margin: 0;
  193. padding-left: 10px;
  194. }
  195.  
  196.  
  197. .posts .photocap {
  198.  
  199. font-size:11px;
  200. padding-bottom:2px;
  201.  
  202.  
  203. }
  204.  
  205.  
  206.  
  207.  
  208.  
  209. .posts .qut {
  210. font-size:14px;
  211. font-style:italic;
  212. text-align:center;
  213.  
  214. }
  215.  
  216. .posts .src {
  217. text-align:right;
  218. margin-top:-7px;
  219. font-size:11px;
  220.  
  221.  
  222. }
  223.  
  224. .posts .qtmrk1 {
  225. font-size:30px;
  226. text-align:center;
  227. font-family:serif;
  228. margin-bottom:4px;
  229. }
  230.  
  231. .posts .qtmrk2 {
  232. font-size:30px;
  233. text-align:center;
  234. font-family:serif;
  235. margin-top:8px;
  236. }
  237.  
  238.  
  239. .posts .photoset {
  240. width:350px;
  241. padding-right:10px;
  242.  
  243. margin:0 auto;
  244.  
  245.  
  246. }
  247.  
  248. .posts .label{
  249. font-family:arial;
  250. display:inline;
  251. font-size:11px;
  252. padding-right:2px;
  253.  
  254. }
  255.  
  256. .posts .lines{
  257. font-family:arial;
  258. display:inline;
  259. font-size:11px;
  260.  
  261. }
  262.  
  263. .question {
  264. font-size:12px;
  265. color:{color:Text};
  266. font-family:arial;
  267. text-align:left;
  268.  
  269. }
  270.  
  271. .asker {
  272. font-size:11px;
  273. color:{color:Links};
  274. font-family:arial;
  275. text-align:left;
  276. padding-top:4px;
  277. padding-bottom:10px;
  278. display:inline;
  279. }
  280.  
  281. .answer {
  282. font-size:12px;
  283. color:{color:Text};
  284. font-family:arial;
  285. text-align:center;
  286.  
  287.  
  288. }
  289.  
  290.  
  291. td img{
  292. max-height:40px;
  293. max-width:40px;
  294. }
  295.  
  296. img {
  297. max-width:100%;
  298. }
  299.  
  300.  
  301.  
  302.  
  303.  
  304. .playerbuttonbg {
  305. position: absolute;
  306. left: 20px;
  307. top: 20px;
  308. width: 19px;
  309. height: 19px;
  310. background-color: #ffffff;
  311. padding: 10px;
  312. -webkit-border-radius: 40px;
  313. -moz-border-radius: 40px;
  314. border-radius: 40px;
  315. opacity: .4;
  316. filter: alpha(opacity=40);
  317. -moz-opacity: 0.4;
  318. -khtml-opacity: 0.4;
  319. transition: opacity .7s ease-in-out;
  320. -moz-transition: opacity .7s ease-in-out;
  321. -webkit-transition: opacity .7s ease-in-out;
  322. }
  323.  
  324. .playerbuttonbg:hover {
  325. opacity: 1;
  326. filter: alpha(opacity=100);
  327. -moz-opacity: 1;
  328. -khtml-opacity: 1;
  329. }
  330.  
  331. .newplayerbutton {
  332. position: relative;
  333. width: 19px;
  334. height: 19px;
  335. overflow: hidden;
  336. }
  337.  
  338. .playerbuttonhug {
  339. position: absolute;
  340. top: -18px;
  341. left: -7px;
  342. }
  343.  
  344. .tumblr_audio_player {
  345. height: 90px;
  346. width: 270px;
  347. -moz-transform: scale(0.60, 0.60);
  348. -webkit-transform: scale(0.60, 0.60);
  349. -o-transform: scale(0.60, 0.60);
  350. -ms-transform: scale(0.60, 0.60);
  351. transform: scale(0.60, 0.60);
  352. -moz-transform-origin: top left;
  353. -webkit-transform-origin: top left;
  354. -o-transform-origin: top left;
  355. -ms-transform-origin: top left;
  356. transform-origin: top left;
  357. }
  358.  
  359. .audioimgwrapper {
  360. position: absolute;
  361. left: 0px;
  362. top: 0px;
  363. -webkit-border-radius: 40px;
  364. -moz-border-radius: 40px;
  365. border-radius: 40px;
  366. overflow: hidden;
  367. width: 79px;
  368. height: 79px;
  369. }
  370.  
  371. .audioimgwrapper img {
  372. width: 100%;
  373. height: auto;
  374. -webkit-border-radius: 40px;
  375. -moz-border-radius: 40px;
  376. border-radius: 40px;
  377. }
  378.  
  379. .trackdetails {
  380. width: auto;
  381.  
  382. display:inline-block;
  383. margin-left: 90px;
  384. min-height: 85px;
  385. font-size:12px;
  386. font-family:sans-serif;
  387. color:{color:Text};
  388. }
  389.  
  390. .audiowrapper {
  391. position: relative;
  392. display:inline-block;
  393. }
  394.  
  395.  
  396. .info{
  397. font-size:12px;
  398. text-align:center;
  399. text-transform:uppercase;
  400.  
  401.  
  402. }
  403.  
  404.  
  405.  
  406. .tags{
  407. display:none;
  408. }
  409.  
  410. #notecontainer {
  411. margin: 20px auto;
  412. width: 350px;
  413. font-size: 11px;
  414. }
  415.  
  416. #notecontainer ol.notes {
  417. list-style-type: none;
  418. margin: 0;
  419. padding: 0;
  420. }
  421.  
  422. #notecontainer img.avatar {
  423. margin-right: 10px;
  424. width: 16px;
  425. height: 16px;
  426. }
  427.  
  428.  
  429. .pagination{
  430. display:none;
  431. }
  432.  
  433.  
  434. #cred{
  435. position:fixed;
  436. font-size:12px;
  437. bottom:6px;
  438. right:4px;
  439. font-weight:bold;
  440.  
  441. }
  442.  
  443. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
  444. #infscr-loading {display:none;}
  445. .navigation {display:none!important;}
  446.  
  447. </style>
  448.  
  449. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  450.  
  451. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  452.  
  453. <script>
  454. $(function(){
  455. var $container = $('#wrapper');
  456. $container.imagesLoaded(function(){
  457. $container.masonry({
  458. itemSelector: '.posts',
  459. });
  460. });
  461. $container.infinitescroll({
  462. itemSelector : ".posts",
  463. navSelector : "div.pagination",
  464. nextSelector : ".pagination a#next",
  465. loadingImg : "",
  466. loadingText : "<em></em>",
  467. bufferPx : 10000,
  468. extraScrollPx: 12000,
  469. },
  470. // trigger Masonry as a callback
  471. function( newElements ) {
  472. var $newElems = $( newElements ).css({ opacity: 0 });
  473. // ensure that images load before adding to masonry layout
  474. $newElems.imagesLoaded(function(){
  475. $newElems.animate({ opacity: 1 });
  476. $container.masonry( 'appended', $newElems, true );
  477. });
  478. }
  479. );
  480. });
  481. </script>
  482.  
  483. </head>
  484.  
  485.  
  486. <body>
  487.  
  488.  
  489. <div id="header">
  490. <div id="title">{Title}</div>
  491. <div id="desc">{Description}</div>
  492.  
  493. <div class="navlinks" style="text-align:center;margin-top:10px;font-size:15px">
  494. <a href="/">home</a>&nbsp;&nbsp;
  495. <a href="/archive">archive</a>&nbsp;&nbsp;
  496. <a href="https://www.instagram.com/beyoubehappylove/">instagram</a>&nbsp;&nbsp;
  497. <a href="https://twitter.com/BeYouBeHappyLuv">twitter</a>&nbsp;&nbsp;
  498. {block:AskEnabled}
  499. <a href="/ask">ask</a>
  500. {/block:AskEnabled}
  501. </div>
  502.  
  503. </div>
  504.  
  505.  
  506. <div id="wrapper">
  507.  
  508.  
  509. {block:Posts}
  510.  
  511.  
  512.  
  513.  
  514. <div class="posts">
  515.  
  516. {block:Photo}
  517. {LinkOpenTag}<img src="{PhotoURL-500}" />{LinkCloseTag}
  518. {block:Caption}<div class="photocap">{Caption}</div>{/block:Caption}
  519. {/block:Photo}
  520.  
  521. {block:Photoset}<div class="photoset">
  522. {Photoset}<!-- edited~ -->
  523. {block:Caption}<div class="photocap">{Caption}</div>{/block:Caption}</div>
  524. {/block:Photoset}
  525.  
  526. {block:Video}
  527. <div class="video">{Video-500}</div>
  528. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  529. {/block:Video}
  530.  
  531. {block:Audio}
  532. {block:AudioPlayer}
  533. <div class="audiowrapper">
  534. {block:AlbumArt}
  535. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  536. {/block:AlbumArt}
  537.  
  538. <div class="playerbuttonbg">
  539. <div class="newplayerbutton">
  540. <div class="playerbuttonhug">
  541.  
  542. {AudioPlayerWhite}
  543.  
  544. </div>
  545. </div>
  546. </div>
  547.  
  548. <div class="trackdetails">
  549.  
  550. {block:TrackName}{TrackName}{/block:TrackName}<br/>
  551. {block:Artist}Artist: {Artist}{/block:Artist}<br/>
  552. {block:Album}Album: {Album}{/block:Album}<br/>
  553. {PlayCountWithLabel}
  554.  
  555. </div>
  556. </div>
  557. {/block:AudioPlayer}
  558.  
  559. {block:Caption}{Caption}{/block:Caption}
  560. {/block:Audio}
  561.  
  562. {block:Quote}
  563. <div class="qut"><div class="qtmrk1">“</div>{Quote}<div class="qtmrk2">”</div></div>
  564. {block:Source}<div class="src"><br>&mdash; {Source}</div>{/block:Source}
  565. {/block:Quote}
  566.  
  567. {block:Text}
  568. {block:Title}<div class="title">{Title}</div>{/block:Title}
  569. <div class="text">{Body}</div>
  570. {/block:Text}
  571.  
  572. {block:Answer}
  573. <table style="border-bottom:1px solid {color:Border};padding-bottom:5px;margin-bottom:5px;">
  574. <tr>
  575. <td style="vertical-align:top;padding-right:10px;"><img src="{AskerPortraitURL-40}"></td>
  576. <td style="vertical-align:top;"><div class="asker">{Asker} </div><span style="font-size:11px;">asked: </span> <div class="question"><em>{Question}</em></div></td>
  577. </tr>
  578. </table>
  579. <div class="answer">{Answer}</div>
  580. {/block:Answer}
  581.  
  582.  
  583.  
  584. {block:Chat}
  585. {block:Title}<h1>{Title}</h1>{/block:Title}
  586. {block:Lines}{block:Label}<div class="label"><b>{Label}</b></div>{/block:Label}<div class="lines">{Line}</div><br>{/block:Lines}
  587. {/block:Chat}
  588.  
  589. {block:Link}
  590. <div class="title"><a href="{URL}">{Name}</a></div>
  591. {block:Description}
  592. <div class="text">{Description}</div>
  593. {/block:Description}
  594. {/block:Link}
  595.  
  596. <div class="info">
  597. <a href="{Permalink}">{block:Date}{TimeAgo}&nbsp;{/block:Date}</a><span style="color:{color:Links}">with </span><a href="{Permalink}" >{block:NoteCount}{NoteCount} notes{/block:NoteCount}</a> &nbsp;
  598.  
  599.  
  600.  
  601.  
  602. </div>
  603.  
  604.  
  605. {block:HasTags}<div class="tags">
  606. {block:Tags}
  607. <a href="{TagURL}"> #{Tag}&nbsp;</a>
  608. {/block:Tags}
  609. </div>
  610. {/block:HasTags}
  611.  
  612.  
  613. {block:PostNotes}
  614. <div id="notecontainer">{PostNotes}</div>
  615. {/block:PostNotes}
  616. </div>
  617.  
  618.  
  619.  
  620.  
  621. {/block:Posts}
  622.  
  623.  
  624.  
  625. {block:PermalinkPage}
  626. {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  627. &nbsp; {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}
  628. {block:RebloggedFrom} <a href="{ReblogParentURL}" ></a>{/block:RebloggedFrom}{/block:PermalinkPage}
  629.  
  630. </div>
  631.  
  632. <div class="pagination">
  633. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  634. </div>
  635.  
  636.  
  637.  
  638.  
  639. <div id="cred"><a href="http://folklorethemes.tumblr.com">flt.</a>
  640. </div>
  641.  
  642.  
  643. </body>
  644.  
  645. </html>
Advertisement
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!