Advertisement
feiinho

Nano - adorablethemes.com

May 17th, 2019
509
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 38.03 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <!--
  6.  
  7. theme: nano
  8. version: 1.3.1 (November 3, 2018)
  9. from: adorablethemes.com
  10.  
  11.  
  12. credits:
  13.  
  14. Font Awesome 4.7.0 (fontawesome.com)
  15. Infinite Scroll 3.0.3 (infinite-scroll.com)
  16. jQuery 3.3.1 (jquery.com)
  17. Sticky-Kit 1.1.2 (leafo.net)
  18.  
  19. -->
  20. <title>{block:SearchPage}{lang:Search results for SearchQuery} - {/block:SearchPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
  21. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  22.  
  23. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  24. <meta name="theme-color" content="{color:Accent}">
  25.  
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="apple-touch-icon" href="{PortraitURL-128}">
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29.  
  30. {block:Hidden}
  31. <meta name="image:Sidebar Photo" content="">
  32.  
  33. <meta name="select:Font" content="sans-serif" title="sans-serif">
  34. <meta name="select:Font" content="serif" title="serif">
  35. <meta name="select:Font" content="monospace" title="monospace">
  36. <meta name="select:Font" content="comic-sans" title="comic sans">
  37.  
  38. <meta name="color:Background" content="#202020">
  39. <meta name="color:Text" content="#dddddd">
  40. <meta name="color:Accent" content="#ffffff">
  41. <meta name="color:Light Text" content="#666666">
  42.  
  43. <meta name="text:Custom Ask Page Text" content="">
  44. <meta name="text:Google Analytics ID" content="">
  45.  
  46. <meta name="text:Featured Tag 1" content="">
  47. <meta name="text:Featured Tag 2" content="">
  48. <meta name="text:Featured Tag 3" content="">
  49. <meta name="text:Featured Tag 4" content="">
  50. <meta name="text:Featured Tag 5" content="">
  51.  
  52. <meta name="if:Show Random Link" content="0">
  53. <meta name="if:Show Liked Posts Link" content="0">
  54. <meta name="if:Load More Button" content="0">
  55. {/block:Hidden}
  56.  
  57. <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
  58.  
  59. <style type="text/css">
  60. * {
  61. -webkit-box-sizing: border-box;
  62. -moz-box-sizing: border-box;
  63. box-sizing: border-box;
  64. }
  65. html {
  66. background-color: {color:Background};
  67. }
  68. body {
  69. color: {color:Text};
  70. background-color: {color:Background};
  71. font-family: Helvetica, Arial, sans-serif;
  72. width: 930px;
  73. margin: 36px auto;
  74. position: relative;
  75. display: flex;
  76. flex-flow: row wrap;
  77. font-size: 15px;
  78. }
  79.  
  80. body.font-serif {
  81. font-family: Constantia, Georgia, "Liberation Serif", serif;
  82. }
  83. body.font-monospace {
  84. font-family: Consolas, Menlo, Monaco, "Lucida Console", monospace;
  85. }
  86. body.font-comic-sans {
  87. font-family: 'Comic Sans MS', Chalkboard, sans-serif;
  88. }
  89.  
  90. main {
  91. width: 580px;
  92. padding: 40px;
  93. }
  94.  
  95. .sidebar {
  96. width: 350px;
  97. padding: 40px;
  98. color: {color:Text};
  99. }
  100.  
  101. .blog-title {
  102. font-family: {TitleFont};
  103. font-weight: {TitleFontWeight};
  104. font-size: 1.25em;
  105. margin-top: 0;
  106. }
  107. .blog-description {
  108. width: 90%;
  109. }
  110.  
  111. .sidebar-photo {
  112. border-radius: 2px;
  113. margin-bottom: 2em;
  114. width: 96px;
  115. height: auto;
  116. }
  117. .sidebar-photo.circle {
  118. border-radius: 96px;
  119. }
  120.  
  121. .sidebar-links {
  122. list-style-type: none;
  123. padding-left: 0;
  124. margin-top: 2em;
  125. text-transform: lowercase;
  126. }
  127. .sidebar-link {
  128. color: {color:Accent};
  129. display: block;
  130. padding: 0.4em 0;
  131. text-decoration: none;
  132. }
  133. .sidebar-link:hover {
  134. color: rgba({RGBcolor:Accent},0.9);
  135. text-decoration: none;
  136. }
  137.  
  138. .post {
  139. margin-bottom: 6em;
  140. padding-bottom: 6em;
  141. border-bottom: 1px dotted rgba({RGBcolor:Text},0.15);
  142. }
  143. .post.search-results {
  144. margin-bottom: 3em;
  145. padding-bottom: 0;
  146. border-bottom: 0;
  147. }
  148. .post.page {
  149. padding-bottom: 0;
  150. border-bottom: 0;
  151. }
  152. figure {
  153. margin: 0;
  154. }
  155. .post img {
  156. border-radius: 2px;
  157. max-width: 100%;
  158. height: auto;
  159. }
  160. .photo-post-photo.high-res {
  161. width: 100%;
  162. height: auto;
  163. }
  164. .photoset-content iframe, .video-post-video, .audio-post-audio {
  165. border-radius: 2px;
  166. }
  167. .tumblr_video_iframe {
  168. max-height: 540px;
  169. }
  170. .post h1,.post h2,.post h3,.post h4,.post h5,.post h6 {
  171. font-weight: 400;
  172. font-size: 1.25em;
  173. margin: 1em 0;
  174. line-height: 150%;
  175. }
  176. h2.post-title {
  177. margin-top: 0;
  178. }
  179. h2.post-title a, h2.post-title a:hover {
  180. text-decoration: none;
  181. }
  182. .post a, .blog-description a {
  183. color: {color:Text};
  184. text-decoration: underline;
  185. text-decoration-color: rgba({RGBcolor:Text},0.5);
  186. }
  187. .post a:hover, .blog-description a:hover {
  188. color: {color:Text};
  189. text-decoration: underline;
  190. text-decoration-color: rgba({RGBcolor:Text},0.9);
  191. }
  192. .post p, .blog-description p {
  193. line-height: 160%;
  194. }
  195. .post ul, .blog-description ul {
  196. list-style-type: square;
  197. line-height: 150%;
  198. padding-left: 1.25em;
  199. }
  200. .post ul ul, .blog-description ul ul {
  201. list-style-type: disc;
  202. font-size: 0.9em;
  203. line-height: 140%;
  204. padding-left: 1.25em;
  205. }
  206. .post ol, .blog-description ol {
  207. line-height: 150%;
  208. padding-left: 1.25em;
  209. }
  210. .post blockquote, .blog-description blockquote {
  211. border-left: 2px solid {color:Text};
  212. padding: 0 1.1em;
  213. margin: 1.1em 0;
  214. font-style: italic;
  215. }
  216. .post hr {
  217. border: 0;
  218. border-bottom: 2px solid rgba({RGBcolor:Text},0.1);
  219. }
  220.  
  221. .post iframe, .blog-description iframe {
  222. max-width: 100%;
  223. }
  224. .photoset {
  225. width: 500px;
  226. }
  227.  
  228. .post code, .post pre {
  229. font-family: Consolas, Menlo, monospace;
  230. }
  231.  
  232. .chat .label {
  233. font-weight: bold;
  234. display: block;
  235. color: {color:Accent};
  236. font-size: 0.85em;
  237. }
  238. .chat ul {
  239. list-style-type: none;
  240. padding-left: 0;
  241. }
  242. .chat ul li {
  243. padding: 0.66em 0;
  244. }
  245.  
  246. .quote-text {
  247. font-family: Constantia, Georgia, "Liberation Serif", serif;
  248. font-style: italic;
  249. font-weight: 400;
  250. font-size: 1.25em;
  251. }
  252.  
  253. .link-post-link .fa-angle-right {
  254. color: {color:Accent};
  255. }
  256.  
  257. .question {
  258. color: rgba({RGBcolor:Text},0.8);
  259. font-style: italic;
  260. }
  261.  
  262. .post-meta {
  263. color: {color:Light Text};
  264. font-size: 0.85em;
  265. margin: 1em 0;
  266. }
  267. .post-meta:last-child {
  268. margin-bottom: 0;
  269. }
  270. .post-meta a, .post-meta a:hover {
  271. color: {color:Light Text};
  272. text-decoration: none;
  273. }
  274. .post-meta a:hover {
  275. color: rgba({RGBcolor:Light Text},0.9);
  276. }
  277. .note-count, .play-count, .post-attribution {
  278. margin-left: 1.33em;
  279. }
  280. .post-attribution a {
  281. display: none;
  282. }
  283. .post-attribution a:first-child {
  284. display: inline;
  285. }
  286. .notes-list {
  287. padding-top: 1.33em;
  288. }
  289. .tag:before {
  290. content: "#";
  291. }
  292.  
  293. ol.notes {
  294. list-style-type: none;
  295. padding-left: 0;
  296. }
  297. .note {
  298. padding: 0.33em 0;
  299. }
  300. .note .avatar {
  301. display: none;
  302. }
  303.  
  304. .pagination {
  305. margin: 0 auto;
  306. clear: both;
  307. text-align: center;
  308. text-transform: lowercase;
  309. }
  310. .pagination a {
  311. color: {color:Text};
  312. text-decoration: none;
  313. }
  314. .span33, .span50 {
  315. min-height: 1px;
  316. float: left;
  317. }
  318. .span33 {
  319. width: 33.33%;
  320. }
  321. .span50 {
  322. width: 50%;
  323. }
  324. .pagination .fa-angle-left {
  325. margin-right: 0.33em;
  326. color: {color:Accent};
  327. }
  328. .pagination .fa-angle-right {
  329. margin-left: 0.33em;
  330. color: {color:Accent};
  331. }
  332.  
  333. {block:IfLoadMoreButton}
  334. #previous, #next, .page-info {
  335. display: none;
  336. }
  337. #view_more_button {
  338. cursor: pointer;
  339. padding: 10px 14px;
  340. background-color: rgba({RGBcolor:Text}, 0.05);
  341. border-radius: 8px;
  342. }
  343. #view_more_button:hover {
  344. background-color: rgba({RGBcolor:Text}, 0.1);
  345. }
  346. #view_more_button:active {
  347. background-color: rgba({RGBcolor:Text}, 0.25);
  348. }
  349. {/block:IfLoadMoreButton}
  350.  
  351. a.read_more:after {
  352. content: " \2192";
  353. }
  354.  
  355. .float-left {
  356. float: left;
  357. }
  358. .float-right {
  359. float: right;
  360. }
  361. .text-left {
  362. text-align: left;
  363. }
  364. .text-center {
  365. text-align: center;
  366. }
  367. .text-right {
  368. text-align: right;
  369. }
  370.  
  371. .like-button-parent {
  372. display: inline-block !important;
  373. }
  374. .reblog-button {
  375. margin-right: 0.53em;
  376. }
  377. .like-button-parent {
  378. position: relative;
  379. margin-right: 1.33em;
  380. }
  381. .like-button-parent .like_button {
  382. position: absolute;
  383. top: 0;
  384. opacity: 0;
  385. }
  386. .like-button-parent .like_button.liked + span {
  387. color: #d95e40;
  388. }
  389.  
  390. p.tmblr-attribution {
  391. font-size: 11px;
  392. }
  393. div.npf_row {
  394. max-width: 100%;
  395. height: auto !important;
  396. margin: 0 !important;
  397. }
  398. .post-section figure video, .post-section figure audio {
  399. max-width: 100%;
  400. }
  401. .npf-link-block a {
  402. text-decoration: none !important;
  403. }
  404.  
  405. .post-section {
  406. padding-top: 0.2em;
  407. }
  408. .post-section:last-child {
  409. padding-bottom: 0.2em;
  410. }
  411. .reblog-avatar {
  412. width: 1.2em;
  413. height: 1.2em;
  414. vertical-align: middle;
  415. margin-right: 0.46em;
  416. border-radius: 2px;
  417. }
  418. .reblog-avatar.deleted {
  419. -webkit-filter: grayscale(1);
  420. filter: grayscale(1);
  421. }
  422. .reblog-username {
  423. color: {color:Accent};
  424. font-size: 0.85em;
  425. }
  426. a.reblog-username {
  427. color: {color:Accent};
  428. text-decoration: none !important;
  429. }
  430. a.reblog-username:hover {
  431. color: {color:Accent};
  432. text-decoration: none !important;
  433. }
  434. .asker, .answerer- {
  435. color: {color:Accent};
  436. font-size: 0.85em;
  437. text-decoration: none !important;
  438. }
  439. .asker a, .asker a:hover, .answerer- a, .answerer- a:hover {
  440. color: {color:Accent};
  441. text-decoration: none !important;
  442. }
  443.  
  444. .tmblr-iframe-pushdown ul.sidebar-links.is_stuck {
  445. margin-top: 64px;
  446. }
  447.  
  448. .tmblr-iframe--app-cta-button {
  449. display: none !important;
  450. }
  451.  
  452. #menu_button {
  453. position: fixed;
  454. top: 20px;
  455. left: 20px;
  456. font-size: 1.25em;
  457. cursor: pointer;
  458. z-index: 101;
  459. display: none;
  460. }
  461. .tmblr-iframe-pushdown #menu_button {
  462. top: 74px;
  463. }
  464. #blackout {
  465. display: none;
  466. }
  467.  
  468.  
  469. @media screen and (max-width:960px) {
  470. body {
  471. width: 768px;
  472. margin: 0 auto;
  473. }
  474. header {
  475. width: 768px;
  476. }
  477. .sidebar {
  478. width: 288px;
  479. }
  480. main {
  481. width: 480px;
  482. }
  483. .photoset {
  484. width: 400px;
  485. }
  486. }
  487.  
  488. @media screen and (max-width:767px) {
  489. body {
  490. width: 100%;
  491. display: block;
  492. margin: 0;
  493. margin-bottom: 36px;
  494. padding: 0;
  495. }
  496. body.menu-open {
  497. overflow-y: hidden;
  498. }
  499. header {
  500. width: 100%;
  501. }
  502. .sidebar {
  503. background-color: {color:Background};
  504. width: 100%;
  505. margin: 0;
  506. padding: 20px;
  507. padding-left: 60px;
  508. position: fixed;
  509. left: -100%;
  510. top: 0;
  511. z-index: 100;
  512. transition: left 0.1s ease-in-out;
  513. overflow-y: scroll;
  514. }
  515. .tmblr-iframe-pushdown .sidebar {
  516. top: 54px;
  517. }
  518. .menu-open .sidebar {
  519. left: 0;
  520. }
  521. .sidebar-photo {
  522. width: 64px;
  523. }
  524. .sidebar-link {
  525. padding: 0.6em 0;
  526. }
  527. main {
  528. width: 100%;
  529. margin: 0;
  530. padding: 20px;
  531. padding-left: 60px;
  532. }
  533. .photoset {
  534. width: 100%;
  535. }
  536. #menu_button {
  537. display: block;
  538. }
  539. #blackout {
  540. background-color: rgba(0,0,0,0);
  541. z-index: 99;
  542. position: fixed;
  543. left: -100%;
  544. top: 0;
  545. width: 100%;
  546. height: 100%;
  547. transition: background-color 0.1s ease-in-out;
  548. display: block;
  549. }
  550. .menu-open #blackout {
  551. background-color: rgba(0,0,0,0.5);
  552. left: 0;
  553. }
  554. .like-reblog-buttons {
  555. display: none;
  556. }
  557. }
  558.  
  559. @media screen and (max-width:360px) {
  560. body {
  561. font-size: 13px;
  562. }
  563. }
  564.  
  565. {CustomCSS}
  566. </style>
  567. {block:IfLoadMoreButton}<noscript><style>#view_more_button {display: none}#previous, #next, .page-info {display: inline}</style></noscript>{/block:IfLoadMoreButton}
  568. </head>
  569. <body class="{block:IndexPage}index-page{/block:IndexPage}{block:PermalinkPage}permalink-page{/block:PermalinkPage} font-{select:Font}">
  570. <div id="menu_button">
  571. <i class="fa fa-bars"></i>
  572. </div>
  573. <div id="blackout"></div>
  574. <div class="sidebar" role="complimentary">
  575.  
  576. {block:IfNotSidebarPhotoImage}
  577. {block:ShowAvatar}
  578. <a href="/">
  579. <img class="sidebar-photo {AvatarShape}" src="{PortraitURL-96}" alt="{Name}'s avatar" />
  580. </a>
  581. {/block:ShowAvatar}
  582. {/block:IfNotSidebarPhotoImage}
  583.  
  584. {block:IfSidebarPhotoImage}
  585. <a href="/">
  586. <img class="sidebar-photo" src="{image:Sidebar Photo}" alt="{Name}'s photo" />
  587. </a>
  588. {/block:IfSidebarPhotoImage}
  589.  
  590. {block:ShowTitle}
  591. <h1 class="blog-title">{Title}</h1>
  592. {/block:ShowTitle}
  593.  
  594. {block:ShowDescription}
  595. <div class="blog-description">{Description}</div>
  596. {/block:ShowDescription}
  597.  
  598. <ul class="sidebar-links">
  599.  
  600. <a class="sidebar-link{block:HomePage} current-page{/block:HomePage}" href="/"><li>{lang:Home}</li></a>
  601.  
  602. {block:HasPages}
  603. {block:Pages}
  604. <a class="sidebar-link {CurrentState}" href="{URL}"><li>{Label}</li></a>
  605. {/block:Pages}
  606. {/block:HasPages}
  607.  
  608. <a class="sidebar-link" href="/archive"><li>{lang:Archive}</li></a>
  609. {block:IfShowLikedPostsLink}<a class="sidebar-link" href="https://www.tumblr.com/liked/by/{Name}"><li>{lang:Liked posts}</li></a>{/block:IfShowLikedPostsLink}
  610.  
  611. {block:IfShowRandomLink}<a class="sidebar-link" href="/random"><li>{lang:Random}</li></a>{/block:IfShowRandomLink}
  612.  
  613. {block:AskEnabled}
  614. <a class="sidebar-link{block:AskPage} current-page{/block:AskPage}" href="/ask"><li>{AskLabel}</li></a>
  615. {/block:AskEnabled}
  616.  
  617. {block:SubmissionsEnabled}
  618. <a class="sidebar-link{block:SubmitPage} current-page{/block:SubmitPage}" href="/submit"><li>{SubmitLabel}</li></a>
  619. {/block:SubmissionsEnabled}
  620.  
  621. <a class="sidebar-link" href="https://adorablethemes.com/theme/nano" target="_blank"><li>Theme</li></a>
  622.  
  623. {block:IfFeaturedTag1}
  624.  
  625. <span class="sidebar-link"><li>&nbsp;</li></span>
  626.  
  627. <a class="sidebar-link" href="/tagged/{text:Featured Tag 1}"><li>#{text:Featured Tag 1}</li></a>
  628.  
  629. {block:IfFeaturedTag2}<a class="sidebar-link" href="/tagged/{text:Featured Tag 2}"><li>#{text:Featured Tag 2}</li></a>{/block:IfFeaturedTag2}
  630. {block:IfFeaturedTag3}<a class="sidebar-link" href="/tagged/{text:Featured Tag 3}"><li>#{text:Featured Tag 3}</li></a>{/block:IfFeaturedTag3}
  631. {block:IfFeaturedTag4}<a class="sidebar-link" href="/tagged/{text:Featured Tag 4}"><li>#{text:Featured Tag 4}</li></a>{/block:IfFeaturedTag4}
  632. {block:IfFeaturedTag5}<a class="sidebar-link" href="/tagged/{text:Featured Tag 5}"><li>#{text:Featured Tag 5}</li></a>{/block:IfFeaturedTag5}
  633.  
  634. {/block:IfFeaturedTag1}
  635.  
  636. </ul>
  637.  
  638. </div>
  639.  
  640. <main class="main" role="main">
  641.  
  642. {block:SearchPage}
  643. {block:SearchResults}
  644. <div class="post search-results">
  645. <div class="post-section">
  646. <h2 class="post-title">{lang:SearchResultCount results for SearchQuery 2}</h2>
  647. </div>
  648. </div>
  649. {/block:SearchResults}
  650.  
  651. {block:NoSearchResults}
  652. <div class="post search-results">
  653. <div class="post-section">
  654. <h2 class="post-title">{lang:No search results for SearchQuery 2}</h2>
  655. </div>
  656. </div>
  657. {/block:NoSearchResults}
  658. {/block:SearchPage}
  659.  
  660. {block:TagPage}
  661. <div class="post search-results">
  662. <div class="post-section">
  663. <h2 class="post-title">#{Tag}</h2>
  664. </div>
  665. </div>
  666. {/block:TagPage}
  667.  
  668. <div id="posts">
  669.  
  670. {block:Posts}
  671.  
  672. <article id="{PostID}" class="post {PostType} {block:Date}not-{/block:Date}page">
  673.  
  674. <div class="post-main">
  675. {block:Text}
  676. {block:Title}
  677. <h2 class="post-title"><a href="{Permalink}">{Title}</a></h2>
  678. {/block:Title}
  679.  
  680. {block:NotReblog}
  681. <div class="post-section">
  682. {block:IfCustomAskPageText}{block:AskPage}<p>{text:Custom Ask Page Text}</p>{/block:AskPage}{/block:IfCustomAskPageText}
  683. {Body}
  684. </div>
  685. {/block:NotReblog}
  686. {block:RebloggedFrom}
  687. {block:Reblogs}
  688. <div class="post-section">
  689. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  690. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  691. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  692. </p>
  693. {Body}
  694. </div>
  695. {/block:Reblogs}
  696. {/block:RebloggedFrom}
  697. {/block:Text}
  698.  
  699. {block:Answer}
  700. <div class="post-section">
  701. <p class="asker"><img class="reblog-avatar" src="{AskerPortraitURL-64}" /> <b>{lang:Asker asked 2}</b></p><p class="question">"{Question}"</p>
  702.  
  703. </div>
  704.  
  705. {block:Answerer}
  706. <div class="post-section">
  707. <p class="answerer-"><img class="reblog-avatar" src="{AnswererPortraitURL-64}" /> <b>{Answerer}</b></p>
  708.  
  709. {Answer}
  710.  
  711. </div>
  712. {/block:Answerer}
  713.  
  714. {block:NotReblog}<div class="post-section">{Replies}</div>{/block:NotReblog}
  715. {block:RebloggedFrom}
  716. {block:Reblogs}
  717. <div class="post-section">
  718. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  719. {block:IsActive}<a class="reblog-username" target="_blank" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  720. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  721. </p>
  722. {Body}
  723. </div>
  724. {/block:Reblogs}
  725. {/block:RebloggedFrom}
  726. {/block:Answer}
  727.  
  728. {block:Photo}
  729. <figure>
  730. {LinkOpenTag}<img class="photo-post-photo{block:HighRes} high-res{/block:HighRes}" src="{PhotoURL-500}"{block:HighRes} srcset="{PhotoURL-1280} 2x"{/block:HighRes} alt="{PhotoAlt}" />{LinkCloseTag}
  731. </figure>
  732. {block:NotReblog}
  733. {block:Caption}
  734. <figcaption class="post-section">
  735. {Caption}
  736. </figcaption>
  737. {/block:Caption}
  738. {/block:NotReblog}
  739. {block:RebloggedFrom}
  740. {block:Reblogs}
  741. <div class="post-section">
  742. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  743. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  744. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  745. </p>
  746. {Body}
  747. </div>
  748. {/block:Reblogs}
  749. {/block:RebloggedFrom}
  750. {/block:Photo}
  751.  
  752. {block:Photoset}
  753. <figure class="photoset-content">
  754. {Photoset}
  755. </figure>
  756.  
  757. {block:NotReblog}
  758. {block:Caption}
  759. <figcaption class="post-section">
  760. {Caption}
  761. </figcaption>
  762. {/block:Caption}
  763. {/block:NotReblog}
  764. {block:RebloggedFrom}
  765. {block:Reblogs}
  766. <div class="post-section">
  767. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  768. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  769. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  770. </p>
  771. {Body}
  772. </div>
  773. {/block:Reblogs}
  774. {/block:RebloggedFrom}
  775. {/block:Photoset}
  776.  
  777. {block:Quote}
  778. <p class="quote-text">"{Quote}"</p>
  779.  
  780. {block:Source}
  781. <p class="text-right"> &mdash; {Source}</p>
  782. {/block:Source}
  783. {/block:Quote}
  784.  
  785. {block:Link}
  786. <div class="post-section"><h2 class="post-title"><a href="{URL}" class="link-post-link"{block:Host} title="{Host}"{/block:Host} {Target}>{Name} <i class="fa fa-fw fa-angle-right"></i></a></h2>
  787. {block:Excerpt}<p class="link-excerpt">{Excerpt}</p>{/block:Excerpt}
  788. </div>
  789. {block:NotReblog}
  790. {block:Description}
  791. <div class="post-section">
  792. {Description}
  793. </div>
  794. {/block:Description}
  795. {/block:NotReblog}
  796. {block:RebloggedFrom}
  797. {block:Reblogs}
  798. <div class="post-section">
  799. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  800. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  801. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  802. </p>
  803. {Body}
  804. </div>
  805. {/block:Reblogs}
  806. {/block:RebloggedFrom}
  807. {/block:Link}
  808.  
  809. {block:Chat}
  810. {block:Title}
  811. <h2 class="post-title"><a href="{Permalink}">{Title}</a></h2>
  812. {/block:Title}
  813.  
  814. <ul class="chat-lines">
  815. {block:Lines}
  816. <li class="{Alt} user_{UserNumber}">
  817. {block:Label}
  818. <span class="label">{Label}</span>
  819. {/block:Label}
  820.  
  821. <span class="line">{Line}</span>
  822. </li>
  823. {/block:Lines}
  824. </ul>
  825. {/block:Chat}
  826.  
  827. {block:Video}
  828. <figure class="video-post-video">
  829. {VideoEmbed-500}
  830. </figure>
  831.  
  832. {block:NotReblog}
  833. {block:Caption}
  834. <div class="post-section">
  835. {Caption}
  836. </div>
  837. {/block:Caption}
  838. {/block:NotReblog}
  839. {block:RebloggedFrom}
  840. {block:Reblogs}
  841. <div class="post-section">
  842. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  843. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  844. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  845. </p>
  846. {Body}
  847. </div>
  848. {/block:Reblogs}
  849. {/block:RebloggedFrom}
  850. {/block:Video}
  851.  
  852. {block:Audio}
  853. <figure class="audio-post-audio">
  854. {AudioEmbed}
  855. </figure>
  856.  
  857. {block:NotReblog}
  858. {block:Caption}
  859. <div class="post-section">
  860. {Caption}
  861. </div>
  862. {/block:Caption}
  863. {/block:NotReblog}
  864. {block:RebloggedFrom}
  865. {block:Reblogs}
  866. <div class="post-section">
  867. <p><img class="reblog-avatar{block:IsDeactivated} deleted{/block:IsDeactivated}" src="{PortraitURL-64}">
  868. {block:IsActive}<a target="_blank" class="reblog-username" href="{Permalink}"><b>{Username}</b></a>{/block:IsActive}
  869. {block:IsDeactivated}<b class="reblog-username">{Username}</b>{/block:IsDeactivated}
  870. </p>
  871. {Body}
  872. </div>
  873. {/block:Reblogs}
  874. {/block:RebloggedFrom}
  875. {/block:Audio}
  876.  
  877. </div>
  878.  
  879. <div class="post-meta-block">
  880. {block:HasTags}
  881. <div class="post-meta tags-list">
  882. {block:Tags}
  883. <a class="tag" href="{TagURL}">{Tag}</a>&nbsp;&nbsp;
  884. {/block:Tags}
  885. </div>
  886. {/block:HasTags}
  887.  
  888. {block:Date}
  889. <div class="post-meta">
  890. <div class="like-reblog-buttons">
  891. <div class="float-left reblog-button">
  892. <a href="{ReblogURL}"><i class="fa fa-refresh"></i></a>
  893. </div>
  894. <div class="float-left like-button-parent">
  895. {LikeButton color="gray" size="16"}
  896. <span><i class="fa fa-heart"></i></span>
  897. </div>
  898. </div>
  899. <a class="time-posted" href="{Permalink}">{ShortMonth} {DayOfMonth} <span class="year-{Year}">{Year}</span></a>
  900. {block:IndexPage}{block:NoteCount}<a class="note-count" href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{/block:IndexPage}
  901. {block:Video}{block:PlayCount}<a class="play-count" href="{Permalink}">{PlayCountWithLabel}</a>{/block:PlayCount}{/block:Video}
  902. {block:Audio}{block:PlayCount}<a class="play-count" href="{Permalink}">{PlayCountWithLabel}</a>{/block:PlayCount}{/block:Audio}
  903.  
  904. <span class="post-attribution">
  905. {block:Submission}<a href="{SubmitterURL}">{lang:Source}</a>{/block:Submission}
  906. {block:ContentSource}<a title="{SourceTitle}" href="{SourceURL}">{lang:Source}</a>{/block:ContentSource}
  907. {block:RebloggedFrom}<a title="{ReblogRootName}" href="{ReblogRootURL}">{lang:Source}</a>{/block:RebloggedFrom}
  908. </span>
  909. </div>
  910.  
  911. {block:PermalinkPage}
  912. {block:PostNotes}
  913. <div class="post-meta notes-list">
  914. <h2>{NoteCountWithLabel}</h2>
  915. {PostNotes-16}
  916. </div>
  917. {/block:PostNotes}
  918. {/block:PermalinkPage}
  919. {/block:Date}
  920.  
  921. </div>
  922.  
  923. </article>
  924.  
  925. {/block:Posts}
  926.  
  927. </div>
  928.  
  929. {block:Pagination}
  930. <div class="pagination">
  931. <div class="span33 text-left">
  932. {block:PreviousPage}<a href="{PreviousPage}" id="previous"><i class="fa fa-angle-left"></i> {lang:Previous}</a>{/block:PreviousPage}
  933. </div>
  934. <div class="span33 text-center">
  935. <a href="/archive" class="page-info">{CurrentPage} / {TotalPages}</a>
  936. </div>
  937. <div class="span33 text-right">
  938. {block:NextPage}<a href="{NextPage}" id="next">{lang:Next} <i class="fa fa-angle-right"></i></a>{/block:NextPage}
  939. </div>
  940. {block:IfLoadMoreButton}<span id="view_more_button">{lang:Load more posts}</span>{/block:IfLoadMoreButton}
  941. </div>
  942. {/block:Pagination}
  943.  
  944. {block:PermalinkPagination}
  945. <div class="pagination">
  946. <div class="span50 text-left">
  947. {block:PreviousPost}<a href="{PreviousPost}" id="previous"><i class="fa fa-angle-left"></i> {lang:Previous Post}</a>{/block:PreviousPost}
  948. </div>
  949. <div class="span50 text-right">
  950. {block:NextPost}<a href="{NextPost}" id="next">{lang:Next Post} <i class="fa fa-angle-right"></i></a>{/block:NextPost}
  951. </div>
  952. </div>
  953. {block:PermalinkPagination}
  954.  
  955. </main>
  956.  
  957. <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT" crossorigin="anonymous"></script>
  958. <script src="https://static.tumblr.com/anzluor/16yo8wj8d/sticky-kit.min.js" integrity="sha384-/+D09m4jokgZKekkXuYLYFyubhSssOaibKAfYUuSLf3veeigHLGkwsPV74Cv00tP" crossorigin="anonymous"></script>
  959. {block:IfLoadMoreButton}<script src="https://unpkg.com/infinite-scroll@3.0.3/dist/infinite-scroll.pkgd.min.js" integrity="sha384-SpHS3ahBNOa97uGbif91UXZ7WShL+CdO3tkOFKrJquA31QgXeSJHhrMxOT3EQKSp" crossorigin="anonymous"></script>{/block:IfLoadMoreButton}
  960.  
  961. <script>
  962. if (window.innerWidth > 767) {
  963. $("ul.sidebar-links").stick_in_parent();
  964. }
  965. $(function(){
  966. {block:IfLoadMoreButton}
  967. {block:IndexPage}
  968. // set up load more button
  969. var container = $('#posts');
  970.  
  971. container.infiniteScroll({
  972. path: 'div.pagination a#next',
  973. append: '.post',
  974. button: '#view_more_button',
  975. history: false,
  976. scrollThreshold: false
  977. });
  978. container.on( 'append.infiniteScroll', function(event, response, path, items) {
  979. {block:IfGoogleAnalyticsID}
  980. // send google analytics hit
  981. ga('send', 'pageview', path);
  982.  
  983. {/block:IfGoogleAnalyticsID}
  984. // hide year if it's the current year
  985. trimDates();
  986.  
  987. // fit videos and photosets
  988. if (window.innerWidth < 961) {
  989. fitVideos();
  990. if (window.innerWidth < 768) {
  991. resizePhotosets();
  992. }
  993. }
  994.  
  995. // get like button state
  996. var $newElems = $( items );
  997. var $newElemsIDs = $newElems.map(function () {
  998. return this.id;
  999. }).get();
  1000. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1001. });
  1002. {/block:IndexPage}
  1003. {/block:IfLoadMoreButton}
  1004.  
  1005. // hide year if it's the current year
  1006. trimDates();
  1007.  
  1008. // fit videos and photosets
  1009. if (window.innerWidth < 961) {
  1010. fitVideos();
  1011. if (window.innerWidth < 768) {
  1012. resizePhotosets();
  1013. }
  1014. }
  1015.  
  1016. // mobile menu button
  1017. $('#menu_button').on('click', function(event){
  1018. $('body').toggleClass('menu-open');
  1019.  
  1020. if ($('body').hasClass('menu-open')) {
  1021. $('#menu_button').html('<i class="fa fa-times"></i>');
  1022. }
  1023. else {
  1024. $('#menu_button').html('<i class="fa fa-bars"></i>');
  1025. }
  1026. });
  1027. });
  1028. function fitVideos() {
  1029. // size videos to 16:9
  1030. $(".video-post-video iframe").each(function(index) {
  1031. if (!$(this).hasClass('instagram-media')) {
  1032. $(this).css('height', (parseInt($(this).css('width')) / 1.77777777) + "px");
  1033. }
  1034. });
  1035. // tumblr videos get to have their AR preserved
  1036. $(".tumblr_video_iframe").each(function(index) {
  1037. $(this).data('aspect-ratio', $(this).data('width') / $(this).data('height'));
  1038. $(this).css('height', (parseInt($(this).css('width')) / $(this).data('aspect-ratio')) + "px");
  1039. });
  1040. }
  1041. function trimDates() {
  1042. var theYear = new Date().getFullYear();
  1043. $(".year-"+theYear).css("display", "none");
  1044. }
  1045. function resizePhotosets() {
  1046. // workaround for responsive photosets on mobile safari
  1047. try {
  1048. var parentWidth = document.body.querySelector('.html_photoset').offsetWidth;
  1049. var photosets = document.body.querySelectorAll('iframe.photoset');
  1050. for(var i = 0; i < photosets.length; ++i){
  1051. var photoset = photosets[i];
  1052. photoset.width = parentWidth;
  1053. }
  1054. }
  1055. catch(e) {
  1056. console.log('no photosets');
  1057. }
  1058. }
  1059. </script>
  1060.  
  1061. {block:IfGoogleAnalyticsID}
  1062. <script>
  1063. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  1064. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  1065. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  1066. })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  1067.  
  1068. ga('create', '{text:Google Analytics ID}', 'auto');
  1069. ga('send', 'pageview');
  1070.  
  1071. </script>
  1072. {/block:IfGoogleAnalyticsID}
  1073.  
  1074. </body>
  1075. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement