API tools faq
paste
bychloethemes

Stuck on a Puzzle Theme - By Chloe

bychloethemes
Apr 10th, 2015
380
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.72 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6. Stuck on a Puzzle Theme - bychloethemes.tumblr.com
  7. don't be a douche and delete the credit
  8. -->
  9.  
  10. <meta name="image:Background" content="" />
  11. <meta name="if:Show Description" content="0" />
  12. <meta name="if:White tumblr controls" content="1" />
  13. <meta name="if:Archive link" content="1" />
  14. <meta name="if:3 columns" content="0" />
  15. <meta name="if:Link 1" content="1" />
  16. <meta name="if:Link 2" content="1" />
  17. <meta name="if:Link 3" content="1" />
  18. <meta name="if:Post borders" content="0" />
  19. <meta name="color:Background" content="#eee" />
  20. <meta name="color:Scrollbar" content="#ccc" />
  21. <meta name="color:Border" content="#fff" />
  22. <meta name="color:Nav links" content="#000" />
  23. <meta name="color:Nav text" content="#000" />
  24. <meta name="color:Body links" content="#000" />
  25. <meta name="color:Body text" content="#000" />
  26. <meta name="color:Text highlight" content="#ccc" />
  27. <meta name="color:Post color" content="#000" />
  28. <meta name="color:Post border" content="#fff" />
  29. <meta name="font:Body" content='verdana,sans-serif'/>
  30. <meta name="text:Link 1 title" content="" />
  31. <meta name="text:URL 1" content="" />
  32. <meta name="text:Link 2 title" content="" />
  33. <meta name="text:URL 2" content="" />
  34. <meta name="text:Link 3 title" content="" />
  35. <meta name="text:URL 3" content="" />
  36.  
  37. {block:Description}
  38. <meta name="description" content="{MetaDescription}" />
  39. {/block:Description}
  40. <meta charset="utf-8">
  41. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  42. <title>{block:TagPage}{Tag} posts - {/block:TagPage} {block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
  43. <link rel="shortcut icon" href="{Favicon}">
  44. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  45. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  46. <style type="text/css">
  47. /*Basic styles*/
  48. ::-webkit-scrollbar {
  49. width: 12px;
  50. height: 4px;
  51. background: {color:border};
  52. }
  53. ::-webkit-scrollbar-thumb {
  54. background-color: {color:scrollbar};
  55. border-top:27px solid {color:border};
  56. border-bottom:27px solid {color:border};
  57. border-right:10px solid {color:border};
  58. -webkit-border-radius: 1ex;
  59. }
  60. ::-moz-selection {
  61. background: #ccc;
  62. color: #fff;
  63. }
  64. ::selection {
  65. background: #ccc;
  66. color: #fff;
  67. }
  68. {block:ifwhitetumblrcontrols}
  69. #tumblr_controls{
  70. top: 1px !important;
  71. margin: 0 0 0 0;
  72. right: 6px !important;
  73. position: fixed !important;
  74. -webkit-filter: invert(100%) ;important;
  75. }
  76. {/block:ifwhitetumblrcontrols}
  77. #top {
  78. height:27px;
  79. width:100%;
  80. top:0;
  81. background-color:{color:border};
  82. z-index:999;
  83. position:fixed;
  84. }
  85.  
  86. #left {
  87. width:27px;
  88. height:100%;
  89. background-color:{color:border};
  90. z-index:999;
  91. left:0;
  92. position:fixed;
  93. }
  94.  
  95. #bottom {
  96. height:27px;
  97. width:100%;
  98. bottom:0;
  99. background-color:{color:border};
  100. z-index:999;
  101. position:fixed;
  102. }
  103.  
  104. #right {
  105. width:17px;
  106. height:100%;
  107. right:0;
  108. background-color:{color:border};
  109. z-index:999;
  110. position:fixed;
  111. }
  112. a:link {
  113. text-decoration:none;
  114. color:{color:body links};
  115. }
  116. a:visited {
  117. text-decoration:none;
  118. color:{color:body links};
  119. }
  120. a:hover {
  121. text-decoration:underline;
  122. color:{color:body links};
  123. }
  124. body {
  125. background: {color:Background} url('{image:Background}')
  126. no-repeat center center fixed;
  127. -webkit-background-size: cover;
  128. -moz-background-size: cover;
  129. -o-background-size: cover;
  130. background-size: cover;
  131. color: {color:body text};
  132. font-size: 0.7em;
  133. text-transform: uppercase;
  134. letter-spacing: 1px;
  135. }
  136. #content {
  137. {block:Indexpage}
  138. margin-top:0px;
  139. padding-top:40px;
  140. {/block:IndexPage}
  141. width:90%;
  142. margin-left:auto;
  143. margin-right:auto;
  144. {block:PermalinkPage}
  145. width:500px;
  146. padding-top:60px;
  147. {/block:PermalinkPage}
  148. }
  149. blockquote {
  150. border-left: 1px solid black;
  151. margin: 0;
  152. padding: 2%;
  153. }
  154. blockquote2 {
  155. background: #fff;
  156. padding: 2% 4% 2% 2%;
  157. }
  158. iframe, img, embed, object, video {
  159. max-width: 100%;
  160. }
  161. img {
  162. height: auto;
  163. width: auto;
  164. }
  165.  
  166. /*Article*/
  167. article {
  168. background: {color:Post color};
  169. padding: 7px 7px 3px 7px;
  170. {block:IfNot3columns}
  171. margin:2%;
  172. width: 19%;
  173. {/block:IfNot3columns}
  174. {block:If3columns}
  175. margin:2%;
  176. width:27%;
  177. {/block:If3columns}
  178. {block:PermalinkPage}
  179. width: 500px;
  180. margin-bottom:50px;
  181. {/block:PermalinkPage}
  182. {block:IfPostBorders}
  183. outline:2px solid {color:Post border};
  184. outline-offset:5px;
  185. {/block:IfPostBorders}
  186. }
  187. article h1 {
  188. font-weight:normal;
  189. text-transform:uppercase;
  190. font-size:20px;
  191. }
  192. .chat span {
  193. float: left;
  194. margin-right: 5px;
  195. }
  196. .albumart {
  197. position:absolute;
  198. {block:IndexPage}
  199. width:60px;
  200. height:60px;
  201. {/block:IndexPage}
  202. {block:PermalinkPage}
  203. width:150px;
  204. height:150px;
  205. {/block:PermalinkPage}
  206. }
  207.  
  208. .albumart img {
  209. float:left;
  210. margin-left:5px;
  211. {block:IndexPage}
  212. width:60px;
  213. height:60px;
  214. {/block:IndexPage}
  215. {block:PermalinkPage}
  216. width:150px;
  217. height:150px;
  218. {/block:PermalinkPage}
  219. border:1px solid #fff;
  220. }
  221.  
  222. .playbox {
  223. opacity:0.6;
  224. width:27px;
  225. height:30px;
  226. overflow:hidden;
  227. position:absolute;
  228. z-index:2;
  229. {block:IndexPage}
  230. margin-left:23px;
  231. margin-top:17px;
  232. {block:IndexPage}
  233. {block:PermalinkPage}
  234. margin-left:60px;
  235. margin-top:61px;
  236. {/block:PermalinkPage}}
  237.  
  238. .audioinfo {
  239. margin-top:2px;
  240. line-height:12px;
  241. font-size:0.8em;
  242. padding-bottom:10px;
  243. text-transform:uppercase;
  244. {block:IndexPage}
  245. margin-left:75px;
  246. {block:IndexPage}
  247. {block:PermalinkPage}
  248. margin-left:163px;
  249. font-size:15px ;
  250. line-height:20px;
  251. margin-bottom:20px;
  252. {/block:PermalinkPage}
  253. }
  254. /*Metadata*/
  255. .metadata {
  256. display: inline-block;
  257. width: 100%;
  258. }
  259. .reblogged {
  260. float: right;
  261. }
  262. /*Tags and notes*/
  263. #tags, nav ul, .chat ul {
  264. list-style: none;
  265. list-style-image: none;
  266. margin: 0;
  267. padding: 0;
  268. }
  269. #tags li {
  270. float: left;
  271. margin-right: 10px;
  272. }
  273. .notes {
  274. clear: both;
  275. padding: 0;
  276. }
  277. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
  278. display:none;
  279. }
  280. #infscr-loading {
  281. display:none;
  282. }
  283. .navigation {
  284. display:none;
  285. }
  286. .copyright {
  287. position:fixed;
  288. bottom:10px;
  289. left:10px;
  290. z-index:9999;
  291. }
  292. .copyright a {
  293. color:{color:masthead links};
  294. }
  295. .permalink {
  296. margin-top:0px;
  297. padding:0px 2px 2px 2px;
  298. text-align:right;
  299. word-spacing:1px;
  300. {block:permalinkpage}
  301. opacity:0;
  302. {/block:permalinkpage}}
  303.  
  304. .permalink a{
  305. text-decoration:none;
  306. font-size:0.7em;
  307. }
  308.  
  309. .permalink a:hover{
  310. text-decoration:underline;
  311. }
  312. #buttons {
  313. display:block;
  314. text-align:center;
  315. text-transform:capitalize;
  316. position:absolute;
  317. bottom:-3px;
  318. opacity:0;
  319. width:95%;
  320. z-index:99;
  321. -webkit-transition: all 0.3s ease-in-out;
  322. -moz-transition: all 0.3s ease-in-out;
  323. -o-transition: all 0.3s ease-in-out;
  324. }
  325. #buttons a,a:link,a:visited {
  326. text-decoration:none;
  327. color:{color:body links};
  328. }
  329. #buttons li {
  330. list-style-type:none;
  331. display:inline-block;
  332. border:3px solid {color:Post color};
  333. font-size:10px;
  334. background:{color:Post color};
  335. }
  336. #buttons a:hover{
  337. text-decoration:underline;
  338. }
  339. .post:hover #buttons{
  340. opacity:1;
  341. }
  342. ol.notes {
  343. padding: 0px;
  344. margin: 25px 0px;
  345. list-style-type: none;
  346. }
  347.  
  348. ol.notes li.note {
  349. padding: 5px;
  350. text-align:center;
  351. }
  352.  
  353. ol.notes li.note img.avatar {
  354. display:none;
  355. }
  356.  
  357. ol.notes li.note span.action {
  358. font-weight: normal;
  359. }
  360.  
  361. ol.notes li.note .answer_content {
  362. font-weight: normal;
  363. }
  364.  
  365. ol.notes li.note blockquote {
  366. padding: 4px 5px;
  367. margin: 10px 0px 0px 25px;
  368. }
  369.  
  370. ol.notes li.note blockquote a {
  371. text-decoration: none;
  372. }
  373. .navlinks {
  374. position:fixed;
  375. left:-10px;
  376. top:-10px;
  377. line-height:27px;
  378. font-size:0.9em;
  379. z-index:9999;
  380. }
  381. .navlinks ul {
  382. list-style:none;
  383. }
  384. .navlinks ul li{
  385. display:inline-block;
  386. font-size: 0.8em;
  387. text-transform: uppercase;
  388. letter-spacing: 1px;
  389. margin-left:10px;
  390. }
  391. .navlinks a:link,a:visited {
  392. text-decoration:none;
  393. color:{color:nav links};
  394. }
  395. .navlinks a:hover,a:active {
  396. text-decoration:underline;
  397. color:{color:nav links};
  398. }
  399. /*Custom CSS*/
  400. {CustomCSS}
  401. </style>
  402. </head>
  403. <body>
  404. <!--Masthead-->
  405. <div id="top"></div>
  406. <div id="right"></div>
  407. <div id="bottom"></div>
  408. <div id="left"></div>
  409.  
  410. <div class="navlinks">
  411. <ul>
  412. <li><b><a href="/">{blogtitle}</a></b></li>
  413. {block:IfShowDescription}
  414. <li>/</li>
  415. <li>{description}</li>
  416. {/block:IfSHowDescription}
  417. {block:AskEnabled}
  418. <li> <a href="/ask">ask</a></li>
  419. {/block:AskEnabled}
  420. {block:SubmissionsEnabled}
  421. <li> <a href="/submit">submit</a></li>
  422. {/block:SubmissionsEnabled}
  423. {block:HasPages}
  424. {block:Pages}
  425. <li> <a href="{URL}">{Label}</a></li>
  426. {/block:Pages}
  427. {/block:HasPages}
  428. {block:Iflink1}
  429. <li> <a href="{text:URL1}">{text:Link 1 title}</a> </li>
  430. {/block:Iflink1}
  431. {block:Iflink2}
  432. <li> <a href="{text:URL2}">{text:Link 2 title}</a> </li>
  433. {/block:Iflink2}
  434. {block:Iflink3}
  435. <li> <a href="{text:URL3}">{text:Link 3 title}</a> </li>
  436. {/block:Iflink3}
  437. {block:IfArchiveLink}
  438. <li> <a href="/archive">past</a></li>
  439. {/block:IfArchiveLink}
  440. <li><a href="http://dontbrag.tumblr.com" >theme</a></li>
  441. </ul>
  442. </div>
  443. </header>
  444. <!--Content holder-->
  445. <div id="content">
  446. {block:Posts}
  447. <article class="content {select:Layout}">
  448. <!--Unique code for each post type-->
  449. {block:Text}
  450. <div class="text">
  451. {block:Title}<h1 class="title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
  452. {Body}
  453. <div class="permalink">
  454. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  455. {/block:Text}
  456.  
  457. {block:Photo}
  458. <div class="photo">
  459. <div class="post">
  460. {block:IndexPage}
  461. <a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  462. </a>
  463. <div id="buttons">
  464. <li><a href="{Permalink}">{ShortDayOfWeek}</a></li>
  465. <li><a href="{Permalink}">{NoteCount}</a></li>
  466. <li><a href="{ReblogURL}" target="_blank">reblog</a></li>
  467. </div>
  468. {/block:IndexPage}
  469. {block:PermalinkPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  470. {block:Caption}{Caption}{/block:Caption}
  471. {/block:PermalinkPage}</div>
  472. {/block:Photo}
  473.  
  474.  
  475. {block:Photoset}
  476. <div class="photoset">
  477. <div class="post">
  478. {block:IndexPage}
  479. {block:Photos}
  480. <a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" />
  481. </a>
  482. <div id="buttons">
  483. <li><a href="{Permalink}">{ShortDayOfWeek}</a></li>
  484. <li><a href="{Permalink}">{NoteCount}</a></li>
  485. <li><a href="{ReblogURL}" target="_blank">reblog</a></li>
  486. </div>
  487. {/block:Photos}
  488. {/block:IndexPage}
  489. {block:PermalinkPage}
  490. {Photoset-500}
  491. {block:Caption}{Caption}{/block:Caption}
  492. {/block:PermalinkPage}</div>
  493. {/block:Photoset}
  494.  
  495. {block:Quote}
  496. <div class="quote">
  497. <p>&ldquo;{Quote}&rdquo;</p>
  498. {block:Source}<p><cite> &mdash;{Source}</cite></p>{/block:Source}
  499. <div class="permalink">
  500. {block:IndexPage}
  501. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  502. {/block:IndexPage}
  503. {/block:Quote}
  504.  
  505. {block:Link}
  506. <div class="link">
  507. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  508. {block:PermalinkPage}
  509. {block:Description}{Description}{/block:Description}
  510. {/block:PermalinkPage}
  511. {block:IndexPage}
  512. <div class="permalink">
  513. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  514. {/block:IndexPage}
  515. {/block:Link}
  516.  
  517. {block:Chat}
  518. <div class="chat inner">
  519. <ul>
  520. {block:Lines}<li class="{Alt}"><p>{block:Label}
  521. <u>{Label}</u>{/block:Label} {Line} </p>
  522. </li>{/block:Lines}
  523. </ul>
  524. {block:IndexPage}
  525. <div class="permalink">
  526. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  527. {/block:IndexPage}
  528. {/block:Chat}
  529.  
  530. {block:Audio}
  531. <div class="audio">
  532. {block:AlbumArt}
  533. <div class="albumart">
  534. <a href="{Permalink}"><img src="{AlbumArtURL}"></a>
  535. </div>
  536. {/block:AlbumArt}
  537. {block:AudioPlayer}
  538. <div class="playbox">
  539. {AudioPlayerWhite}
  540. </div>
  541. {/block:AudioPlayer}
  542. <div class="audioinfo">
  543. Artist: <span{block:Artist} style="display:none;"
  544. {/block:Artist}>Unknown</span>
  545. {block:Artist}{Artist}{/block:Artist}</br>
  546. Title: <span{block:TrackName} style="display:none;"
  547. {/block:TrackName}>Unknown</span>
  548. {block:TrackName}{TrackName}{/block:TrackName}</br>
  549. Album: <span{block:Album} style="display:none;"
  550. {/block:Album}>Unknown</span>
  551. {block:Album}{Album}{/block:Album}{block:PlayCount}</br>
  552. Plays: {FormattedPlayCount}{/block:PlayCount}
  553. </div>
  554. {block:IndexPage}
  555. <div class="permalink">
  556. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  557. {/block:IndexPage}
  558. {/block:Audio}
  559.  
  560. {block:Video}
  561. <div class="video">
  562. <div class="video-player">
  563. {block:IfNot3columns}{Video-250}{/block:IfNot3columns}
  564. {block:If3columns}{Video-400}{/block:If3columns}
  565. </div>
  566. {block:PermalinkPage}
  567. {block:Caption}{Caption}{/block:Caption}
  568. {/block:PermalinkPage}
  569. {block:IndexPage}
  570. <div class="permalink">
  571. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  572. {/block:IndexPage}
  573. {/block:Video}
  574.  
  575. {block:Answer}
  576. <div class="answer">
  577. {lang:Asker asked 2}: {Question}</div>
  578. <div style="text-indent: 20px;">{Answer}</div>
  579. {block:IndexPage}
  580. <div class="permalink">
  581. <a href="{Permalink}">{NoteCount}</a> <a href="{ReblogURL}" target="_blank">Reblog</a></div>
  582. {/block:IndexPage}
  583. {/block:Answer}
  584. </div>
  585. <!--Post footer (tags and notes) on displayed on permalink pages-->
  586. {block:Permalink}
  587. <footer class="details">
  588. {block:HasTags}
  589. <ul id="tags">
  590. {block:Tags}<li> <a href="{TagURL}">{Tag}</a> </li>{/block:Tags}
  591. </ul>
  592. {/block:HasTags}
  593. {block:PostNotes}
  594. <div id="notes">
  595. {PostNotes}
  596. </div>
  597. {/block:PostNotes}
  598. </footer>
  599. {/block:Permalink}
  600. </article>
  601. {/block:Posts}
  602. <!--Close of article-->
  603. </div>
  604. <!--Pagination: previous/next page links-->
  605. {block:Pagination}
  606. <div class="pagination">
  607. {block:PreviousPage}<a href="{PreviousPage}">Previous page</a>{/block:PreviousPage}
  608. {block:NextPage}<a href="{NextPage}">Next page</a>{/block:NextPage}
  609. </div>
  610. {/block:Pagination}
  611. <!--Links to jQuery library, Masonry, infinite scroll and imagesLoaded-->
  612. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  613. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  614. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  615. <script src="http://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  616. <!--Code for infinite scroll and grid layout-->
  617. <script>
  618. (function() {
  619. var $tumblelog = $('#content');
  620. $tumblelog.infinitescroll({
  621. navSelector : ".pagination",
  622. nextSelector : ".pagination a:first",
  623. itemSelector : "article",
  624. bufferPx : 50,
  625. done : "",
  626. loading: {
  627. finishedMsg: "<p> </p>",
  628. img : " ",
  629. msg: null,
  630. msgText: "<p> </p>"
  631. },
  632. },
  633. function( newElements ) {
  634. var $newElems = $( newElements ).css({ opacity: 0 });
  635. $newElems.imagesLoaded(function(){
  636. $newElems.animate({ opacity: 1 });
  637. $tumblelog.masonry( 'appended', $newElems);
  638. });
  639. }
  640. );
  641. $tumblelog.imagesLoaded( function(){
  642. $tumblelog.masonry({
  643. columnWidth: function( containerWidth ) {
  644. return containerWidth / 100;
  645. }
  646. });
  647. });
  648. })();
  649. </script>
  650. <!--For users adding Google Analytics ID-->
  651. <script>
  652. var _gaq=[['_setAccount','{text:Google Analytics ID}'],['_trackPageview']];
  653. (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
  654. g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
  655. s.parentNode.insertBefore(g,s)}(document,'script'));
  656. </script>
  657. <div class="copyright"><a href="http://dontbrag.tumblr.com">&copy;
  658. </a></div>
  659. </body>
  660. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!