Advertisement
cornetespoir

Bec revamp

Feb 2nd, 2018
4,307
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.25 KB | None | 0 0
  1. <!--
  2. // Theme
  3.  
  4. Bec 2.0
  5.  
  6. by espoirthemes //
  7.  
  8. + edits to the code are allowed
  9. + send questions to espoirthemes.com/contact
  10. + please do not move or remove the credit
  11.  
  12.  
  13. -->
  14.  
  15. <!DOCTYPE html>
  16. <html>
  17. <head>
  18.  
  19. <meta charset="utf-8">
  20. <title>{Title}</title>
  21. {block:Description}
  22. <meta name="description" content="{MetaDescription}">
  23. {/block:Description}
  24.  
  25. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  28. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  29. <meta name="color:background" content="mistyrose" />
  30. <meta name="color:posts" content="#fff" />
  31. <meta name="color:links" content="crimson" />
  32. <meta name="color:border" content="#eee" />
  33. <meta name="color:ask bubble" content="crimson" />
  34. <meta name="color:ask bubble 2" content="salmon" />
  35. <meta name="color:ask text" content="#fff"/>
  36. <meta name="color:hover info background" content="salmon" />
  37. <meta name="color:hover info icon" content="#fff" />
  38.  
  39. <meta name="color:pagination" content="#f57483" />
  40.  
  41. <link href="https://fonts.googleapis.com/css?family=Raleway|Shrikhand" rel="stylesheet">
  42. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  43.  
  44. <script type="text/javascript">
  45. $(window).load(function() { $("#loading").delay(0).fadeOut();
  46. })
  47. </script>
  48.  
  49. <style>
  50.  
  51. body {
  52. background:{color:background};
  53. margin:0;
  54. font-size:1em;
  55. font-family:Raleway;
  56. overflow-x:hidden;
  57. word-wrap:break-word;
  58. }
  59.  
  60. a {
  61. text-decoration:none;
  62. color:{color:links};
  63.  
  64. }
  65.  
  66. header {
  67. width:100%;
  68. padding-top:100px;
  69. padding-bottom:50px;
  70. min-height:20vh;
  71. background:{color:background};
  72. }
  73.  
  74.  
  75. .title {
  76. text-align:center;
  77. font-size:7em;
  78. color:crimson;
  79. text-shadow: -2px 2px 0 salmon,
  80. -4px 4px 0 salmon,
  81. -6px 6px 0 pink,
  82. -8px 8px 0 pink;
  83. font-family:Shrikhand;
  84.  
  85. }
  86.  
  87. .description, .menu {
  88. text-align:center;
  89. width:50%;
  90. margin:10px auto;
  91.  
  92. }
  93.  
  94. .menu a {
  95. border:2px solid {color:links};
  96. padding:4px 10px;
  97. border-radius:10px;
  98. line-height:200%;
  99.  
  100. }
  101.  
  102.  
  103.  
  104. .description {
  105. padding:20px 40px;
  106. }
  107.  
  108. h1 {
  109. font-size:2em;
  110. }
  111. h2 {
  112. font-size:1.8em;
  113. }
  114.  
  115. h1, h2 {
  116. font-family:Shrikhand;
  117. color:crimson;
  118. padding:10px 10px 30px 10px;
  119. border-bottom:1px dotted {color:border};
  120. text-align:center;
  121. }
  122.  
  123.  
  124. #con {
  125. width:60%;
  126. margin:100px auto;
  127. column-count:2;
  128. column-gap:40px;
  129. }
  130. article {
  131. width:90%;
  132. display:inline-block;
  133. break-inside:avoid;
  134. margin:30px auto;
  135. position:relative;
  136. border-radius:8px;
  137. background:{color:posts};
  138. }
  139.  
  140.  
  141. .posts img, iframe {
  142. opacity:.8;
  143. }
  144.  
  145. .posts img {
  146. max-width:100%;
  147. display:block;
  148. }
  149.  
  150. .caption {
  151. padding:40px;
  152. margin:10px 0;
  153. }
  154. .tags {
  155. border-top:1px dotted {color:border};
  156. padding:15px;
  157. }
  158.  
  159. .tags a {
  160. opacity:.8;
  161. margin:0px 4px;
  162. }
  163.  
  164. ol.notes {
  165. line-height:200%;
  166. }
  167.  
  168. .user, .deactivated, .tumblelog, ol.notes .like .action a {
  169. margin:6px;
  170. margin-left:20px;
  171. padding:4px;
  172. border-radius:4px;
  173. border:none;
  174. position:relative;
  175. background:rgba({RGBcolor:links}, .12)
  176. }
  177.  
  178. .user:after, .deactivated:after, .tumblelog:after, ol.notes .like .action a:after
  179. {
  180. content: '';
  181. position: absolute;
  182. border-style: solid;
  183. border-width: 8px 13px 8px 0;
  184. border-color: transparent rgba({RGBcolor:links}, .12); /* keep same color as bubble */
  185. display: block;
  186. width: 0;
  187. z-index: 1;
  188. left: -13px;
  189. top: 6px;
  190. }
  191.  
  192. .reblog-header img {
  193. transform:translate(0,-4px);
  194. }
  195.  
  196. .deactivated:before {
  197. content:'deactivated';
  198. position:absolute;
  199. padding-left:8px;
  200. opacity:0;
  201. transition:.4s ease-in-out;
  202. }
  203.  
  204. .deactivated:hover:before {
  205. opacity:1;
  206.  
  207. }
  208.  
  209.  
  210. .speechbubble {
  211.  
  212. width:calc(70% - 16px);
  213. position: relative;
  214. left:80px;
  215. margin: 0;
  216. padding:16px;
  217. border-radius:10px;
  218. height: auto;
  219. color:{color:ask text};
  220. background: linear-gradient(to right, {color:ask bubble}, {color:ask bubble 2});
  221. {block:permalinkpage}
  222. width:360px;
  223. {/block:permalinkpage}
  224. }
  225.  
  226. /* the before and after are the triangle part of the speech bubble */
  227. .speechbubble:after
  228. {
  229. content: '';
  230. position: absolute;
  231. border-style: solid;
  232. border-width: 12px 17px 12px 0;
  233. border-color: transparent {color:ask bubble}; /* keep same color as bubble */
  234. display: block;
  235. width: 0;
  236. z-index: 1;
  237. left: -16px;
  238. top: 10px;
  239. }
  240.  
  241.  
  242. /* Chat Posts */
  243.  
  244. .chat {
  245. padding:5px;
  246. line-height:150%;
  247. }
  248.  
  249.  
  250. .chat:nth-of-type(odd) {
  251. background:linear-gradient( to right, {color:links}, {color:header});
  252. color:{color:posts};
  253. -webkit-transition:.5s;
  254. transition:.5s; }
  255.  
  256. .chat:nth-of-type(odd) b {
  257. color:{color:posts};
  258. -webkit-transition:.5s;
  259. transition:.5s; }
  260.  
  261. .chat:nth-of-type(even) {
  262. background:{color:posts};
  263. color:{color:links};
  264. -webkit-transition:.5s;
  265. transition:.5s; }
  266. .chat:nth-of-type(even) b{
  267. color:{color:links};
  268. -webkit-transition:.5s;
  269. transition:.5s; }
  270.  
  271. /* Audio Posts */
  272.  
  273.  
  274. .posts #albumart{
  275. z-index:2;
  276. float:left;
  277. border-radius:100%;
  278. height:100px;
  279. border:1px solid {color:info border};
  280. width:100px;
  281. }
  282.  
  283.  
  284.  
  285. /* circle inside the album art to make it look like a CD */
  286.  
  287. .playerbox {
  288. float:left;
  289. padding:6px;
  290. }
  291.  
  292.  
  293. .posts #albumart img{
  294.  
  295.  
  296. float:left;
  297. border-radius:100%;
  298. width:100px;
  299. height:100px;
  300. border-width:0px; transition:.6s;
  301.  
  302. }
  303.  
  304. .playerbox:hover #albumart img{
  305. transition:0.6s;
  306. transform:rotate(300deg); }
  307.  
  308. .player {
  309. width:20px;
  310. overflow:hidden;
  311. height:40px;
  312. transform:scale(1.2);
  313. border-radius:100%;
  314. top:8px;
  315. bottom:10px;
  316. left:4px;
  317.  
  318. padding:8px;
  319. padding-top:6px;
  320. padding-left:10px;
  321. padding-bottom:0px;
  322. border-radius:100%;
  323. position:absolute;
  324.  
  325. }
  326.  
  327.  
  328. .playercon {
  329. width:56px;
  330. height:56px;
  331. border-radius:100%;
  332. left:0px;
  333. background:white;
  334. top:22px;
  335. position:relative;
  336. border:1px solid {color:info border};
  337. -webkit-transition-duration:500ms;
  338. -moz-transition-duration:500ms;
  339. -o-transition-duration:500ms;
  340. -ms-transition-duration:500ms;
  341. }
  342. {/block:permalinkpage}
  343. .infobox {
  344. float:left top;
  345. margin-left:50px;
  346. background-color:transparent;
  347. padding:14px;
  348. padding-left:4px;
  349. max-height:140px;
  350. text-align:left;
  351. color:{color:text};
  352. }
  353.  
  354. .trackname {
  355.  
  356. letter-spacing:2px;
  357. padding:6px;
  358.  
  359. font-size:1em; background:rgba({RGBcolor:icon color a}, .48);
  360.  
  361. font-weight:300;
  362.  
  363.  
  364.  
  365.  
  366. }
  367. .artist {
  368. letter-spacing:2px;
  369. padding:6px;
  370. background:rgba({RGBcolor:icon color a}, .28);
  371.  
  372.  
  373. }
  374.  
  375. .album {
  376. padding:6px;
  377. background:rgba({RGBcolor:icon color a}, .08);
  378.  
  379. }
  380.  
  381.  
  382. .artist, .album, .trackname {
  383. border-top-right-radius:30px;
  384. border-bottom-right-radius:30px;
  385. padding-left:40px;
  386. }
  387.  
  388.  
  389.  
  390. #audiopost {
  391. width:{text:post size}px;
  392. {block:permalinkpage}
  393. width:500px;
  394. {/block:permalinkpage}
  395.  
  396.  
  397. }
  398.  
  399.  
  400.  
  401. .hoverinfo {
  402. position:relative;
  403. background:{color:hover info background};
  404. border-top-right-radius:10px;
  405. border-top-left-radius:10px;
  406. }
  407.  
  408. .partial {
  409. height:calc(100% - 30px - 1.2em)!important;
  410. }
  411.  
  412. .hoverinfo a {
  413. color:{color:hover info icon};
  414.  
  415. }
  416.  
  417. .h {
  418.  
  419. color:white;
  420. font-size:2.4em;
  421. text-align:center;
  422. padding:10px 10px 0px 10px;
  423. }
  424.  
  425.  
  426. .posts:hover .hoverinfo {
  427. opacity:1;
  428. }
  429.  
  430. #loading {
  431. position: fixed;
  432. left: 0px;
  433. top: 0px;
  434. width: 100%;
  435. font-size:28px;
  436. font-family: "up";
  437. height: 100%;
  438. z-index: 9999999;
  439. background:{color:background};
  440. {block:TagPage}display:none; {/block:TagPage}
  441. {block:SearchPage}display:none; {/block:SearchPage}
  442. }
  443.  
  444. #envelope {
  445. background-color: #fff;
  446. height: 180px;
  447. margin: 200px auto;
  448. perspective: 700px;
  449. perspective-origin: 50%;
  450. position: relative;
  451. transform-style: preserve-3d;
  452. width: 300px;
  453. animation: floaty 1s infinite;
  454. }
  455.  
  456. @keyframes floaty {
  457. 0% {
  458. transform:translate(0,0);
  459. }
  460.  
  461. 50% {
  462. transform:translate(0, 12px);
  463. }
  464. }
  465.  
  466. @keyframes beat{
  467. 0% {
  468. transform: scale(1.12);
  469. }
  470.  
  471. 50% {
  472. transform: scale(1);
  473. }
  474.  
  475. 100% {
  476. transform: scale(1.12);
  477. }
  478. }
  479. @keyframes floatyy {
  480. 0% {
  481. transform: scale(.8) translate(0,0);
  482. }
  483.  
  484. 50% {
  485. transform: scale(.81) translate(0, 12px);
  486. }
  487.  
  488. 100% {
  489. transform:scale(.8);
  490. }
  491. }
  492.  
  493.  
  494.  
  495. #flap {
  496. border-color: #fff transparent transparent;
  497. border-style: solid;
  498. border-width: 110px 150px 87px 150px;
  499. height: 0;
  500. left: 0;
  501. position: absolute;
  502. top: 0;
  503. transform: rotateX(0) translateZ(10px);
  504. transform-origin: 50% 0;
  505. width: 0;
  506. }
  507.  
  508.  
  509.  
  510. #front {
  511. border-color: transparent #fbfbfb #f7f7f7 #fcfcfc;
  512. border-style: solid;
  513. border-width: 87px 150px;
  514. bottom: 0;
  515. height: 0;
  516. left: 0;
  517. position: absolute;
  518. width: 0;
  519. }
  520.  
  521. .heart{
  522. position: absolute;
  523. width: 110px;
  524. z-index:99999;
  525. height: 100px;
  526. margin-left:-50px;
  527. left:50%;
  528.  
  529. animation: floaty 1s infinite;
  530. transform:scale(.8);
  531. margin-top:250px;
  532.  
  533. }
  534. .heart:before,
  535. .heart:after{
  536. position: absolute;
  537. content: "";
  538. left: 50px;
  539. top: 0;
  540. width: 50px;
  541. height: 80px;
  542. background: #fc2e5a;
  543. border-radius: 50px 50px 0 0;
  544. transform: rotate(-45deg);
  545. transform-origin: 0 100%;
  546. }
  547. .heart:after{
  548. left: 0;
  549. transform: rotate(45deg);
  550. transform-origin :100% 100%;
  551. }
  552.  
  553.  
  554. .wing {
  555. background:white;
  556. border-radius: 12px 20px 60px 20px;
  557. width:120px;
  558. height:50px; margin-top:260px;
  559. position:absolute;
  560. }
  561.  
  562. .right {
  563. margin-left:-60px;
  564. left:50%;
  565. animation:flap1 1s infinite;
  566. border-bottom:3px solid rgba(0,0,0,.08);
  567. border-radius: 12px 20px 60px 20px;
  568. transform:rotate(-10deg) translate(250px,0);
  569. }
  570.  
  571. @keyframes flap1 {
  572. 0% {
  573. transform:rotate(-10deg) translate(250px,0);
  574. }
  575.  
  576. 50% {
  577. transform:rotate(-5deg) translate(250px,0);
  578. }
  579. }
  580.  
  581. @keyframes flap2 {
  582. 0% {
  583. transform:rotate(10deg) translate(-248px,0);
  584. }
  585.  
  586. 50% {
  587. transform:rotate(5deg) translate(-248px,0);
  588. }
  589. }
  590.  
  591. .left {
  592. border-radius:12px 20px 20px 60px;
  593. margin-left:-60px;
  594. left:50%;
  595. animation:flap2 1s infinite;
  596. border-bottom:3px solid rgba(0,0,0,.08);
  597. transform:rotate(10deg) translate(-248px, 0);
  598. }
  599.  
  600. .right:before {
  601. position:absolute;
  602. content:'';
  603. background:white;
  604. width:70%;
  605. height:70%;
  606. border-bottom:3px solid rgba(0,0,0,.08);
  607. border-radius: 20px 20px 60px 20px;
  608. transform:rotate(20deg) translate(-1px,0);
  609. margin-top:38px;
  610. }
  611.  
  612. .right:after {
  613. position:absolute;
  614. content:'';
  615. background:white;
  616. width:40%;
  617. transform:rotate(29deg) translate(-8px,0);
  618. height:30%;
  619. border-bottom:3px solid rgba(0,0,0,.08);
  620. border-radius: 0px 0px 60px 70px;
  621. margin-top:66px;
  622. }
  623.  
  624.  
  625.  
  626. .left:before {
  627. position:absolute;
  628. content:'';
  629. background:white;
  630. width:70%;
  631. border-bottom:3px solid rgba(0,0,0,.08);
  632. transform:translate(46%,0) rotate(-20deg);
  633. height:60%;
  634. border-radius:12px 20px 70px 70px;
  635. margin-top:40px;
  636. }
  637.  
  638. .left:after {
  639. position:absolute;
  640. content:'';
  641. background:white;
  642. width:40%;
  643. border-bottom:3px solid rgba(0,0,0,.08);
  644. height:30%;
  645. transform:translate(164%,0) rotate(-34deg);
  646. border-radius:0px 0px 70px 60px;
  647. margin-top:58px;
  648. }
  649.  
  650. @media screen and (max-width: 1000px) {
  651.  
  652.  
  653. #con {
  654. width:90%;
  655. left:0;
  656. margin:50px auto;
  657. }
  658. }
  659.  
  660.  
  661. @media screen and (max-width: 700px) {
  662. #con {
  663. column-count:1;
  664. }
  665.  
  666. .posts {
  667. width:100%;
  668. }
  669.  
  670. }
  671.  
  672. #pagination {
  673.  
  674. margin:50px;
  675. text-align: center;
  676. position: relative;
  677. {block:permalinkpage}
  678. transform:translate(-100px,0);
  679. {/block:permalinkpage}
  680. }
  681.  
  682.  
  683. #pagination a, .current_page {
  684. margin: 0 6px;
  685. display: inline-block;
  686. width: 40px;
  687. height: 40px;
  688. text-align: center;
  689. background: {color:pagination};
  690. border-radius: 100%;
  691. color: #fff; opacity:.6;
  692. line-height: 42px;
  693.  
  694. }
  695.  
  696. .current_page {
  697. background: {color:pagination};
  698. color:#fff;
  699. opacity:1;
  700. }
  701.  
  702. .info {
  703. padding:20px;
  704. }
  705.  
  706.  
  707.  
  708. {CustomCSS}
  709.  
  710. #egg { opacity:.6;right:10px; bottom:10px; position:fixed;bottom:4px;display:block; width: 14px; height: 18px; background-color:#FFFEFC; -webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px; border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  711. border:2px solid {color:links}; z-index:4;
  712.  
  713. }
  714. #egg:hover { animation-name: egg;
  715. animation-duration: 1s;
  716. animation-iteration-count: infinite;}
  717. @keyframes egg{
  718. 0%{}
  719. 10%{transform:rotate(20deg)}
  720. 80%{transform:rotate(-20deg)}
  721. 100%{}
  722. }
  723.  
  724. </style>
  725. </head>
  726. <body>
  727. <a href="http://espoirthemes.tumblr.com" title="credit"><div id="egg"></div></a>
  728.  
  729. <header>
  730.  
  731. <div class="title">
  732. {title}
  733. </div>
  734. <div class="description">
  735. {Description}
  736. </div>
  737. <div class="menu">
  738. <a href="/"><span class="sf sf-heart-o"></span> {lang:Home}</a>
  739. {block:AskEnabled}<a href="/ask"><span class="sf sf-heart-o"></span> Ask</a> {/block:AskEnabled}
  740. {block:SubmissionEnabled}<a href="/submit"><span class="sf sf-heart-o"></span> Submit</a>{/block:SubmissionEnabled}
  741. <a href="/archive"><span class="sf sf-heart-o"></span> {lang:Archive}</a>
  742. {Block:HasPages}{block:Pages} <a href="{url}"><span class="sf sf-heart-o"></span> {Label}</a>{/block:Pages} {/block:HasPages}
  743. </div>
  744. </header>
  745.  
  746.  
  747. <div id="loading">
  748. <div class="wing right"></div><div class="wing left"></div><div class="heart"></div><div id="envelope"><div id="flap"></div><div id="front"></div></div>
  749.  
  750. </div>
  751.  
  752. <a href="http://espoirthemes.tumblr.com" title="credit"><div id="egg"></div></a>
  753.  
  754. <div id="con" class="container">
  755.  
  756.  
  757.  
  758.  
  759.  
  760. {block:Tagpage}
  761. <article class="posts {block:Answer} answers {/block:answer}"><div class="caption">
  762. {lang:Showing TagResultCount posts tagged Tag}
  763. </div></article>
  764. {/block:tagpage}
  765. {block:SearchPage}
  766. <article class="posts"><div class="caption">
  767. {lang:Showing SearchResultCount results for SearchQuery}
  768. </div></article>
  769. {/block:SearchPage}
  770. {block:DayPage}
  771. <article class="posts"><div class="caption">
  772. {lang:Viewing everything posted on Month DayOfMonth Year}
  773. </div></article>
  774. {/block:DayPage}
  775.  
  776.  
  777. {block:Posts}<article class="posts">
  778.  
  779. {block:indexpage}
  780. <div class="hoverinfo {block:HasTags} partial {/block:HasTags}">
  781. <div class="h">
  782. <a href="{permalink}"><span class="sf sf-beating-heart"></span></a>
  783. </div></div>
  784. {/block:indexpage}
  785.  
  786. <!-- {block:NoRebloggedFrom}
  787. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  788. {/block:NoRebloggedFrom} -->
  789. {block:ContentSource}
  790. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  791. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  792. {/block:SourceLogo}
  793. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  794. {/block:ContentSource}
  795.  
  796. <!-- text post start -->
  797. {block:Text}
  798.  
  799. {block:Title}
  800. <h2>{Title}</h2>
  801. {/block:Title}
  802.  
  803. <div class="caption">{block:NotReblog}
  804. <figcaption>
  805. {Body}
  806. </figcaption>
  807. {/block:NotReblog}
  808.  
  809. {block:RebloggedFrom}
  810. <div class="reblog-list">
  811. {block:Reblogs}
  812. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  813. <div class="reblog-header">
  814.  
  815. {block:IsActive}
  816. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  817. <img src="{PortraitURL-64}" style="width:24px; float:left">
  818. </a>
  819. {/block:IsActive}
  820.  
  821. {block:IsDeactivated}
  822. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  823. <img src="{PortraitURL-64}" style="width:24px; float:left">
  824. </span>
  825. {/block:IsDeactivated}
  826.  
  827. {block:IsActive}
  828. <a target="_blank" href="{Permalink}" class="user"> {Username}</a>
  829. {/block:IsActive}
  830.  
  831. {block:IsDeactivated}
  832. <span class="inactive deactivated">{Username}</span>
  833. {/block:IsDeactivated}
  834.  
  835. </div>
  836. <div class="reblog-content">
  837. {Body}
  838. </div>
  839. </div>
  840. {/block:Reblogs}
  841. </div>
  842. {/block:RebloggedFrom}</div>
  843.  
  844. {/block:Text} <!-- text post end -->
  845.  
  846. {block:Panorama}
  847.  
  848. {LinkOpenTag}
  849. <div class="im"><img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/></div>
  850. {LinkCloseTag}
  851. {block:Caption}
  852. <div class="caption"> {Caption}</div>
  853. {/block:Caption}
  854.  
  855. {/block:Panorama}
  856.  
  857. <!-- photo posts -->
  858. {block:Photo}
  859. <div class="im"> <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></div>
  860. {block:Caption}
  861. <div class="caption"> {block:NotReblog}
  862. <figcaption>
  863. {Caption}
  864. </figcaption>
  865. {/block:NotReblog}
  866.  
  867. {block:RebloggedFrom}
  868. <div class="reblog-list">
  869. {block:Reblogs}
  870. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  871. <div class="reblog-header">
  872.  
  873. {block:IsActive}
  874. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  875. <img src="{PortraitURL-64}" style="width:24px; float:left">
  876. </a>
  877. {/block:IsActive}
  878.  
  879. {block:IsDeactivated}
  880. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  881. <img src="{PortraitURL-64}" style="width:24px; float:left">
  882. </span>
  883. {/block:IsDeactivated}
  884.  
  885. {block:IsActive}
  886. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  887. {/block:IsActive}
  888.  
  889. {block:IsDeactivated}
  890. <span class="inactive deactivated">{Username}</span>
  891. {/block:IsDeactivated}
  892.  
  893. </div>
  894. <div class="reblog-content">
  895. {Body}
  896. </div>
  897. </div>
  898. {/block:Reblogs}
  899. </div>
  900. {/block:RebloggedFrom}</div>
  901. {/block:Caption}
  902.  
  903. {/block:Photo}<!-- end photo posts -->
  904.  
  905. {block:Panorama}
  906. {LinkOpenTag}
  907. <div class="im"> <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/></div>
  908. {LinkCloseTag}
  909.  
  910. {block:Caption}
  911. <div class="caption"> {block:NotReblog}
  912. <figcaption>
  913. {Caption}
  914. </figcaption>
  915. {/block:NotReblog}
  916.  
  917. {block:RebloggedFrom}
  918. <div class="reblog-list">
  919. {block:Reblogs}
  920. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  921. <div class="reblog-header">
  922.  
  923. {block:IsActive}
  924. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  925. <img src="{PortraitURL-64}" style="width:24px; float:left">
  926. </a>
  927. {/block:IsActive}
  928.  
  929. {block:IsDeactivated}
  930. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  931. <img src="{PortraitURL-64}" style="width:24px; float:left">
  932. </span>
  933. {/block:IsDeactivated}
  934.  
  935. {block:IsActive}
  936. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  937. {/block:IsActive}
  938.  
  939. {block:IsDeactivated}
  940. <span class="inactive deactivated">{Username}</span>
  941. {/block:IsDeactivated}
  942.  
  943. </div>
  944. <div class="reblog-content">
  945. {Body}
  946. </div>
  947. </div>
  948. {/block:Reblogs}
  949. </div>
  950. {/block:RebloggedFrom}</div>
  951. {/block:Caption}
  952.  
  953. {/block:Panorama}
  954.  
  955. <!-- photoset posts -->
  956. {block:Photoset}
  957. <div class="im"> {Photoset}</div>
  958.  
  959. {block:Caption}
  960. <div class="caption"> {block:NotReblog}
  961. <figcaption>
  962. {Caption}
  963. </figcaption>
  964. {/block:NotReblog}
  965.  
  966. {block:RebloggedFrom}
  967. <div class="reblog-list">
  968. {block:Reblogs}
  969. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  970. <div class="reblog-header">
  971.  
  972. {block:IsActive}
  973. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  974. <img src="{PortraitURL-64}" style="width:24px; float:left">
  975. </a>
  976. {/block:IsActive}
  977.  
  978. {block:IsDeactivated}
  979. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  980. <img src="{PortraitURL-64}" style="width:24px; float:left">
  981. </span>
  982. {/block:IsDeactivated}
  983.  
  984. {block:IsActive}
  985. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  986. {/block:IsActive}
  987.  
  988. {block:IsDeactivated}
  989. <span class="inactive deactivated">{Username}</span>
  990. {/block:IsDeactivated}
  991.  
  992. </div>
  993. <div class="reblog-content">
  994. {Body}
  995. </div>
  996. </div>
  997. {/block:Reblogs}
  998. </div>
  999. {/block:RebloggedFrom}</div>
  1000. {/block:Caption}
  1001.  
  1002. {/block:Photoset}<!-- end photoset -->
  1003.  
  1004. <!-- quote posts -->
  1005. {block:Quote}
  1006. <div class="caption">
  1007. "{Quote}"
  1008.  
  1009. {block:Source}
  1010. <br> -{Source}
  1011. {/block:Source}
  1012. </div>
  1013. {/block:Quote} <!-- end quote posts -->
  1014.  
  1015. <!-- link posts --> {block:Link}
  1016.  
  1017. <h2> <a href="{URL}" style="border:none" class="link" {Target}>{Name}</a></h2>
  1018.  
  1019. {block:Description}
  1020. <div class="caption">{Description}</div>
  1021. {/block:Description}
  1022.  
  1023. {/block:Link}
  1024. <!-- end link posts -->
  1025.  
  1026. {block:Chat}
  1027.  
  1028.  
  1029. <div class="caption">
  1030. {block:Title}<a href="{Permalink}" style="background:transparent; padding:0;"><h2>{title}</h2></a>{/block:Title}
  1031. {block:Lines} <div class="chat">{block:Label}<b>{Label}</b>{/block:Label} {Line}<br/></div>{/block:Lines}
  1032.  
  1033. </div>
  1034.  
  1035. {/block:Chat}{block:Video}
  1036.  
  1037. <center>{Video-400}</center>
  1038.  
  1039. {block:Caption}
  1040. <div class="caption"> {block:NotReblog}
  1041. <figcaption>
  1042. {Caption}
  1043. </figcaption>
  1044. {/block:NotReblog}
  1045.  
  1046. {block:RebloggedFrom}
  1047. <div class="reblog-list">
  1048. {block:Reblogs}
  1049. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1050. <div class="reblog-header">
  1051.  
  1052. {block:IsActive}
  1053. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1054. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1055. </a>
  1056. {/block:IsActive}
  1057.  
  1058. {block:IsDeactivated}
  1059. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1060. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1061. </span>
  1062. {/block:IsDeactivated}
  1063.  
  1064. {block:IsActive}
  1065. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1066. {/block:IsActive}
  1067.  
  1068. {block:IsDeactivated}
  1069. <span class="inactive deactivated">{Username}</span>
  1070. {/block:IsDeactivated}
  1071.  
  1072. </div>
  1073. <div class="reblog-content">
  1074. {Body}
  1075. </div>
  1076. </div>
  1077. {/block:Reblogs}
  1078. </div>
  1079. {/block:RebloggedFrom}</div>
  1080. {/block:Caption}
  1081.  
  1082. {/block:Video}{block:Audio}
  1083.  
  1084. <div id="audiopost">
  1085. <div class="playerbox">
  1086. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  1087.  
  1088. <center><div class="playercon"><div class="player">{AudioPlayerWhite}</div></div></center></div>
  1089. <div class="infobox">
  1090. <div class="trackname"> {block:TrackName}
  1091. Track: {TrackName}
  1092. {/block:TrackName} </div>
  1093.  
  1094.  
  1095. <div class="artist">
  1096. {block:Artist}
  1097.  
  1098. Artist: {Artist}
  1099. {/block:Artist} </div>
  1100.  
  1101. <div class="album">
  1102. {block:Album}
  1103. Album: {Album}
  1104. {/block:Album}
  1105. </div>
  1106.  
  1107. </div></div> <br> {block:Caption}
  1108. <div class="caption"> {block:NotReblog}
  1109. <figcaption>
  1110. {Caption}
  1111. </figcaption>
  1112. {/block:NotReblog}
  1113.  
  1114. {block:RebloggedFrom}
  1115. <div class="reblog-list">
  1116. {block:Reblogs}
  1117. <div class="{block:isOriginalEntry}original-reblog{/block:isOriginalEntry}">
  1118. <div class="reblog-header">
  1119.  
  1120. {block:IsActive}
  1121. <a class="{block:isNotOriginalEntry}sub-reblog{/block:isNotOriginalEntry}" href="{Permalink}" target="_blank">
  1122. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1123. </a>
  1124. {/block:IsActive}
  1125.  
  1126. {block:IsDeactivated}
  1127. <span class="inactive {block:isNotOriginalEntry} sub-reblog{/block:isNotOriginalEntry}">
  1128. <img src="{PortraitURL-64}" style="width:24px; float:left">
  1129. </span>
  1130. {/block:IsDeactivated}
  1131.  
  1132. {block:IsActive}
  1133. <a target="_blank" href="{Permalink}" class="user">{Username}</a>
  1134. {/block:IsActive}
  1135.  
  1136. {block:IsDeactivated}
  1137. <span class="inactive deactivated">{Username}</span>
  1138. {/block:IsDeactivated}
  1139.  
  1140. </div>
  1141. <div class="reblog-content">
  1142. {Body}
  1143. </div>
  1144. </div>
  1145. {/block:Reblogs}
  1146. </div>
  1147. {/block:RebloggedFrom}</div>
  1148. {/block:Caption}
  1149.  
  1150. {/block:Audio}
  1151.  
  1152.  
  1153.  
  1154. {block:Answer}
  1155. <div class="caption">
  1156. <br>
  1157. <div class="askerportrait"><img style="position:absolute; margin-left:10px" src="{AskerPortraitURL-40}" align="left" /></div><div class="speechbubble">{Asker} said: {Question}</div> {answer}
  1158.  
  1159. </div>
  1160. {/block:Answer}
  1161.  
  1162.  
  1163.  
  1164. {block:Date}
  1165.  
  1166.  
  1167. {block:permalinkpage}
  1168. <div class="info">
  1169.  
  1170.  
  1171. <a href="/day/{year}/{monthnumberwithzero}/{dayofmonthwithzero}" title="at {12hour}:{minutes}{AmPM}" >{lang:Posted on DayOfMonth Month Year}</a> with <a href="{Permalink}">{NoteCountWithLabel}</a>
  1172.  
  1173. {block:RebloggedFrom}<br> {lang:via} <a href="{ReblogParentURL}"> {ReblogParentName}</a> {lang:source} <a href="{ReblogRootURL}"> {ReblogRootName}</a>
  1174. {/block:RebloggedFrom}
  1175. </div> <!-- end info -->
  1176. {/block:permalinkpage}
  1177. {/block:Date}
  1178. {block:HasTags} <div class="tags"> {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div> {/block:HasTags}
  1179.  
  1180.  
  1181. </article><!--posts end-->
  1182. <div id="pagination"><!-- navigation for next post and previous post -->
  1183. {block:PermalinkPagination}
  1184. {block:PreviousPost}
  1185. <a href="{PreviousPost}" class="jump_page"><span class="sf sf-arrow-left"></span></a>
  1186. {/block:PreviousPost}
  1187. Choose the next love letter
  1188. {block:NextPost}
  1189. <a href="{NextPost}" class="jump_page"><span class="sf sf-arrow-right"></span></a>
  1190. {/block:NextPost}
  1191. {/block:PermalinkPagination}
  1192. </div>
  1193.  
  1194. {block:IfDisqusShortname}
  1195.  
  1196. <div id="disqus_thread"></div>
  1197. <script type="text/javascript">
  1198. /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
  1199. var disqus_shortname = '{text:Disqus Shortname}'; // Required - Enter shortname in Tumblr Theme Options
  1200. var disqus_url = '{Permalink}';
  1201.  
  1202. /* * * DON'T EDIT BELOW THIS LINE * * */
  1203. (function() {
  1204. var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
  1205. dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
  1206. (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  1207. })();
  1208. </script>
  1209. <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
  1210. <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
  1211.  
  1212. {/block:IfDisqusShortname}
  1213.  
  1214. {block:PostNotes} {PostNotes-16} {/block:PostNotes} {/block:Posts}
  1215. </div>
  1216. <div id="pagination">
  1217. {block:Pagination}
  1218.  
  1219. {block:previousPage}<a href="{PreviousPage}" class="jump_page"> <span class="sf sf-arrow-left"></span></a>{/block:PreviousPage}
  1220.  
  1221. {block:JumpPagination length="5"}
  1222. {block:CurrentPage}
  1223. <span class="current_page"><span>{CurrentPage}</span></span>
  1224. {/block:CurrentPage}
  1225.  
  1226. {block:JumpPage}
  1227. <a class="jump_page" href="{URL}">{PageNumber}</a>
  1228. {/block:JumpPage}
  1229. {/block:JumpPagination}
  1230.  
  1231. {block:NextPage}
  1232. <a href="{NextPage}" class="jump_page"><span class="sf sf-arrow-right"></span></a>
  1233. {/block:NextPage}
  1234. </div>
  1235. {/block:Pagination}
  1236. <center>{block:DayPagination}{block:PreviousDayPage}
  1237. <a href="{PreviousDayPage}" class="jump_page">
  1238. &#171; {ShortMonth} {DayOfMonth}
  1239. </a>
  1240. {/block:PreviousDayPage}{block:NextDayPage}
  1241. <a href="{NextDayPage}" class="jump_page">
  1242. {ShortMonth} {DayOfMonth} &#187;
  1243. </a>
  1244. {/block:NextDayPage}{/block:DayPagination}</center>
  1245. </div>
  1246. </body>
  1247. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement