Advertisement
sunrisen

hawaii theme

Mar 5th, 2013
6,627
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.29 KB | None | 0 0
  1. <!--
  2.  
  3. HAWAII THEME - RELEASED 05.03.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. <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
  23. <title>{Title}</title>
  24.  
  25. <link rel="shortcut icon" href="{Favicon}">
  26.  
  27. <meta name="color:background" content="#ffffff"/>
  28. <meta name="color:text" content="#000000"/>
  29. <meta name="color:link" content="#000000"/>
  30. <meta name="color:hover" content="#ffffff"/>
  31. <meta name="color:blogtitle" content="#000"/>
  32.  
  33. <meta name="font:body" content="helvetica"/>
  34.  
  35. <meta name="image:header" content=""/>
  36.  
  37. <meta name="if:show header image" content="0"/>
  38. <meta name="if:show captions" content="0"/>
  39. <meta name="if:image fade" content="1"/>
  40. <meta name="if:animated post entry" content="1"/>
  41.  
  42. <meta name="text:link one" content=""/>
  43. <meta name="text:link one title" content=""/>
  44. <meta name="text:link two" content=""/>
  45. <meta name="text:link two title" content=""/>
  46. <meta name="text:link three" content=""/>
  47. <meta name="text:link three title" content=""/>
  48. <meta name="text:link four" content=""/>
  49. <meta name="text:link four title" content=""/>
  50. <meta name="text:link five" content=""/>
  51. <meta name="text:link five title" content=""/>
  52.  
  53. <style type="text/css">
  54.  
  55. ::-webkit-scrollbar-thumb:vertical{
  56. background-color:#C2C8CF;
  57. -moz-border-radius:10px;
  58. -webkit-border-radius:10px;
  59. }
  60.  
  61. #tumblr_controls{
  62. position:fixed !important;
  63. }
  64.  
  65. .wrapper{{block:indexpage}width:940px;{/block:indexpage}{block:permalinkpage}width:550px;{/block:permalinkpage}margin:0px auto;}
  66.  
  67. ::-webkit-scrollbar {width: 6px; height: 4px; background: #d8d8d8; }
  68. ::-webkit-scrollbar-thumb { background-color: #130C11;}
  69.  
  70. body{
  71. margin:0px;
  72. background-attachment: fixed;
  73. background-repeat: repeat;
  74. background-color:{color:background};
  75. background-attachment: fixed;
  76. background-repeat: repeat;
  77. font-size: 11px;
  78. font-family: helvetica;
  79. line-height:10px;
  80. color: {color:text};
  81. }
  82.  
  83. a:link, a:active, a:visited{
  84. color: {color:link};
  85. text-decoration: none;
  86. -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;
  87. }
  88.  
  89. a:hover{
  90. color: {color:hover};
  91. -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;
  92. }
  93.  
  94. .entry {
  95. margin:20px;
  96. padding: 10px;
  97. float:left;
  98. background-color:transparent;
  99. {block:IndexPage}
  100. width:250px;
  101. {/block:IndexPage}
  102. {block:PermalinkPage}
  103. width:550px;
  104. {/block:PermalinkPage}
  105. padding-bottom: 7px;
  106. font-family:{font:body};
  107. font-size: 10px;
  108. line-height:14px;
  109. overflow:hidden;
  110. {block:ifanimatedpostentry}
  111. -webkit-transition-duration:2s;
  112. {/block:ifanimatedpostentry}
  113. }
  114.  
  115. #sidebar{
  116. opacity:1;
  117. background-color:{color:background};
  118. margin-top: 20px;
  119. margin-left: 20px;
  120. overflow:hidden;
  121. font-family:{font:body};
  122. font-size: 13px;
  123. padding-top:0px;
  124. width: 100%;
  125. padding: 0px;
  126. height:auto;
  127. z-index:1;
  128. margin:0px auto;
  129. padding-bottom:4px;
  130. padding-top:4px;
  131. position:fixed;
  132. text-align:center;
  133. }
  134.  
  135. #posts {
  136. width: 100%;
  137. background: transparent;
  138. margin-left:320px;
  139. padding-left: 2px;
  140. padding-right: 2px;
  141. padding-top:20px;
  142. margin-top:0px;
  143. float:left;
  144. margin:0px auto;
  145. }
  146.  
  147. #infscr-loading{
  148. bottom: -70px;
  149. position: absolute;
  150. left: 50%;
  151. margin-left:-8px;
  152. width:16px;
  153. height:11px;
  154. overflow:hidden;
  155. margin-bottom: 50px;
  156. }
  157.  
  158. .img{{block:ifimagefade}opacity:.8;{/block:ifimagefade}-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  159. }
  160.  
  161. .img:hover{opacity:1;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  162.  
  163. .title{
  164. font-family:{font:body};
  165. font-size: 12px;
  166. line-height:15px;
  167. text-transform:uppercase;
  168. }
  169.  
  170. blockquote{
  171. padding:0px 0px 2px 5px;
  172. margin:0px 0px 2px 10px;
  173. border-left: 1px dotted #555555;
  174. }
  175.  
  176. .navi{
  177. font-family:{font:body};
  178. font-size:18px;
  179. line-height:30px;
  180. text-transform:uppercase;
  181. }
  182.  
  183. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  184. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  185. .user_7 .label, .user_8 .label, .user_9 .label {color:#130C11;}
  186. .notes img{width:10px; position:relative; top:3px;}
  187. .notes{font-size:9px;text-transform:uppercase;}
  188.  
  189. .blogtitle{
  190. font-family: 'lobster';
  191. font-size:30px;
  192. color: {color:blogtitle};
  193. line-height: 30px;
  194. -webkit-transition: all 0.2s ease-out;-moz-transition: all 0.2s ease-out;transition: all 0.2s ease-out;
  195. }
  196.  
  197. .perm{margin-top:-10px;font-family:{font:body};font-size:10px;text-transform:uppercase;text-align:center;opacity:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3 ease-in-out;}
  198.  
  199. .entry:hover .perm{margin-top:5px;opacity:1;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
  200.  
  201. .perms{margin-top:0px;padding-top:10px;font-family:{font:body};font-size:10px;text-transform:uppercase;text-align:center;opacity:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3 ease-in-out;margin-bottom:-10px;}
  202.  
  203. .entry:hover .perms{margin-top:3px;padding-top:0px;opacity:1;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
  204.  
  205. .captionperm{text-align:left;float:right;font-family:{font:body};font-size:10px;text-transform:uppercase;opacity:.5;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3 ease-in-out;}
  206. .captionperm a{color:black;}
  207. .entry:hover .captionperm:hover{opacity:1;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;transition: all 0.3 ease-in-out;}
  208.  
  209. .perma {position:absolute; text-decoration:none; margin-top:1px; margin-left:1px; padding:7px; background:none;opacity:0; -webkit-transition: 0.4s ease-in;z-index:10;font-family:{font:body};width:auto;text-align:center;{block:ifshowcaptions}visibility:hidden;{/block:ifshowcaptions}color:white;}
  210. .perma a {text-decoration:none;text-transform:uppercase;color:white;}
  211. .perma a:hover{text-shadow:0px 0px 20px #000; color:black;}
  212. .entry:hover .perma {-webkit-transition: 0.3s ease-in; position:absolute; padding:7px; opacity:1;}
  213. .entry:hover .perma:hover{opacity:1;z-index:100;border:0px;}
  214.  
  215. {CustomCSS}
  216. </style>
  217. <script type="text/javascript">
  218. $(document).ready(function(){ //hide the all of the element with class msg_body
  219. $(".msg_body").hide(); //toggle the component with class msg_body
  220. $(".msg_head").click(function()
  221. {
  222. $(this).next(".msg_body").slideToggle();
  223. });});
  224. </script>
  225. {block:IndexPage}
  226. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  227. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  228.  
  229. <script type="text/javascript">
  230. $(window).load(function () {
  231. var $content = $('#posts');
  232. $content.masonry({itemSelector: '.entry'}),
  233. $content.infinitescroll({
  234. navSelector : 'div#pagination',
  235. nextSelector : 'div#pagination a#nextPage',
  236. itemSelector : '.entry',
  237. loading: {
  238. finishedMsg: '',
  239. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  240. },
  241. bufferPx : 600,
  242. debug : false,
  243. },
  244. // call masonry as a callback.
  245. function( newElements ) {
  246. var $newElems = $( newElements );
  247. $newElems.hide();
  248. // ensure that images load before adding to masonry layout
  249. $newElems.imagesLoaded(function(){
  250. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  251. });
  252. });
  253. });
  254. </script>
  255.  
  256. {/block:IndexPage}
  257.  
  258. <meta name="viewport" content="width=800" />
  259.  
  260. </head>
  261. <body>
  262. <div id="sidebar">
  263. {block:ifshowheaderimage}<a href="/"><img src="{image:header}" style="max-width:200px;max-height:25px;"/></a>{/block:ifshowheaderimage}
  264. {block:ifnotshowheaderimage}<span class="blogtitle"><a href="/">{Title}</a></span>{/block:ifnotshowheaderimage}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="navi">
  265. <a href="/">home</a> | {block:AskEnabled}<a href="/ask">message</a> | {/block:AskEnabled}{block:iflinkonetitle}<a href="{text:link one}">{text:link one title}</a> | {/block:iflinkonetitle}{block:iflinktwotitle}<a href="{text:link two}">{text:link two title}</a> | {/block:iflinktwotitle}{block:iflinkthreetitle}<a href="{text:link three}">{text:link three title}</a> | {/block:iflinkthreetitle}{block:iflinkfourtitle}<a href="{text:link four}">{text:link four title}</a> | {/block:iflinkfourtitle}{block:iflinkfivetitle}<a href="{text:link five}">{text:link five title}</a> | {/block:iflinkfivetitle}<a href="http://sunrisen.tumblr.com">theme</a></span> <span class="msg_head" style="font-size:18px;font-family:helvetica;line-height:30px;text-transform:uppercase;font-weight:normal;color:{color:link};">| about</span>
  266. <div class="msg_body" style="line-height:12px;">{Description}</div>
  267. </div>
  268.  
  269. <div class="wrapper">
  270. <div id="posts">
  271.  
  272. {block:Posts}
  273. <div class="entry">
  274.  
  275. {block:Text}
  276. {block:IndexPage}
  277. {/block:IndexPage}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="entrytext">{Body}</span>
  278. {block:IndexPage}<div class="perm"><a href="{reblogurl}" target="_blank">reblog</a> : <a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  279. {/block:IndexPage}
  280. {/block:Text}
  281.  
  282. {block:Link}
  283. {block:IndexPage}
  284. {/block:IndexPage}<a href="{URL}" class="title">{Name}</a>
  285. {block:Description}{Description}{/block:Description}
  286. {block:IndexPage}<div class="perm"><a href="{reblogurl}" target="_blank">reblog</a> : <a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  287. {/block:IndexPage}
  288. {block:Link}
  289.  
  290. {block:Photo}
  291. {block:IndexPage}
  292. <span class="perma"><a href="{reblogurl}" target="_blank">REBLOG</a> | <a href="{permalink}">{notecountwithlabel}</a></span>
  293. {/block:IndexPage}
  294. {block:IndexPage}{LinkOpenTag}<div class="img"><div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="250"/></a></div></div>{LinkCloseTag}{block:ifshowcaptions}{caption}<div style="display:none;">{block:RebloggedFrom}{ReblogParentName}{ReblogParentTitle}{ReblogParentURL}{/block:RebloggedFrom}{block:ContentSource}{SourceURL} {/block:ContentSource}</div>{/block:ifshowcaptions}{/block:IndexPage}
  295. {block:PermalinkPage}{LinkOpenTag}<a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="550px"/></a>{LinkCloseTag}{/block:PermalinkPage}
  296. {block:IndexPage}
  297. {block:ifshowcaptions}
  298. <span class="captionperm"><a href="{permalink}">{notecountwithlabel}</a> | <a href="{reblogurl}" target="_blank">reblog</a></span>
  299. {/block:ifshowcaptions}
  300. {/block:IndexPage}
  301. {/block:Photo}
  302.  
  303. {block:Photoset}
  304. {block:indexpage}
  305. {Photoset-250}
  306. {/block:indexpage}
  307. {block:PermalinkPage}{Photoset-410}{/block:PermalinkPage}
  308. {/block:Photoset}
  309.  
  310. {block:Quote}
  311. {block:IndexPage}
  312. {/block:IndexPage}
  313. {Quote}</span>
  314. {block:IndexPage}<div class="perm"><a href="{reblogurl}" target="_blank">reblog</a> : <a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  315. {/block:IndexPage}
  316. {/block:Quote}
  317.  
  318. {block:Chat}
  319. {block:IndexPage}
  320. {/block:IndexPage}
  321. {block:Title}<span class="title">{Title}</span>{/block:Title}
  322. <ul class="chat">
  323. {block:Lines}
  324. <li class="user_{UserNumber}">
  325. {block:Label}
  326. <span class="label">{Label}</span>
  327. {/block:Label}
  328.  
  329. {Line}
  330. </li>
  331. {/block:Lines}
  332. </ul>
  333. {block:IndexPage}<div class="perm"><a href="{reblogurl}" target="_blank">reblog</a> : <a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  334. {/block:IndexPage}
  335. {/block:Chat}
  336.  
  337. {block:Audio}
  338. {block:IndexPage}
  339. {/block:IndexPage}
  340. <center><div style="{block:indexpage}width:250px;{/block:indexpage}{block:permalinkpage}width:550px;{/block:permalinkpage} padding-top:1px;height:28px;background:#000;"><div style="float:left">{AudioPlayerBlack}</div><div style="margin-top:10px; float:right;">
  341. {block:ExternalAudio}{/block:ExternalAudio}</div></div></center>
  342. {block:IndexPage}<div class="perms"><a href="{permalink}" target="_blank">{block:trackname}{trackname}{/block:trackname} - {block:artist}{artist}{/block:artist}</a></div>
  343. {/block:IndexPage}
  344. {/block:Audio}
  345.  
  346. {block:Video}
  347. {block:IndexPage}
  348. {/block:IndexPage}
  349. <center>
  350. {block:IndexPage}
  351. {Video-250}
  352. {/block:IndexPage}
  353. </center>
  354. <center>{block:PermalinkPage}{Video-500}{/block:PermalinkPage}</center>
  355. {block:IndexPage}<div class="perms"><a href="{reblogurl}" target="_blank">reblog</a> : <a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  356. {/block:IndexPage}
  357. {block:Video}
  358.  
  359. {block:Answer}
  360. {block:IndexPage}
  361. {/block:IndexPage}
  362. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  363. <b>{Asker}</b>: <b>{Question}</b>{Answer}
  364. {block:IndexPage}<div class="perm"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div>
  365. {/block:IndexPage}
  366. {/block:Answer}
  367.  
  368.  
  369. {block:PermalinkPage}
  370. {block:Date}
  371. <center>
  372. {TimeAgo} | {12HourWithZero}:{Minutes}{AmPm}
  373. <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>
  374. {/block:Date}
  375.  
  376. {/block:PermalinkPage}
  377.  
  378. {block:PostNotes}<div class="notes">{PostNotes}</div>
  379. {/block:PostNotes}
  380. </div>
  381.  
  382.  
  383. {/block:Posts}
  384. </div>
  385. </div>
  386. <div class="right">
  387. </div>
  388. <div class="footer">
  389. <br>
  390. </div>
  391. </div>
  392. </body>
  393. </html>
  394. <div style="position:fixed;right:0px;bottom:-425px;">
  395. <---DONT REMOVE---->
  396. {block:IndexPage}
  397. {block:Pagination}
  398. <div id="pagination">
  399. {block:NextPage}
  400. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  401. {/block:NextPage}
  402. {block:PreviousPage}
  403. <a href="{PreviousPage}">&larr;&nbsp;</a>
  404. {/block:PreviousPage}
  405. </div>
  406. {/block:Pagination}
  407. {/block:IndexPage}</div>
  408. </div>
  409. </body>
  410. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement