Advertisement
lovely-themesDOTcom

lovely-themesDOTcom/09

Mar 20th, 2013
1,116
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.39 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>
  3. <head>
  4.  
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8.  
  9. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
  10. {block:IndexPage}
  11.  
  12. <script src="http://masonry.desandro.com/js/jquery-1.7.1.min.js"></script>
  13. <script src="http://masonry.desandro.com/jquery.masonry.min.js"></script>
  14. <script src="http://masonry.desandro.com/js/jquery.infinitescroll.min.js"></script>
  15.  
  16. <script>
  17. $(function(){
  18. var $container = $('#content');
  19. $container.imagesLoaded(function(){
  20. $container.masonry({
  21. itemSelector: '.posts',
  22. columnWidth: 190
  23. });
  24. });
  25. $container.infinitescroll({
  26. navSelector : "div#navigation",
  27. nextSelector : "div#navigation a#nextPage",
  28. itemSelector : '.posts',
  29. loading: {
  30. finishedMsg: ' ',
  31. img: ' '
  32. }
  33. },
  34. function( newElements ) {
  35. var $newElems = $( newElements ).css({ opacity: 0 });
  36. $newElems.imagesLoaded(function(){
  37. $newElems.animate({ opacity: 1 });
  38. $container.masonry( 'appended', $newElems, true );
  39. });
  40. }
  41. );
  42.  
  43. });
  44. </script>
  45.  
  46. {/block:IndexPage}
  47.  
  48. </head>
  49.  
  50. <style type="text/css">
  51.  
  52. body {
  53. background-image: url('http://i.imgur.com/dDS01QQ.png'), url('http://i.imgur.com/cZ0l1Ww.png');
  54. background-attachment:fixed;
  55. background-repeat: repeat-x, repeat;
  56. color:#999999;
  57. font-family: arial;
  58. font-size:10px;
  59. line-height:12px;
  60. text-align:justify;
  61. }
  62.  
  63. #container {
  64. width: 850px;
  65. display: block;
  66. margin: 0 auto;
  67. text-align: center;
  68. overflow: hidden;
  69. }
  70.  
  71. #header{
  72. width:850px; height: 147px;
  73. margin-top:-8px;
  74. position:fixed;
  75. z-index:1;
  76. background-image: url('http://i.imgur.com/UO2vRHQ.png');
  77. }
  78.  
  79. #content {
  80. width: 600px;
  81. display: block;
  82. margin: 0 auto;
  83. text-align: justify;
  84. overflow: hidden;
  85. float:right;
  86. margin-top:141px;
  87. }
  88.  
  89. #sidebar {
  90. width: 230px;
  91. display: block;
  92. margin: 0 auto;
  93. text-align: justify;
  94. overflow: hidden;
  95. float:left;
  96. position: fixed;
  97. margin-top:140px;
  98. margin-left:15px;
  99. }
  100.  
  101. .sidebarbox {
  102. background: #eee;
  103. border: 1px solid #e8e8e8;
  104. text-align: justify;
  105. overflow: hidden;
  106. padding: 5px;
  107. margin-bottom: 7px;
  108. }
  109.  
  110. .posts {
  111. float: left;
  112. width: 180px;
  113. overflow: auto;
  114. margin-left: 5px;
  115. }
  116.  
  117. .postbox {
  118. background: #eee;
  119. border: 1px solid #e8e8e8;
  120. display: block;
  121. text-align: justify;
  122. overflow: hidden;
  123. padding: 5px;
  124. margin-bottom: 10px;
  125. }
  126.  
  127. .notesbox {
  128. background: #000;
  129. display: block;
  130. text-align: justify;
  131. overflow: hidden;
  132. padding: 5px;
  133. margin-bottom: 10px;
  134. margin-left: 10px;
  135. margin-right:186px;
  136. float: right;
  137. width: 400px;
  138. }
  139.  
  140. a.navi:link, a.navi:active, a.navi:visited{
  141. font-family: arial;
  142. font-weight: bold;
  143. font-size:10px;
  144. color: #fff;
  145. text-transform: uppercase;
  146. margin: 1px; padding: 1px;
  147. padding-left:5px;
  148. text-align: left;
  149. background-color:#41c0c2;
  150. display:block;
  151. }
  152. a.navi:hover{
  153. color: #fff; background-color:#dadada;
  154. }
  155.  
  156. a.navi2:link, a.navi2:active, a.navi2:visited{
  157. font-family: arial;
  158. font-weight: bold;
  159. font-size:10px;
  160. color: #fff;
  161. text-transform: uppercase;
  162. margin: 1px; padding: 1px;
  163. padding-left:5px;
  164. text-align: left;
  165. background-color:#e9c6b7;
  166. display:block;
  167. }
  168. a.navi2:hover{
  169. color: #fff; background-color:#dadada;
  170. }
  171.  
  172. a.navi3:link, a.navi3:active, a.navi3:visited{
  173. font-family: arial;
  174. font-weight: bold;
  175. font-size:10px;
  176. color: #fff;
  177. text-transform: uppercase;
  178. margin: 1px; padding: 1px;
  179. padding-left:5px;
  180. text-align: left;
  181. background-color:#d7e5c1;
  182. display:block;
  183. }
  184. a.navi3:hover{
  185. color: #fff; background-color:#dadada;
  186. }
  187.  
  188. a.navi4:link, a.navi4:active, a.navi4:visited{
  189. font-family: arial;
  190. font-weight: bold;
  191. font-size:10px;
  192. color: #fff;
  193. text-transform: uppercase;
  194. margin: 1px; padding: 1px;
  195. padding-left:5px;
  196. text-align: left;
  197. background-color:#c7c8c3;
  198. display:block;
  199. }
  200. a.navi4:hover{
  201. color: #fff; background-color:#dadada;
  202. }
  203.  
  204. h1{
  205. color:#fff;
  206. font-family: arial black;
  207. font-size:12px;
  208. text-align:left;
  209. line-height:15px;
  210. letter-spacing:-1px;
  211. padding:2px; margin:0px;
  212. margin-bottom: 2px;
  213. text-transform: uppercase;
  214. background-color:#41c0c2;
  215. }
  216. h2{
  217. color:#fff;
  218. font-family: arial black;
  219. font-size:12px;
  220. text-align:left;
  221. line-height:15px;
  222. letter-spacing:-1px;
  223. padding:2px; margin:0px;
  224. margin-bottom: 2px;
  225. text-transform: uppercase;
  226. background-color:#e9c6b7;
  227. }
  228. h3{
  229. color:#fff;
  230. font-family: arial black;
  231. font-size:12px;
  232. text-align:left;
  233. line-height:15px;
  234. letter-spacing:-1px;
  235. padding:2px; margin:0px;
  236. margin-bottom: 2px;
  237. text-transform: uppercase;
  238. background-color:#d7e5c1;
  239. }
  240. h4{
  241. color:#fff;
  242. font-family: arial black;
  243. font-size:12px;
  244. text-align:left;
  245. line-height:15px;
  246. letter-spacing:-1px;
  247. padding:2px; margin:0px;
  248. margin-bottom: 2px;
  249. text-transform: uppercase;
  250. background-color:#c7c8c3;
  251. }
  252.  
  253. a{
  254. color: #ffc447;
  255. text-decoration:none;
  256. -webkit-transition: all 0.5s ease-in-out;
  257. -moz-transition: all 0.5s ease-in-out;
  258. -ms-transition: all 0.5s ease-in-out;
  259. -o-transition: all 0.5s ease-in-out;
  260. transition: all 0.5s ease-in-out;
  261. }
  262. a:hover{
  263. color:#fff;
  264. text-decoration:none;
  265. -webkit-transition: all 0.5s ease-in-out;
  266. -moz-transition: all 0.5s ease-in-out;
  267. -ms-transition: all 0.5s ease-in-out;
  268. -o-transition: all 0.5s ease-in-out;
  269. transition: all 0.5s ease-in-out;
  270. }
  271.  
  272. b {color: #ab0099;}
  273. u {color: #9cc032;}
  274. i {color: #ffbc3f;}
  275.  
  276. ol.notes {
  277. font-size: 10px;
  278. display:block;
  279. text-decoration: none;
  280. background: #111;
  281. list-style-type: none;
  282. border-bottom: 1px solid #000;
  283. }
  284. ol {
  285. list-style-position: inside;
  286. -webkit-padding-start: 0px;
  287. }
  288. ol.notes li.note {
  289. border-bottom: solid 1px #222;
  290. padding: 4px;
  291. }
  292. ol.notes li.note img.avatar {
  293. width: 14px;
  294. padding: 2px;
  295. background: #222;
  296. margin-bottom: -4px;
  297. }
  298.  
  299. .stuff{
  300. margin:1px; padding:4px;
  301. display: block;
  302. line-height:8px;
  303. text-align:center;
  304. margin-top:0px;
  305. margin-bottom:10px;
  306. }
  307. .stuff a{
  308. margin:0px; padding:5px;
  309. text-align:center;
  310. color:#ffffff; background-color:#41c0c2;
  311. font-family: "arial";
  312. font-size:10px; line-height:10px;
  313. text-transform:lowercase;
  314. letter-spacing:0px; font-weight:normal;
  315. -webkit-transition:0.5s; -moz-transition:0.5s;
  316. -ms-transition:0.5s; -o-transition:0.5s; transition:0.5s;}
  317.  
  318. .stuff a:hover{color:#ffffff; background-color:#e9c6b7;}
  319.  
  320. figure {
  321. display: block;
  322. position: relative;
  323. float: left;
  324. overflow: hidden;
  325. margin: 0px;}
  326. figcaption {
  327. position: absolute;
  328. padding: 5px; opacity: 0;
  329. -webkit-transition: all 0.6s ease;
  330. -moz-transition: all 0.6s ease;
  331. -o-transition: all 0.6s ease;}
  332. figure:hover figcaption {opacity:1;}
  333. .cap-bot figcaption {left: 0; bottom: 0%;}
  334. .cap-bot:hover figcaption {bottom: 0;}
  335.  
  336.  
  337. </style>
  338.  
  339. <body>
  340.  
  341. <div id="container">
  342. <div id="header"></div>
  343.  
  344. <div id="sidebar">
  345. <div class="sidebarbox">
  346. <h1>{title}</h1>
  347. <img src="http://24.media.tumblr.com/851c817c39d306985d1d5fcc34e902fc/tumblr_mjx4p5oeC51r69ctuo4_250.gif" width=218>
  348. </div>
  349.  
  350. <div class="sidebarbox">
  351. <h2>about me</h2>
  352. {Description}
  353. </div>
  354.  
  355. <div class="sidebarbox">
  356. <h3>navigation</h3>
  357. <table width="100%" cellpadding="1" cellspacing="0" border="0">
  358. <tr><td width="50%" valign="top">
  359. <a href="/" class="navi">home</a>
  360. <a href="/ask" class="navi2">ask me</a>
  361. </td><td width="50%" valign="top">
  362. <a href="/submit" class="navi3">submit</a>
  363. <a href="/archive" class="navi4">archive</a>
  364. </td></tr></table>
  365. </div>
  366.  
  367. <div class="sidebarbox">
  368. <h4>favorites</h4>
  369. <center><img src="http://i.imgur.com/DbWGvfR.png" width=51> <img src="http://i.imgur.com/qKIju82.png" width=51> <img src="http://i.imgur.com/r8J8z5W.png" width=51> <img src="http://i.imgur.com/jnSQtOE.png" width=51></center>
  370. </div>
  371.  
  372. </div>
  373.  
  374. <div id="content">
  375.  
  376. {block:Posts}
  377.  
  378. <div class="posts">
  379. <div class="postbox">
  380. <figure class='cap-bot'>
  381. {block:Text}
  382. {block:Title}
  383. <h1>{Title}</h1>
  384. {/block:Title}
  385. {Body}
  386. {/block:Text}
  387.  
  388. {block:Quote}
  389. {Quote}<p>
  390. {/block:Quote}
  391.  
  392. {block:Answer}
  393. <b>{Asker}</b>: {Question}<br>
  394. {Answer}
  395. {/block:Answer}
  396.  
  397. {block:Photo}
  398. <center>
  399. <img src="{PhotoURL-250}" width="170px" style="max-width: 170px;">
  400. </center>
  401. {/block:Photo}
  402.  
  403. {block:Audio}
  404. {block:ExternalAudio}(<a href="{ExternalAudioURL}">download!</a>)
  405. {/block:ExternalAudio}
  406. <center>{AudioPlayerWhite}</center> <p>
  407. {/block:Audio}
  408.  
  409. {block:Video}
  410. <center>{Video-170}</center><p>
  411. {/block:Video}
  412.  
  413. {block:Photoset}
  414. <center>{Photoset-250}</center>
  415. {/block:Photoset}
  416.  
  417. {block:Chat}
  418. <center>{block:Title}<h1>{Title}</h1>{/block:Title}
  419. {block:Lines}{block:Label}
  420. <br>{Label}{/block:Label} {Line} {/block:Lines}</center>
  421. {/block:Chat}
  422.  
  423. {block:Link}
  424. <a href="{URL}"><h1>{Name}</h1></a>
  425. {block:Description}{Description}{/block:Description}
  426. {/block:Link}
  427.  
  428. {block:IndexPage}<figcaption class='cap-bot'>
  429. <div class="stuff">
  430. <center><a href="{reblogurl}" target="_blank">Reblog</a> <a href="{Permalink}" title="permalink">{NoteCountWithLabel}</a></center>
  431. </div></figcaption></figure>
  432. {/block:IndexPage}
  433.  
  434.  
  435. </div>
  436. </div>
  437.  
  438. {block:PostNotes}
  439.  
  440. <div class="notesbox">
  441. {block:RebloggedFrom}rebloged from <a href="{ReblogParentURL}">&hearts;</a> posted by <a href="{ReblogRootURL}">&copy;</a> {/block:RebloggedFrom} on {Month} {DayOfMonth},{Year} & has {NoteCountwithLabel} <p>{PostNotes}</div>
  442. {/block:PostNotes}
  443. {/block:Posts}
  444.  
  445. {block:IndexPage}
  446. <div class="column navigation" id="navigation">
  447. {block:Pagination}
  448. {block:PreviousPage}<a href="{PreviousPage}" class="navigate">{/block:PreviousPage}{block:PreviousPage}</a>{/block:PreviousPage}
  449. {block:NextPage}<a href="{NextPage}" class="navigate" id="nextPage">{/block:NextPage}{block:NextPage}</a>{/block:NextPage}{/block:Pagination}
  450. </div>
  451. {/block:IndexPage}
  452.  
  453. </div>
  454. </div>
  455. </div>
  456. </div>
  457.  
  458. <div style="position: fixed; left: 5px; bottom: 5px; background: #000; padding: 3px; text-transform: uppercase;"><a href="http://lovely-themes.com">theme</a></div>
  459.  
  460. </body>
  461. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement