Advertisement
Lyend

Untitled

Oct 20th, 2012
132
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 62.28 KB | None | 0 0
  1. <html>
  2. <head>
  3. <title>{Title}{block:SearchPage} ({lang:Search results for SearchQuery}){/block:SearchPage}{block:PermalinkPage}{block:PostSummary} — {PostSummary}{/block:PostSummary}{/block:PermalinkPage}</title>
  4.  
  5. <meta charset="utf-8">
  6. <meta name="description" content="{block:IndexPage}{block:Description}{MetaDescription}{/block:Description}{/block:IndexPage}{block:PermalinkPage}{block:PostSummary}{PostSummary}{/block:PostSummary}{/block:PermalinkPage}" />
  7.  
  8. <meta name="color:Accent" content="#4EA3D0"/>
  9. <meta name="font:Body" content="'Helvetica Neue', Helvetica, Arial, sans-serif"/>
  10. <meta name="if:Two column posts" content="1"/>
  11.  
  12. <!-- Appearance option -->
  13. <meta name="if:Show bar on top" content="1"/>
  14. <meta name="if:Show blog title" content="1"/>
  15. <meta name="if:Show blog description" content="1"/>
  16. <meta name="if:Show profile photo" content="1"/>
  17. <meta name="if:Use endless scrolling" content="1"/>
  18.  
  19.  
  20. <meta name="if:Show right column" content="1"/>
  21. <meta name="if:Place timestamp in left column" content="1"/>
  22. <meta name="if:Use larger font for quotes" content="0"/>
  23. <meta name="if:Show image shadows" content="1"/>
  24. <meta name="if:Show tags" content="1"/>
  25. <meta name="if:Show post notes" content="1"/>
  26. <meta name="if:Show copyright in footer" content="1"/>
  27. <meta name="text:Google Analytics ID" content=""/>
  28. <meta name="text:Disqus comments" content=""/>
  29.  
  30. <link rel="shortcut icon" href="{Favicon}" />
  31. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
  32.  
  33. <!-- HTML5 Shiv -->
  34. <!--[if lt IE 9]>
  35. <script src="http://static.tumblr.com/hriofhd/Qj0m8pn7q/html5shiv.js"></script>
  36. <![endif]-->
  37.  
  38. <!-- Reset CSS -->
  39. <link rel="stylesheet" href="http://static.tumblr.com/thpaaos/DIcklyl4z/reset.css" type="text/css">
  40.  
  41. <!-- Theme CSS -->
  42. <style type="text/css" media="screen">
  43. body {
  44. -webkit-font-smoothing: antialiased;
  45. font-size: 15px;
  46. font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  47. line-height: 24px;
  48. margin: 0;
  49. padding: 0;
  50. }
  51.  
  52. *:active, *:focus { outline-width: 0px; }
  53. img { max-width: 100% }
  54. .post .top.media img { width: 100%; }
  55. a { text-decoration: none; color: {Color:Accent}; }
  56. a img { border-width: 0px; }
  57. strong { font-weight: bold; }
  58. em { font-style: italic; }
  59.  
  60. .group:after {
  61. visibility: hidden;
  62. display: block;
  63. content: "";
  64. clear: both;
  65. height: 0;
  66. }
  67. * html .group { zoom: 1; } /* IE6 */
  68. *:first-child+html .group { zoom: 1; } /* IE7 */
  69.  
  70. iframe#tumblr_controls {
  71. top: 12px !important;
  72. }
  73.  
  74. #color_bar {
  75. height: 12px;
  76. background: {Color:Accent};
  77. }
  78.  
  79. #container {
  80. width: 950px;
  81. margin: 0 auto;
  82. padding: 60px 20px;
  83. }
  84.  
  85. #header {
  86. height: 48px;
  87. margin: 0 0 60px 0;
  88. }
  89.  
  90. #blog_info {
  91. width: 700px;
  92. margin: 0 60px 0 0;
  93. float: left;
  94. }
  95.  
  96. #blog_info h1 {
  97. font-size: 36px;
  98. font-weight: bold;
  99. letter-spacing: -1px;
  100. line-height: 36px;
  101. margin: 8px 0 0 0;
  102. }
  103.  
  104. #blog_info h1 a {
  105. color: #333333;
  106. }
  107.  
  108. #blog_info h1 a:hover {
  109. color: #000;
  110. }
  111.  
  112. #blog_info h1 a:active {
  113. position: relative;
  114. top: 1px;
  115. }
  116.  
  117. #blog_info p, #blog_info .cont {
  118. color: #646464;
  119. margin-top: 7px;
  120. }
  121.  
  122. .cont {
  123. margin-bottom: 7px;
  124. }
  125.  
  126. #blog_avatar {
  127. width: 188px;
  128. position: relative;
  129. float: right;
  130. {block:IfNotShowBlogTitle}float: left;{/block:IfNotShowBlogTitle}
  131. }
  132.  
  133. #blog_avatar a {
  134. width: 48px;
  135. height: 48px;
  136. {block:IfShowImageShadows}
  137. -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, .21);
  138. box-shadow: 0px 1px 3px rgba(0, 0, 0, .21);
  139. {/block:IfShowImageShadows}
  140. position: absolute;
  141. top: 10px;
  142. left: 40px;
  143. display: block;
  144. }
  145.  
  146. #blog_avatar img {
  147. width: 68px;
  148. -webkit-border-radius: 2px;
  149. -moz-border-radius: 2px;
  150. border-radius: 2px;
  151. }
  152.  
  153. #blog_avatar a::before {
  154. content: " ";
  155. width: 46px;
  156. height: 46px;
  157. -webkit-border-radius: 2px;
  158. -moz-border-radius: 2px;
  159. border-radius: 2px;
  160. border: 1px solid rgba(0,0,0,.1);
  161. position: absolute;
  162. top: 0px;
  163. left: 0px;
  164. z-index: 999;
  165. display: block;
  166. }
  167. #blog_avatar:hover a {
  168. width: 64px;
  169. height: 64px;
  170. -webkit-transition: all 0.5s ease-in-out;
  171. -moz-transition: all 0.5s ease-in-out;
  172. -ms-transition: all 0.5s ease-in-out;
  173. -o-transition: all 0.5s ease-in-out;
  174. transition: all 0.5s ease-in-out;
  175.  
  176. #blog_avatar:hover a img {
  177. width: 64px;
  178. }
  179.  
  180. #blog_avatar:hover a::before {
  181. width: 62px;
  182. height: 62px;
  183. }
  184.  
  185. #blog_avatar:active a {
  186. top: -7px;
  187. -webkit-box-shadow: 0px 0px 1px rgba(0, 0, 0, .21);
  188. box-shadow: 0px 0px 1px rgba(0, 0, 0, .21);
  189. }
  190.  
  191. #posts {
  192. width: 700px;
  193. color: #4C4C4C;
  194. margin: 0 60px 0 0;
  195. float: left;
  196. }
  197.  
  198. #posts .post {
  199. list-style-type: none;
  200. border-bottom: 1px solid #E6E6E6;
  201. margin: 0 0 45px 0;
  202. padding: 0 0 45px 0;
  203. }
  204.  
  205. .top.audio * {
  206. width: 700px;
  207. height: 91px
  208. }
  209.  
  210. .top.media {
  211. line-height: 0;
  212. {block:IfShowImageShadows}
  213. -webkit-box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, .27);
  214. box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, .27);
  215. {/block:IfShowImageShadows}
  216. position: relative;
  217. display: inline-block;
  218. }
  219.  
  220. .top.media.photoset {
  221. line-height: 0;
  222. {block:IfShowImageShadows}
  223. -webkit-box-shadow: none;
  224. box-shadow: none;
  225. {/block:IfShowImageShadows}
  226. position: relative;
  227. display: inline-block;
  228. }
  229.  
  230. .media img {
  231. -webkit-border-radius: 2px;
  232. -moz-border-radius: 2px;
  233. border-radius: 2px;
  234. }
  235.  
  236. .link_post .link {
  237. color: {Color:Accent};
  238. font-size: 21px;
  239. font-weight: bold;
  240. border: 1px solid rgba({RGBcolor:Accent}, 0.13);
  241. background: rgba({RGBcolor:Accent}, 0.13);
  242. -webkit-border-radius: 2px;
  243. -moz-border-radius: 2px;
  244. border-radius: 2px;
  245. padding: 15px 53px 15px 20px;
  246. position: relative;
  247. display: block;
  248. }
  249.  
  250. .link .arrow {
  251. width: 0;
  252. height: 0;
  253. border-top: 8px solid transparent;
  254. border-bottom: 8px solid transparent;
  255. border-left: 12px solid {Color:Accent};
  256. position: absolute;
  257. top: 50%;
  258. right: 20px;
  259. margin-top: -8px;
  260. display: block;
  261. }
  262.  
  263. .link_post .link:hover {
  264. border: 1px solid rgba({RGBcolor:Accent}, 0.2);
  265. background: rgba({RGBcolor:Accent}, 0.2);
  266. }
  267.  
  268. .link_post .link:active {
  269. position: relative;
  270. top: 1px;
  271. }
  272.  
  273. #posts .post .caption_and_post_info.after_top_part {
  274. border-top: 0;
  275. margin: 30px auto auto auto;
  276. padding-top: 0;
  277. }
  278.  
  279. .post .caption {
  280. width: auto;
  281. float: none;
  282. }
  283.  
  284. {block:IfPlaceTimestampInLeftColumn}
  285. .post .caption {
  286. width: 513px;
  287. float: right;
  288. }
  289. {/block:IfPlaceTimestampInLeftColumn}
  290.  
  291. .content_source {
  292. margin-bottom: 20px;
  293. }
  294.  
  295. .content_source img {
  296. margin: 0 0 0 4px !important;
  297. opacity: 0.7;
  298. vertical-align: middle;
  299. }
  300.  
  301. .caption a, .description a {
  302. color: {Color:Accent};
  303. padding: 0 1px;
  304. }
  305.  
  306. .caption a:hover, .description a:hover {
  307. background: rgba({RGBcolor:Accent}, 0.13);
  308. }
  309.  
  310. .caption a:active, .description a:active {
  311. background: rgba({RGBcolor:Accent}, 0.2);
  312. }
  313.  
  314. .caption h2 {
  315. font-size: 32px;
  316. line-height: 33px;
  317. margin: 0 0 18px 0;
  318. }
  319.  
  320. .caption h2 a {
  321. color: #333;
  322. font-weight: bold;
  323. letter-spacing: -1px;
  324. }
  325.  
  326. .caption h2 a:hover {
  327. color: {Color:Accent};
  328. background: transparent;
  329. }
  330.  
  331. .caption blockquote {
  332. border-left: 2px solid #E6E6E6;
  333. padding: 1px 0 1px 20px;
  334. }
  335.  
  336. .caption pre {
  337. background: #eee;
  338. font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Anonymous Pro", "Courier New", monospace, serif;
  339. overflow: scroll;
  340. padding: 10px;
  341. border-radius: 3px;
  342. font-size: 13px;
  343. line-height: 19px;
  344. }
  345.  
  346. .caption p,
  347. .caption ol,
  348. .caption ul,
  349. .caption pre,
  350. .caption h1,
  351. .caption h2,
  352. .post h3,
  353. .caption h4,
  354. .caption h5,
  355. .caption blockquote,
  356. .caption img,
  357. .caption embed,
  358. .caption object {
  359. margin: 0 0 20px 0;
  360. }
  361.  
  362. .caption p:empty {
  363. display: none;
  364. }
  365.  
  366. .caption iframe {
  367. display: block !important;
  368. }
  369.  
  370. .post .caption ul,
  371. .post .caption ol {
  372. margin-left: 18px;
  373. }
  374.  
  375. .caption .question {
  376. display: block;
  377. padding: 15px;
  378. font-size: 15px;
  379. }
  380.  
  381. .caption .answer {
  382. margin-top: 20px;
  383. }
  384.  
  385. .caption .asker {
  386. line-height: 24px;
  387. margin: 25px 20px 0 23px;
  388. }
  389.  
  390. .caption .asker img {
  391. float: left;
  392. margin: 0 7px 0 0;
  393. }
  394.  
  395. .caption .asker a {
  396. margin-left: 0;
  397. }
  398.  
  399. .caption .quote {
  400. color: #333;
  401. font-weight: bold;
  402. }
  403.  
  404. .quote span {
  405. display: inline-block;
  406. }
  407.  
  408. .quote.short_text {
  409. font-size: 50px;
  410. letter-spacing: -2px;
  411. line-height: 48px;
  412. margin: 0 0 18px 0;
  413. }
  414.  
  415. .quote.short_text span {
  416. margin: 0 0 0 -22px;
  417. }
  418.  
  419. .quote.medium_text {
  420. font-size: 36px;
  421. letter-spacing: -1px;
  422. line-height: 36px;
  423. margin: 0 0 20px 0;
  424. }
  425.  
  426. .quote.medium_text span {
  427. margin: 0 0 0 -13px;
  428. }
  429.  
  430. .quote.long_text,
  431. .quote.text {
  432. font-size: 24px;
  433. line-height: 27px;
  434. margin: 0 0 20px 0;
  435. }
  436.  
  437. .quote.long_text span {
  438. margin: 0 0 0 -9px;
  439. }
  440.  
  441. .quote.larger_text {
  442. font-size: 50px !important;
  443. letter-spacing: -2px !important;
  444. line-height: 48px !important;
  445. margin: 0 0 18px 0 !important;
  446. }
  447.  
  448. .quote.larger_text span {
  449. margin: 0 0 0 -22px !important;
  450. }
  451.  
  452. .quote_source {
  453. margin: 0 0 20px 0 !important;
  454. }
  455.  
  456. .caption .conversation {
  457. margin-left: 0 !important;
  458. margin-bottom: 30px;
  459. list-style-type: none;
  460. }
  461.  
  462. .conversation .chat_line {
  463. padding: 10px 16px;
  464. }
  465.  
  466. .conversation .chat_line.user1 {
  467. background: #f5f5f5;
  468. }
  469.  
  470. .conversation .chat_line.user2 {
  471. background: #fff;
  472. }
  473.  
  474. .conversation .chat_line.user3 {
  475. background: #ddd;
  476. }
  477.  
  478. .conversation .chat_line.user4 {
  479. background: #ccc;
  480. }
  481.  
  482. .post .post_info {
  483. width: auto;
  484. font-size: 12px;
  485. font-family: 'Times New Roman', Times, serif;
  486. letter-spacing: 2px;
  487. text-transform: uppercase;
  488. list-style-type: none;
  489. -webkit-font-smoothing: subpixel-antialiased;
  490. margin: 1px 0 0 -3px;
  491. overflow: hidden;
  492. }
  493.  
  494. .post_info li {
  495. line-height: 14px;
  496. margin-bottom: 10px;
  497. float: left;
  498. }
  499.  
  500. .post_info li a {
  501. margin: 0 10px 0 0;
  502. padding: 0 2px 0 5px;
  503. }
  504.  
  505. .post_info .timestamp {
  506. color: #4c4c4c;
  507. padding: 0 2px 0 5px;
  508. display: inline-block;
  509. }
  510.  
  511. .post_info .timestamp:hover {
  512. background: rgba(0,0,0,.08);
  513. }
  514.  
  515. .post_info .timestamp:active {
  516. background: rgba(0,0,0,.1);
  517. }
  518.  
  519. .post_info .notecount {
  520. color: #4c4c4c;
  521. padding: 0 2px 0 5px;
  522. display: inline-block;
  523. }
  524.  
  525. .post_info .notecount:hover {
  526. background: rgba(0,0,0,.08);
  527. }
  528.  
  529. .post_info .notecount:active {
  530. background: rgba(0,0,0,.1);
  531. }
  532.  
  533. /* Baselines */
  534.  
  535. {block:IfPlaceTimestampInLeftColumn}
  536. .timestamp.has_caption {
  537. margin-top: 6px;
  538. }
  539.  
  540. .timestamp.has_caption.with_title {
  541. margin-top: 18px
  542. }
  543. {/block:IfPlaceTimestampInLeftColumn}
  544.  
  545. .tag {
  546. color: {Color:Accent};
  547. display: table;
  548. }
  549.  
  550. .tag span {
  551. color: #4c4c4c;
  552. display: table-cell;
  553. }
  554.  
  555. .tag:hover {
  556. background: rgba({RGBcolor:Accent}, 0.13);
  557. }
  558.  
  559. .tag:hover span {
  560. color: {Color:Accent};
  561. }
  562.  
  563. .tag:active {
  564. background: rgba({RGBcolor:Accent}, 0.2);
  565. }
  566.  
  567. .post .post_info.floating {
  568. width: 157px;
  569. float: left;
  570. }
  571.  
  572. .post .post_info.floating li {
  573. float: none;
  574. }
  575.  
  576. .post_notes {
  577. clear: both;
  578. }
  579.  
  580. ol.notes {
  581. color: #4C4C4C;
  582. font-size: 13px;
  583. text-shadow: 0px 1px 0px rgba(255,255,255,.7);
  584. text-align: left;
  585. list-style-type: none;
  586. border-top: solid 1px #E6E6E6;
  587. -webkit-font-smoothing: subpixel-antialiased !important;
  588. margin: 40px auto auto auto;
  589. }
  590.  
  591. ol.notes li.note {
  592. border-bottom: solid 1px #E6E6E6;
  593. padding: 9px 0 10px 0;
  594. }
  595.  
  596. ol.notes li.note img.avatar {
  597. width: 16px;
  598. height: 16px;
  599. border-radius: 3px;
  600. vertical-align: -4px;
  601. margin-right: 6px;
  602. }
  603.  
  604. ol.notes a {
  605. color: #4C4C4C;
  606. text-decoration: underline;
  607. }
  608.  
  609. ol.notes a:hover {
  610. color: #4C4C4C;
  611. }
  612.  
  613. ol.notes li.note blockquote {
  614. border-color: #eee;
  615. padding: 4px 10px;
  616. margin: 10px 0px 0px 25px;
  617. }
  618.  
  619. ol.notes li.note blockquote a {
  620. text-decoration: none;
  621. }
  622.  
  623. ol.notes li.note:last-child {
  624. border-width: 0px;
  625. }
  626.  
  627. #sidebar {
  628. width: 188px;
  629. color: #4c4c4c;
  630. font-size: 14px;
  631. margin: -8px 0 0 0;
  632. float: right;
  633. }
  634.  
  635. #sidebar .description {
  636. line-height: 21px;
  637. border-bottom: 1px solid #E6E6E6;
  638. margin: 3px 0 20px 0;
  639. padding: 0 0 20px 0;
  640. }
  641.  
  642. #sidebar .links {
  643. font-size: 12px;
  644. font-family: 'Times New Roman', Times, serif;
  645. letter-spacing: 2px;
  646. text-transform: uppercase;
  647. list-style-type: none;
  648. -webkit-font-smoothing: subpixel-antialiased;
  649. margin: 0 0 20px 0;
  650. line-height: 20px;
  651. }
  652.  
  653. #sidebar .links a {
  654. color: #4c4c4c;
  655. }
  656.  
  657. #sidebar .links a:hover {
  658. color: {Color:Accent};
  659. }
  660.  
  661. .links .icon {
  662. width: 12px;
  663. height: 12px;
  664. background: #383838 url('http://static.tumblr.com/thpaaos/1xRm66voi/icons_sprite.png');
  665. margin: 0 8px 0 0;
  666. display: inline-block;
  667. }
  668.  
  669. .links a:hover .icon {
  670. background-color: {Color:Accent};
  671. }
  672.  
  673. .ask .icon { background-position: 0 0; margin-bottom: -2px; }
  674. .submit .icon { background-position: 0 -12px; margin-bottom: -1px; }
  675. .rss .icon { background-position: 0 -24px; }
  676. .archive .icon { background-position: 0 -36px; }
  677.  
  678. .bubble {
  679. color: #6f6f6f;
  680. font-size: 13px;
  681. line-height: 20px;
  682. background: #f5f5f5;
  683. border: 1px solid #d5d5d5;
  684. -webkit-border-radius: 4px;
  685. -moz-border-radius: 4px;
  686. border-radius: 4px;
  687. padding: 8px 12px;
  688. position: relative;
  689. display: none;
  690. }
  691.  
  692. #twitter_container .bubble:first-child {
  693. display: block;
  694. }
  695.  
  696. .bubble .arrow {
  697. width: 0;
  698. height: 0;
  699. position: absolute;
  700. display: block;
  701. }
  702.  
  703. .bubble .arrow.fill {
  704. border-left: 8px solid transparent;
  705. border-right: 8px solid transparent;
  706. border-top: 8px solid #f5f5f5;
  707. bottom: -8px;
  708. left: 25px;
  709. }
  710.  
  711. .bubble .arrow.border {
  712. border-left: 10px solid transparent;
  713. border-right: 10px solid transparent;
  714. border-top: 10px solid #d5d5d5;
  715. bottom: -10px;
  716. left: 23px;
  717. }
  718.  
  719. .bubble:hover {
  720. background: #f2f2f2;
  721. border-color: #CFCFCF;
  722. }
  723.  
  724. .bubble:hover .arrow.fill {
  725. border-top-color: #F1F1F1;
  726. }
  727.  
  728. .bubble:hover .arrow.border {
  729. border-top-color: #d5d5d5;
  730. }
  731.  
  732. .twitter_username {
  733. max-width: 166px;
  734. color: #4c4c4c;
  735. font-size: 12px;
  736. font-family: 'Times New Roman', Times, serif;
  737. letter-spacing: 0.4em;
  738. text-transform: uppercase;
  739. text-overflow: ellipsis;
  740. -webkit-font-smoothing: subpixel-antialiased;
  741. margin: 11px 0 0 22px;
  742. overflow: hidden;
  743. display: inline-block;
  744. opacity: 1;
  745. }
  746.  
  747. .twitter_username:hover {
  748. color: {Color:Accent};
  749. }
  750.  
  751. #footer {
  752. width: 700px;
  753. color: #4C4C4C;
  754. font-size: 12px;
  755. font-family: 'Times New Roman', Times, serif;
  756. letter-spacing: 2px;
  757. text-transform: uppercase;
  758. -webkit-font-smoothing: subpixel-antialiased;
  759. }
  760.  
  761. #footer .copyright {
  762. width: 50%;
  763. float: left;
  764. }
  765.  
  766. #footer .pagination {
  767. width: 230px;
  768. text-align: right;
  769. float: right;
  770. position: relative;
  771. }
  772.  
  773. .pagination .count {
  774. float: left;
  775. }
  776.  
  777. .pagination .buttons {
  778. width: 113px;
  779. height: 30px;
  780. margin: -2px 0 0 30px;
  781. float: right;
  782. position: absolute;
  783. top: 0;
  784. right: 0;
  785. z-index: 10;
  786. }
  787.  
  788. .pagination .buttons.disabled {
  789. z-index: 9;
  790. }
  791.  
  792. .buttons a,
  793. .buttons li {
  794. width: 56px;
  795. height: 28px;
  796. line-height: 999px;
  797. text-align: center;
  798. border: 1px solid #C8C8C8;
  799. -webkit-box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 1);
  800. box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 1);
  801. background: #f1f1f1; /* Old browsers */
  802. background: -moz-linear-gradient(top, #f1f1f1 0%, #e8e8e8 100%); /* FF3.6+ */
  803. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1f1f1), color-stop(100%,#e8e8e8)); /* Chrome,Safari4+ */
  804. background: -webkit-linear-gradient(top, #f1f1f1 0%,#e8e8e8 100%); /* Chrome10+,Safari5.1+ */
  805. background: -o-linear-gradient(top, #f1f1f1 0%,#e8e8e8 100%); /* Opera 11.10+ */
  806. background: -ms-linear-gradient(top, #f1f1f1 0%,#e8e8e8 100%); /* IE10+ */
  807. background: linear-gradient(top, #f1f1f1 0%,#e8e8e8 100%); /* W3C */
  808. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#e8e8e8',GradientType=0 );/* IE6-9 */
  809. list-style-type: none;
  810. overflow: hidden;
  811. position: relative;
  812. display: block;
  813. }
  814.  
  815. .buttons.disabled li {
  816. background: #f5f5f5;
  817. }
  818.  
  819. .buttons a:active {
  820. -webkit-box-shadow: none;
  821. box-shadow: none;
  822. background: #E6E6E6;
  823. }
  824.  
  825. .buttons .arrow {
  826. width: 10px;
  827. height: 14px;
  828. position: absolute;
  829. top: 50%;
  830. display: block;
  831. background-image: url(http://static.tumblr.com/ogedyaw/xu1m8jxnf/arrow_sprite.png);
  832. }
  833.  
  834. .buttons .left {
  835. -webkit-border-top-left-radius: 2px;
  836. -webkit-border-bottom-left-radius: 2px;
  837. -moz-border-radius-topleft: 2px;
  838. -moz-border-radius-bottomleft: 2px;
  839. border-top-left-radius: 2px;
  840. border-bottom-left-radius: 2px;
  841. position: absolute;
  842. left: 0;
  843. }
  844.  
  845. .left .arrow {
  846. background-position: 0 15px;
  847. margin: -7px auto auto 20px;
  848. }
  849.  
  850. .disabled .left .arrow {
  851. background-position: 0 0;
  852. }
  853.  
  854. .buttons .right {
  855. border-left-width: 1px;
  856. -webkit-border-top-right-radius: 2px;
  857. -webkit-border-bottom-right-radius: 2px;
  858. -moz-border-radius-topright: 2px;
  859. -moz-border-radius-bottomright: 2px;
  860. border-top-right-radius: 2px;
  861. border-bottom-right-radius: 2px;
  862. position: absolute;
  863. right: 0;
  864. }
  865.  
  866. .right .arrow {
  867. background-position: 10px -71px;
  868. margin: -7px auto auto 24px;
  869. }
  870.  
  871. .disabled .right .arrow {
  872. background-position: 10px -56px;
  873. }
  874.  
  875. /* Protection for parents that have floating children */
  876. #header:after,
  877. #container:after,
  878. .caption_and_post_info:after,
  879. #footer:after
  880. .buttons:after {
  881. content: ".";
  882. display: block;
  883. height: 0;
  884. clear: both;
  885. visibility: hidden;
  886. }
  887. </style>
  888.  
  889. {block:PermalinkPage}
  890. <!-- Simplified permalink pages (Hides right column) -->
  891. <style type="text/css" media="screen">
  892. #container {
  893. width: 700px;
  894. }
  895.  
  896. #header {
  897. width: 700px;
  898. }
  899.  
  900. #blog_info {
  901. width: 513px;
  902. margin: 0;
  903. }
  904.  
  905. #blog_avatar {
  906. width: 48px;
  907. height: 48px;
  908. backround-color: red;
  909. }
  910.  
  911. #blog_avatar a {
  912. position: absolute;
  913. left: auto;
  914. right: 0;
  915. }
  916.  
  917. #blog_avatar:hover a {
  918. left: auto;
  919. right: -8px;
  920. }
  921.  
  922. #sidebar {
  923. display: none;
  924. }
  925.  
  926. #blog_info {
  927. {block:IfNotShowBlogTitle}
  928. width: 632px;
  929. margin-top: -7px;
  930. float: right;
  931. {/block:IfNotShowBlogTitle}
  932. }
  933.  
  934. #blog_info .description {
  935. margin-bottom: 60px;
  936. }
  937.  
  938. .post .post_info,
  939. .post .post_info.floating,
  940. .post .caption {
  941. width: auto !important;
  942. float: none;
  943. }
  944.  
  945. .post .post_info {
  946. margin-top: 45px;
  947. }
  948.  
  949. .post .post_info li,
  950. .post .post_info.floating li {
  951. line-height: 14px;
  952. margin-bottom: 10px;
  953. float: left;
  954. }
  955.  
  956. .post .post_info li a,
  957. .post .post_info.floating li a {
  958. margin: 0 10px 0 0;
  959. padding: 0 2px 0 5px;
  960. }
  961. </style>
  962. {block:PermalinkPage}
  963.  
  964. {block:IfNotShowRightColumn}
  965. <!-- Hides right column -->
  966. <style type="text/css" media="screen">
  967. #container {
  968. width: 700px;
  969. }
  970.  
  971. #header {
  972. width: 700px;
  973. }
  974.  
  975. #blog_info {
  976. width: 513px;
  977. margin: 0;
  978. }
  979.  
  980. #blog_avatar {
  981. width: 48px;
  982. height: 48px;
  983. backround-color: red;
  984. }
  985.  
  986. #blog_avatar a {
  987. position: absolute;
  988. left: auto;
  989. right: 0;
  990. }
  991.  
  992. #blog_avatar:hover a {
  993. left: auto;
  994. right: -8px;
  995. }
  996.  
  997. #sidebar {
  998. display: none;
  999. }
  1000.  
  1001. #blog_info {
  1002. {block:IfNotShowBlogTitle}
  1003. width: 632px;
  1004. margin-top: -7px;
  1005. float: right;
  1006. {/block:IfNotShowBlogTitle}
  1007. }
  1008.  
  1009. #blog_info .description {
  1010. margin-bottom: 60px;
  1011. }
  1012.  
  1013. .post .post_info,
  1014. .post .post_info.floating,
  1015. .post .caption {
  1016. width: auto !important;
  1017. float: none;
  1018. }
  1019.  
  1020. .post .post_info {
  1021. margin-top: 45px;
  1022. }
  1023.  
  1024. .post .post_info li,
  1025. .post .post_info.floating li {
  1026. line-height: 14px;
  1027. margin-bottom: 10px;
  1028. float: left;
  1029. }
  1030.  
  1031. .post .post_info li a,
  1032. .post .post_info.floating li a {
  1033. margin: 0 10px 0 0;
  1034. padding: 0 2px 0 5px;
  1035. }
  1036. </style>
  1037. {/block:IfNotShowRightColumn}
  1038.  
  1039. <!-- Custom CSS -->
  1040. <style type="text/css" media="screen">
  1041. {CustomCSS}
  1042. </style>
  1043.  
  1044. </head>
  1045. <body>
  1046. {block:IfShowBarOnTop}<section id="color_bar"></section>{/block:IfShowBarOnTop}
  1047.  
  1048. <section id="container" class="group">
  1049. <header id="header">
  1050. <section id="blog_info">
  1051. {block:IfShowBlogTitle}<h1><a href="/">{Title}</a></h1>{/block:IfShowBlogTitle}
  1052. {block:PermalinkPage}{block:IfShowBlogDescription}{block:Description}<div class="description cont">{Description}</div>{/block:Description}{/block:IfShowBlogDescription}{/block:PermalinkPage}
  1053. {block:IfNotShowRightColumn}{block:IfShowBlogDescription}<div class="cont description"{block:PermalinkPage} style="display:none"{/block:PermalinkPage}>{Description}</div>{/block:IfShowBlogDescription}{/block:IfNotShowRightColumn}
  1054. </section>
  1055.  
  1056. {block:IfShowProfilePhoto}
  1057. <section id="blog_avatar">
  1058. <a href="/" class="avatar"><img src="{PortraitURL-64}"></a>
  1059. </section>
  1060. {/block:IfShowProfilePhoto}
  1061. </header>
  1062.  
  1063. <aside id="sidebar">
  1064. {block:IfShowBlogDescription}{block:Description}<div class="cont description group">{Description}</div>{/block:Description}{/block:IfShowBlogDescription}
  1065.  
  1066. {block:HasPages}
  1067. <ul class="links">
  1068. {block:Pages}
  1069. <li><a href="{URL}">{Label}</a></li>
  1070. {/block:Pages}
  1071. </ul>
  1072. {/block:HasPages}
  1073.  
  1074. <ul class="links" style="display:none;{block:AskEnabled} display:block;{/block:AskEnabled}{block:SubmissionsEnabled} display:block;{/block:SubmissionsEnabled}">
  1075. {block:AskEnabled}<li><a href="/ask" class="ask"><span class="icon"></span>ask me anything</a></li>{/block:AskEnabled}
  1076. {block:SubmissionsEnabled}<li><a href="/submit" class="submit"><span class="icon"></span>submit a post</a></li>{/block:SubmissionsEnabled}
  1077. </ul>
  1078.  
  1079. <ul class="links">
  1080. <li><a href="{RSS}" class="rss"><span class="icon"></span>rss</a></li>
  1081. <li><a href="/archive" class="archive"><span class="icon"></span>archive</a></li>
  1082. </ul>
  1083.  
  1084. {block:Twitter}
  1085. <aside id="twitter_container" style="display:none"></aside>
  1086.  
  1087. <script type="text/javascript">
  1088. function recent_tweets(data) {
  1089. document.getElementById("twitter_container").innerHTML =
  1090. document.getElementById("twitter_container").innerHTML +
  1091. '<a class="bubble" href="http://twitter.com/{TwitterUsername}/status/' +
  1092. (data[0].id_str ? data[0].id_str : data[0].id) +
  1093. '">' + data[0].text +
  1094. '<span class="arrow border"></span><span class="arrow fill"></span></a>' +
  1095. '<a href="twitter.com/{TwitterUsername}" class="twitter_username">@{TwitterUsername}</a>';
  1096.  
  1097. document.getElementById("twitter_container").style.display = 'block';
  1098. }
  1099. </script>
  1100. {/block:Twitter}
  1101. </aside>
  1102.  
  1103. <ul id="posts">
  1104. <!-- START POSTS -->
  1105. {block:Posts}
  1106.  
  1107. <li class="post group" {block:IfShowPostNotes} {block:PostNotes} style="padding:0"{/block:PostNotes} {/block:IfShowPostNotes}>
  1108.  
  1109. {block:Photo}
  1110. <section class="top media" style="display:block;">
  1111. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"> {LinkCloseTag}{Question}
  1112. </section>
  1113. {/block:Photo}
  1114.  
  1115. {block:Photoset}
  1116. <section class="top media photoset">
  1117. {Photoset-700}
  1118. </section>
  1119. {/block:Photoset}
  1120.  
  1121. {block:Link}
  1122. <section class="top link_post">
  1123. <a href="{URL}" class="link">{Name}<span class="arrow"></span></a>
  1124. </section>
  1125. {/block:Link}
  1126.  
  1127. {block:Audio}
  1128. <section class="top audio">
  1129. {AudioPlayerBlack}
  1130. </section>
  1131. {/block:Audio}
  1132.  
  1133. {block:Video}
  1134. <section class="top media">
  1135. {Video-700}
  1136. </section>
  1137. {/block:Video}
  1138.  
  1139. <section class="group caption_and_post_info
  1140. {block:Photo} after_top_part isphoto{/block:Photo}
  1141. {block:Photoset} after_top_part isphoto{/block:Photoset}
  1142. {block:Link} after_top_part islink{/block:Link}
  1143. {block:Audio} after_top_part isaudio{/block:Audio}
  1144. {block:Video} after_top_part isvideo{/block:Video}
  1145. ">
  1146. {block:Text}
  1147. <section class="caption group">
  1148. {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
  1149. <div class="cont group">{Body}</div>
  1150. {block:ContentSource}
  1151. <div class="cont content_source">
  1152. <a href="{SourceURL}">
  1153. {lang:Source}:
  1154. {block:SourceLogo}
  1155. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1156. {/block:SourceLogo}
  1157. {block:NoSourceLogo}
  1158. {SourceTitle}
  1159. {/block:NoSourceLogo}
  1160. </a>
  1161. </div>
  1162. {/block:ContentSource}
  1163. </section>
  1164. {/block:Text}
  1165.  
  1166. {block:Answer}
  1167. <section class="caption group">
  1168. <div class="cont group">
  1169.  
  1170. <div class="question bubble">
  1171. {Question}
  1172. <span class="arrow border"></span>
  1173. <span class="arrow fill"></span>
  1174. </div>
  1175. <div class="asker group">
  1176. <img src="{AskerPortraitURL-24}" width="24" height="24" /> {Asker}
  1177. </div>
  1178. <div class="answer cont">{Answer}</div>
  1179. </div>
  1180. {block:ContentSource}
  1181. <div class="cont content_source">
  1182. <a href="{SourceURL}">
  1183. {lang:Source}:
  1184. {block:SourceLogo}
  1185. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1186. {/block:SourceLogo}
  1187. {block:NoSourceLogo}
  1188. {SourceTitle}
  1189. {/block:NoSourceLogo}
  1190. </a>
  1191. </div>
  1192. {/block:ContentSource}
  1193. </section>
  1194. {/block:Answer}
  1195.  
  1196. {block:Photo}
  1197. <section class="caption group">
  1198. {block:Caption}
  1199. <div class="cont">{Caption}</div>
  1200. {/block:Caption}
  1201. {block:ContentSource}
  1202. <div class="cont content_source">
  1203. <a href="{SourceURL}">
  1204. {lang:Source}:
  1205. {block:SourceLogo}
  1206. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1207. {/block:SourceLogo}
  1208. {block:NoSourceLogo}
  1209. {SourceTitle}
  1210. {/block:NoSourceLogo}
  1211. </a>
  1212. </div>
  1213. {/block:ContentSource}
  1214. </section>
  1215. {/block:Photo}
  1216.  
  1217. {block:Photoset}
  1218. <section class="caption group">
  1219. {block:Caption}
  1220. <div class="cont">{Caption}</div>
  1221. {/block:Caption}
  1222. {block:ContentSource}
  1223. <div class="cont content_source">
  1224. <a href="{SourceURL}">
  1225. {lang:Source}:
  1226. {block:SourceLogo}
  1227. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1228. {/block:SourceLogo}
  1229. {block:NoSourceLogo}
  1230. {SourceTitle}
  1231. {/block:NoSourceLogo}
  1232. </a>
  1233. </div>
  1234. {/block:ContentSource}
  1235. </section>
  1236. {/block:Photoset}
  1237.  
  1238. {block:Quote}
  1239. <section class="caption group">
  1240. <section class="quote {Length}_text {block:IfUseLargerFontForQuotes}larger_text{/block:IfUseLargerFontForQuotes}"><span>“</span>{Quote}”</section>
  1241. {block:Source}
  1242. <div class="cont quote_source">&mdash; {Source}</div>
  1243. {/block:Source}
  1244. {block:ContentSource}
  1245. <div class="cont content_source">
  1246. <a href="{SourceURL}">
  1247. {lang:Source}:
  1248. {block:SourceLogo}
  1249. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1250. {/block:SourceLogo}
  1251. {block:NoSourceLogo}
  1252. {SourceTitle}
  1253. {/block:NoSourceLogo}
  1254. </a>
  1255. </div>
  1256. {/block:ContentSource}
  1257. </section>
  1258. {/block:Quote}
  1259.  
  1260. {block:Link}
  1261. {block:Description}
  1262. <section class="caption group">
  1263. <div class="cont">{Description}</div>
  1264. {block:ContentSource}
  1265. <div class="cont content_source">
  1266. <a href="{SourceURL}">
  1267. {lang:Source}:
  1268. {block:SourceLogo}
  1269. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1270. {/block:SourceLogo}
  1271. {block:NoSourceLogo}
  1272. {SourceTitle}
  1273. {/block:NoSourceLogo}
  1274. </a>
  1275. </div>
  1276. {/block:ContentSource}
  1277. </section>
  1278. {/block:Description}
  1279. {/block:Link}
  1280.  
  1281. {block:Chat}
  1282. <section class="caption group">
  1283. {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
  1284. <ul class="conversation">
  1285. {block:Lines}
  1286. <li class="chat_line user{UserNumber}">
  1287. {block:Label}
  1288. <strong>{Label}</strong>&nbsp;&nbsp;
  1289. {/block:Label}
  1290. {Line}
  1291. </li>
  1292. {/block:Lines}
  1293. </ul>
  1294. {block:ContentSource}
  1295. <div class="cont content_source">
  1296. <a href="{SourceURL}">
  1297. {lang:Source}:
  1298. {block:SourceLogo}
  1299. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1300. {/block:SourceLogo}
  1301. {block:NoSourceLogo}
  1302. {SourceTitle}
  1303. {/block:NoSourceLogo}
  1304. </a>
  1305. </div>
  1306. {/block:ContentSource}
  1307. </section>
  1308. {/block:Chat}
  1309.  
  1310. {block:Audio}
  1311. {block:Caption}
  1312. <section class="caption group">
  1313. <div class="cont">{Caption}</div>
  1314. {block:ContentSource}
  1315. <div class="cont content_source">
  1316. <a href="{SourceURL}">
  1317. {lang:Source}:
  1318. {block:SourceLogo}
  1319. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1320. {/block:SourceLogo}
  1321. {block:NoSourceLogo}
  1322. {SourceTitle}
  1323. {/block:NoSourceLogo}
  1324. </a>
  1325. </div>
  1326. {/block:ContentSource}
  1327. </section>
  1328. {/block:Caption}
  1329. {/block:Audio}
  1330.  
  1331. {block:Video}
  1332. <section class="caption group">
  1333. {block:Caption}
  1334. <div class="cont">{Caption}</div>
  1335. {/block:Caption}
  1336. {block:ContentSource}
  1337. <div class="cont content_source">
  1338. <a href="{SourceURL}">
  1339. {lang:Source}:
  1340. {block:SourceLogo}
  1341. <img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1342. {/block:SourceLogo}
  1343. {block:NoSourceLogo}
  1344. {SourceTitle}
  1345. {/block:NoSourceLogo}
  1346. </a>
  1347. </div>
  1348. {/block:ContentSource}
  1349. </section>
  1350. {/block:Video}
  1351.  
  1352. <ul class="
  1353. post_info
  1354. {block:IfPlaceTimestampInLeftColumn}
  1355. {block:Text} floating{/block:Text}
  1356. {block:Answer} floating{/block:Answer}
  1357. {block:Photo}{block:Caption} floating{/block:Caption}{/block:Photo}
  1358. {block:Photo}{block:ContentSource} floating{/block:ContentSource}{/block:Photo}
  1359. {block:Photoset}{block:Caption} floating{/block:Caption}{/block:Photoset}
  1360. {block:Photoset}{block:ContentSource} floating{/block:ContentSource}{/block:Photoset}
  1361. {block:Quote} floating{/block:Quote}
  1362. {block:Link}{block:Description} floating{/block:Description}{/block:Link}
  1363. {block:Link}{block:ContentSource} floating{/block:ContentSource}{/block:Link}
  1364. {block:Chat} floating{/block:Chat}
  1365. {block:Audio}{block:Caption} floating{/block:Caption}{/block:Audio}
  1366. {block:Audio}{block:ContentSource} floating{/block:ContentSource}{/block:Audio}
  1367. {block:Video}{block:Caption} floating{/block:Caption}{/block:Video}
  1368. {block:Video}{block:ContentSource} floating{/block:ContentSource}{/block:Video}
  1369. {/block:IfPlaceTimestampInLeftColumn}
  1370. ">
  1371. <li><a href="{Permalink}" class="
  1372. timestamp
  1373. {block:Text}has_caption{block:Title} with_title{/block:Title}{/block:Text}
  1374. {block:Photo}{block:Caption}has_caption{/block:Caption}{/block:Photo}
  1375. {block:Photoset}{block:Caption}has_caption{/block:Caption}{/block:Photoset}
  1376.  
  1377. {block:Quote}
  1378. {block:Source}
  1379. {Length}_quote
  1380. {/block:Source}
  1381. {/block:Quote}
  1382.  
  1383. {block:Link}{block:Description}has_caption{/block:Description}{/block:Link}
  1384. {block:Chat}chat{block:Title} with_title{/block:Title}{/block:Chat}
  1385. {block:Audio}{block:Caption}has_caption{/block:Caption}{/block:Audio}
  1386. {block:Video}{block:Caption}has_caption{/block:Caption}{/block:Video}
  1387. ">{block:IndexPage}{TimeAgo}{/block:IndexPage}{block:PermalinkPage}{block:Date}{Month} {DayOfMonth}, {Year} ({12Hour}:{Minutes} {AmPm}){/block:Date}{/block:PermalinkPage}</a></li>{block:PermalinkPage}{block:HasTags}{/block:HasTags}{/block:PermalinkPage}
  1388.  
  1389. {block:IfShowPostNotes}
  1390. {block:NoteCount}
  1391. <li><a class="notecount" href="{Permalink}#notes">{NoteCount} notes</a></li>
  1392. {/block:NoteCount}
  1393. {/block:IfShowPostNotes}
  1394.  
  1395. {block:IfShowTags}
  1396. {block:Tags}
  1397. <li><a class="tag" href="{TagURL}"><span>#</span>{Tag}</a></li>
  1398. {/block:Tags}
  1399. {/block:IfShowTags}
  1400. </ul>
  1401. {block:PostNotes}
  1402. <section class="post_notes">
  1403. <a name="notes">
  1404. {PostNotes}
  1405. </a>
  1406. </section>
  1407. {/block:PostNotes}
  1408.  
  1409. </section>
  1410. </li>
  1411.  
  1412. {/block:Posts}
  1413. <!-- END POSTS -->
  1414. </ul>
  1415.  
  1416. <footer id="footer">
  1417. {block:IfShowCopyrightInFooter}
  1418. <section class="copyright">&copy; {CopyrightYears} {Title}</section>
  1419. {/block:IfShowCopyrightInFooter}
  1420. {block:Pagination}
  1421. <nav class="pagination">
  1422. <section class="buttons">
  1423. {block:PreviousPage}<a href="{PreviousPage}" class="left">{lang:Previous page}<span class="arrow"></span></a>{/block:PreviousPage}
  1424. {block:NextPage}<a href="{NextPage}" class="right">{lang:Next page}<span class="arrow"></span></a>{block:NextPage}
  1425. </section>
  1426. <section class="disabled buttons">
  1427. <li class="left"><span class="arrow"></span></li>
  1428. <li class="right"><span class="arrow"></span></li>
  1429. </section>
  1430. <section class="count">Page {CurrentPage} / {TotalPages}</section>
  1431. </nav>
  1432. {/block:Pagination}
  1433. </footer>
  1434. </section>
  1435.  
  1436. {block:IfUseEndlessScrolling}
  1437. <script type="text/javascript" src="http://assets.tumblr.com/javascript/jquery-1.7.2.min.js"></script>
  1438. <script type="text/javascript">
  1439. var Tumblelog = {};
  1440.  
  1441. // AJAX---Holy fuck...
  1442. Tumblelog.Ajax = (function(url, callbackFunction) {
  1443. this.bindFunction = function (caller, object) {
  1444. return function() {
  1445. return caller.apply(object, [object]);
  1446. };
  1447. };
  1448.  
  1449. this.stateChange = function (object) {
  1450. if (this.request.readyState==4) this.callbackFunction(this.request.responseText);
  1451. };
  1452.  
  1453. this.getRequest = function() {
  1454. if (window.ActiveXObject)
  1455. return new ActiveXObject('Microsoft.XMLHTTP');
  1456. else if (window.XMLHttpRequest)
  1457. return new XMLHttpRequest();
  1458. return false;
  1459. };
  1460.  
  1461. this.postBody = (arguments[2] || "");
  1462. this.callbackFunction=callbackFunction;
  1463. this.url=url;
  1464. this.request = this.getRequest();
  1465.  
  1466. if(this.request) {
  1467. var req = this.request;
  1468. req.onreadystatechange = this.bindFunction(this.stateChange, this);
  1469.  
  1470. if (this.postBody!=="") {
  1471. req.open("POST", url, true);
  1472. req.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
  1473. req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  1474. req.setRequestHeader('Connection', 'close');
  1475. } else {
  1476. req.open("GET", url, true);
  1477. }
  1478.  
  1479. req.send(this.postBody);
  1480. }
  1481. });
  1482.  
  1483. // Infinite Scroll
  1484. Tumblelog.Infinite = (function() {
  1485.  
  1486. var _$window = $(window);
  1487. var _$posts = $('#posts');
  1488. var _trigger_post = null;
  1489.  
  1490. var _current_page = {CurrentPage};
  1491. var _total_pages = {TotalPages};
  1492. var _url = document.location.href;
  1493. var _infinite_timeout = null;
  1494. var _is_loading = false;
  1495. var _posts_loaded = false;
  1496.  
  1497. var _Ajax = Tumblelog.Ajax;
  1498.  
  1499. function init() {
  1500. set_trigger();
  1501. enable_scroll();
  1502. }
  1503.  
  1504. function set_trigger () {
  1505. var $all_posts = _$posts.find('li.post');
  1506.  
  1507. if (!_posts_loaded) {
  1508. _posts_loaded = $all_posts.length;
  1509. }
  1510.  
  1511. if (_posts_loaded >= 4) {
  1512. _trigger_post = _$posts.find('li.post:eq(' + ($all_posts.length - 4) + ')').get(0);
  1513. } else if (_posts_loaded >= 3) {
  1514. _trigger_post = _$posts.find('li.post:eq(' + ($all_posts.length - 3) + ')').get(0);
  1515. } else {
  1516. _trigger_post = _$posts.find('li.post:last').get(0);
  1517. }
  1518. };
  1519.  
  1520. function in_viewport (el) {
  1521. if (el == null) return;
  1522. var top = el.offsetTop;
  1523. var height = el.offsetHeight;
  1524.  
  1525. while (el.offsetParent) {
  1526. el = el.offsetParent;
  1527. top += el.offsetTop;
  1528. }
  1529.  
  1530. return (top < (window.pageYOffset + window.innerHeight));
  1531. };
  1532.  
  1533. function enable_scroll() {
  1534. $('#footer .pagination').hide();
  1535. _$window.scroll(function(){
  1536. clearTimeout(_infinite_timeout);
  1537. infinite_timeout = setTimeout(infinite_scroll, 100);
  1538. });
  1539. }
  1540.  
  1541. function disable_scroll() {
  1542. clearTimeout(_infinite_timeout);
  1543. $(window).unbind('scroll');
  1544. }
  1545.  
  1546. function infinite_scroll() {
  1547. if (_is_loading) return;
  1548.  
  1549. if (in_viewport(_trigger_post)) {
  1550. load_more_posts(); // w00t
  1551. }
  1552. };
  1553.  
  1554. function load_more_posts() {
  1555. if (_is_loading) return;
  1556. _is_loading = true;
  1557.  
  1558. // Build URL
  1559. if (_url.charAt(_url.length - 1) != '/') _url += '/';
  1560. if (_current_page === 1) _url += 'page/1';
  1561. _current_page++;
  1562. _url = _url.replace('page/' + (_current_page - 1), 'page/' + _current_page);
  1563.  
  1564. // Fetch
  1565. _Ajax(_url, function(data) {
  1566. var new_posts_html = data.split('<!-- START' + ' POSTS -->')[1].split('<!-- END' + ' POSTS -->')[0];
  1567. var $new_posts = $('#posts', data);
  1568.  
  1569. // Insert posts and update counters
  1570. $('#posts').append(new_posts_html);
  1571. _posts_loaded = $new_posts.find('li.post').length;
  1572.  
  1573. if ((_posts_loaded > 0) && (_current_page < _total_pages)) {
  1574. set_trigger();
  1575. _is_loading = false;
  1576. } else {
  1577. disable_scroll();
  1578. }
  1579. });
  1580.  
  1581. // Stats
  1582. {block:IfGoogleAnalyticsID}
  1583. if (typeof window._gaq != 'undefined') {
  1584. _gaq.push(['_trackPageview', _url]);
  1585. }
  1586. {/block:IfGoogleAnalyticsID}
  1587. }
  1588.  
  1589. return {
  1590. init: init
  1591. };
  1592. });
  1593.  
  1594. $(function() {
  1595. {block:IndexPage}
  1596. if ( !($.browser.msie && (parseInt($.browser.version, 10) < 9) ) ) {
  1597. var InfiniteScroll = new Tumblelog.Infinite;
  1598. InfiniteScroll.init();
  1599. }
  1600. {/block:IndexPage}
  1601. });
  1602. </script>
  1603. {/block:IfUseEndlessScrolling}
  1604.  
  1605. {block:Twitter}
  1606. <script type="text/javascript" src="/tweets.js"></script>
  1607. {/block:Twitter}
  1608.  
  1609. {block:IfGoogleAnalyticsID}
  1610. <script type="text/javascript">
  1611. var _gaq=[['_setAccount','{text:Google Analytics ID}'],['_trackPageview']];
  1612. (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
  1613. g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
  1614. s.parentNode.insertBefore(g,s)}(document,'script'));
  1615. </script>
  1616. {/block:IfGoogleAnalyticsID}
  1617. {block:IfUseEndlessScrolling}<script type="text/javascript" src="http://assets.tumblr.com/javascript/tumblelog.js"></script>{/block:IfUseEndlessScrolling}
  1618. </body>
  1619. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement