aretter

revitalize grid

Jul 16th, 2012
11,333
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.38 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!--
  5. Revitalize (Grid) Code, Aretter
  6. -->
  7.  
  8. <meta name="color:text" content="#000">
  9. <meta name="color:links" content="#bbb">
  10. <meta name="color:links underline" content="#ddd">
  11. <meta name="color:background" content="#fcfcfc">
  12. <meta name="color:background posts" content="#f6f6f6">
  13. <meta name="color:border" content="#f0f0f0">
  14. <meta name="color:border hover" content="#e5e5e5">
  15. <meta name="color:border title" content="#e5e5e5">
  16. <meta name="color:border title two" content="#f0f0f0">
  17.  
  18. <meta name="if:show captions" content="1" />
  19. <meta name="if:show portrait photo" content="1" />
  20. <meta name="if:endless scrolling" content="1" />
  21.  
  22. <meta name="font:title" content="Baskerville" />
  23. <meta name="font:body" content="Lucida Sans" />
  24.  
  25. <meta name="text:title font size" content="13px" />
  26. <meta name="text:font size" content="8px" />
  27.  
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. <link rel="shortcut icon" href="{Favicon}">
  31. <title>{Title}</title>
  32. <link rel="shortcut icon" href="{Favicon}">
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34.  
  35. {block:Description}
  36. <meta name="description" content="{MetaDescription}" />
  37. {/block:Description}
  38.  
  39. <style type="text/css">
  40. body {margin-top:20px;
  41. font-family:{font:body};
  42. font-size:{text:font size};
  43. color:{color:text};
  44. background-color:{color:background};
  45. line-height:12px;
  46. text-align:justify;}
  47.  
  48. .tumblrAutoPager_page_info,
  49. .tumblrAutoPager_page_separator {display:none;}
  50.  
  51. a {text-decoration:none; color:{color:text};}
  52. a img {border:0px;}
  53.  
  54. #infscr-loading img {display:none;}
  55.  
  56. .text,
  57. .quote,
  58. .answer,
  59. .chat,
  60. .link{{block:IndexPage}width:250px;{/block:IndexPage}
  61. {block:PermalinkPage}width:400px;{/block:PermalinkPage}}
  62.  
  63. .wrap {{block:IndexPage}width:880px;{/block:IndexPage}
  64. {block:PermalinkPage}width:442px;{/block:PermalinkPage}
  65. height:100%;
  66. margin:auto;}
  67.  
  68. .posts {float:right;
  69. {block:IndexPage}width:880px;{/block:IndexPage}
  70. {block:PermalinkPage}width:442px;{/block:PermalinkPage}}
  71.  
  72. .post {{block:IndexPage}width:250px;{/block:IndexPage}
  73. {block:PermalinkPage}width:442px{/block:PermalinkPage}
  74. float:left;
  75. background:{color:background posts};
  76. padding:10px;
  77. border-bottom:{color:border} 2px solid;
  78. border-top:{color:border} 2px solid;
  79. border-left:{color:border} 1px solid;
  80. border-right:{color:border} 1px solid;
  81. margin: 0 20px 20px 0;
  82. position: relative;}
  83.  
  84. .postt {{block:IndexPage}width:250px;{/block:IndexPage}
  85. {block:PermalinkPage}width:442px{/block:PermalinkPage}
  86. float:left;
  87. background:{color:background posts};
  88. padding:10px;
  89. border-bottom:{color:border title} 2px solid;
  90. border-top:{color:border title} 2px solid;
  91. border-left:{color:border title two} 1px solid;
  92. border-right:{color:border title two} 1px solid;
  93. margin: 0 20px 20px 0;
  94. position: relative;}
  95.  
  96. .post:hover {border-bottom:{color:border hover} 2px solid;
  97. border-top:{color:border hover} 2px solid;
  98. border-left:{color:border} 1px solid;
  99. border-right:{color:border} 1px solid;}
  100.  
  101. .photo img {{block:IndexPage}width:250px;{/block:IndexPage}
  102. {block:PermalinkPage}width:400px{/block:PermalinkPage}
  103. margin:auto;}
  104.  
  105. .style {font-family:{font:title};
  106. font-size:{text:title font size};
  107. margin-bottom:4px;}
  108.  
  109. .style1 {color:{color:links};
  110. text-transform:capitalize;}
  111. .style1 a {color:{color:links}}
  112.  
  113. .links {margin-top:4px;}
  114. .links a {color:{color:links}; border-bottom:{color:links underline} 1px solid;
  115. margin-right:2px;}
  116.  
  117. div.video embed,
  118. div.post div.video object {{block:IndexPage}width:250px;{/block:IndexPage}
  119. {block:PermalinkPage}width:400px;{/block:PermalinkPage}
  120. margin-bottom:10px;}
  121.  
  122. #portrait {float:left;
  123. margin-top:1px;
  124. margin-right:6px;
  125. width:48px;
  126. height:48px;
  127. background-image:url({PortraitURL-48})}
  128.  
  129. .navigation {display:none;}
  130.  
  131. ol.notes {width:400px;
  132. list-style-type: none;}
  133. ol.notes li.note {margin-left:-40px;
  134. margin-bottom:2px;}
  135. ol.notes li.note img.avatar {display:none;}
  136.  
  137. .aretter {position:fixed;
  138. right:4px;
  139. bottom:2px;}
  140. .aretter a {border-bottom:dotted 0px;
  141. color:#222;}
  142.  
  143. {CustomCSS}
  144. </style>
  145. {block:IndexPage}<script type="text/javascript" src="http://static.tumblr.com/twte3d7/BH7lio0yf/jquery.js"></script>
  146. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
  147. <script type="text/javascript" charset="utf-8">
  148. var $j = jQuery.noConflict();
  149. $j(function() {
  150. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  151. $j("img").lazyload({
  152. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  153. effect: "fadeIn",
  154. });
  155. });
  156. </script>{/block:IndexPage}
  157. {block:IndexPage}
  158. <script type="text/javascript">
  159. $(window).load(function(){
  160. $("p").remove(":contains('Source:')");
  161. $("p").remove(":contains('(via')");
  162. });
  163. </script>
  164. {/block:IndexPage}
  165.  
  166. <script type='text/javascript' src='http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js'></script>
  167.  
  168. <!-- {block:IndexPage} -->
  169. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  170. {block:IfEndlessScrolling}<script src="http://static.tumblr.com/twte3d7/qNulm663d/infinite.js"></script>{/block:IfEndlessScrolling}
  171.  
  172. <script type="text/javascript">
  173. $(window).load(function () {
  174. $('.posts').masonry(),
  175. $('.masonryWrap').infinitescroll({
  176. navSelector : "div.navigation",
  177. // selector for the paged navigation (it will be hidden)
  178. nextSelector : ".navigation a#next",
  179. // selector for the NEXT link (to page 2)
  180. itemSelector : ".post",
  181. // selector for all items you'll retrieve
  182. bufferPx : 10000,
  183. extraScrollPx: 10000,
  184. loadingImg : "http://static.tumblr.com/ry7nsix/S4Klhms7s/load.gif",
  185. loadingText : "<em></em>",
  186. },
  187. // call masonry as a callback.
  188. function() { $('.posts').masonry({ appendedContent: $(this) }); }
  189. );
  190. });
  191. </script>
  192. <!-- {/block:IndexPage} -->
  193. </head>
  194.  
  195. <body>
  196.  
  197. <div class="wrap">
  198. <div class="navigation">
  199. <!--{block:Pagination}-->
  200. <!--{block:NextPage}-->
  201. <p id="page_nav">
  202. <a style="float:right" href="{NextPage}" id="next">Older</a>
  203. <!--{/block:NextPage}-->
  204. <!--{block:PreviousPage}-->
  205. <a style="float:left" href="{PreviousPage}">Newer</a>
  206. </p>
  207. <!--{/block:PreviousPage}-->
  208. <!--{/block:Pagination}-->
  209. </div>
  210.  
  211. <div class="posts">
  212. <div class="postt">{block:ifshowportraitphoto}<div style="min-height:50px;">{/block:ifshowportraitphoto}{block:ifshowportraitphoto}<div id="portrait"></div>{/block:ifshowportraitphoto}<div class="style"><a href="/">{Title}</a></div>
  213. {Description}
  214. <div class="links"><a href="/ask">Contact</a> <a href="/archive">Index</a> {block:HasPages}{block:Pages}<a href="{URL}">{Label}</a> {/block:Pages}{/block:HasPages}</div>{block:ifshowportraitphoto}</div>{/block:ifshowportraitphoto}
  215. </div>
  216.  
  217. {block:Posts}
  218.  
  219. {block:Text}<div class="post text">
  220. <div class="style">{block:Title}{Title}{/block:Title}</div>
  221. {Body}
  222. <div class="style1"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  223. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  224. </div>
  225. </div>{/block:Text}
  226.  
  227. {block:Photo}<div class="post photo">
  228. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}
  229. {block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}
  230. <img src="{block:IndexPage}{PhotoURL-HighRes}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-400}{/block:PermalinkPage}" alt="{PhotoAlt}"/>
  231. {block:IndexPage}</a>{/block:IndexPage}
  232. {block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}
  233. {block:ifshowcaptions}{Caption}{/block:ifshowcaptions}
  234. <div class="style1"><div style="margin-top:6px;"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  235. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div>
  236. </div>{/block:Photo}
  237.  
  238. {block:Photoset}<div class="post">
  239. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}
  240. {block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}
  241. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  242. {block:PermalinkPage}{Photoset-400}{/block:PermalinkPage}
  243. {block:IndexPage}</a>{/block:IndexPage}
  244. {block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}
  245. {block:ifshowcaptions}{Caption}{/block:ifshowcaptions}
  246. <div class="style1"><div style="margin-top:6px;"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  247. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div>
  248. </div>{/block:Photoset}
  249.  
  250. {block:Quote}<div class="post quote">
  251. <div class="style">{Quote}</div>
  252. - {Source}
  253. <div class="style1"><div style="margin-top:6px;"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  254. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div>
  255. </div>{/block:Quote}
  256.  
  257. {block:Link}<div class="post link">
  258. <div class="style"><a href="{URL}">{Name}</a></div>
  259. {block:Description}{Description}{/block:Description}
  260. <div class="style1"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  261. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  262. </div>
  263. </div>{/block:Link}
  264.  
  265. {block:Chat}<div class="post chat">
  266. {block:Title}{Title}{/block:Title}
  267. {block:Lines}{block:Label}<b>{Label}</b> {Line}<br>{/block:Label}{/block:Lines}
  268. <div class="style1"><div style="margin-top:6px;"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  269. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div>
  270. </div>{/block:Chat}
  271.  
  272. {block:Audio}
  273. <div class="post text">
  274. <div style="border:1px #bbb solid; width:207px;">{AudioPlayerGrey}</div>
  275. {Caption}
  276. <div class="style1"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  277. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  278. </div>
  279. </div>
  280. {/block:Audio}
  281.  
  282. {block:Answer}<div class="post answer">
  283. <div class="style">{Asker}: {Question}</div>
  284. {Answer}
  285. <div class="style1"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  286. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  287. </div>
  288. </div>
  289. {/block:Answer}
  290.  
  291. {block:Video}<div class="post text">
  292. <div class="video">
  293. {block:IndexPage}{Video-250}{/block:IndexPage}
  294. {block:PermalinkPage}{Video-400}{/block:PermalinkPage}
  295. <div class="style1"><a href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} {Month} {Year}</a>
  296. {block:HasTags}<br>{lang:Tags}: {block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}
  297. </div>
  298. </div>
  299. </div>{/block:Video}
  300.  
  301. {block:PermalinkPage}{/block:PermalinkPage}
  302.  
  303. {block:PostNotes}
  304. <div class="postt">
  305. <u>{NoteCountWithLabel}</u><br>
  306. {PostNotes}
  307. </div>
  308. {/block:PostNotes}
  309.  
  310. {/block:Posts}
  311.  
  312. {block:IndexPage}{block:IfNotEndlessScrolling}<div class="postt">{block:Pagination}<div style="float:left; margin-top:-5px;">{block:PreviousPage}<a href="{PreviousPage}">&larr; Previous</a>{/block:PreviousPage}</div>
  313. <div style="float:right; margin-top:-5px;">{block:NextPage}<a href="{NextPage}">Next &rarr;</a>{/block:NextPage}</div>{/block:Pagination}</div>
  314. </div>{/block:IfNotEndlessScrolling}{/block:IndexPage}
  315.  
  316. </div>
  317.  
  318. <div class="aretter"><a href="http://arreter.tumblr.com">theme</a></div>
  319.  
  320. </body>
  321. </html>
Advertisement
Add Comment
Please, Sign In to add comment