API tools faq
paste
Advertisement
cornetespoir

Kirby Theme

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