Advertisement
lovely-themesDOTcom

lovely-themesDOTcom/15

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