bychloethemes

Florantia Theme - by Chloe

Aug 4th, 2015
1,047
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 23.49 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3. <!--
  4. _ _ _
  5. | |__ _ _ ___| |__ | | ___ ___
  6. | '_ \| | | | / __| '_ \| |/ _ \ / _ \
  7. | |_) | |_| | | (__| | | | | (_) | __/
  8. |_.__/ \__, | \___|_| |_|_|\___/ \___|
  9. |___/
  10.  
  11. Florantia Theme by Chloe | @dontbrag | @bychloethemes
  12. Do not delete the credit. Do not claim as your own. Do not copy any ideas or code. Do not redistribute.
  13.  
  14. For html help go to @htmlqueens
  15.  
  16. -->
  17. <meta name="image:Background" content="http://static.tumblr.com/b879f6f077133de33d3aa4b0f01ab261/yxfeliq/9K0nsiqdp/tumblr_static_bt8btiyybpk40wkk8kso0gock.png" />
  18. <meta name="image:Left Sidebar" content="" />
  19. <meta name="image:Right Sidebar" content="" />
  20.  
  21. <meta name="color:Background" content="#fff" />
  22. <meta name="color:Scrollbar" content="#000" />
  23. <meta name="color:Scrollbar Background" content="#99b686" />
  24. <meta name="color:Blog Border" content="#99b686" />
  25. <meta name="color:Sidebar Text" content="#000" />
  26. <meta name="color:Sidebar Links" content="#000" />
  27. <meta name="color:Sidebar Backgrounds" content="#fff" />
  28. <meta name="color:Sidebar Borders" content="#666" />
  29. <meta name="color:Text" content="#000" />
  30. <meta name="color:Links" content="#666" />
  31. <meta name="color:Post Backgrounds" content="#fff" />
  32. <meta name="color:Post Borders" content="#666" />
  33. <meta name="color:Post Accent" content="#eee" />
  34.  
  35. <meta name="if:Tiled Background" content="1"/>
  36. <meta name="if:Pagination" content="0" />
  37. <meta name="if:Sign Off Asks" content="" />
  38.  
  39. <meta name="text:Sidebar Height" content="250px" />
  40. <meta name="text:Subtitle" content="~" />
  41. <meta name="text:Link 1" content="" />
  42. <meta name="text:URL 1" content="" />
  43. <meta name="text:Link 2" content="" />
  44. <meta name="text:URL 2" content="" />
  45. <meta name="text:Link 3" content="" />
  46. <meta name="text:URL 3" content="" />
  47. <meta name="text:Ask Sign Off" content="your name xx" />
  48.  
  49. {block:Description}
  50. <meta name="description" content="{MetaDescription}" />
  51. {/block:Description}
  52. <meta charset="utf-8">
  53. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  54. <title>{block:TagPage}{Tag} posts | {/block:TagPage} {block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  55. <title>{text:Tab Title}</title>
  56. <link rel="shortcut icon" href="{Favicon}">
  57. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  58. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  59. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  60. <link href='//fonts.googleapis.com/css?family=Raleway:400,600' rel='stylesheet' type='text/css'>
  61. <link href='//fonts.googleapis.com/css?family=Nothing+You+Could+Do' rel='stylesheet' type='text/css'>
  62. <style type="text/css">
  63. ::-webkit-scrollbar {
  64. background-color: {color:Scrollbar Background};
  65. height: 5px;
  66. width: 5px;
  67. }
  68. ::-webkit-scrollbar-thumb {
  69. background-color: {color:Scrollbar};
  70. width: 5px;
  71. height: 5px;
  72. }
  73. #tumblr_controls {
  74. right:12px!important;
  75. top:12px!important;
  76. position:fixed!important;
  77. margin: 0 0 0 0!important;
  78. }
  79. body {
  80. background: {color:Background} url('{image:Background}'){block:IfNotTiledBackground}
  81. no-repeat center center fixed;
  82. -webkit-background-size: cover;
  83. -moz-background-size: cover;
  84. -o-background-size: cover;
  85. background-size: cover;
  86. {/block:IfNotTiledBackground}
  87. {block:IfTiledBackground}
  88. repeat fixed;
  89. {/block:IfTiledBackground}
  90. color: {color:Text};
  91. font-family: 'Raleway', sans-serif;
  92. font-size: 12px;
  93. margin: 0;
  94. padding: 0;
  95. }
  96. iframe, img, embed, object, video {
  97. max-width: 100%;
  98. }
  99. img {
  100. height: auto;
  101. width: auto;
  102. vertical-align:middle;
  103. }
  104. blockquote {
  105. border-left:1px solid {color:Post Borders};
  106. margin:0 0 0 15px;
  107. padding:0 0 0 5px;
  108. }
  109. a:link, a:visited {
  110. color:{color:Links};
  111. text-decoration:none;
  112. }
  113. a:hover, a:active {
  114. text-decoration:line-through;
  115. }
  116. a:focus {
  117. outline:none;
  118. }
  119. b, strong {
  120. font-weight:600;
  121. }
  122. hr {
  123. height:1px;
  124. background:{color:Post Borders};
  125. border:0;
  126. }
  127. h1 {
  128. font-weight:400;
  129. }
  130. cite {
  131. margin-top:3px;
  132. display:block;
  133. text-align:right;
  134. }
  135. #topping {
  136. position:fixed;
  137. z-index:999999999;
  138. width:100%;
  139. height:10px;
  140. left:0px;
  141. top:0px;
  142. }
  143. #lefting {
  144. position:fixed;
  145. z-index:999999999;
  146. width:10px;
  147. height:100%;
  148. left:0px;
  149. top:0px;
  150. }
  151. #righting {
  152. position:fixed;
  153. z-index:999999999;
  154. width:10px;
  155. height:100%;
  156. right:0px;
  157. top:0px;
  158. }
  159. #botting {
  160. position:fixed;
  161. z-index:999999999;
  162. width:100%;
  163. height:10px;
  164. left:0px;
  165. bottom:0px;
  166. }
  167. #botting, #righting, #lefting, #topping {
  168. background:{color:Blog Border};
  169. }
  170. .credit {
  171. width:14px;
  172. height:13px;
  173. color: {color:Post Borders};
  174. position:fixed;
  175. bottom: 15px;
  176. right: 15px;
  177. line-height: 14px;
  178. font-size:12px;
  179. text-transform: uppercase;
  180. padding:3px 4px;
  181. overflow: hidden;
  182. z-index:999999999999999999;
  183. text-align:left;
  184. -webkit-transition: all 0.5s ease-in-out;
  185. -moz-transition: all 0.5s ease-in-out;
  186. -o-transition: all 0.5s ease-in-out;
  187. transition: all 0.5s ease-in-out;
  188. }
  189. .fa-diamond {
  190. right:4px;
  191. position:absolute;
  192. }
  193. .credit:hover {
  194. width:126px;
  195. background:#000;
  196. color:#fff;
  197. -webkit-transition: all 0.5s ease-in-out;
  198. -moz-transition: all 0.5s ease-in-out;
  199. -o-transition: all 0.5s ease-in-out;
  200. transition: all 0.5s ease-in-out;
  201. }
  202. .credit a {
  203. color:#fff;
  204. text-decoration: none;
  205. }
  206. .credit .mine {
  207. opacity:0;
  208. visibility:hidden;
  209. }
  210. .credit:hover .mine {
  211. opacity: 1;
  212. visibility: visible;
  213. -webkit-transition: all 0.5s ease-in-out 0.5s;
  214. -moz-transition: all 0.5s ease-in-out 0.5s;
  215. -o-transition: all 0.5s ease-in-out 0.5s;
  216. transition: all 0.5s ease-in-out 0.5s;
  217. }
  218. .sidebar {
  219. width:150px;
  220. border:1px solid {color:Sidebar Borders};
  221. height:{text:Sidebar Height};
  222. background:{color:Sidebar Backgrounds};
  223. position:fixed;
  224. top:100px;
  225. padding:10px;
  226. box-shadow:3px 3px rgba(200,200,200,0.5);
  227. z-index:9;
  228. color:{color:Sidebar Text};
  229. }
  230. .sidebar h1 {
  231. margin:0;
  232. text-align:center;
  233. }
  234. .sidebar img {
  235. padding:5px;
  236. border:1px dashed {color:Sidebar Borders};
  237. width:140px;
  238. }
  239. .sidebar a {
  240. color:{color:Sidebar Links};
  241. }
  242. .left-sidebar {
  243. left:80px;
  244. }
  245. .right-sidebar {
  246. right:80px;
  247. }
  248. ul.navlinks {
  249. padding:0;
  250. list-style-type:none;
  251. text-align:center;
  252. margin:0;
  253. }
  254. ul.navlinks li {
  255. display:inline-block;
  256. margin:0;
  257. }
  258. ul.navlinks li:after {
  259. content:' · ';
  260. margin:0 3px;
  261. }
  262. ul.navlinks li:first-child:before {
  263. content:' · ';
  264. margin:0 3px;
  265. }
  266. .pagination {
  267. margin:0 auto;
  268. width:150px;
  269. position:absolute;
  270. bottom:-30px;
  271. text-align:center;
  272. }
  273. .pagination a {
  274. background:{color:Sidebar Backgrounds};
  275. border:1px solid {color:Sidebar Borders};
  276. box-shadow:3px 3px rgba(200,200,200,0.5);
  277. padding:3px;
  278. }
  279. .content {
  280. {block:IndexPage}
  281. width:664px;
  282. {/block:IndexPage}
  283. {block:PermalinkPage}
  284. width:542px;
  285. {/block:PermalinkPage}
  286. margin:20px auto 0 auto;
  287. }
  288. article {
  289. {block:IndexPage}
  290. width:250px;
  291. margin:30px;
  292. padding:10px;
  293. {/block:IndexPage}
  294. {block:PermalinkPage}
  295. width:500px;
  296. margin:20px 0;
  297. padding:20px;
  298. {/block:PermalinkPage}
  299. background:{color:Post Backgrounds};
  300. border:1px solid {color:Post Borders};
  301. box-shadow:3px 3px rgba(200,200,200,0.5);
  302. }
  303. article h1 {
  304. margin:0;
  305. }
  306. article p {
  307. margin:3px 0;
  308. }
  309. article ul {
  310. padding:0;
  311. margin-left:30px;
  312. }
  313. .photoset {
  314. margin-bottom:-1px;
  315. }
  316. .short h1 {
  317. font-size:2em;
  318. }
  319. .medium h1 {
  320. font-size:1.5em;
  321. }
  322. .long h1 {
  323. font-size:1em;
  324. }
  325. ul.chat-list {
  326. list-style-type:none;
  327. padding:0;
  328. margin:0;
  329. }
  330. ul.chat-list li {
  331. margin:3px 0;
  332. padding:3px 0;
  333. }
  334. ul.chat-list li.even {
  335. background:{color:Post Accent};
  336. }
  337. span.label {
  338. font-weight:bold;
  339. }
  340. .album-art img {
  341. {block:IndexPage}
  342. width:70px;
  343. height:70px;
  344. {/block:IndexPage}
  345. {block:PermalinkPage}
  346. height:500px;
  347. width:500px;
  348. text-align:center;
  349. {/block:PermalinkPage}
  350. }
  351. .audio-info {
  352. position:absolute;
  353. left:88px;
  354. top:10px;
  355. line-height:16px;
  356. min-height:70px;
  357. border-left:1px solid {color:Post Borders};
  358. padding-left:5px;
  359. }
  360. .tumblr_audio_player {
  361. {block:IndexPage}
  362. height: 30px;
  363. width: 30px;
  364. position: absolute;
  365. top: 30px;
  366. left: 30px;
  367. border-radius: 50%;
  368. opacity: 0.8;
  369. {/block:IndexPage}
  370. {block:PermalinkPage}
  371. width:500px;
  372. height:40px;
  373. {/block:PermalinkPage}
  374. }
  375. .asks, .asks2 {
  376. margin-bottom:10px;
  377. }
  378. .asks {
  379. float:left;
  380. margin-right:15px;
  381. }
  382. .asks2 {
  383. float:right;
  384. margin-left:15px;
  385. }
  386. .question, .question2 {
  387. margin-bottom:10px;
  388. background:{color:Post Accent};
  389. padding:4px;
  390. {block:PermalinkPage}
  391. line-height:18px;
  392. {/block:PermalinkPage}
  393. }
  394. .question {
  395. {block:IndexPage}
  396. margin-left:55px;
  397. {/block:IndexPage}
  398. {block:PermalinkPage}
  399. margin-left:83px;
  400. {/block:PermalinkPage}
  401. }
  402. .question:before {
  403. content:"";
  404. width: 0;
  405. height: 0;
  406. border-style: solid;
  407. z-index:7;
  408. border-color: transparent {color:Post Accent} transparent transparent;
  409. position:absolute;
  410. {block:IndexPage}
  411. border-width: 4px 10px 4px 0px;
  412. left:55px;
  413. {/block:IndexPage}
  414. {block:PermalinkPage}
  415. border-width: 7px 11px 7px 0px;
  416. left:92px;
  417. {/block:PermalinkPage}
  418. }
  419. .question2 {
  420. {block:IndexPage}
  421. margin-right:55px;
  422. {/block:IndexPage}
  423. {block:PermalinkPage}
  424. margin-right:83px;
  425. {/block:PermalinkPage}
  426. }
  427. .question2:before {
  428. content:"";
  429. width: 0;
  430. height: 0;
  431. border-style: solid;
  432. z-index:7;
  433. border-color: transparent transparent transparent {color:Post Accent};
  434. position:absolute;
  435. {block:IndexPage}
  436. border-width: 4px 0px 4px 10px;
  437. right:55px;
  438. {/block:IndexPage}
  439. {block:PermalinkPage}
  440. border-width: 7px 0px 7px 11px;
  441. right:92px;
  442. {/block:PermalinkPage}
  443. }
  444. .question2 p {
  445. display:inline;
  446. margin:0;
  447. }
  448. #signature {
  449. font-size: 1.4em;
  450. font-family: 'Nothing You Could Do', cursive;
  451. text-align: right;
  452. }
  453. ul.permas {
  454. padding:0;
  455. list-style-type:none;
  456. margin:0;
  457. text-align:center;
  458. height:0;
  459. overflow:hidden;
  460. font-size:10px;
  461. -webkit-transition: all 0.4s ease-in-out;
  462. -moz-transition: all 0.4s ease-in-out;
  463. -o-transition: all 0.4s ease-in-out;
  464. transition: all 0.4s ease-in-out;
  465. }
  466. ul.permas li {
  467. display:inline-block;
  468. }
  469. article:hover ul.permas {
  470. height:14px;
  471. margin-top:10px;
  472. -webkit-transition: all 0.4s ease-in-out;
  473. -moz-transition: all 0.4s ease-in-out;
  474. -o-transition: all 0.4s ease-in-out;
  475. transition: all 0.4s ease-in-out;
  476. }
  477. ol.notes {
  478. list-style-type: none;
  479. margin:0 5px 0 0;
  480. padding:0;
  481. }
  482.  
  483. ol.notes li.note {
  484. padding:0;
  485. text-align:left;
  486. line-height:16px;
  487. width:100%;
  488. border:0;
  489. border-radius:0;
  490. background:transparent;
  491. border-bottom:1px solid {color:Post Borders};
  492. padding-bottom:8px;
  493. padding-top:8px;
  494. }
  495. ol.notes li.note:last-child {
  496. border-bottom:0;
  497. }
  498. ol.notes li.note img.avatar {
  499. display:none;
  500. }
  501.  
  502. ol.notes li.note span.action {
  503. font-weight: normal;
  504. }
  505.  
  506. ol.notes li.note .answer_content {
  507. font-weight: normal;
  508. }
  509. #infscr-loading {
  510. position:absolute;
  511. bottom:-10px;
  512. width:200px;
  513. margin-left:50%;
  514. left:-100px;
  515. text-align:center;
  516. color:{color:Post Borders};
  517. }
  518. #infscr-loading img{
  519. display:none;
  520. }
  521. </style>
  522. </head>
  523. <body>
  524. <div id="topping"></div>
  525. <div id="lefting"></div>
  526. <div id="righting"></div>
  527. <div id="botting"></div>
  528. <div class="left-sidebar sidebar">
  529. <h1><a href="/">{Title}</a></h1>
  530. {block:IfLeftSidebarImage}
  531. <p><img src="{image:Left Sidebar}"></p>
  532. {/block:IfLeftSidebarImage}
  533. {block:Description}<p>{Description}</p>{/block:Description}
  534. {block:Pagination}
  535. <div class="pagination" {block:IfNotPagination}style="visibility:hidden;"{/block:IfNotPagination}>
  536. {block:PreviousPage}<a href="{PreviousPage}">previous</a>{/block:PreviousPage}
  537. </div>
  538. {/block:Pagination}
  539. </div>
  540. <div class="right-sidebar sidebar">
  541. <h1>{text:Subtitle}</h1>
  542. {block:IfRightSidebarImage}
  543. <p><img src="{image:Right Sidebar}"></p>
  544. {/block:IfRightSidebarImage}
  545. <ul class="navlinks">
  546. <li><a href="/">home</a></li>
  547. {block:AskEnabled}
  548. <li><a href="/ask">ask</a></li>
  549. {/block:AskEnabled}
  550. {block:SubmissionsEnabled}
  551. <li><a href="/submit">submit</a></li>
  552. {/block:SubmissionsEnabled}
  553. {block:HasPages}
  554. <br>&nbsp;&middot;&nbsp;
  555. {block:Pages}
  556. <li><a href="{URL}">{Label}</a></li>
  557. {/block:Pages}
  558. <br>
  559. {/block:HasPages}
  560. {block:IfLink1}
  561. <br>&nbsp;&middot;&nbsp;
  562. <li><a href="{text:URL 1}">{text:Link 1}</a></li>
  563. {/block:IfLink1}
  564. {block:IfLink2}
  565. <li><a href="{text:URL 2}">{text:Link 2}</a></li>
  566. {/block:IfLink2}
  567. {block:IfLink3}
  568. <li><a href="{text:URL 3}" >{text:Link 3}</a></li>
  569. {/block:IfLink3}
  570. <br>&nbsp;&middot;&nbsp;
  571. <li><a href="/archive">archive</a></li>
  572. <li><a href="http://dontbrag.tumblr.com" target="_blank">theme</a></li>
  573. </ul>{block:Pagination}
  574. <div class="pagination" {block:IfNotPagination}style="visibility:hidden;"{/block:IfNotPagination}>
  575. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  576. </div>
  577. {/block:Pagination}
  578. </div>
  579. <div class="content">
  580. {block:Posts}
  581. {block:PermalinkPagination}
  582. <article>
  583. <center>Posted on {DayOfWeek} the {DayOfMonth}{DayOfMonthSuffix} of {Month}, {Year} at {12Hour}:{Minutes}{AmPm} with {NoteCountWithLabel}.</center>
  584. </article>
  585. {/block:PermalinkPagination}
  586. <article>
  587. {block:Text}
  588. <div class="text">
  589. {block:Title}<h1>{Title}</h1>{block:Title}
  590. <p>{Body}</p>
  591. </div>
  592. {/block:Text}
  593.  
  594. {block:Photo}
  595. <div class="photo">
  596. <div class="make_lightbox" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
  597. </div>
  598. {/block:Photo}
  599.  
  600. {block:Photoset}
  601. <div class="photoset">
  602. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  603. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  604. </div>
  605. {/block:Photoset}
  606.  
  607. {block:Quote}
  608. <div class="quote {Length}">
  609. <h1>&ldquo;{Quote}&rdquo;</h1>
  610. {block:IndexPage}
  611. {block:Source}<cite>-&nbsp;{Source}</cite>{/block:Source}
  612. {/block:IndexPage}
  613. </div>
  614. {/block:Quote}
  615.  
  616. {block:Link}
  617. <div class="link">
  618. <h1>&#8627;<a href="{URL}" {Target}>{Name}</a></h1>
  619. {block:IndexPage}
  620. {block:Description}<p>{Description}</p>{/block:Description}
  621. {/block:IndexPage}
  622. </div>
  623. {/block:Link}
  624.  
  625. {block:Chat}
  626. <div class="chat">
  627. {block:Title}<h1>{Title}</h1>{/block:Title}
  628. <ul class="chat-list">
  629. {block:Lines}
  630. <li class="{Alt}">
  631. {block:Label}<span class="label">{Label}</span>{/block:Label}
  632. {Line}</li>
  633. {/block:Lines}
  634. </ul>
  635. </div>
  636. {/block:Chat}
  637.  
  638. {block:Audio}
  639. <div class="audio">
  640. {block:AlbumArt}
  641. <div class="album-art">
  642. <img src="{AlbumArtURL}">
  643. </div>
  644. {/block:AlbumArt}
  645. {block:IndexPage}
  646. <div class="audio-info" {block:AudioEmbed}style="display:none;"{/block:AudioEmbed}>
  647. Artist: <span {block:Artist}style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  648. Title: <span {block:TrackName}style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  649. Album: <span {block:Album}style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}<br>
  650. Plays: {FormattedPlayCount}</div>
  651. {block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}
  652. {/block:IndexPage}
  653. {block:PermalinkPage}
  654. {block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}
  655. {/block:PermalinkPage}
  656. {block:IndexPage}
  657. {block:AudioEmbed}{AudioEmbed-250}{/block:AudioEmbed}
  658. {/block:IndexPage}
  659. {block:PermalinkPage}
  660. {block:AudioEmbed}{AudioEmbed-500}{/block:AudioEmbed}
  661. {/block:PermalinkPage}
  662. </div>
  663. {/block:Audio}
  664.  
  665. {block:Video}
  666. <div class="video">
  667. {block:IndexPage}{Video-250}{/block:IndexPage}
  668. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  669. </div>
  670. {block:Video}
  671.  
  672. {block:Answer}
  673. <div class="answer">
  674. <img class="asks" src="{block:IndexPage}{AskerPortraitURL-40}{/block:IndexPage}{block:PermalinkPage}{AskerPortraitURL-64}{/block:PermalinkPage}">
  675. <div class="question">{lang:Asker asked 2}: {Question}</div>
  676. <hr style="visibility:hidden;width:100%;margin:0;">
  677. {block:Answerer}
  678. <img class="asks2" src="{block:IndexPage}{AnswererPortraitURL-40}{/block:IndexPage}{block:PermalinkPage}{AnswererPortraitURL-64}{/block:PermalinkPage}">
  679. <div class="question2">{Answerer} replied: {Answer}</div>
  680. <hr style="visibility:hidden;width:100%;">
  681. {/block:Answerer}
  682. {Replies}
  683. {block:IfSignOffAsks}
  684. <div id="signature" {block:Answerer}style="display:none;"{/block:Answerer}>-{text:Ask Sign Off}</div>
  685. {/block:IfSignOffAsks}
  686. </div>
  687. {/block:Answer}
  688.  
  689. {block:IndexPage}
  690. <ul class="permas">
  691. <li><a href="{Permalink}">{NoteCount}</a></li>
  692. <li>&middot;</li>
  693. <li><a href="{ReblogURL}">Reblog</a></li>
  694. {block:RebloggedFrom}<li>&middot;</li>
  695. <li><a href="{ReblogParentURL}">Via</a></li>
  696. {/block:RebloggedFrom}
  697. {block:ContentSource}<li>&middot;</li>
  698. <li><a href="{SourceURL}">Source</a></li>
  699. {/block:ContentSource}
  700. </ul>
  701. {/block:IndexPage}
  702. </article>
  703. {block:PermalinkPage}
  704. {block:Photo}{block:Caption}<article>{Caption}</article>{/block:Caption}{/block:Photo}
  705.  
  706. {block:Photoset}{block:Caption}<article>{Caption}</article>{/block:Caption}{/block:Photoset}
  707.  
  708. {block:Quote}{block:Source}<article><cite style="font-style:normal;"> &mdash;&nbsp;{Source}</cite></article>{/block:Source}{/block:Quote}
  709.  
  710. {block:Link}{block:Description}<article>{Description}</article>{/block:Description}{/block:Link}
  711.  
  712. {block:Audio}
  713. <article>
  714. Artist: <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br>
  715. Title: <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br>
  716. Album: <span{block:Album} style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br>
  717. Plays: {FormattedPlayCount}{/block:PlayCount}</article>
  718. {block:Caption}<article>{Caption}</article>{/block:Caption}
  719. {/block:Audio}
  720.  
  721. {block:Video}{block:Caption}<article>{Caption}</article>{/block:Caption}{/block:Video}
  722.  
  723. {block:HasTags}
  724. <article id="tags">
  725. filed under: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}
  726. </article>{/block:HasTags}
  727. {block:PostNotes}
  728. <article id="notes" class="postnotes">
  729. {PostNotes}
  730. </article>
  731. {/block:PostNotes}
  732. {/block:PermalinkPage}
  733. {/block:Posts}
  734. </div>
  735. <!--Links to jQuery library, Masonry, infinite scroll and imagesLoaded-->
  736. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  737. <script type="text/javascript">
  738.  
  739. $(function(){ // shorthand document.ready()
  740. $('.make_lightbox').each(function(){ // this is just an element I let them click, it carries a series of data- attributes.
  741. $(this).on('click',function(){ // when clicked. this is the newer jQuery click() handler that's only in v1.8+ so that may be something to note.
  742. var lbArray = []; // create blank array.
  743. var arrayContents = {"width":$(this).data('width'), "height":$(this).data('height'), "low_res":$(this).data("lowres"), "high_res":$(this).data('highres')}; // make set of the data- attributes.
  744. lbArray.push(arrayContents); // push the set into the array.
  745. Tumblr.Lightbox.init(lbArray,1); // trigger Tumblr lightbox. the '1' is the number of photos it expects. specific to how tumblr has things set up.
  746. $('body').toggleClass('tumblr_lightbox_active'); // use this to prevent the user from scrolling.
  747. });
  748. });
  749. });
  750. </script>
  751. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  752. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  753. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  754. <!--Code for infinite scroll and grid layout-->
  755. <script>
  756. (function() {
  757. var $tumblelog = $('.content');
  758.  
  759. $tumblelog.imagesLoaded( function(){
  760. $tumblelog.masonry({
  761. columnWidth: function( containerWidth ) {
  762. return containerWidth / 100;
  763. }
  764. });
  765. });
  766. {block:IfNotPagination}
  767. $tumblelog.infinitescroll({
  768. navSelector : ".pagination",
  769. nextSelector : ".pagination a:last",
  770. itemSelector : "article",
  771. bufferPx : 50,
  772. done : "",
  773. loading: {
  774. finishedMsg: "<p>You've reached the end of the Earth.</p>",
  775. img : "",
  776. msg: null,
  777. msgText: "<p><i class='fa fa-spinner fa-pulse fa-3x'></i></p>"
  778. },
  779. },
  780. function( newElements ) {
  781. var $newElems = $( newElements ).css({ opacity: 0 });
  782. $newElems.imagesLoaded(function(){
  783. $newElems.animate({ opacity: 1 });
  784. $tumblelog.masonry( 'appended', $newElems);
  785. });
  786. $(function(){ // shorthand document.ready()
  787. $('.make_lightbox').each(function(){ // this is just an element I let them click, it carries a series of data- attributes.
  788. $(this).on('click',function(){ // when clicked. this is the newer jQuery click() handler that's only in v1.8+ so that may be something to note.
  789. var lbArray = []; // create blank array.
  790. var arrayContents = {"width":$(this).data('width'), "height":$(this).data('height'), "low_res":$(this).data("lowres"), "high_res":$(this).data('highres')}; // make set of the data- attributes.
  791. lbArray.push(arrayContents); // push the set into the array.
  792. Tumblr.Lightbox.init(lbArray,1); // trigger Tumblr lightbox. the '1' is the number of photos it expects. specific to how tumblr has things set up.
  793. $('body').toggleClass('tumblr_lightbox_active'); // use this to prevent the user from scrolling.
  794. });
  795. });
  796. });
  797.  
  798. }
  799. );
  800. {/block:IfNotPagination}
  801. })();
  802. </script>
  803. <div class="credit">
  804. <i class="fa fa-diamond"></i>&nbsp;<a class="mine" target="_blank" href="http://dontbrag.tumblr.com">ByChloeThemes</a>
  805. </div>
  806. </body>
  807. </html>
Advertisement
Add Comment
Please, Sign In to add comment