Don't like ads? PRO users don't see any ads ;-)
Public Pastes

Articulant Theme

By: atonalsthemes on Jul 9th, 2012  |  syntax: None  |  size: 8.83 KB  |  hits: 1,263  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
  2. <head>
  3. <!--
  4. Articulant Theme
  5. Creator: Kelsey @ http://www.atonals.tumblr.com
  6. This text should never be deleted, nor should the credit link placed in the theme code.
  7.  
  8. credits to:
  9. http://masonry.desandro.com/docs/methods.html
  10. -->
  11.  
  12. <title>{Title}</title>
  13.  
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}
  17. <meta name="description" content="{MetaDescription}" />
  18. {/block:Description}
  19.  
  20. <meta name="color:text" content="#3c3c3c"/>
  21. <meta name="color:links" content="#000000"/>
  22. <meta name="color:link hover" content="#dddddd"/>
  23. <meta name="color:background" content="#ffffff"/>
  24.  
  25. <meta name="if:endless scroll" content="0" />
  26. <meta name="if:show captions" content="0"/>
  27.  
  28. <meta name="text:blogtitle size" content="18" />
  29. <meta name="text:text size" content="12" />
  30.  
  31. <meta name="font:body" content="baskerville" />
  32. <meta name="font:title" content="Baskerville" />
  33.  
  34. <script src="http://masonry.desandro.com/js/jquery-1.7.1.min.js"></script>
  35. <script src="http://masonry.desandro.com/jquery.masonry.min.js"></script>
  36. {block:ifendlessscroll}<script src="http://masonry.desandro.com/js/jquery.infinitescroll.min.js">
  37. </script>{/block:ifendlessscroll}
  38.  
  39.  
  40.  
  41. <style type="text/css">
  42.  
  43. iframe#tumblr_controls {
  44. top: 0% !important;
  45. right:0% !important;
  46. position: absolute !important;}
  47.  
  48. body {background: {color:background};font-family: {font:body};font-size: {text:text size}px;color: {color:Text};line-height:15px;text-align: justify;}
  49.  
  50. a:hover {color: {color:link hover};-webkit-transition-duration: .5s;}
  51. a {color: {color:Links};text-decoration: none;}
  52.  
  53. .caption {margin-top:5px;}
  54. .title {font-size:{text:blogtitle size}px; text-transform:uppercase;}
  55. .content{width:840px;margin-top:20px;margin-left:20px;{block:permalinkpage}width:500px{/block:permalinkpage}}
  56.  
  57.  
  58. .post{{block:indexpage}width:250px;{/block:indexpage}{block:permalinkpage}width:400px{/block:permalinkpage} margin:10px;font-size:{text:text size}px;position:absolute;}
  59.  
  60. ::-webkit-scrollbar-thumb:vertical { background-color:{color:Text}; height:100px; }
  61. ::-webkit-scrollbar-thumb:horizontal { background-color:{color:background}; height:10px !important; }
  62. ::-webkit-scrollbar { height:10px; width:10px; background-color:{color:background}; }
  63.  
  64. .post img {{block:indexpage}width:250px;{/block:indexpage}}
  65. .audio {background-color:#000000;width:250px;}
  66.  
  67.  
  68. .permalink {text-align:right;opacity:1;}
  69.  
  70. .notetitle {padding-left:14px;text-transform:none;padding-bottom:10px;}
  71. .notes {margin-top:-4px; margin-bottom:25px; padding-left:15px;}
  72. ol.notes li.note {padding:5px;}
  73. ol.notes {max-height: 250px;width:470px; overflow: auto;}
  74. img.avatar {display: none;}
  75.  
  76.  
  77. .blogtitle {font-size:{text:blogtitle size}px; font-family:{font:title}; margin-bottom:10px; text-transform:uppercase;line-height:15px;text-align:left;width:100px;
  78. }.header {left:860px;top:230px; position:fixed;width:150px;{block:permalinkpage}left:600px;{/block:permalinkpage}}.information {text-align:left;line-height: 10px;padding-bottom:10px;}
  79.  
  80. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
  81. #infscr-loading {opacity:0;}
  82.  
  83. .navigation{{block:ifendlessscroll}display:none;{/block:ifendlessscroll}{block:ifnotendlessscroll}text-align:left;{/block:ifnotendlessscroll}}
  84. {CustomCSS}
  85. </style>
  86.  
  87. <script>
  88. $(function(){
  89. var $container = $('.content');
  90. $container.imagesLoaded(function(){
  91. $container.masonry({
  92. itemSelector: '.post'
  93. });
  94. });
  95. $container.infinitescroll({
  96. navSelector : '.navigation',
  97. nextSelector : '.navigation a#next',
  98. itemSelector : '.post',
  99. animate:false,
  100. donetext: "No more posts to load" ,},
  101. function( newElements ) {
  102. var $newElems = $( newElements ).css({ opacity: 0 });
  103. $newElems.imagesLoaded(function(){
  104. $newElems.animate({ opacity: 1 });
  105. $container.masonry( 'appended', $newElems );
  106. });
  107. });
  108. });
  109. </script>
  110. </head>
  111. <body>
  112.  
  113. <div class="header"><div align="left"><div class="blogtitle"><a href="/">{Title}</a></div>
  114. <div class="information">{description}</div><a href="/ask">message</a><br><a href="/archive">archive</a><br>{block:HasPages}{block:Pages}<a href="{URL}">{Label}</a><br>{/block:Pages}{/block:HasPages}<a href="http://atonals.tumblr.com">theme</a>
  115.  
  116. <div class="navigation">{block:Pagination}{block:NextPage}<p id="page_nav"><a href="{NextPage}" id="next">older</a>{/block:NextPage}{block:PreviousPage}<a href="{PreviousPage}"> / newer</a></p>{/block:PreviousPage}{/block:Pagination}</div></div></div>
  117.  
  118. <div class="content">
  119. {block:Posts}
  120.  
  121. {block:Text}
  122. <div class="post">
  123. {block:Title}<div class="title">{Title}</div>{/block:Title}
  124. {Body}
  125. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
  126. {/block:IndexPage}
  127.  
  128. {block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
  129. Posted {TimeAgo} with {NoteCount} Notes
  130. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  131.  
  132. <div class="notes">
  133. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  134. {/block:PermalinkPage}
  135.  
  136. </div>
  137. {/block:Text}
  138.  
  139.  
  140. {block:Photo}
  141. <div class="post">
  142.  
  143. {block:IndexPage}
  144. <a href="{Permalink}">
  145. <img src="{PhotoURL-250}" alt="{PhotoAlt}" />
  146. {block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}{/block:IndexPage}</a>
  147.  
  148. {block:PermalinkPage}
  149. <img src="{PhotoURL-400}" alt="{PhotoAlt}" width="500"/><div class="notetitle">{block:caption}{Caption}{/block:caption}
  150. Posted {TimeAgo} with {NoteCount} Notes
  151. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  152.  
  153. <div class="notes">
  154. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  155. {/block:PermalinkPage}
  156.  
  157.  
  158. </div>
  159. {/block:Photo}
  160.  
  161.  
  162. {block:Photoset}
  163. <div class="post">
  164. {Photoset-250}
  165. {block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}
  166. {/block:IndexPage}
  167.  
  168. {block:IndexPage}<div class="permalink"><a href="{Permalink}"><br>{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>{/block:IndexPage}
  169.  
  170. {block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
  171. Posted {TimeAgo} with {NoteCount} Notes
  172. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  173.  
  174. <div class="notes">
  175. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  176. {/block:PermalinkPage}
  177. </div>
  178.  
  179. {/block:Photoset}
  180.  
  181. {block:Quote}
  182. <div class="post">
  183. {Quote}{block:Source}<br>written by <i>{Source}</i>{/block:Source}
  184. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>{/block:IndexPage}
  185. {block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
  186. Posted {TimeAgo} with {NoteCount} Notes
  187. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  188.  
  189. <div class="notes">
  190. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  191. {/block:PermalinkPage}
  192. </div>
  193. {/block:Quote}
  194.  
  195. {block:Link}
  196. <div class="post">
  197. <div class="title"><a href="{URL}">{Name}</a></div>
  198. {block:Description}{Description}{/block:Description}
  199. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
  200. {/block:IndexPage}
  201. </div>
  202. {/block:Link}
  203.  
  204. {block:Chat}
  205. <div class="post">
  206. {block:Title}<b>{Title}</b>{/block:Title}
  207. {block:Lines}{block:Label}<b>{Label}</b> "{Line}"<br>{/block:Label}{/block:Lines}
  208. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
  209. {/block:IndexPage}
  210. {block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
  211. Posted {TimeAgo} with {NoteCount} Notes
  212. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  213.  
  214. <div class="notes">
  215. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  216. {/block:PermalinkPage}
  217. </div>
  218. {/block:Chat}
  219.  
  220. {block:Video}
  221. <div class="post">
  222. {Video-250}
  223.  
  224. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}
  225. </div>{/block:Video}
  226.  
  227. {block:Audio}
  228. <div class="post">
  229. <div class="audio">
  230. {AudioPlayerBlack}</div>
  231. {Caption}
  232. {block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a>
  233. </div>{/block:IndexPage}
  234. {block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
  235. Posted {TimeAgo} with {NoteCount} Notes
  236. {block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
  237.  
  238. <div class="notes">
  239. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  240. {/block:PermalinkPage}
  241. </div>
  242. {/block:Audio}
  243.  
  244.  
  245.  
  246.  
  247. {/block:Posts}
  248.  
  249. </div>
  250. </body>
  251. </html>
create a new version of this paste RAW Paste Data