API tools faq
paste
Advertisement
spirkism

theme #33: apollo

spirkism
Jul 29th, 2017
6,252
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 44.50 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. ------------------------------THEME #33: APOLLO------------------------------
  4. -------------------------#4 in the greek gods series-------------------------
  5. ------------------------by Phi (spirkthemes/spirkism)------------------------
  6.  
  7. --Version 2.1
  8.  
  9. -----------------------------------RULES:------------------------------------
  10. - do not steal/redistribute
  11. - don't (re)move the credit
  12. - don't use as a base code, there are plenty of those out there & don't take snippets
  13. - you are allowed to edit as much as you like for your own personal use
  14. - don't hesitate to contact me if you find a bug or need otherwise help
  15. ------------------------------------------------------------------------------
  16.  
  17. -->
  18.  
  19. <!DOCTYPE html>
  20. <head>
  21.  
  22. <title>{Title}</title>
  23.  
  24. <!-- /* LINKS */ -->
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  28. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/h5czl1a/aTqnk4mjj/tooltipstuff.css"/>
  29.  
  30.  
  31.  
  32. {block:Hidden}
  33. <!-- /* META TAGS */ -->
  34. <meta name="color:background" content="#f7f7f7" />
  35. <meta name="color:primary" content="#ffffff" />
  36. <meta name="color:accent" content="#ffde66" />
  37. <meta name="color:text" content="#9d9d9d" />
  38. <meta name="color:links" content="#ffde66" />
  39. <meta name="color:links hover" content="#efb010" />
  40.  
  41.  
  42. <meta name="text:font size" content="11px" />
  43. <meta name="text:link 1 url" content="/" />
  44. <meta name="text:link 1 text" content="home" />
  45. <meta name="text:link 2 url" content="/ask" />
  46. <meta name="text:link 2 text" content="message" />
  47. <meta name="text:link 3 url" content="/archive" />
  48. <meta name="text:link 3 text" content="archive" />
  49. <meta name="text:link 4 url" content="/" />
  50. <meta name="text:link 4 text" content="link 4" />
  51. <meta name="text:link 5 url" content="/" />
  52. <meta name="text:link 5 text" content="" />
  53. <meta name="text:link 6 url" content="/" />
  54. <meta name="text:link 6 text" content="" />
  55. <meta name="text:link 7 url" content="/" />
  56. <meta name="text:link 7 text" content="" />
  57. <meta name="text:link 8 url" content="/" />
  58. <meta name="text:link 8 text" content="" />
  59. <meta name="text:link 9 url" content="/" />
  60. <meta name="text:link 9 text" content="" />
  61. <meta name="text:link 10 url" content="/" />
  62. <meta name="text:link 10 text" content="" />
  63.  
  64. <meta name="image:background" content="" />
  65. <meta name="image:sidebar" content="" />
  66. <meta name="font:Body" content="Arial, Helvetica, sans-serif"/>
  67. <meta name="font:Special" content="Arial, Helvetica, sans-serif"/>
  68.  
  69.  
  70. <meta name="if:searchbar" content="1" />
  71. <meta name="if:infinite scroll" content="0" />
  72. <meta name="if:manually load more" content="1" />
  73. <meta name="if:scroll to top" content="1" />
  74. <meta name="if:grid layout" content="0" />
  75.  
  76.  
  77. <meta name="select:post size" content="500px" title="500px">
  78. <meta name="select:post size" content="400px" title="400px">
  79. <meta name="select:post size" content="250px" title="250px">
  80.  
  81.  
  82. <meta name="select:captions" content="captions-unnested" title="unnested">
  83. <meta name="select:captions" content="captions-normal" title="default">
  84. <meta name="select:captions" content="captions-none" title="none">
  85. <meta name="select:captions" content="captions-perma" title="perma page only">
  86.  
  87.  
  88. <meta name="select:index tags" content="fixed-tags" title="visible" />
  89. <meta name="select:index tags" content="hover-tags" title="on hover" />
  90. <meta name="select:index tags" content="no-tags" title="none" />
  91.  
  92. <meta name="select:perma tags" content="fixed-tags" title="visible" />
  93. <meta name="select:perma tags" content="hover-tags" title="on hover" />
  94. <meta name="select:perma tags" content="no-tags" title="none" />
  95. {/block:Hidden}
  96.  
  97.  
  98. <style type="text/css">
  99.  
  100.  
  101. /* ----------- GENERAL ---------- */
  102.  
  103. ::-webkit-scrollbar-thumb {
  104. background-color: RGBA({RGBcolor:accent},0.5);
  105. height:auto;
  106. width: 3px;
  107. border-right: 3px solid {color:primary};
  108. border-left: 3px solid {color:primary};
  109. z-index: 9999999999999999999999999999999999999;
  110. }
  111.  
  112. ::-webkit-scrollbar {
  113. height:auto;
  114. width:9px;
  115. background-color:{color:primary};
  116. z-index: 999999999999999999999999999999999999;
  117. }
  118.  
  119.  
  120. div#qTip {
  121. font-size: 11px;
  122. font: 0.8em {font:body};
  123. line-height: 11px;
  124. display: none;
  125. text-align: center;
  126. position: absolute;
  127. z-index: 999999999999999999999999999999999999999999999999999999;
  128. background-color: {color:accent};
  129. padding: 3px 7px;
  130. color: {color:primary};
  131. max-width: 200px;
  132. height: auto;
  133. border: 1px solid {color:background};
  134. -webkit-transition: all 0.1s ease-out;
  135. -moz-transition: all 0.1s ease-out;
  136. -o-transition: all 0.1s ease-out;
  137. }
  138.  
  139. body {
  140. word-wrap:break-word;
  141. margin: 0;
  142. background-image: url('{image:background}');
  143. background-attachment: fixed;
  144. background-size: 100% auto;
  145. background-color: {color:background};
  146. font: {text:font size} {font:body};
  147. color: {color:text};
  148. }
  149.  
  150. img {
  151. max-width: 100%;
  152. }
  153.  
  154. a {
  155. text-decoration: none;
  156. color: {color:links};
  157. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  158. -o-transition: 0.5s ease;
  159. -moz-transition: 0.5s ease;
  160. }
  161.  
  162. a:hover {
  163. text-decoration: none;
  164. color: {color:links hover};
  165. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  166. -o-transition: 0.5s ease;
  167. -moz-transition: 0.5s ease;
  168. }
  169.  
  170. blockquote {
  171. border-left: solid 2px {color:background};
  172. padding-left: 10px;
  173. max-width: 100%;
  174. }
  175.  
  176.  
  177. /* ---------------------HEADER--------------------- */
  178.  
  179.  
  180.  
  181.  
  182.  
  183. /* ---------------------SIDEBAR--------------------- */
  184.  
  185. #sidebar {
  186. position: fixed;
  187. top: 200px;
  188. left:150px;
  189. }
  190.  
  191.  
  192. #sb-img {
  193. width: 150px;
  194. height:150px;
  195. border-radius:50%;
  196. overflow:hidden;
  197. border:5px solid {color:accent};
  198. position: absolute;
  199. background-color: {color:accent};
  200. }
  201.  
  202. #sb-img img {
  203. width: 150px;
  204. height:150px;
  205. }
  206.  
  207. .sb-arrow {
  208. width: 0px;
  209. height: 0px;
  210. position: absolute;
  211. }
  212.  
  213.  
  214. #sb-arrow1 {
  215. margin-left: 170px;
  216. margin-top: 60px;
  217. border-top: 20px solid transparent;
  218. border-right: 0px solid transparent;
  219. border-bottom: 20px solid transparent;
  220. border-left: 40px solid {color:accent};
  221. {block:IfInfiniteScroll}
  222. display: none;
  223. {/block:IfInfiniteScroll}
  224. z-index: 2;
  225. }
  226.  
  227. #sb-arrow1-fb {
  228. margin-left: 170px;
  229. margin-top: 60px;
  230. border-top: 20px solid transparent;
  231. border-right: 0px solid transparent;
  232. border-bottom: 20px solid transparent;
  233. border-left: 40px solid {color:accent};
  234. z-index: 1;
  235. }
  236.  
  237.  
  238. #sb-arrow2 {
  239. margin-left: 140px;
  240. margin-top: 135px;
  241. border-top: 20px solid transparent;
  242. border-right: 0px solid transparent;
  243. border-bottom: 20px solid transparent;
  244. border-left: 40px solid {color:accent};
  245. -ms-transform: rotate(45deg); /* IE 9 */
  246. -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  247. transform: rotate(45deg);
  248. }
  249.  
  250. #sb-arrow3 {
  251. margin-left: 60px;
  252. margin-top: 170px;
  253. border-top: 40px solid {color:accent};
  254. border-right: 20px solid transparent;
  255. border-bottom: 0px solid transparent;
  256. border-left: 20px solid transparent;
  257. cursor: help;
  258. }
  259.  
  260. #sb-arrow4 {
  261. margin-left: -20px;
  262. margin-top: 135px;
  263. border-top: 40px solid {color:accent};
  264. border-right: 20px solid transparent;
  265. border-bottom: 0px solid transparent;
  266. border-left: 20px solid transparent;
  267. ms-transform: rotate(45deg); /* IE 9 */
  268. -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  269. transform: rotate(45deg);
  270. }
  271.  
  272. #sb-arrow5 {
  273. margin-left: -50px;
  274. margin-top: 60px;
  275. border-top: 20px solid transparent;
  276. border-right: 40px solid {color:accent};
  277. border-bottom: 20px solid transparent;
  278. border-left: 0px solid transparent;
  279. {block:IfInfiniteScroll}
  280. cursor: default;
  281. {/block:IfInfiniteScroll}
  282. }
  283.  
  284.  
  285. #sb-arrow6 {
  286. margin-left: -20px;
  287. margin-top: -15px;
  288. border-top: 20px solid transparent;
  289. border-right: 40px solid {color:accent};
  290. border-bottom: 20px solid transparent;
  291. border-left: 0px solid transparent;
  292. ms-transform: rotate(45deg); /* IE 9 */
  293. -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  294. transform: rotate(45deg);
  295. }
  296.  
  297. #sb-arrow7 {
  298. margin-left: 60px;
  299. margin-top: -50px;
  300. border-top: 0px solid transparent;
  301. border-right: 20px solid transparent;
  302. border-bottom: 40px solid {color:accent};
  303. border-left: 20px solid transparent;
  304. cursor: help;
  305. }
  306.  
  307.  
  308. #sb-arrow8 {
  309. margin-left: 140px;
  310. margin-top: -15px;
  311. border-top: 0px solid transparent;
  312. border-right: 20px solid transparent;
  313. border-bottom: 40px solid {color:accent};
  314. border-left: 20px solid transparent;
  315. ms-transform: rotate(45deg); /* IE 9 */
  316. -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  317. transform: rotate(45deg);
  318. }
  319.  
  320. {block:IfNotInfiniteScroll}{block:NextPage}
  321. #sb-arrow1:before {
  322. content: "\f054";
  323. font-family: FontAwesome;
  324. font-size:16px;
  325. position: absolute;
  326. margin-left: -31px;
  327. margin-top: -8px;
  328. color: {color:primary};
  329. }
  330. {/block:NextPage}{/block:IfNotInfiniteScroll}
  331.  
  332. #sb-arrow3:before {
  333. content: "\f129";
  334. font-family: FontAwesome;
  335. font-size:16px;
  336. color: {color:primary};
  337. margin-left: -3px;
  338. margin-top: -33px;
  339. position: absolute;
  340. }
  341.  
  342. {block:IfNotInfiniteScroll}{block:PreviousPage}
  343. #sb-arrow5:before {
  344. content: "\f053";
  345. font-family: FontAwesome;
  346. font-size:16px;
  347. color: {color:primary};
  348. position: absolute;
  349. margin-left:17px;
  350. margin-top: -8px;
  351. }
  352. {/block:PreviousPage}{/block:IfNotInfiniteScroll}
  353.  
  354. #sb-arrow7:before {
  355. content: "\f0c9";
  356. font-family: FontAwesome;
  357. font-size:16px;
  358. position: absolute;
  359. margin-left: -7px;
  360. margin-top: 20px;
  361. color: {color:primary};
  362. }
  363.  
  364.  
  365.  
  366. /* ---------------- POPUP LINKS ----------------- */
  367.  
  368.  
  369. #popup-links-background {
  370. z-index: 99;
  371. background-color: RGBA({RGBcolor:background}, 0.5);
  372. width: 100%;
  373. height: 100%;
  374. position: fixed;
  375. display: none;
  376. }
  377.  
  378. #sb-popup-links {
  379. position: fixed;
  380. top: 150px;
  381. left:470px;
  382. z-index: 999;
  383. width: {select:post size};
  384. background-color: {color:primary};
  385. display: none;
  386. }
  387.  
  388. #popup-links-close {
  389. position: absolute;
  390. right: 5px;
  391. top: 5px;
  392. cursor: help;
  393. }
  394.  
  395. #popup-links-close:before {
  396. content: "\f00d";
  397. font-family: FontAwesome;
  398. font-size:1.3em;
  399. color: {color:text};
  400. }
  401.  
  402. .popup-links-header {
  403. padding: 5px;
  404. text-align: center;
  405. background-color: {color:accent};
  406. font: 1.2em {font:special};
  407. color: {color:primary};
  408. }
  409.  
  410. #popup-links {
  411. padding: 10px;
  412. }
  413.  
  414. .popup-link {
  415. width: calc({select:post size} / 2 - 18px);
  416. display: inline-block;
  417. text-align: center;
  418. border-bottom: 1px solid {color:background};
  419. padding: 3px;
  420. margin-bottom: 5px;
  421. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  422. -o-transition: 0.5s ease;
  423. -moz-transition: 0.5s ease;
  424. }
  425.  
  426. .popup-link:hover {
  427. letter-spacing: 0.15em;
  428. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  429. -o-transition: 0.5s ease;
  430. -moz-transition: 0.5s ease;
  431. }
  432.  
  433.  
  434. /* ---------------- POPUP LINKS ----------------- */
  435.  
  436. #popup-desc-background {
  437. z-index: 99;
  438. background-color: RGBA({RGBcolor:background}, 0.5);
  439. width: 100%;
  440. height: 100%;
  441. position: fixed;
  442. display: none;
  443. }
  444.  
  445. #sb-popup-desc {
  446. position: fixed;
  447. top: 150px;
  448. left:470px;
  449. z-index: 999;
  450. width: {select:post size};
  451. background-color: {color:primary};
  452. display: none;
  453. }
  454.  
  455. #popup-desc {
  456. padding: 20px;
  457. }
  458.  
  459. #popup-desc-close {
  460. position: absolute;
  461. right: 5px;
  462. top: 5px;
  463. cursor: help;
  464. }
  465.  
  466. #popup-desc-close:before {
  467. content: "\f00d";
  468. font-family: FontAwesome;
  469. font-size:1.3em;
  470. color: {color:text};
  471. }
  472.  
  473.  
  474. /* ------- SEARCHBAR -------- */
  475.  
  476. #searchbar {
  477. position: relative;
  478. margin-left: 15px;
  479. display: inline-block;
  480. margin-top: 15px;
  481. }
  482.  
  483. #searchform input {
  484. border: 0px;
  485. padding: 5px;
  486. text-transform: uppercase;
  487. margin-top: 0px;
  488. letter-spacing: 1px;
  489. font-size: 0.8em;
  490. color: #A2A2A2;
  491. border-radius: 3px;
  492. }
  493.  
  494. #searchinput {
  495. background-color: {color:background};
  496. border-radius: 3px;
  497. display: inline-block;
  498. width: calc({select:post size} - 65px);
  499. }
  500.  
  501. #searchbutton {
  502. vertical-align: bottom;
  503. height: 10px;
  504. background-color: {color:background};
  505. border-radius: 3px;
  506. display: inline-block;
  507. }
  508.  
  509.  
  510. #searchform input:focus {
  511. outline: none;
  512. }
  513.  
  514.  
  515.  
  516. /* ---------------- TUMBLR CONTROLS ----------------- */
  517.  
  518. .tmblr-iframe {
  519. position: fixed;
  520. margin-top: -3px !important;
  521. -webkit-filter: invert(100%);
  522. filter: invert(100%);
  523. border: none;
  524. opacity: 0.2;
  525. z-index: 999999;
  526. transform:scale(0.75);
  527. transform-origin:100% 0;
  528. -webkit-transform:scale(0.75);
  529. -webkit-transform-origin:100% 0;
  530. -o-transform:scale(0.75);
  531. -o-transform-origin:100% 0;
  532. -moz-transform:scale(0.75);
  533. -moz-transform-origin:100% 0;
  534. -ms-transform:scale(0.75);
  535. -ms-transform-origin:100% 0;
  536. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  537. -o-transition: 0.5s ease;
  538. -moz-transition: 0.5s ease;
  539. }
  540.  
  541. .tmblr-iframe:hover {
  542. opacity: 0.5;
  543. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  544. -o-transition: 0.5s ease;
  545. -moz-transition: 0.5s ease;
  546. }
  547.  
  548.  
  549.  
  550.  
  551. /* ---------------- LIGHTBOX ----------------- */
  552.  
  553.  
  554. .tmblr-lightbox {
  555. background-color: RGBA({RGBcolor:primary}, 0.7) !important;
  556. }
  557.  
  558.  
  559. .tmblr-lightbox .vignette {
  560. opacity:0; !important;
  561. }
  562.  
  563.  
  564. .tmblr-lightbox .lightbox-image {
  565. box-shadow: none !important;
  566. overflow:hidden !important;
  567. border:15px solid RGBA({RGBcolor:accent}, 1) !important;
  568. border-radius: 0px !important;
  569. }
  570.  
  571. .tmblr-lightbox .lightbox-image img {
  572. overflow:hidden !important;
  573. }
  574.  
  575. .tmblr-lightbox .lightbox-image-container {
  576.  
  577. }
  578.  
  579. .tmblr-lightbox .lightbox-caption {
  580. display: none;
  581. }
  582.  
  583.  
  584.  
  585. /* ---------------------------------------- */
  586. /* ------------ POSTS & CONTENT ----------- */
  587. /* ---------------------------------------- */
  588.  
  589.  
  590.  
  591. #content {
  592. position: relative;
  593. {block:IfNotGridLayout}
  594. width: {select:post size};
  595. {/block:IfNotGridLayout}
  596. {block:IfGridLayout}
  597. {block:IndexPage}
  598. width: calc(100% - 550px);
  599. {/block:IndexPage}
  600. {block:PermalinkPage}
  601. width: {select:post size};
  602. {/block:PermalinkPage}
  603. {/block:IfGridLayout}
  604. margin-left: 470px;
  605. }
  606.  
  607.  
  608. #posts {
  609. margin-top: 60px;
  610. }
  611.  
  612. #post {
  613. background-color: transparent;
  614. width: {select:post size};
  615. }
  616.  
  617. .posty {
  618. width: {select:post size};
  619. {block:IfNotGridLayout}
  620. margin-bottom: 70px;
  621. {/block:IfNotGridLayout}
  622. {block:IfGridLayout}
  623. margin-bottom: 50px;
  624. margin-right: 30px;
  625. {/block:IfGridLayout}
  626. }
  627.  
  628.  
  629. .caption blockquote {
  630. margin-left: 5px;
  631. margin-right: 0px;
  632. max-width: 100%;
  633. }
  634.  
  635. .caption img {
  636. height: 100%;
  637. max-width: 100%;
  638. }
  639.  
  640. .captions-normal {
  641. padding: 10px 15px;
  642. width: calc({select:post size} - 30px);
  643. background-color: {color:primary};
  644. }
  645.  
  646.  
  647. .captions-unnested {
  648. padding: 5px 0px 5px 0px;
  649. width: {select:post size};
  650. background-color: {color:primary};
  651. }
  652.  
  653. blockquote.caption_unnested {
  654. border-left: none;
  655. margin-left: 0px;
  656. }
  657.  
  658. .caption_unnested {
  659. border-bottom:3px solid {color:background};
  660. padding: 0px 10px !important;
  661. background-color: {color:primary};
  662. }
  663.  
  664. .caption_unnested p {
  665. padding-left: 10px;
  666. }
  667.  
  668.  
  669. .captions-unnested p {
  670. padding-left: 10px;
  671. }
  672.  
  673.  
  674. .caption_unnested:last-of-type {
  675. border-bottom: none;
  676. }
  677.  
  678. .caption_unnested .tumblr_blog {
  679.  
  680. }
  681.  
  682. .post-user {
  683. font: 1em {font:special};
  684. {block:IsDeactivated}
  685. text-decoration: line-through;
  686. {/block:IsDeactivated}
  687. }
  688.  
  689. .post-text {
  690.  
  691. }
  692.  
  693.  
  694. .tumblr_blog {
  695. font: 1em {font:special};
  696. {block:IsDeactivated}
  697. text-decoration: line-through;
  698. {/block:IsDeactivated}
  699. }
  700.  
  701.  
  702.  
  703. .caption:empty {
  704. display: none;
  705. }
  706.  
  707.  
  708.  
  709. .tumblr_blog:before {
  710. content: "\f185";
  711. font-family: FontAwesome;
  712. font-size:1.2em;
  713. color: {color:accent};
  714. margin-right: 3px;
  715. vertical-align: middle;
  716. }
  717.  
  718.  
  719. .captions-none {
  720. display: none;
  721. }
  722.  
  723.  
  724. .captions-perma {
  725. {block:IndexPage}
  726. display: none;
  727. {/block:IndexPage}
  728. padding: 10px 15px;
  729. width: calc({select:post size} - 30px);
  730. background-color: {color:primary};
  731. }
  732.  
  733.  
  734.  
  735. /*------------------------TEXT POST----------------------- */
  736.  
  737.  
  738.  
  739. .textpost {
  740. background-color: {color:primary};
  741. }
  742.  
  743. .textpost-title {
  744. padding: 10px;
  745. background-color: RGBA({RGBcolor:accent}, 1);
  746. color: {color:primary};
  747. text-align: center;
  748. font:1.2em {font:special};
  749. border-bottom: 5px solid {color:background};
  750. }
  751.  
  752. .textpost-content {
  753. padding: 15px 15px 10px 15px;
  754. border-bottom:3px solid {color:background};
  755. width: calc({select:post size} - 30px);
  756. }
  757.  
  758. .textpost-content:last-of-type {
  759. border:none;
  760. }
  761.  
  762. .textpost-user {
  763. font: 1em {font:special};
  764. }
  765.  
  766. .textpost-user:before {
  767. content: "\f185";
  768. font-family: FontAwesome;
  769. font-size:1.2em;
  770. color: {color:accent};
  771. margin-right: 3px;
  772. vertical-align: middle;
  773. }
  774.  
  775. .textpost-text {
  776.  
  777. }
  778.  
  779. .textpost-text {
  780. padding-left: 10px;
  781. max-width: 100%;
  782. }
  783.  
  784.  
  785. .textpost img {
  786. height: 100%;
  787. max-width: 100%;
  788. }
  789.  
  790. .textpost-text-page {
  791. padding: 15px;
  792. }
  793.  
  794. .textpost-text-page-no {
  795. display: none;
  796. }
  797.  
  798.  
  799.  
  800.  
  801. /*------------------------PHOTO POST----------------------- */
  802.  
  803.  
  804.  
  805. .panorama-post {
  806.  
  807. }
  808.  
  809.  
  810.  
  811.  
  812. /*------------------------QUOTE POST----------------------- */
  813.  
  814. .quotepost {
  815. background-color: {color:primary};
  816. padding: 15px 15px 0px 15px;
  817. }
  818.  
  819. .quotepost .fa {
  820. display: inline-block;
  821. }
  822.  
  823. .quotepost .fa-quote-left {
  824. vertical-align: top;
  825. margin-right: 10px;
  826. }
  827.  
  828. .quotepost .fa-quote-right {
  829. margin-left: 10px;
  830. }
  831.  
  832. .quotepost-quote {
  833. display: inline-block;
  834. width: calc({select:post size} - 80px);
  835. font: 1em {font:special};
  836. padding-bottom: 15px;
  837. }
  838.  
  839. .quotepost-source {
  840. border-top: 3px solid {color:background};
  841. text-align: center;
  842. width: calc({select:post size} - 30px);
  843. margin-left: -15px;
  844. padding: 15px;
  845. font-size: 0.9em;
  846. word-wrap:break-word;
  847. }
  848.  
  849. /*------------------------LINK POST----------------------- */
  850.  
  851. .linkpost {
  852.  
  853. }
  854.  
  855. .linkpost blockquote {
  856.  
  857. }
  858.  
  859. .linkpost-title {
  860. padding: 10px;
  861. background-color: RGBA({RGBcolor:accent}, 1);
  862. color: {color:primary};
  863. text-align: center;
  864. font:1.2em {font:special};
  865. border-bottom: 5px solid {color:background};
  866. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  867. -o-transition: 0.5s ease;
  868. -moz-transition: 0.5s ease;
  869. }
  870.  
  871. .linkpost-title:hover{
  872. letter-spacing: 0.2em;
  873. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  874. -o-transition: 0.5s ease;
  875. -moz-transition: 0.5s ease;
  876. }
  877.  
  878.  
  879. .linkpost .caption {
  880.  
  881. }
  882.  
  883. .linkpost-img {
  884.  
  885. }
  886.  
  887.  
  888. /*------------------------CHAT POST----------------------- */
  889.  
  890. .chatpost {
  891. background-color: {color:primary};
  892. }
  893.  
  894. .chatpost-title {
  895. padding: 10px;
  896. background-color: RGBA({RGBcolor:accent}, 1);
  897. color: {color:primary};
  898. text-align: center;
  899. font:1.2em {font:special};
  900. border-bottom: 5px solid {color:background};
  901. }
  902.  
  903. .chatpost ul {
  904. padding: 5px 15px 15px 15px;
  905. margin-bottom: 0px;
  906. }
  907.  
  908. .chatpost ul li {
  909. list-style-type: none;
  910. margin-bottom: 3px;
  911. }
  912.  
  913. .chatpost ul li:last-child {
  914.  
  915. }
  916.  
  917. .chatpost ul .odd {
  918.  
  919. }
  920.  
  921. .chatpost ul .even {
  922.  
  923. }
  924.  
  925. .chatpost .fa-sun-o {
  926. color: {color:accent};
  927. margin-right: 5px;
  928. vertical-align: middle;
  929. }
  930.  
  931. /*------------------------AUDIO POST----------------------- */
  932.  
  933. .audiopost {
  934.  
  935. }
  936.  
  937. .audiopost-button {
  938. position:absolute;
  939. z-index: 3;
  940. border-radius: 50%;
  941. overflow:hidden;
  942. background-color: RGBA({RGBcolor:primary}, 0.6);
  943. width: 44px;
  944. height: 44px;
  945. margin-top: 18px;
  946. margin-left: 18px;
  947. }
  948.  
  949. .audiopost-player {
  950. position: absolute;
  951. z-index: 9;
  952. width: 30px;
  953. height: 30px;
  954. overflow:hidden;
  955. margin-top: 7px;
  956. margin-left: 5px;
  957. opacity: 0.2;
  958. }
  959.  
  960.  
  961. .audiopost-img {
  962. width: 80px;
  963. height: 80px;
  964. border-radius: 50%;
  965. position: absolute;
  966. z-index: 2;
  967. overflow: hidden;
  968. }
  969.  
  970.  
  971.  
  972. .audiopost-fallbackimg {
  973. width: 80px;
  974. height: 80px;
  975. border-radius: 50%;
  976. position: absolute;
  977. z-index: 1;
  978. overflow:hidden;
  979. }
  980.  
  981.  
  982.  
  983.  
  984. .audiopost ul {
  985. background-color: {color:accent};
  986. color: {color:primary};
  987. width: calc({select: post size} - 120px);
  988. position: relative;
  989. padding: 10px;
  990. margin-left: 90px;
  991. min-height: 60px;
  992. text-align: center;
  993. list-style-type:none;
  994. }
  995.  
  996. .audiopost ul li {
  997. border-bottom: 0.5px solid {color:primary};
  998. padding-bottom: 3px;
  999. margin-bottom: 3px;
  1000.  
  1001. }
  1002.  
  1003. .audiopost .caption {
  1004.  
  1005. }
  1006.  
  1007.  
  1008. /*------------------------VIDEO POST----------------------- */
  1009.  
  1010. .videopost {
  1011.  
  1012. }
  1013.  
  1014. .videopost-video {
  1015.  
  1016. }
  1017.  
  1018. .videopost .caption {
  1019. margin-top: 3px;
  1020. }
  1021.  
  1022.  
  1023. .select-700px {
  1024. display:none;
  1025. }
  1026.  
  1027.  
  1028. .main-250px .select-400px {
  1029. display: none;
  1030. }
  1031.  
  1032. .main-250px .select-500px {
  1033. display: none;
  1034. }
  1035.  
  1036. .main-400px .select-500px {
  1037. display: none;
  1038. }
  1039.  
  1040. .main-400px .select-250px {
  1041. display: none;
  1042. }
  1043.  
  1044. .main-500px .select-250px {
  1045. display: none;
  1046. }
  1047.  
  1048. .main-500px .select-400px {
  1049. display: none;
  1050. }
  1051.  
  1052. /*------------------------ASK POST----------------------- */
  1053.  
  1054. .answerpost {
  1055.  
  1056. }
  1057.  
  1058. .answerpost .caption {
  1059.  
  1060. }
  1061.  
  1062. .answerpost img {
  1063.  
  1064. }
  1065.  
  1066.  
  1067. .answerpost-arrow {
  1068. border-top:10px solid transparent;
  1069. border-right:20px solid {color:accent};
  1070. border-bottom:10px solid transparent;
  1071. border-left:0px solid transparent;
  1072. display: inline-block;
  1073. vertical-align: middle;
  1074. position: absolute;
  1075. margin-left: 55px;
  1076. margin-top: 15px;
  1077. }
  1078.  
  1079. .answerpost-asker {
  1080. font: 1em {font:special};
  1081. }
  1082.  
  1083. .answerpost-asker a {
  1084. color: {color:primary};
  1085. }
  1086.  
  1087.  
  1088. .answerpost-askerimg {
  1089. display: inline-block;
  1090. border-radius: 50%;
  1091. overflow:hidden;
  1092. width: 50px;
  1093. height: 50px;
  1094. position: absolute;
  1095. }
  1096.  
  1097. .answerpost-askerimg img {
  1098.  
  1099. }
  1100.  
  1101.  
  1102. .answerpost-question {
  1103. background-color: {color:accent};
  1104. display: inline-block;
  1105. padding: 7px;
  1106. width: calc({select:post size} - 90px);
  1107. margin-left: 75px;
  1108. color: {color:primary};
  1109. min-height: 35px;
  1110. }
  1111.  
  1112.  
  1113. .answerpost-answer {
  1114. background-color: {color:primary};
  1115. padding: 5px 15px;
  1116. margin-top: 10px;
  1117. display:inline-block;
  1118. width: calc({select:post size} - 30px);
  1119. }
  1120.  
  1121.  
  1122. .answerpost-answer img {
  1123. width: 100%;
  1124. height: auto;
  1125. }
  1126.  
  1127. .answerpost-answer-reblog img {
  1128. width: 100%;
  1129. height: auto;
  1130. }
  1131.  
  1132.  
  1133.  
  1134. .answerpost-answer-reblog-box {
  1135. margin-top: 10px;
  1136. }
  1137.  
  1138.  
  1139. .answerpost-answererimg {
  1140. display: inline-block;
  1141. border-radius: 50%;
  1142. overflow:hidden;
  1143. width: 50px;
  1144. height: 50px;
  1145. position: absolute;
  1146. right:0px;
  1147. }
  1148.  
  1149.  
  1150. .answerpost-answerer {
  1151. font: 1em {font:special};
  1152. margin-bottom: -5px;
  1153. }
  1154.  
  1155. .answerpost-answerer a {
  1156. color: {color:text};
  1157. }
  1158.  
  1159. .answerpost-arrow-answerer {
  1160. border-top:10px solid transparent;
  1161. border-right:0px solid transparent;
  1162. border-bottom:10px solid transparent;
  1163. border-left:20px solid {color:primary};
  1164. display: inline-block;
  1165. position: absolute;
  1166. right: 56px;
  1167. margin-top: 15px;
  1168. }
  1169.  
  1170.  
  1171. .answerpost-answer-reblog {
  1172. width: calc({select:post size} - 90px);
  1173. display:inline-block;
  1174. background-color: {color:primary};
  1175. padding: 7px;
  1176. margin-bottom:5px;
  1177. min-height: 35px;
  1178. }
  1179.  
  1180.  
  1181. .answerpost .captions-normal {
  1182. padding: 10px 15px;
  1183. margin-top: 0px;
  1184. }
  1185.  
  1186. .answerpost .captions-unnested {
  1187. padding: 5px 0px 5px 0px;
  1188. margin-top: 0px;
  1189. }
  1190.  
  1191.  
  1192. .answerpost .caption:empty {
  1193. display: none;
  1194. }
  1195.  
  1196. .answerpost .caption:empty {
  1197. display: none;
  1198. }
  1199.  
  1200. .answerpost .caption_unnested:empty {
  1201. display: none;
  1202. }
  1203.  
  1204. /*------------------------PERM----------------------- */
  1205.  
  1206. #permbox1 {
  1207. background-color: RGBA({RGBcolor:primary}, 0.5);
  1208. padding: 10px 10px;
  1209. margin-top: 3px;
  1210. }
  1211.  
  1212. #permbox1 .permbox-box {
  1213. display: inline-block;
  1214. color: RGBA({RGBcolor:text}, 0.5);
  1215. margin-right: 5px;
  1216. z-index:2;
  1217. }
  1218.  
  1219. #timeago-box {
  1220. position: absolute;
  1221. left: 50px;
  1222. width: calc({select:post size} - 100px);
  1223. text-align: center;
  1224. }
  1225.  
  1226. #timeago-box a {
  1227. color: RGBA({RGBcolor:text}, 0.7);
  1228. }
  1229.  
  1230.  
  1231.  
  1232. #parent-portrait:before {
  1233. font-family: FontAwesome;
  1234. font-size: 1.1em;
  1235. content: "\f007";
  1236. }
  1237.  
  1238. #root-portrait:before {
  1239. font-family: FontAwesome;
  1240. font-size: 1.1em;
  1241. content: "\f1f9";
  1242. }
  1243.  
  1244.  
  1245.  
  1246. #reblogbutton:before {
  1247. font-family: FontAwesome;
  1248. font-size: 1.1em;
  1249. content: "\f021";
  1250. }
  1251.  
  1252. #timeago-box {
  1253. }
  1254.  
  1255.  
  1256. #notecount-box {
  1257.  
  1258. }
  1259.  
  1260. #reblogbutton {
  1261. position:absolute;
  1262. display:inline-block;
  1263. right: 10px;
  1264. }
  1265.  
  1266. #like-heart {
  1267. position:absolute;
  1268. display:inline-block;
  1269. right: 32px;
  1270. margin-top: -9px;
  1271. }
  1272.  
  1273. #like-heart svg {
  1274. width:11px;
  1275. height:auto;
  1276. display:block;
  1277. fill: RGBA({RGBcolor:text}, 0.5);
  1278. }
  1279.  
  1280.  
  1281. #like-heart .liked + svg {
  1282. opacity:1;
  1283. }
  1284.  
  1285. #like-heart .liked + svg path {
  1286. fill:{color:accent};
  1287. }
  1288.  
  1289.  
  1290. #like-heart .like_button iframe {
  1291. position:absolute;
  1292. top:0;
  1293. left:0;
  1294. bottom:0;
  1295. right:0;
  1296. z-index:2;
  1297. opacity:0;
  1298. }
  1299.  
  1300.  
  1301.  
  1302.  
  1303. /*------------------------TAGS----------------------- */
  1304.  
  1305.  
  1306. .no-tags {
  1307. display: none;
  1308. }
  1309.  
  1310. .no-tags .comma:last-child {
  1311. display: none;
  1312. }
  1313.  
  1314. .hover-tags {
  1315. margin-top: 7px;
  1316. text-align: center;
  1317. opacity: 0;
  1318. font-size: 0.9em;
  1319. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  1320. -o-transition: 0.5s ease;
  1321. -moz-transition: 0.5s ease;
  1322. }
  1323.  
  1324. .hover-tags .comma:last-child {
  1325. display: none;
  1326. }
  1327.  
  1328. .posty:hover .hover-tags {
  1329. opacity: 1;
  1330. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  1331. -o-transition: 0.5s ease;
  1332. -moz-transition: 0.5s ease;
  1333. }
  1334.  
  1335. .fixed-tags {
  1336. margin-top: 7px;
  1337. text-align: center;
  1338. font-size: 0.9em;
  1339. }
  1340.  
  1341. .fixed-tags .comma:last-child {
  1342. display: none;
  1343. }
  1344.  
  1345.  
  1346. /*------------------------NOTES----------------------- */
  1347.  
  1348. #notes {
  1349. width: calc({select:post size} - 30px);
  1350. padding: 15px;
  1351. background-color: {color:primary};
  1352. overflow-y: auto;
  1353. max-height: 500px;
  1354. margin-bottom: 50px;
  1355. margin-top: -20px;
  1356. font-size: 0.8em;
  1357. }
  1358.  
  1359. #notes ol {
  1360. list-style-type: none;
  1361. padding: 0px;
  1362. text-align: center;
  1363. margin-left: -30px;
  1364. }
  1365.  
  1366. #notes ol li {
  1367. margin-bottom: 5px;
  1368. }
  1369.  
  1370. #notes img {
  1371.  
  1372. }
  1373.  
  1374. #notes .avatar {
  1375. border-radius: 50%;
  1376. overflow:hidden;
  1377. height: 20px;
  1378. width: 20px;
  1379. margin-right: 5px;
  1380. vertical-align: middle;
  1381. }
  1382.  
  1383. #notes .action {
  1384.  
  1385. }
  1386.  
  1387. /*------------------------INFINITE SCROLL THINGS----------------------- */
  1388.  
  1389. .load-more {
  1390. position: relative;
  1391. bottom: 0px;
  1392. text-align: center;
  1393. width: 70px;
  1394. height: 30px;
  1395. padding: 10px;
  1396. background-color: {color:primary};
  1397. margin-bottom: 70px;
  1398. {block:IfGridLayout}
  1399. margin-top: 40px;
  1400. margin-left: calc(50% - 45px);
  1401. {/block:IfGridLayout}
  1402. {block:IfNotGridLayout}
  1403. margin-left: calc({select:post size} / 2 - 45px);
  1404. {/block:IfNotGridLayout}
  1405. font: 1em {font:special};
  1406. line-height: 30px;
  1407. cursor: help;
  1408. }
  1409.  
  1410.  
  1411. #infscr-loading {
  1412. {block:IfGridLayout}
  1413. bottom: -30px;
  1414. position: absolute;
  1415. margin-left: calc(50% - 35px);
  1416. {/block:IfGridLayout}
  1417. {block:IfNotGridLayout}
  1418. position: relative;
  1419. margin-left: calc({select:post size} / 2 - 35px);
  1420. margin-bottom: 70px;
  1421. margin-top: -20px;
  1422. {/block:IfNotGridLayout}
  1423. width: 70px;
  1424. height: 70px;
  1425. }
  1426.  
  1427. #infscr-loading p {
  1428. font:1.1em {font:special};
  1429. }
  1430.  
  1431.  
  1432. /*------------------------SCROLL TO TOP----------------------- */
  1433.  
  1434. #scroll-button {
  1435. background-color: {color:primary};
  1436. position: fixed;
  1437. right: 5px;
  1438. bottom: 35px;
  1439. width: 25px;
  1440. height: 25px;
  1441. line-height: 25px;
  1442. color:{color:accent};
  1443. text-align: center;
  1444. display: block;
  1445. cursor: help;
  1446. z-index: 99999999999999999999999999999999999999999999999;
  1447. }
  1448.  
  1449. #scroll-button:before {
  1450. content: "\f062";
  1451. font-family: FontAwesome;
  1452. font-size:16px;
  1453. }
  1454.  
  1455.  
  1456. /*------------------------CREDIT----------------------- */
  1457.  
  1458. /* -- DO NOT EDIT ANYTHING HERE WITHOUT ASKING ME FIRST -- */
  1459.  
  1460. #credit {
  1461. position: fixed;
  1462. right: 5px;
  1463. bottom: 5px;
  1464. width: 25px;
  1465. height: 25px;
  1466. line-height: 25px;
  1467. background-color: {color:accent};
  1468. color:{color:primary};
  1469. text-align: center;
  1470. z-index: 99999999999999999999999999999999999999999999999;
  1471. }
  1472.  
  1473.  
  1474.  
  1475. #credit:before {
  1476. content: "\f259";
  1477. font-family: FontAwesome;
  1478. font-size:16px;
  1479. }
  1480.  
  1481.  
  1482.  
  1483. </style>
  1484. </head>
  1485.  
  1486. <body>
  1487.  
  1488. <!-- /* SIDEBAR, HEADER, ETC. */ -->
  1489.  
  1490. <!-- /* SIDEBAR */ -->
  1491.  
  1492. <div id="sidebar">
  1493.  
  1494. <a href="/"><div id="sb-img"><img src="{image:sidebar}"></div></a>
  1495.  
  1496. {block:NextPage}<a id="next-link" href="{NextPage}">{/block:NextPage}<div class="sb-arrow" id="sb-arrow1"></div>{block:NextPage}</a>{/block:NextPage}
  1497. <div class="sb-arrow" id="sb-arrow1-fb"></div>
  1498. <div class="sb-arrow" id="sb-arrow2"></div>
  1499. <div class="sb-arrow" id="sb-arrow3"></div>
  1500. <div class="sb-arrow" id="sb-arrow4"></div>
  1501. {block:PreviousPage}<a href="{PreviousPage}">{/block:PreviousPage}<div class="sb-arrow" id="sb-arrow5"></div>{block:PreviousPage}</a>{/block:PreviousPage}
  1502. <div class="sb-arrow" id="sb-arrow6"></div>
  1503. <div class="sb-arrow" id="sb-arrow7"></div>
  1504. <div class="sb-arrow" id="sb-arrow8"></div>
  1505.  
  1506. </div> <!--sidebar-->
  1507.  
  1508. <div id="popup-links-background"></div>
  1509. <div id="popup-desc-background"></div>
  1510.  
  1511. <div id="sb-popup-links">
  1512. <div id="popup-links-close"></div>
  1513. <div class="popup-links-header">navigation</div>
  1514. <div id="popup-links">
  1515. {block:IfLink1Text}<a href="{text:link 1 url}"><div class="popup-link">{text:link 1 text}</div></a>{/block:IfLink1Text}
  1516. {block:IfLink2Text}<a href="{text:link 2 url}"><div class="popup-link">{text:link 2 text}</div></a>{/block:IfLink2Text}
  1517. {block:IfLink3Text}<a href="{text:link 3 url}"><div class="popup-link">{text:link 3 text}</div></a>{/block:IfLink3Text}
  1518. {block:IfLink4Text}<a href="{text:link 4 url}"><div class="popup-link">{text:link 4 text}</div></a>{/block:IfLink4Text}
  1519. {block:IfLink5Text}<a href="{text:link 5 url}"><div class="popup-link">{text:link 5 text}</div></a>{/block:IfLink5Text}
  1520. {block:IfLink6Text}<a href="{text:link 6 url}"><div class="popup-link">{text:link 6 text}</div></a>{/block:IfLink6Text}
  1521. {block:IfLink7Text}<a href="{text:link 7 url}"><div class="popup-link">{text:link 7 text}</div></a>{/block:IfLink7Text}
  1522. {block:IfLink8Text}<a href="{text:link 8 url}"><div class="popup-link">{text:link 8 text}</div></a>{/block:IfLink8Text}
  1523. {block:IfLink9Text}<a href="{text:link 9 url}"><div class="popup-link">{text:link 9 text}</div></a>{/block:IfLink9Text}
  1524. {block:IfLink10Text}<a href="{text:link 10 url}"><div class="popup-link">{text:link 10 text}</div></a>{/block:IfLink10Text}
  1525. </div>
  1526. </div>
  1527.  
  1528. <div id="sb-popup-desc">
  1529. <div id="popup-desc-close"></div>
  1530. <div class="popup-links-header">info</div>
  1531. {block:IfSearchbar}
  1532. <div id="searchbar">
  1533. <form action="/search" method="get" id=searchform>
  1534. <input type="text" name="q" value="{SearchQuery}" id="searchinput"/>
  1535. <input type="image" value="search" src="http://static.tumblr.com/h5czl1a/b6qom9fvn/search-icon-png-21.png" id="searchbutton"/>
  1536. </form></div>
  1537. {/block:IfSearchbar}
  1538. <div id="popup-desc">{Description}</div>
  1539. </div>
  1540.  
  1541.  
  1542.  
  1543.  
  1544.  
  1545.  
  1546.  
  1547. <!-- /* POSTS */ DON'T CHANGE ANYTHING HERE PLEASE (or you might heck it) -->
  1548.  
  1549. <div id="content">
  1550. <div id="posts">
  1551. {block:Posts}
  1552. <div class="posty" id="{PostID}">
  1553.  
  1554.  
  1555.  
  1556. <div id="post" class="{select:post size}">
  1557.  
  1558. <!-- {block:NoRebloggedFrom}
  1559. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1560. {/block:NoRebloggedFrom} -->
  1561.  
  1562. {block:ContentSource}<!-- {SourceURL}
  1563. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1564. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1565. {/block:ContentSource}
  1566.  
  1567.  
  1568.  
  1569. <!-- /* TEXT POST */ -->
  1570. {block:Text}<div class="textpost">
  1571. {block:Title}<div class="textpost-title">{Title}</div>{/block:Title}
  1572. <div class="textpost-text-page{block:Date}-no{/block:Date}">
  1573. {Body}
  1574. </div>
  1575. {block:Date}
  1576. {block:NotReblog}
  1577. <div class="textpost-content">
  1578. {Body}
  1579. </div>
  1580. {/block:NotReblog}
  1581. {block:Reblogs}
  1582. <div class="textpost-content">
  1583. <div class="textpost-user">
  1584. <a href="{Permalink}">{Username}</a>:
  1585. </div>
  1586. <div class="textpost-text">
  1587. {Body}
  1588. </div>
  1589. </div>
  1590. {/block:Reblogs}
  1591. {/block:Date}
  1592. </div>
  1593. {/block:Text}
  1594.  
  1595. <!-- /* PHOTO POST */ -->
  1596. {block:Photo}<div class="photopost">
  1597. {LinkOpenTag}
  1598. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  1599. {LinkCloseTag}
  1600. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1601. </div>
  1602. {/block:Photo}
  1603.  
  1604. <!-- /* PANORAMA POST */ -->
  1605. {block:Panorama}<div class="panoramapost">
  1606. {LinkOpenTag}
  1607. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}" />
  1608. {LinkCloseTag}
  1609. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1610. </div>
  1611. {/block:Panorama}
  1612.  
  1613. <!-- /* PHOTOSET POST */ -->
  1614. {block:Photoset}<div class="photosetpost">
  1615. <div class="photoset main-{select:post size}">
  1616. <div class="select-700px">{Photoset-700}</div>
  1617. <div class="select-500px">{Photoset-500}</div>
  1618. <div class="select-400px">{Photoset-400}</div>
  1619. <div class="select-250px">{Photoset-250}</div>
  1620. </div>
  1621. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1622. </div>{/block:Photoset}
  1623.  
  1624. <!-- /* QUOTE POST */ -->
  1625. {block:Quote}<div class="quotepost"><i class="fa fa-quote-left" aria-hidden="true"></i>
  1626. <div class="quotepost-quote">{Quote}</div><i class="fa fa-quote-right" aria-hidden="true"></i>
  1627. {block:Source}<div class="quotepost-source">{Source}</div>{/block:Source}
  1628. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1629. </div>
  1630. {/block:Quote}
  1631.  
  1632. <!-- /* LINK POST */ -->
  1633. {block:Link}<div class="linkpost">
  1634. <a href="{URL}"><div class="linkpost-title">{Name}</div></a>
  1635. {block:Description}<div class="caption {select:captions}">{Description}</div>{/block:Description}
  1636. </div>
  1637. {/block:Link}
  1638.  
  1639.  
  1640. <!-- /* CHAT POST */ -->
  1641. {block:Chat}<div class="chatpost">
  1642. {block:Title}<div class="chatpost-title">{Title}</div>{/block:Title}
  1643. <ul>
  1644. {block:Lines}
  1645. <li class="{Alt}"><i class="fa fa-sun-o" aria-hidden="true"></i>{block:Label}<strong>{Label}</strong> {/block:Label}{Line}</li>
  1646. {/block:Lines}
  1647. </ul>
  1648. </div>
  1649. {/block:Chat}
  1650.  
  1651.  
  1652. <!-- /* AUDIO POST */ -->
  1653. {block:Audio}<div class="audiopost">
  1654. {block:AlbumArt}
  1655. <div class="audiopost-img"><img src="{AlbumArtURL}"></div>
  1656. {/block:AlbumArt}
  1657. <div class="audiopost-fallbackimg"><img src="{image:sidebar}"></div>
  1658. {block:AudioPlayer}
  1659. <div class="audiopost-button">
  1660. <div class="audiopost-player">{AudioPlayer}</div>
  1661. </div>
  1662. {/block:AudioPlayer}
  1663. <ul>
  1664. {block:TrackName}<li><strong>Track:</strong> {TrackName}</li>{/block:TrackName}
  1665. {block:Artist}<li><strong>Artist:</strong> {Artist}</li>{/block:Artist}
  1666. {block:Album}<li><strong>Album:</strong> {Album}</li>{/block:Album}
  1667. </ul>
  1668. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1669. </div>
  1670. {/block:Audio}
  1671.  
  1672.  
  1673. <!-- /* VIDEO POST */ -->
  1674. {block:Video}<div class="videopost"><div class="main-{select:post size}">
  1675. <div class="select-700px">{Video-700}</div>
  1676. <div class="select-500px">{Video-500}</div>
  1677. <div class="select-400px">{Video-400}</div>
  1678. <div class="select-250px">{Video-250}</div>
  1679. </div>
  1680. {block:Caption}<div class="caption {select:captions}">{Caption}</div>{/block:Caption}
  1681. </div>
  1682. {/block:Video}
  1683.  
  1684. <!-- /* ASK POST */ -->
  1685.  
  1686. {block:Answer}
  1687. <div class="answerpost">
  1688. <div class="answerpost-askerimg"><img src="{AskerPortraitURL-64}"></div>
  1689. <div class="answerpost-arrow"></div>
  1690. <div class="answerpost-question"><div class="answerpost-asker"><strong>{Asker}</strong> asked:</div>{Question}</div>
  1691. {block:Answerer}
  1692. <div class="answerpost-answer-reblog-box">
  1693. <div class="answerpost-answer-reblog"><div class="answerpost-answerer"><strong>{Answerer}</strong> answered: </div>{Answer}</div>
  1694. <div class="answerpost-arrow-answerer"></div>
  1695. <div class="answerpost-answererimg"><img src="{AnswererPortraitURL-64}"></div>
  1696. </div>
  1697. {/block:Answerer}
  1698. {block:NotReblog}
  1699. <div class="answerpost-answer">{Replies}</div>
  1700. {/block:NotReblog}
  1701. {block:RebloggedFrom}<div class="caption {select:captions}">{Replies}</div>{/block:RebloggedFrom}
  1702. </div>
  1703. {/block:Answer}
  1704.  
  1705.  
  1706.  
  1707. <!-- /* PERM */ -->
  1708.  
  1709. {block:Date}
  1710. <div id="permbox1">
  1711. <div id="timeago-box" class="permbox-box"><a href="{Permalink}" id="time-link">{TimeAgo}{block:NoteCount} | {NoteCount} notes{/block:NoteCount}</a></div>
  1712.  
  1713. <a href="{ReblogUrl}" target="_blank"><div id="reblogbutton" class="permbox-box"></div></a>
  1714.  
  1715. <div id="likebutton" class="permbox-box">
  1716. <div id="like-heart">{LikeButton}
  1717. <svg viewBox="0 0 19 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M14.0425097,0.000920262799 C16.1435097,-0.0400797372 18.8835097,1.28192026 18.9635097,5.36992026 C19.0525097,9.95492026 15.1985097,13.3079203 9.48350967,16.2089203 C3.76650967,13.3079203 -0.0874903349,9.95492026 0.00150966509,5.36992026 C0.0815096651,1.28192026 2.82150967,-0.0400797372 4.92250967,0.000920262799 C7.02450967,0.0419202628 8.87050967,2.26592026 9.46950967,2.92792026 C10.0945097,2.26592026 11.9405097,0.0419202628 14.0425097,0.000920262799 Z"></path></svg>
  1718. </div>
  1719. </div>
  1720.  
  1721. <!--
  1722. {block:RebloggedFrom}<div id="reblogged-box" class="permbox-box"><a href="{ReblogParentURL}">VIA</a></div>{/block:RebloggedFrom} -->
  1723.  
  1724. <!--<a href="{ReblogURL}" title="reblog" target="_blank"><div id="reblog" class="permbox-box">REBLOG</div></a>-->
  1725.  
  1726. {block:RebloggedFrom}
  1727. <a href="{ReblogParentURL}" title="via: {ReblogParentName}">
  1728. <div id="parent-portrait" class="permbox-box">
  1729. </div>
  1730. </a>
  1731. <a href="{ReblogRootURL}" title="source: {ReblogRootName}">
  1732. <div id="root-portrait" class="permbox-box">
  1733. </div>
  1734. </a>
  1735. {/block:RebloggedFrom}
  1736. {block:NotReblog}
  1737. <a href="{PermaLink}" title="source: {Name}">
  1738. <div id="root-portrait" class="permbox-box"></div>
  1739. </a>
  1740. {/block:NotReblog}
  1741.  
  1742. </div> <!--id="permbox1"-->
  1743. {/block:Date}
  1744.  
  1745. </div> <!--post -->
  1746.  
  1747. <!-- /* TAGS */ -->
  1748. {block:HasTags}<div {block:IndexPage}class="{select:index tags}"{/block:IndexPage}{block:PermalinkPage}class="{select:perma tags}"{/block:PermalinkPage}>
  1749. {block:Tags}
  1750. <a href="{TagURL}" class="tag">#{Tag}</a>&nbsp;&nbsp;
  1751. {/block:Tags}
  1752. </div>
  1753. {/block:HasTags}
  1754.  
  1755. </div> <!-- posty div -->
  1756.  
  1757.  
  1758.  
  1759. {/block:Posts}
  1760.  
  1761.  
  1762.  
  1763.  
  1764.  
  1765. <!-- /* POST NOTES */ -->
  1766. {block:PostNotes}
  1767. <div id="notes">
  1768. <ul>
  1769. {PostNotes-64}
  1770. </ul>
  1771. </div>
  1772. {/block:PostNotes}
  1773. </div> <!-- posts div -->
  1774.  
  1775. {block:IfManuallyLoadMore}
  1776. {block:IfInfiniteScroll}
  1777. {block:Pagination}
  1778. <div class="load-more">load more</div>
  1779. {/block:Pagination}
  1780. {/block:IfInfiniteScroll}
  1781. {/block:IfManuallyLoadMore}
  1782.  
  1783. </div> <!-- content div -->
  1784.  
  1785. <!-- scroll to top button -->
  1786.  
  1787. {block:IfScrollToTop}
  1788. <div id="scroll-button"></div>
  1789. {/block:IfScrollToTop}
  1790.  
  1791.  
  1792. <!-- /* CREDIT: DO NOT REMOVE !!! */ -->
  1793.  
  1794. <a href="http://spirkthemes.tumblr.com"><div id="credit" data-tipped-options="position: 'left'"></div></a>
  1795.  
  1796.  
  1797.  
  1798. <!-- /* SCRIPTS */ -->
  1799.  
  1800. <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
  1801.  
  1802.  
  1803. <script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
  1804.  
  1805.  
  1806. {block:Indexpage}
  1807. {block:IfInfiniteScroll}
  1808. <script src="http://static.tumblr.com/h5czl1a/Ot3ouzjts/infinitescroll.js"></script>
  1809. {/block:IfInfiniteScroll}
  1810. {block:IfGridLayout}<script src="http://static.tumblr.com/h5czl1a/bshouzjul/masonry.js"></script>
  1811. {/block:IfGridLayout}
  1812. {/block:Indexpage}
  1813. <script src="http://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1814.  
  1815.  
  1816.  
  1817. <script>
  1818. jQuery(window).load(function(){
  1819. var $container = $('#posts');
  1820. $container.imagesLoaded(function(){
  1821. $container.masonry({
  1822. itemSelector: '.posty',
  1823. });
  1824. });
  1825. $('.posty').unnest({
  1826. yourCaption: ".captions-unnested",
  1827. wrapName: ".caption_unnested",
  1828. newCaptionUsername: false,
  1829. originalPostCaptionUsername: false,
  1830. tumblrAvatars: false,
  1831. usernameColon: false
  1832. });
  1833. {block:IfInfiniteScroll}
  1834. $container.infinitescroll({
  1835. itemSelector: '.posty',
  1836. navSelector: '#sb-arrow1',
  1837. nextSelector: '#next-link',
  1838. bufferPx: 10000,
  1839. loading: {
  1840. finishedMsg: "<p>The End.</p>",
  1841. img : "http://static.tumblr.com/h5czl1a/B0Souzjn7/loadingspinner.gif",
  1842. msg: null,
  1843. msgText: "",
  1844. } {block:IfManuallyLoadMore},
  1845. errorCallback: function(){
  1846. $('.load-more').hide();
  1847. }
  1848. {/block:IfManuallyLoadMore}
  1849. },
  1850. function( newElements ) {
  1851. var $newElems = $(newElements);
  1852. $newElems.unnest({
  1853. yourCaption: ".captions-unnested",
  1854. wrapName: ".caption_unnested",
  1855. newCaptionUsername: false,
  1856. originalPostCaptionUsername: false,
  1857. tumblrAvatars: false,
  1858. usernameColon: false
  1859. });
  1860. $newElems.imagesLoaded(function(){
  1861. $newElems.animate({ opacity: 1 });
  1862. $container.masonry( 'appended', $newElems, true );
  1863. });
  1864. var $newElemsIDs = $newElems.map(function(){
  1865. return this.id;
  1866. }).get();
  1867. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1868. }
  1869. );
  1870. {block:IfManuallyLoadMore}
  1871. $(window).unbind('.infscr');
  1872. $('.load-more').click(function(){
  1873. $container.infinitescroll('retrieve');
  1874. return false
  1875. });
  1876. {/block:IfManuallyLoadMore}
  1877. {/block:IfInfiniteScroll}
  1878. });
  1879. </script>
  1880.  
  1881.  
  1882.  
  1883. <script type="text/javascript" src="http://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  1884. <script src="http://static.tumblr.com/h5czl1a/ACynk4kjd/tipped.js"></script>
  1885.  
  1886.  
  1887. <script type='text/javascript'>
  1888. $(document).ready(function() {
  1889. $('#sb-arrow7').click(function(){
  1890. $('#popup-links-background').fadeToggle(200);
  1891. $('#sb-popup-links').fadeToggle(200);
  1892. });
  1893. $('#popup-links-close').click(function(){
  1894. $('#popup-links-background').fadeToggle(200);
  1895. $('#sb-popup-links').fadeToggle(200);
  1896. });
  1897. $('#popup-links-background').click(function(){
  1898. $('#popup-links-background').fadeToggle(200);
  1899. $('#sb-popup-links').fadeToggle(200);
  1900. });
  1901.  
  1902.  
  1903. $('#sb-arrow3').click(function(){
  1904. $('#popup-desc-background').fadeToggle(200);
  1905. $('#sb-popup-desc').fadeToggle(200);
  1906. });
  1907. $('#popup-desc-close').click(function(){
  1908. $('#popup-desc-background').fadeToggle(200);
  1909. $('#sb-popup-desc').fadeToggle(200);
  1910. });
  1911. $('#popup-desc-background').click(function(){
  1912. $('#popup-desc-background').fadeToggle(200);
  1913. $('#sb-popup-desc').fadeToggle(200);
  1914. });
  1915. });
  1916. </script>
  1917.  
  1918.  
  1919.  
  1920.  
  1921. <script type="text/javascript">
  1922.  
  1923. {block:IfScrollToTop}
  1924. $(document).ready(function(){
  1925. var scrollButton = $("#scroll-button");
  1926. scrollButton.click(function(){
  1927. $("html, body").animate({scrollTop:0},1000)});
  1928. $(window).scroll(function(){
  1929. if($(window).scrollTop()<=0){
  1930. scrollButton.fadeOut(100)
  1931. }
  1932. else{scrollButton.fadeIn(100)
  1933. }
  1934. });
  1935. });
  1936. {/block:IfScrollToTop}
  1937.  
  1938. </script>
  1939.  
  1940.  
  1941.  
  1942.  
  1943. <script type='text/javascript'>
  1944. $(document).ready(function() {
  1945. Tipped.create('#credit','theme credit');
  1946. });
  1947. </script>
  1948.  
  1949. <script>
  1950. (function($){
  1951. $(document).ready(function(){
  1952. $("[title]").style_my_tooltips({
  1953. tip_follows_cursor:true,
  1954. tip_delay_time:200,
  1955. tip_fade_speed:300
  1956. }
  1957. );
  1958. });
  1959. })(jQuery);
  1960. </script>
  1961.  
  1962. </body>
  1963. </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!