Advertisement
sunrisen

fawn theme v2

Jan 27th, 2013
5,063
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.84 KB | None | 0 0
  1. <!--
  2.  
  3. FAWN THEME V2 - RELEASED 27.01.13
  4. ----------------------------------------
  5. CREATED BY SUNRISEN - THEME BLOG: SUNRISENTHEMES
  6. ----------------------------------------
  7. THIS THEME AND ALL OTHER THEMES BY SUNRISEN
  8. ARE USED SUBJECT TO THE AGREEMENT OF THE TERMS
  9. FOR MORE INFORMATION, VISIT
  10. HTTP://THEMES.SUNRISEN.CO/TERMS
  11.  
  12. -->
  13. <html lang="en">
  14. <head>
  15.  
  16. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  17.  
  18. <html xmlns="http://www.w3.org/1999/xhtml">
  19. <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# blog: http://ogp.me/ns/blog#">
  20. <script type="text/javascript"
  21. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  22.  
  23. <title>{Title}</title>
  24.  
  25. <link rel="shortcut icon" href="{Favicon}">
  26.  
  27. <meta name="font:sidebar" content=""/>
  28. <meta name="font:links" content="courier new"/>
  29. <meta name="font:posts" content=""/>
  30.  
  31. <meta name="color:background" content="#ffffff"/>
  32. <meta name="color:text" content="#000000"/>
  33. <meta name="color:link" content-"#000000"/>
  34. <meta name="color:hover" content="#ffffff"/>
  35. <meta name="color:post border hover" content="#aaa"/>
  36.  
  37. <meta name="if:title font" content="1"/>
  38. <meta name="if:three columns" content="0"/>
  39. <meta name="if:image fade" content="1"/>
  40. <meta name="if:fixed header" content="0"/>
  41. <meta name="if:transparent header" content="1"/>
  42.  
  43. <meta name="text:link one" content=""/>
  44. <meta name="text:link one title" content=""/>
  45. <meta name="text:link two" content=""/>
  46. <meta name="text:link two title" content=""/>
  47. <meta name="text:link three" content=""/>
  48. <meta name="text:link three title" content=""/>
  49. <meta name="text:link four" content=""/>
  50. <meta name="text:link four title" content=""/>
  51.  
  52. <style type="text/css">
  53.  
  54. ::-webkit-scrollbar-thumb:vertical{
  55. background-color:#C2C8CF;
  56. -moz-border-radius:10px;
  57. -webkit-border-radius:10px;
  58. }
  59.  
  60. #tumblr_controls{
  61. position:fixed !important;
  62. }
  63.  
  64. .wrapper{
  65. width:1000px;
  66. margin:0px auto;
  67. }
  68.  
  69. ::-webkit-scrollbar {width: 6px; height: 4px; background: #d8d8d8; }
  70. ::-webkit-scrollbar-thumb { background-color: #130C11;}
  71.  
  72. body{
  73. margin:0px;
  74. background-attachment: fixed;
  75. background-repeat: repeat;
  76. background-color:{color:background};
  77. background-attachment: fixed;
  78. background-repeat: repeat;
  79. font-size: 11px;
  80. font-family: courier;
  81. line-height:11px;
  82. color: {color:text};
  83. }
  84.  
  85. a:link, a:active, a:visited{
  86. color: {color:link};
  87. text-decoration: none;
  88. -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;
  89. }
  90.  
  91. a:hover{
  92. color: {color:hover};
  93. -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;
  94. }
  95.  
  96. .entry {
  97. margin:8px;
  98. padding: 10px;
  99. float:left;
  100. background-color:transparent;
  101. {block:indexpage}
  102. width:230px;
  103. {/block:indexpage}
  104. {block:permalinkpage}
  105. width:600px;
  106. {/block:permalinkpage}
  107. background:transparent;
  108. padding-bottom: 7px;
  109. font-family:{font:posts};
  110. font-size: 10px;
  111. line-height:14px;
  112. border:1px solid {color:background};
  113. -webkit-transition-duration:.6s;
  114. }
  115.  
  116. .entry:hover{{block:indexpage}border:1px solid {color:post border hover};{/block:indexpage}-webkit-transition-duration:.6s;}
  117.  
  118. .perma {position:absolute; text-decoration:none; margin-top:-10px; margin-left:32px;padding-top:4px;padding-bottom:4px; background:{color:background}; opacity:0; -webkit-transition: 0.3s ease-in;z-index:10;font-family:{font:posts};color:{color:text};width:44px;text-align:center;}
  119. .perma a {text-decoration:none;text-transform:uppercase;}
  120. .entry:hover .perma {-webkit-transition: 0.3s ease-in; position:absolute; margin-top:0px; opacity:.9;}
  121. .entry:hover .perma:hover{opacity:1;padding-top:15px;border-bottom-left-radius:6px;border-bottom-right-radius:6px;}
  122.  
  123. .perma2 {position:absolute; text-decoration:none; margin-top:-10px; margin-left:76px; padding:4px; background:{color:background}; opacity:0; -webkit-transition: 0.3s ease-in;z-index:10;font-family:{font:posts};color:{color:link};width:auto;text-align:center;}
  124. .perma2 a {text-decoration:none;text-transform:uppercase;}
  125. .entry:hover .perma2 {-webkit-transition: 0.3s ease-in; position:absolute; margin-top:0px; opacity:.9;}
  126. .entry:hover .perma2:hover{opacity:1;padding-top:15px;border-bottom-left-radius:6px;border-bottom-right-radius:6px;}
  127.  
  128. .perma3 {position:absolute; text-decoration:none; margin-top:-10px; margin-left:0px;padding-top:4px;padding-bottom:4px; background:{color:background}; opacity:0; -webkit-transition: 0.3s ease-in;z-index:10;font-family:{font:posts};color:{color:link};width:32px;text-align:center;}
  129. .perma3 a {text-decoration:none;text-transform:uppercase;}
  130. .entry:hover .perma3 {-webkit-transition: 0.3s ease-in; position:absolute; margin-top:0px; opacity:.9;}
  131. .entry:hover .perma3:hover{opacity:1;padding-top:15px;border-bottom-left-radius:6px;border-bottom-right-radius:6px;}
  132.  
  133. .perm {
  134. margin:0px;
  135. text-align:center;
  136. padding:0px;
  137. padding-bottom:5px;
  138. opacity:0;
  139. font-family:{font:posts};
  140. -moz-transition: all 0.6s ease-out;
  141. -o-transition: all 0.6s ease-out;
  142. -webkit-transition: all 0.6s ease-out;
  143. transition: all 0.6s ease-out;
  144. }
  145.  
  146. .entry:hover .perm{
  147. opacity: 1;
  148. }
  149.  
  150. #sidebar{
  151. opacity:1;
  152. {block:iftransparentheader}
  153. background:transparent;
  154. {/block:iftransparentheader}
  155. {block:ifnottransparentheader}
  156. background:{color:background};
  157. {/block:ifnottransparentheader}
  158. margin-top: 0px;
  159. margin-left: 100px;
  160. overflow:hidden;
  161. font-family:{font:sidebar};
  162. text-transform:uppercase;
  163. font-size: 10px;
  164. padding-top:0px;
  165. width: 100%;
  166. margin-left:200px;
  167. text-align:center;
  168. padding: 0px;
  169. padding-top:4px;
  170. padding-bottom:4px;
  171. height:auto;
  172. z-index:100;
  173. {block:iffixedheader}
  174. position:fixed;
  175. {/block:iffixedheader}
  176. {block:ifnotfixedheader}
  177. position:relative;
  178. {/block:ifnotfixedheader}
  179. margin:auto;
  180. }
  181.  
  182. #posts {
  183. {block:ifthreecolumns}
  184. width: 810px;
  185. margin-left:100px;
  186. {/block:ifthreecolumns}
  187. {block:ifnotthreecolumns}
  188. width:1080px;
  189. margin-left:-35px;
  190. {/block:ifnotthreecolumns}
  191. background: transparent;
  192. padding-left: 2px;
  193. padding-right: 2px;
  194. {block:iffixedheader}
  195. padding-top:120px;
  196. {/block:iffixedheader}
  197. {block:ifnotfixedheader}
  198. padding-top:10px;
  199. {/block:ifnotfixedheader}
  200. margin-top:0px;
  201. float:left;
  202. }
  203.  
  204. .img{{block:ifimagefade}opacity:0.7;background-color:white;{/block:ifimagefade}-webkit-transition: all .6s ease-out;-moz-transition: all .6s ease-out;transition: all .6s ease-out;}
  205.  
  206. .img:hover{opacity:1;}
  207.  
  208. #infscr-loading{
  209. bottom: -70px;
  210. position: absolute;
  211. left: 50%;
  212. margin-left:-8px;
  213. width:16px;
  214. height:11px;
  215. overflow:hidden;
  216. margin-bottom: 50px;
  217. }
  218.  
  219. .title{
  220. font-family:{font:sidebar};
  221. font-size: 13px;
  222. line-height:15px;
  223. color: ;
  224. text-transform:uppercase;
  225. font-weight: ;
  226. }
  227.  
  228. blockquote{
  229. padding:0px 0px 2px 5px;
  230. margin:0px 0px 2px 10px;
  231. border-left: 1px dotted #555555;
  232. }
  233.  
  234. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  235. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  236. .user_7 .label, .user_8 .label, .user_9 .label {color:#130C11;}
  237. .notes img{width:10px; position:relative; top:3px;}
  238.  
  239. .blogtitle{
  240. {block:iftitlefont}
  241. font-family:permanent marker;
  242. {/block:iftitlefont}
  243. {block:ifnottitlefont}
  244. font-family: courier new;
  245. {/block:ifnottitlefont}
  246. font-size:35px;
  247. text-transform:uppercase;
  248. color: {color:link};
  249. line-height: 40px;
  250. }
  251.  
  252. .nav{font-family:{font:links};font-size:10px;text-transform:uppercase;text-align:center;float:center;background{color:background};padding:5px;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
  253. .nav:hover{background:#000;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
  254. .nav:hover a:hover{color:#ffffff;-webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;}
  255.  
  256. </style>
  257. <style>
  258. .my-like {text-align:left;
  259. float:left
  260. display:inline-block;
  261. cursor:pointer;-webkit-transition-duration:0.95s;
  262. }
  263. .my-like:hover {
  264. color:red;
  265. cursor:pointer;
  266. }
  267. .my-liked{color:#a30100;}
  268. </style>
  269. <script>
  270. window.onload = function () {
  271. document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>' );
  272. document.addEventListener( 'click', function ( event ) {
  273. var myLike = event.target;
  274. if( myLike.className.indexOf( 'my-like' ) > -1 ) {
  275. var frame = document.getElementById( 'my-like-frame' ),
  276. liked = ( myLike.className == 'my-liked' ),
  277. command = liked ? 'unlike' : 'like',
  278. reblog = myLike.getAttribute( 'data-reblog' ),
  279. id = myLike.getAttribute( 'data-id' ),
  280. oauth = reblog.slice( -8 );
  281. frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id;
  282. liked ? myLike.className = 'my-like' : myLike.className = 'my-liked';
  283. };
  284. }, false );
  285. };
  286. </script>
  287. <link href='http://fonts.googleapis.com/css?family=Permanent+Marker' rel='stylesheet' type='text/css'>
  288. {block:IndexPage}
  289. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  290. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  291.  
  292. <script type="text/javascript">
  293. $(window).load(function () {
  294. var $content = $('#posts');
  295. $content.masonry({itemSelector: '.entry'}),
  296. $content.infinitescroll({
  297. navSelector : 'div#pagination',
  298. nextSelector : 'div#pagination a#nextPage',
  299. itemSelector : '.entry',
  300. loading: {
  301. finishedMsg: '',
  302. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  303. },
  304. bufferPx : 600,
  305. debug : false,
  306. },
  307. // call masonry as a callback.
  308. function( newElements ) {
  309. var $newElems = $( newElements );
  310. $newElems.hide();
  311. // ensure that images load before adding to masonry layout
  312. $newElems.imagesLoaded(function(){
  313. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  314. });
  315. });
  316. });
  317. </script>
  318.  
  319. {/block:IndexPage}
  320.  
  321. <meta name="viewport" content="width=800" />
  322.  
  323. </head>
  324. <body>
  325.  
  326. <div id="sidebar">
  327. <div class="blogtitle"><a href="/">{Title}</a></div><br>
  328. <a href="/" class="nav">home</a> <a href="/ask" class="nav">message</a> {block:iflinkonetitle}<a href="{text:link one}" class="nav">{text:link one title}</a>{/block:iflinkonetitle} {block:iflinktwotitle}<a href="{text:link two}" class="nav">{text:link two title}</a>{/block:iflinktwotitle} {block:iflinkthreetitle}<a href="{text:link three}" class="nav">{text:link three title}</a>{/block:iflinkthreetitle} {block:iflinkfourtitle}<a href="{text:link four}" class="nav">{text:link four title}</a>{/block:iflinkfourtitle} <a href="http://sunrisen.tumblr.com" class="nav">theme</a><br><br>
  329. {description}
  330. </div></div>
  331. <div class="wrapper">
  332. <div id="posts">
  333.  
  334. {block:Posts}
  335. <div class="entry">
  336.  
  337. {block:Text}
  338. {block:IndexPage}
  339. {/block:IndexPage}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="entrytext">{Body}</span>
  340. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  341. {/block:Text}
  342.  
  343. {block:Link}
  344. {block:IndexPage}
  345. {/block:IndexPage}<a href="{URL}" class="title">{Name}</a>
  346. {block:Description}{Description}{/block:Description}
  347. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  348. {block:Link}
  349.  
  350. {block:Photo}
  351. {block:IndexPage}
  352. <div class="perma"><a href="{reblogurl}" target="_blank">REBLOG</a></div>
  353. <div class="perma2"><a href="{permalink}">{notecountwithlabel}</a></div>
  354. <div class="perma3"><div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like">LIKE</div></div>
  355. {/block:IndexPage}
  356. {block:IndexPage}{LinkOpenTag}<div class="img"><div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="230"/></a></div></div>{LinkCloseTag}{/block:IndexPage}
  357. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="600px"/></a>{LinkCloseTag}{/block:PermalinkPage}
  358. {/block:Photo}
  359.  
  360.  
  361. {block:Photoset}
  362. <center>
  363. {block:IndexPage}
  364. {Photoset-205}
  365. {block:IndexPage}
  366. {/block:IndexPage}
  367. </center>
  368. <center>{block:PermalinkPage}{Photoset-410}{/block:PermalinkPage}</center>
  369. {/block:Photoset}
  370.  
  371. {block:Quote}
  372. {block:IndexPage}
  373. {/block:IndexPage}
  374. {Quote}</span>
  375. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  376. {/block:Quote}
  377.  
  378. {block:Chat}
  379. {block:IndexPage}
  380. {/block:IndexPage}
  381. {block:Title}<span class="title">{Title}</span>{/block:Title}
  382. <ul class="chat">
  383. {block:Lines}
  384. <li class="user_{UserNumber}">
  385. {block:Label}
  386. <span class="label">{Label}</span>
  387. {/block:Label}
  388.  
  389. {Line}
  390. </li>
  391. {/block:Lines}
  392. </ul>
  393. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  394. {/block:Chat}
  395.  
  396. {block:Audio}
  397. {block:IndexPage}
  398. {/block:IndexPage}
  399. <center><div style="width:230px; height:28px;overflow-y:auto;"><div style="float:left">{AudioPlayerBlack}</div><div style="margin-top:10px; float:right;">
  400. {block:ExternalAudio}{/block:ExternalAudio}</div></div></center>
  401. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  402. {/block:Audio}
  403.  
  404. {block:Video}
  405. {block:IndexPage}
  406. {/block:IndexPage}
  407. <center>
  408. {block:IndexPage}
  409. {Video-250}
  410. {/block:IndexPage}
  411. </center>
  412. <center>{block:PermalinkPage}{Video-500}{/block:PermalinkPage}</center>
  413. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a> / <a href="{ReblogURL}">REBLOG</a></div>{/block:IndexPage}
  414. {block:Video}
  415.  
  416. {block:Answer}
  417. {block:IndexPage}
  418. {/block:IndexPage}
  419. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  420. <b>{Asker}</b>: <b>{Question}</b>{Answer}
  421. {block:IndexPage}<div class="perm"><a href="{Permalink}">{NoteCount}</a></div>{/block:IndexPage}
  422. {/block:Answer}
  423.  
  424.  
  425. {block:PermalinkPage}
  426. {block:Date}
  427. <center>
  428. {TimeAgo} | {12HourWithZero}:{Minutes}{AmPm}
  429. <br>{block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}{/block:hasTags}</center>
  430. {/block:Date}
  431.  
  432. {/block:PermalinkPage}
  433.  
  434. {block:PostNotes}{PostNotes}
  435. {/block:PostNotes}
  436. </div>
  437.  
  438.  
  439. {/block:Posts}
  440. </div>
  441. </div>
  442. <div class="right">
  443. </div>
  444. <div class="footer">
  445. <br>
  446. </div>
  447. </div>
  448. </body>
  449. </html>
  450. <div style="position:fixed;right:0px;bottom:-425px;">
  451. <---DONT REMOVE---->
  452. {block:IndexPage}
  453. {block:Pagination}
  454. <div id="pagination">
  455. {block:NextPage}
  456. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  457. {/block:NextPage}
  458. {block:PreviousPage}
  459. <a href="{PreviousPage}">&larr;&nbsp;</a>
  460. {/block:PreviousPage}
  461. </div>
  462. {/block:Pagination}
  463. {/block:IndexPage}</div></div>
  464. </body>
  465. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement