API tools faq
paste
Advertisement
bct

lady beetle theme

bct
Nov 14th, 2017
10,696
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 41.95 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. (◍•ᴗ•◍)♡ ✧*。
  4.  
  5. Lady Beetle by Chloë | @dontbrag | @bychloethemes
  6.  
  7. > Do not delete/alter any credit.
  8. > Do not claim as your own.
  9. > Do not copy any code.
  10. > Do not redistribute.
  11.  
  12. Full terms: http://bychloethemes.tumblr.com/themes
  13.  
  14. =========================================================
  15.  
  16. DEPENDENCIES:
  17.  
  18. > jQuery
  19. https://jquery.com/
  20. > Infinite Scroll
  21. http://infinite-scroll.com/
  22. > Masonry
  23. http://masonry.desandro.com/
  24. > PXU Photosets (Modified by me)
  25. https://github.com/PixelUnion/Extended-Tumblr-Photoset/
  26. > ImagesLoaded
  27. http://imagesloaded.desandro.com/
  28. > Video Resizing
  29. http://shythemes.tumblr.com/post/134536748863/
  30. > Outicons
  31. https://github.com/antonps/outicons
  32. > Google Fonts
  33. http://fonts.google.com/
  34. > SMT Tooltips
  35. http://manos.malihu.gr/style-my-tooltips-jquery-plugin/
  36. > timeAgo()
  37. http://bychloethemes.tumblr.com/plugins/timeago
  38.  
  39. -->
  40. <html>
  41. <head>{block:Hidden}
  42. <meta name="color:Accent" content="#ddf2e8" />
  43. <meta name="text:Tagline" content="tagline...." />
  44. <meta name="if:Reblog Header" content="" />
  45. <meta name="if:Infinite Scroll" content="" />
  46. <meta name="if:Rounded Corners" content="" />
  47. <meta name="if:About Page" content="" />
  48. <meta name="text:About Page Link" content="/about" />
  49. <meta name="if:Related Posts" content="" />
  50. <meta name="text:FAQ" content="To see how to format the FAQ please read the theme post. If you don't want a FAQ, delete this text or it will show up on your blog." />
  51. {/block:Hidden}
  52. <link rel="shortcut icon" href="{Favicon}">
  53. <title>{Title}{block:SearchPage} : "{SearchQuery}"{/block:SearchPage}{block:DayPage} : {DayOfMonthWithZero}.{MonthNumberWithZero}.{Year}{/block:DayPage}{block:TagPage} : #{Tag}{/block:TagPage}{block:PostSummary} : {PostSummary}{/block:PostSummary}</title>
  54. <link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700,700i" rel="stylesheet">
  55. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  56. <link href='https://static.tumblr.com/8pnyeus/sXxofi7lt/outicons.css' rel='stylesheet' type='text/css'>
  57. <style type="text/css">
  58. * {
  59. margin: 0;
  60. padding: 0;
  61. }
  62. ::-webkit-scrollbar {
  63. background-color: #ddd;
  64. height: 11px;
  65. width: 11px;
  66. border: 5px solid #fff;
  67. }
  68. ::-webkit-scrollbar-thumb {
  69. background-color: #000;
  70. border: 5px solid #fff;
  71. }
  72. #s-m-t-tooltip {
  73. max-width: 300px;
  74. padding: 3px 6px;
  75. margin: 20px 10px;
  76. background: #fff;
  77. color: #676767;
  78. border: 1px solid #eaeaea;
  79. z-index: 999999999999999!important;
  80. font-size: 0.95em;
  81. }
  82. body {
  83. background: #ffffff url(http://static.tumblr.com/4e4f76ae273d8fb11bb2164e2c926373/yxfeliq/Ispnx7b6e/tumblr_static_7uyenz45fyww8wwcw88sc4gsk.png) repeat;
  84. background-attachment: fixed;
  85. color: #676767;
  86. font-family: 'Karla', sans-serif;
  87. line-height: 15px;
  88. -moz-osx-font-smoothing: grayscale;
  89. -webkit-font-smoothing: antialiased;
  90. font-smoothing: antialiased;
  91. font-size: 11px;
  92. word-break: break-word;
  93. }
  94. {block:IfRoundedCorners}
  95. aside, .link_overflow, article, #s-m-t-tooltip {
  96. border-radius: 10px;
  97. }
  98. {/block:IfRoundedCorners}
  99. .zoom {
  100. cursor: zoom-in;
  101. }
  102. img:not(.lightbox-image) {
  103. max-width: 100%;
  104. height: auto;
  105. }
  106. a {
  107. text-decoration: none;
  108. color: #000;
  109. }
  110. small {
  111. font-size: 0.95em;
  112. }
  113. figure.tmblr-full {
  114. margin: 10px 0;
  115. }
  116. hr {
  117. border: none;
  118. height: 1px;
  119. background: #aaa;
  120. margin: 20px 50px;
  121. }
  122. header {
  123. width: 100%;
  124. top: 0;
  125. background: {color:Accent};
  126. height: 100px;
  127. position: relative;
  128. }
  129. bar {
  130. border: 1px solid #eaeaea;
  131. border-width: 1px 0;
  132. padding: 10px;
  133. height: 44px;
  134. width: 100%;
  135. display: block;
  136. line-height: 24px;
  137. background: #fff;
  138. box-sizing: border-box;
  139. }
  140. bar.scroll {
  141. position: fixed;
  142. top: 0;
  143. left: 0;
  144. display: none;
  145. z-index: 999;
  146. border-top: none;
  147. }
  148. bar img {
  149. height: 24px;
  150. vertical-align: middle;
  151. margin-right: 15px;
  152. border-radius: 50%;
  153. }
  154. #wrapper {
  155. width: 980px;
  156. margin: 50px auto;
  157. }
  158. aside {
  159. width: 180px;
  160. padding: 15px;
  161. box-sizing: border-box;
  162. background: #fff;
  163. border: 1px solid #eaeaea;
  164. position: absolute;
  165. text-align: center;
  166. }
  167. aside img {
  168. width: 60px;
  169. margin-bottom: 10px;
  170. border-radius: 50%;
  171. }
  172. aside h2 {
  173. font-size: 1em;
  174. margin-top: 3px;
  175. }
  176. .pagination, .perma_pagination {
  177. margin-top: 10px;
  178. }
  179. .current_page, .jump_page, .perma_pagination a {
  180. margin: 0 3px;
  181. }
  182. #desc {
  183. margin: 10px 0 0;
  184. text-align: left;
  185. }
  186. ul#navi {
  187. list-style: none;
  188. }
  189. ul#navi li {
  190. display: inline-block;
  191. margin: 10px 4px 0;
  192. font-size: 1.1em;
  193. }
  194. .link_overflow {
  195. position: absolute;
  196. top: calc(100% + 15px);
  197. width: calc(100% + 2px);
  198. padding: 13px 15px;
  199. box-sizing: border-box;
  200. background: #fff;
  201. border: 1px solid #eaeaea;
  202. left: -1px;
  203. max-height: 200px;
  204. overflow-y: auto;
  205. display: none;
  206. }
  207. .link_overflow ul {
  208. list-style: none;
  209. }
  210. .link_overflow li {
  211. display: inline-block;
  212. margin: 2px 3px;
  213. }
  214. .link_overflow li:not(:last-of-type):after {
  215. content:',';
  216. }
  217. {block:IfInfiniteScroll}
  218. #infscr-loading {
  219. position:absolute;
  220. margin-bottom:-40px;
  221. bottom:30px;
  222. width:200px;
  223. margin-left:50%;
  224. left:-100px;
  225. text-align:center;
  226. }
  227. {/block:IfInfiniteScroll}
  228. #posts {
  229. margin-left: 230px;
  230. }
  231. article {
  232. width: 350px;
  233. box-sizing: border-box;
  234. border: 1px solid #eaeaea;
  235. padding: 15px;
  236. margin-bottom: 50px;
  237. background: #fff;
  238. }
  239. article.photo, article.video {
  240. padding: 5px;
  241. }
  242. article img {
  243. display: block;
  244. margin: 0 auto;
  245. }
  246. article.photo .reblog-list,
  247. article.video .reblog-list {
  248. padding: 15px 10px 10px;
  249. }
  250. .reblog:not(:first-of-type) {
  251. padding-top: 10px;
  252. }
  253. article h2 + div {
  254. padding-top: 15px;
  255. }
  256. article p {
  257. margin-bottom: 5px;
  258. }
  259. article p:last-of-type {
  260. margin-bottom: 0;
  261. }
  262. article ol, article ul {
  263. padding-left: 15px;
  264. margin: 10px;
  265. }
  266. article .reblog img {
  267. margin: 10px auto;
  268. }
  269. article blockquote {
  270. margin: 10px;
  271. border-left: 2px solid {color:Accent};
  272. padding-left: 10px;
  273. }
  274. article .reblog-header {
  275. margin-bottom: 3px;
  276. }
  277. article .reblog-header i {
  278. margin-right: 5px;
  279. }
  280. article .inactive span {
  281. text-decoration: line-through;
  282. }
  283. article .reblog-list:hover .inactive:after {
  284. content: 'deactivated';
  285. margin-left: 5px;
  286. text-decoration: none;
  287. }
  288. article.quote cite {
  289. display: block;
  290. text-align: right;
  291. }
  292. article.quote .reblog-list {
  293. display: none;
  294. }
  295. article.chat ul {
  296. list-style: none;
  297. margin: 0;
  298. padding: 0;
  299. font-size: 1.1em;
  300. }
  301. article.chat li:not(:first-of-type):not(.note) {
  302. margin-top: 5px;
  303. }
  304. .host + .reblog-list {
  305. padding-top: 10px;
  306. }
  307. .audio {
  308. position: relative;
  309. }
  310. .album-art {
  311. height: 100px;
  312. width: 100px;
  313. background-size: contain;
  314. background-position: center;
  315. background-repeat: no-repeat;
  316. background-image: url('http://static.tumblr.com/yxfeliq/CCbozax5f/record.jpeg');
  317. display: inline-block;
  318. vertical-align: middle;
  319. margin-bottom: 10px;
  320. }
  321. ul.audio-info {
  322. display: inline-block;
  323. vertical-align: middle;
  324. list-style: none;
  325. padding-left: 10px;
  326. width: 185px;
  327. margin-bottom: 20px;
  328. }
  329. ul.audio-info li {
  330. margin: 3px 0;
  331. }
  332. .audio-info b {
  333. color: #000;
  334. }
  335. .audio_player {
  336. position: absolute;
  337. top: 30px;
  338. left: 30px;
  339. opacity: 0.95;
  340. width: 30px;
  341. height: 27px;
  342. overflow: hidden;
  343. border-radius: 50%;
  344. background: #f3f3f2;
  345. border: 5px solid #f3f3f2;
  346. border-bottom-width: 8px;
  347. }
  348. .querier {
  349. margin-bottom: 10px;
  350. }
  351. .bubble {
  352. margin-bottom: 15px;
  353. background: #ececec;
  354. padding: 15px;
  355. }
  356. .bubble + .reblog-list:empty {
  357. margin-top: -10px;
  358. }
  359. .bubble blockquote {
  360. border-left-color: #aaa;
  361. }
  362. .video-resize {
  363. overflow: hidden;
  364. }
  365. {block:IndexPage}
  366. .time-ago {
  367. float: right;
  368. }
  369. .header {
  370. padding-bottom: 15px;
  371. }
  372. .photo .header, .video .header {
  373. padding: 10px 10px 15px;
  374. }
  375. .permalinks ul {
  376. padding: 0;
  377. margin: 0;
  378. text-align: right;
  379. list-style: none;
  380. }
  381. .permalinks li {
  382. display: inline-block;
  383. margin-left: 3px;
  384. }
  385. .permalinks li:first-of-type {
  386. float: left;
  387. margin-left: 0;
  388. }
  389. .permalinks {
  390. padding-top: 10px;
  391. }
  392. article.photo .permalinks,
  393. article.video .permalinks {
  394. padding: 0px 10px 10px;
  395. }
  396. .custom-like-button {
  397. position: relative;
  398. cursor: pointer;
  399. display:inline-block;
  400. }
  401. .like_button {
  402. position: absolute;
  403. top: 0;
  404. left: 0;
  405. right: 0;
  406. bottom: 0;
  407. width: 100%;
  408. height: 100%;
  409. opacity: 0;
  410. z-index: 10;
  411. }
  412. .like_button iframe {
  413. width: 100% !important;
  414. height: 100% !important;
  415. }
  416. .our_toggle {
  417. color: #000;
  418. top: 0;
  419. left: 0;
  420. right: 0;
  421. bottom: 0;
  422. width: 11px;
  423. height: 13px;
  424. z-index: 1;
  425. cursor: pointer;
  426. -webkit-transition: all 0.2s ease-in-out;
  427. -moz-transition: all 0.2s ease-in-out;
  428. -o-transition: all 0.2s ease-in-out;
  429. transition: all 0.2s ease-in-out;
  430. }
  431. .like_button:hover + .our_toggle {
  432. color: #e88b8b;
  433. -webkit-transition: all 0.2s ease-in-out;
  434. -moz-transition: all 0.2s ease-in-out;
  435. -o-transition: all 0.2s ease-in-out;
  436. transition: all 0.2s ease-in-out;
  437. }
  438. .like_button.liked + .our_toggle .oi-heart:before {
  439. content: "\e098";
  440. color: #e88b8b;
  441. }
  442.  
  443. .reblog-content {
  444. overflow: hidden;
  445. position: relative;
  446. }
  447. .read-more {
  448. position: absolute;
  449. bottom: 0;
  450. background: #fff;
  451. display: block;
  452. width: 100%;
  453. line-height: 20px;
  454. text-align: center;
  455. }
  456. .long .read-more:before {
  457. content: '';
  458. position: absolute;
  459. width: 100%;
  460. height: 40px;
  461. background: #fff;
  462. background: -webkit-linear-gradient(transparent, white);
  463. background: -o-linear-gradient(transparent, white);
  464. background: -moz-linear-gradient(transparent, white);
  465. background: linear-gradient(transparent, white);
  466. bottom: 20px;
  467. left: 0;
  468. }
  469. {/block:IndexPage}
  470. {block:PermalinkPage}
  471. article {
  472. width: 600px;
  473. font-size: 1.1em;
  474. line-height: 1.4em;
  475. }
  476. article:not(.photoset):not(.photo):not(.video) {
  477. padding: 25px;
  478. }
  479. .bubble {
  480. margin-bottom: 25px;
  481. }
  482. ol.notes {
  483. list-style: none;
  484. padding: 0;
  485. display: none;
  486. }
  487. a.avatar_frame {
  488. float: right;
  489. height: 16px;
  490. }
  491. li.note {
  492. padding: 3px 0;
  493. padding-left: 20px;
  494. }
  495. li.note blockquote {
  496. margin-bottom: 7px;
  497. }
  498. img.avatar {
  499. border-radius: 3px;
  500. }
  501. li.like:before {
  502. content: "\e099";
  503. font-family: untitled-font-1!important;
  504. font-style: normal;
  505. font-weight: 400;
  506. speak: none;
  507. display: inline-block;
  508. text-decoration: inherit;
  509. width: 1em;
  510. text-align: center;
  511. font-variant: normal;
  512. text-transform: none;
  513. vertical-align: middle;
  514. line-height: 1;
  515. font-size: 1em;
  516. -webkit-font-smoothing: antialiased;
  517. -moz-osx-font-smoothing: grayscale;
  518. margin-right: -11px;
  519. color: #f3719f;
  520. left: -20px;
  521. position: relative;
  522. font-size: 14px;
  523. }
  524. li.reblog:before, li.reply:before {
  525. content: '\e083';
  526. font-family: untitled-font-1!important;
  527. font-style: normal;
  528. font-weight: 400;
  529. speak: none;
  530. display: inline-block;
  531. text-decoration: inherit;
  532. width: 1em;
  533. text-align: center;
  534. font-variant: normal;
  535. text-transform: none;
  536. vertical-align: middle;
  537. line-height: 1;
  538. font-size: 1em;
  539. -webkit-font-smoothing: antialiased;
  540. -moz-osx-font-smoothing: grayscale;
  541. margin-right: -11px;
  542. color: #909090;
  543. left: -20px;
  544. position: relative;
  545. font-size: 14px;
  546. }
  547. li.original_post:before {
  548. content: '\e078';
  549. }
  550. li.reply:before {
  551. content: "\e0ca";
  552. }
  553. .more-info {
  554. margin: 0 10px 10px;
  555. }
  556. .reblog-list:empty + .more-info {
  557. margin-top: 10px;
  558. }
  559. a.tags {
  560. margin-right: 5px;
  561. color: #676767;
  562. }
  563. article:not(.photo) .more-info,
  564. article:not(.photoset) .more-info{
  565. margin-top: 10px;
  566. }
  567. article:not(.photoset):not(.photo):not(.video) .more-info,
  568. article:not(.photoset):not(.photo):not(.video) ol.notes {
  569. margin-left: 0;
  570. margin-right: 0;
  571. }
  572. article:not(.photoset):not(.photo):not(.video) ol.notes {
  573. margin-bottom: 0;
  574. }
  575.  
  576. {block:IfRelatedPosts}
  577. #related h1 {
  578. margin-bottom: 20px;
  579. }
  580. article.related {
  581. width: 180px;
  582. display: inline-block;
  583. height: 180px;
  584. margin-right: 30px;
  585. overflow: hidden;
  586. margin-bottom: 30px;
  587. padding: 5px!important;
  588. position: relative;
  589. }
  590. article.related:nth-of-type(n+7) {
  591. display: none;
  592. }
  593. .r-image {
  594. width: 100%;
  595. height: 100%;
  596. background-size: cover;
  597. background-position: center center;
  598. background-repeat: no-repeat;
  599. }
  600. .r-image.photoset:not(:first-of-type) {
  601. display: none;
  602. }
  603. .r-text {
  604. padding: 10px;
  605. }
  606. .r-text:after {
  607. content: '';
  608. position: absolute;
  609. bottom: 0px;
  610. left: 0;
  611. border-bottom: 15px solid #fff;
  612. width: 100%;
  613. height: 40px;
  614. background: #fff;
  615. background: -webkit-linear-gradient(transparent, white);
  616. background: -o-linear-gradient(transparent, white);
  617. background: -moz-linear-gradient(transparent, white);
  618. background: linear-gradient(transparent, white);
  619. }
  620. .r-text h2 {
  621. margin-bottom: 10px;
  622. }
  623. .masker {
  624. width: 100%;
  625. height: 100%;
  626. position: absolute;
  627. top: 0;
  628. left: 0;
  629. }
  630.  
  631. {/block:IfRelatedPosts}
  632. {/block:PermalinkPage}
  633.  
  634.  
  635. {CustomCSS}
  636. </style>
  637. </head>
  638. <body>
  639. <header></header>
  640. <bar>
  641. <a href="/"><img src="{PortraitURL-24}"></a>
  642. <span>{text:Tagline}</span>
  643. </bar>
  644. <div id="wrapper">
  645. <aside>
  646. <img src="{PortraitURL-64}">
  647. <a href="/"><h1>{Title}</h1></a>
  648. <h2>@{Name}</h2>
  649. {block:Pagination}
  650. <div class="pagination"{block:IfInfiniteScroll} style="display:none;"{/block:IfInfiniteScroll}>
  651. {block:PreviousPage}<a href="{PreviousPage}"><i class="oi-chevron-left">
  652. </i></a>{/block:PreviousPage}
  653.  
  654. {block:JumpPagination length="5"}{block:CurrentPage}
  655. <span class="current_page">{PageNumber}</span>
  656. {/block:CurrentPage}{block:JumpPage}
  657. <a class="jump_page" href="{URL}">{PageNumber}</a>
  658. {/block:JumpPage}{/block:JumpPagination}
  659.  
  660. {block:NextPage}<a href="{NextPage}" id="next-link"><i class="oi-chevron-right"></i></a>{/block:NextPage}
  661. </div>
  662. {/block:Pagination}
  663.  
  664. {block:PermalinkPagination}
  665. <div class="perma_pagination">
  666. {block:NextPost}
  667. <a href="{NextPost}"><i class="oi-chevron-left"></i> prev. post</a>
  668. {block:PreviousPost}&middot;{/block:PreviousPost}{/block:NextPost}
  669.  
  670. {block:PreviousPost}
  671. <a href="{PreviousPost}">next post <i class="oi-chevron-right"></i></a>
  672. {/block:PreviousPost}
  673. </div>
  674. {/block:PermalinkPagination}
  675.  
  676. {block:Description}<div id="desc">
  677. {Description}
  678. </div>{/block:Description}
  679. <ul id="navi">
  680. <li><a href="/" title="home"><i class="oi-home"></i></a>
  681. {block:AskEnabled}<li><a href="/ask" title="ask"><i class="oi-discuss"></i></a>{/block:AskEnabled}
  682. {block:HasPages}<li><a href="#" id="link_click" title="links"><i class="oi-link"></i></a>{/block:HasPages}
  683. {block:IfAboutPage}<li><a href="{text:About Page Link}" title="about"><i class="oi-user"></i></a>{/block:IfAboutPage}
  684. <li><a href="/archive" title="archive"><i class="oi-grid"></i></a>
  685. </ul>
  686. {block:HasPages}<div class="link_overflow">
  687. <ul>
  688. {block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
  689. </ul>
  690. </div>{/block:HasPages}
  691. </aside>
  692. <div id="posts">
  693. {block:Posts}<article id="{PostID}" class="{PostType}">
  694.  
  695. {block:IndexPage}
  696. {block:IfReblogHeader}
  697. {block:RebloggedFrom}
  698. <div class="header">
  699. <i class="oi-refresh"></i> <a href="{ReblogParentURL}" target="_blank">{ReblogParentName}</a>
  700. <span class="time-ago">{TimeStamp}</span>
  701. </div>
  702. {/block:RebloggedFrom}
  703. {/block:IfReblogHeader}
  704. {/block:IndexPage}
  705.  
  706. {block:Text}
  707. {block:Title}<h2>{Title}</h2>{/block:Title}
  708.  
  709. {block:AskPage}
  710. {block:IfFAQ}<div class="faq">
  711. {text:FAQ}
  712. </div>{/block:IfFAQ}
  713. {/block:AskPage}
  714.  
  715. {block:NotReblog}
  716. <div class="reblog-list">
  717. {Body}
  718. </div>
  719. {/block:NotReblog}
  720. {/block:Text}
  721.  
  722. {block:Photo}
  723. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false" class="zoom">
  724. {block:IndexPage}<img src="{PhotoURL-400}">{/block:IndexPage}{block:PermalinkPage}<img src="{PhotoURL-HighRes}">{/block:PermalinkPage}
  725. </a>
  726. {block:NotReblog}
  727. {block:Caption}
  728. <div class="reblog-list">
  729. {Caption}
  730. </div>
  731. {/block:Caption}
  732. {/block:NotReblog}
  733. {/block:Photo}
  734.  
  735. {block:Photoset}
  736. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  737. {block:Photos}<div class="photo-data">
  738. <div class="pxu-photo">
  739. <img src="{block:IndexPage}{PhotoURL-500}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  740. </div>
  741. <a class="tumblr-box zoom" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  742. </div>{/block:Photos}
  743. </div>
  744. {block:NotReblog}
  745. {block:Caption}
  746. <div class="reblog-list">
  747. {Caption}
  748. </div>
  749. {/block:Caption}
  750. {/block:NotReblog}
  751. {/block:Photoset}
  752.  
  753. {block:Quote}
  754. <blockquote>
  755. <h2>{Quote}</h2>
  756. </blockquote>
  757. {block:Source}
  758. <cite>{Source}</cite>
  759. {/block:Source}
  760. {/block:Quote}
  761.  
  762. {block:Chat}
  763. <ul>
  764. {block:Lines}<li>{block:Label}<b>{Label}</b>{/block:Label} {Line}{/block:Lines}
  765. </ul>
  766. {/block:Chat}
  767.  
  768. {block:Link}
  769. <h2><i class="oi-link"></i> <a href="{URL}">{Name}</a></h2>
  770. {block:Excerpt}
  771. <blockquote>
  772. {Excerpt}
  773. </blockquote>
  774. {block:Host}
  775. <div class="host">
  776. ({Host})
  777. </div>
  778. {/block:Host}
  779. {/block:Excerpt}
  780. {block:NotReblog}
  781. {block:Description}
  782. <div class="reblog-list">
  783. {Description}
  784. </div>
  785. {/block:Description}
  786. {/block:NotReblog}
  787. {/block:Link}
  788.  
  789. {block:Audio}
  790. <div class="audio">
  791. {block:AlbumArt}<div class="album-art" style="background-image:url({AlbumArtURL})"></div>{/block:ALbumArt}
  792.  
  793. <ul class="audio-info">
  794. <li><b><i class="oi-mic"></i> Artist:</b> <span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  795. <li><b><i class="oi-playlist"></i> Title:</b> <span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  796. <li><b><i class="oi-disc"></i> Album:</b> <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}
  797. <li><b><i class="oi-repeat"></i> Plays:</b> {FormattedPlayCount}
  798. </ul>
  799.  
  800. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  801. </div>
  802.  
  803. {block:NotReblog}
  804. {block:Caption}
  805. <div class="reblog-list">
  806. {Caption}
  807. </div>
  808. {/block:Caption}
  809. {/block:NotReblog}
  810. {/block:Audio}
  811.  
  812. {block:Video}
  813. <div class="video-resize">{Video-700}</div>
  814. {block:NotReblog}
  815. {block:Caption}
  816. <div class="reblog-list">
  817. {Caption}
  818. </div>
  819. {/block:Caption}
  820. {/block:NotReblog}
  821. {/block:Video}
  822.  
  823. {block:Answer}
  824. <div class="question bubble">
  825. <div class="querier"><i class="oi-discuss"></i> {Asker} asked:</div>
  826. {Question}
  827. </div>
  828. {block:Answerer}
  829. <div class="reply bubble">
  830. <div class="querier"><i class="oi-user"></i> {Answerer} answered:</div>
  831. {Answer}
  832. </div>
  833. {/block:Answerer}
  834. {block:NotReblog}
  835. <div class="reblog-list">
  836. {Replies}
  837. </div>
  838. {/block:NotReblog}
  839. {/block:Answer}
  840.  
  841. {block:RebloggedFrom}
  842. <div class="reblog-list" {block:Chat}style="display:none"{/block:Chat}>
  843. {block:Reblogs}
  844. <div class="{block:isOriginalEntry}original-reblog {/block:isOriginalEntry}reblog">
  845. <div class="reblog-header">
  846.  
  847. <a href="{Permalink}" target="_blank">{block:isOriginalEntry}<i class="oi-user"></i>{/block:isOriginalEntry}{block:isNotOriginalEntry}<i class="oi-refresh"></i>{/block:isNotOriginalEntry}</a>
  848.  
  849. {block:IsActive}
  850. <a target="_blank" href="{Permalink}">{Username}</a>
  851. {/block:IsActive}
  852.  
  853. {block:IsDeactivated}
  854. <span class="inactive"><span>{Username}</span></span>
  855. {/block:IsDeactivated}
  856.  
  857. </div>
  858. <div class="reblog-content">
  859. {Body}
  860. </div>
  861. </div>
  862. {/block:Reblogs}
  863. </div>
  864. {/block:RebloggedFrom}
  865.  
  866. {block:AskPage}{block:SubmissionsEnabled}<p style="margin-top: 10px;"><a href="/submit">Go to submit page <i class="oi-chevron-right"></i></a></p>{/block:SubmissionsEnabled}{/block:AskPage}
  867.  
  868. {block:IndexPage}<div class="permalinks">
  869. <ul>
  870. <li><a href="{Permalink}" target="_blank">{NoteCountWithLabel}</a>
  871. <li class="custom-like-button">
  872. {LikeButton}
  873. <div class="our_toggle"><i class="oi-heart"></i></div>
  874. <li><a href="{ReblogURL}" target="_blank"><i class="oi-refresh"></i></a>
  875. </ul>
  876. </div>{/block:IndexPage}
  877. {block:PermalinkPage}
  878. {block:Date}<div class="more-info">
  879. {NoteCountWithLabel} / {DayofMonth}{DayofMonthSuffix} of {Month}{block:RebloggedFrom} / via: <a href="{ReblogParentURL}" target="_blank">{ReblogParentName}</a> / src: <a href="{ReblogRootURL}" target="_blank">{ReblogRootName}</a>{/block:RebloggedFrom}{block:HasTags} / {block:Tags}<a href="{TagURL}" class="tags">#{Tag}</a>{/block:Tags}{/block:HasTags}{block:PostNotes} / <a href="#" id="show-notes">show notes</a>{/block:PostNotes}
  880. </div>{/block:Date}
  881. {block:PostNotes}
  882. {PostNotes-16}
  883. {/block:PostNotes}
  884. {/block:PermalinkPage}
  885. </article>{/block:Posts}
  886. {block:IfRelatedPosts}{block:RelatedPosts}<section id="related">
  887. <h1>Related Posts</h1>
  888. {block:Posts}
  889. <article class="related">
  890. <a href="{Permalink}" title="Permalink"><div class="masker"></div></a>
  891. {block:Text}<div class="r-text">
  892. {block:Title}<h2>{Title}</h2>{/block:Title}
  893. {Body}
  894. </div>{/block:Text}
  895.  
  896. {block:Photo}<div class="r-image" style="background-image:url('{PhotoURL-500}');"></div>{/block:Photo}
  897.  
  898. {block:Photoset}
  899. {block:Photos}
  900. <div class="r-image photoset" style="background-image:url('{PhotoURL-500}');"></div>
  901. {/block:Photos}
  902. {/block:Photoset}
  903.  
  904. {block:Quote}<div class="r-text"><h2>{Quote}</h2></div>{/block:Quote}
  905.  
  906. {block:Link}<div class="r-text">
  907. <h2><i class="oi-link"></i> <a href="{URL}" {Target}>{Name}</a></h2></div>
  908. {/block:Link}
  909.  
  910. {block:Chat}<div class="r-text">
  911. {block:Title}<h2>{Title}</h2>{/block:Title}
  912. <ul class="chat-list">
  913. {block:Lines}
  914. <li class="{Alt}">
  915. {block:Label}<span class="label">{Label}</span>{/block:Label}
  916. {Line}</li>
  917. {/block:Lines}
  918. </ul>
  919. </div>{/block:Chat}
  920.  
  921. {block:Audio}
  922. <div class="r-image" style="background-image:url('http://static.tumblr.com/yxfeliq/C5Xnysfnk/cd.jpg');{block:AlbumArt}background-image:url('{AlbumArtURL}');{/block:AlbumArt}"></div>
  923. {/block:Audio}
  924.  
  925. {block:Video}
  926. <div class="r-image" style="background-image:url('http://static.tumblr.com/yxfeliq/uWknysfvj/video_icon_0.png');{block:VideoThumbnail}background-image:url('{VideoThumbnailURL}');{/block:VideoThumbnail}"></div>{/block:Video}
  927.  
  928. {block:Answer}<div class="r-text">
  929. <b>Q:</b> {Question}
  930. </div>{/block:Answer}
  931.  
  932. </article>{/block:Posts}
  933. </section>{/block:RelatedPosts}{/block:IfRelatedPosts}
  934. </div>
  935. </div>
  936. <script src="https://secure.static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  937. <script src="https://secure.static.tumblr.com/i5s2zks/0ILo8v362/masonry.pkgd.min.js"></script>
  938. <link href="https://dl.dropboxusercontent.com/s/hzclyl41cq3yzjk/style.css" rel="stylesheet" type="text/css"/>
  939. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  940. <script type="text/javascript" src="http://static.tumblr.com/i5s2zks/9Acok8oo2/bct-timeago.min.js"></script>
  941. {block:IfInfiniteScroll}<script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>{/block:IfInfiniteScroll}
  942. <script src ="http://static.tumblr.com/yxfeliq/eqUozosls/shythemes.vr.modified.min.js"></script>
  943. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  944. <script src="http://static.tumblr.com/yxfeliq/UMuozenk7/ladybeetle.min.js"></script>
  945. <script type="text/javascript">
  946.  
  947. var fhs = document.createElement('script');var fhs_id = "5527597";
  948. var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;
  949. fhs.src = "//freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";
  950. document.head.appendChild(fhs);document.write("<span id='o_"+fhs_id+"' style='display:none'></span>");
  951. $(document).ready(function(){
  952. $("[title],a[title],img[title]").style_my_tooltips(tooltipOptions);
  953. $('bar').clone().addClass('scroll').prependTo('#wrapper');
  954. $('.photo-slideshow').pxuPhotoset(pxuOptions);
  955. $('.quote cite').each(removeViaQuotes);
  956. $(".time-ago").timeAgo();
  957. $('.video-resize').resizeVideos();
  958. {block:IndexPage}
  959. $('#wrapper').on('click', '.read-more a', expandEvent);
  960. $('#wrapper').on('click', 'a.read-less', collapseEvent);
  961. var $tumblelog = $('#posts');
  962. $tumblelog.imagesLoaded(function () {
  963. $('.reblog-content').each(checkPostLength);
  964. $tumblelog.masonry(masonryOptions);
  965. });
  966. {block:IfInfiniteScroll}
  967. $tumblelog.infinitescroll(infScrollOptions, function(newElements) {
  968. var $newElems = $( newElements );
  969. $newElems.css({ opacity: 0, zIndex: -1 });
  970. var $newElemsIDs = $newElems.map(function () {
  971. return this.id;
  972. }).get();
  973. $newElems.find('.photo-slideshow').pxuPhotoset(pxuOptions);
  974. $newElems.find('.quote cite').each(removeViaQuotes);
  975. $newElems.find(".time-ago").timeAgo();
  976. $newElems.find('.reblog-content').each(checkPostLength);
  977. $newElems.find('.video-resize').resizeVideos();
  978. $newElems.imagesLoaded(function(){
  979. $newElems.animate({ opacity: 1, zIndex: 1 });
  980. $tumblelog.masonry( 'appended', $newElems );
  981. });
  982. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  983. });
  984. {/block:IfInfiniteScroll}
  985. {/block:IndexPage}
  986. {block:PermalinkPage}
  987. $('#show-notes').click(function(e){
  988. e.preventDefault();
  989. $('ol.notes').slideToggle();
  990. $(this).text(($(this).text() == 'show notes') ? 'hide notes' : 'show notes');
  991. })
  992. {/block:PermalinkPage}
  993. });
  994. var nav = $("bar");
  995. var pos = nav.position();
  996. $(window).scroll(function() {
  997. var windowpos = $(window).scrollTop();
  998. if (windowpos > pos.top) {
  999. $('bar.scroll').fadeIn(0);
  1000. $('.tmblr-iframe').css({
  1001. 'top' : 2,
  1002. 'position' : 'fixed'
  1003. });
  1004. $('aside').css({
  1005. 'position' : 'fixed',
  1006. 'top' : 94
  1007. });
  1008. } else {
  1009. $('bar.scroll').fadeOut(0);
  1010. $('.tmblr-iframe').css({
  1011. 'top' : 103,
  1012. 'position' : 'absolute'
  1013. });
  1014. $('aside').css({
  1015. 'position' : 'absolute',
  1016. 'top' : 'initial'
  1017. });
  1018. }
  1019. });
  1020. </script>
  1021. </body>
  1022. <style type="text/css">
  1023. .tmblr-iframe {
  1024. top: 103px;
  1025. right: 0px;
  1026. position: absolute;
  1027. -webkit-filter: invert(100%);
  1028. filter: invert(100%);
  1029. -webkit-transform: scale(.7, .7);
  1030. -moz-transform: scale(.7, .7);
  1031. transform: scale(.7, .7);
  1032. opacity: 0.7;
  1033. -webkit-transform-origin: right top;
  1034. -moz-transform-origin: right top;
  1035. -ms-transform-origin: right top;
  1036. -o-transform-origin: right top;
  1037. transform-origin: right top;
  1038. z-index: 9999;
  1039. }
  1040. .tmblr-lightbox {
  1041. background: rgba(255,255,255,0.9);
  1042. }
  1043. .tmblr-lightbox .vignette {
  1044. opacity: 0;
  1045. }
  1046. .tmblr-lightbox .lightbox-image {
  1047. box-shadow: none;
  1048. border-radius: 0;
  1049. border: 5px solid {color:Accent};
  1050. }
  1051. </style>
  1052. </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!