Advertisement
haffalump

haffalump theme five

Oct 10th, 2012
1,287
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.85 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.  
  3.  
  4. <!--theme five
  5. theme credit to hafsa (haffalump @ tumblr)
  6. the credit can not be removed or changed in any possible way.
  7. do not use this code as a base, and do not repost it/rehash it
  8. and use claim it as your own.
  9. -->
  10.  
  11.  
  12.  
  13. <html>
  14.  
  15.  
  16. <link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css'>
  17.  
  18. <head>
  19.  
  20. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  21.  
  22. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  23.  
  24. <script type=”text/javascript”>
  25. $(window).load(function () {
  26. $(‘.content’).masonry({
  27. itemSelector : “.container”,
  28. },
  29. function() { $(‘.content’).masonry({ appendedContent: $(this) }); }
  30. );
  31. });
  32. </script>
  33.  
  34.  
  35. <link rel="shortcut icon" href="{Favicon}">
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  37. {block:Description}
  38. <meta name="description" content="{MetaDescription}" />
  39. {/block:Description}
  40.  
  41. <meta name="color:Background" content ="#ffffff"/>
  42. <meta name="image:Background" content=""/>
  43. <meta name="font:Body" content="'Droid Sans', georgia, lucida sans,"/>
  44. <meta name="color:Text" content="#777777"/>
  45. <meta name="color:Link" content="#a0a0a0"/>
  46. <meta name="color:Link Hover" content="#ffffff"/>
  47.  
  48. <style type="text/css">
  49.  
  50.  
  51.  
  52.  
  53.  
  54. body {
  55. background-color: 'Droid Sans', arial, lucida sans, sans-serif;
  56. font-family: {font:Body};
  57. font-size: 9px;
  58. color: {color:Text};
  59. letter-spacing: 1px;
  60. }
  61.  
  62.  
  63. .content {
  64. width: 420px;
  65. padding: 0px;
  66. position: absolute;
  67. margin-left: 30px;
  68. margin-right: auto;
  69. background-color: #ffffff;
  70. }
  71.  
  72. .content2 {
  73. width: 420px;
  74. padding: 0px;
  75. position: absolute;
  76. margin-left: 70px;
  77. margin-right: auto;
  78. left: 410px;
  79. background-color: #ffffff;
  80. }
  81.  
  82. .container{
  83. width: 860px;
  84. float:left;
  85.  
  86. }
  87.  
  88.  
  89. .sidebar {
  90. font-family: 'Droid Sans', georgia, lucida sans, sans-serif;
  91. font-size: 7px;
  92. letter-spacing: 2px;
  93. color: {color:Text};
  94. text-align: justify;
  95. text-transform: uppercase;
  96. width: 140px;
  97. height: 351px;
  98. padding: 40px 30px 40px 30px;
  99. padding-top: 10px;
  100. background-color: #f0f0f0;
  101. overflow: auto;
  102. letter-spacing: 0px;
  103. line-height: 130%;
  104.  
  105. }
  106.  
  107. .sidebar a:link, .sidebar a:visited, .sidebar a:active{
  108.  
  109. color: #555555;
  110. }
  111.  
  112.  
  113. .sidebar a:hover {
  114. color: #ffffff;
  115. text-decoration: none;
  116. }
  117.  
  118. .title {
  119. font-family: 'Droid Sans', georgia, lucida sans, arial, sans-serif;
  120. font-size: 7px;
  121. letter-spacing: 2px;
  122. color: {color:Text};
  123. text-align: center;
  124. text-transform: uppercase;
  125. font-weight: none;
  126. letter-spacing: 0px;
  127. padding: 10px 0px 10px 0px;
  128. font-style: none;
  129. }
  130.  
  131. a {
  132. font-weight: none;
  133. text-decoration: none;
  134. color: {color:Link};
  135.  
  136. }
  137.  
  138. a:hover {
  139. color: {color:Link Hover};
  140. text-decoration: none;
  141. }
  142.  
  143. a img {
  144. border: 0px;
  145. }
  146.  
  147.  
  148.  
  149. .post img {
  150. display: block;
  151. margin: 0 auto;
  152. width: 400px;
  153. }
  154.  
  155. .post {
  156. margin-top: 30px;
  157. text-align: justify;
  158. background-color: #f0f0f0;
  159. padding: 10px;
  160. width: 400px;
  161.  
  162. }
  163.  
  164. .notesandtags {
  165. padding: 5px;
  166. margin-bottom: 15px;
  167. margin-top: -2px;
  168. margin-left: -4px;
  169.  
  170. }
  171.  
  172. .tags {
  173. font-size: 6px;
  174. float: right;
  175. text-transform: lowercase;
  176. margin-top: 2px;
  177. margin-bottom: 10px;
  178.  
  179. }
  180.  
  181. .tag {
  182. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  183. font-size: 6px;
  184. letter-spacing: 1px;
  185. color: #c5c5c5;
  186. text-transform: uppercase;
  187. font-weight: none;
  188. width: 420px;
  189. margin-right: 3px;
  190.  
  191. }
  192.  
  193. .time {
  194. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  195. font-size: 6px;
  196. letter-spacing: 1px;
  197. color: #c5c5c5;
  198. text-transform: uppercase;
  199. font-weight: none;
  200. width: 420px;
  201. }
  202.  
  203. h3 {
  204. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  205. font-size: 8px;
  206. color: {color:Text};
  207. text-align: justify;
  208. letter-spacing: 1px;
  209. text-transform: uppercase;
  210. font-weight: none;
  211. font-style: none;
  212. margin-bottom: 30px;
  213. }
  214.  
  215. .h3 a:link, .h3 a:visited, .h3 a:active{
  216. color: #000000;}
  217.  
  218. blockquote {
  219. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  220. font-size: 9px;
  221. color: {color:Text};
  222. text-align: justify;
  223. text-transform: lowercase;
  224. font-weight: none;
  225. font-style: none;
  226. padding: 10px;
  227. margin: 10px;
  228. }
  229.  
  230. .quote {
  231. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  232. font-size: 8px;
  233. color:{color:Text};
  234. text-align: justify;
  235. letter-spacing: 1px;
  236. text-transform: uppercase;
  237. font-weight: none;
  238. font-style: none;
  239. }
  240.  
  241. .source {
  242. margin-left: 25px;
  243. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  244. font-size: 6px;
  245. letter-spacing: 1px;
  246. color: #cccccc;
  247. text-transform: uppercase;
  248. font-weight: none;
  249. }
  250.  
  251. .link {
  252. font-family: 'Droid Sans', arial, times new roman, sans-serif;
  253. font-size: 8px;
  254. color: {color:Text};
  255. text-align: left;
  256. letter-spacing: 1px;
  257. text-transform: uppercase;
  258. font-weight: bold;
  259. font-style: none;
  260. }
  261.  
  262. .link:hover {
  263. color: #ffffff;
  264. }
  265.  
  266. ul.chat {
  267. margin: 0;
  268. padding: 0;
  269. }
  270.  
  271. .chat li {
  272. list-style-type: none;
  273. font-size: 8px;
  274. margin-left: 0px;
  275. padding: 3px;
  276. text-transform: uppercase;
  277. }
  278.  
  279. .chat li.odd {
  280. margin-bottom: 1px;
  281. color: #aaaaaa;
  282. font-size: 8px;
  283. text-transform: uppercase;
  284. }
  285.  
  286. .chat li.even {
  287. margin-bottom: 1px;
  288. color: #aaaaaa;
  289. font-size: 8px;
  290. text-transform: uppercase;
  291. }
  292.  
  293. .label {
  294. font-weight: none;
  295. }
  296.  
  297.  
  298.  
  299. #navcontainer
  300. {
  301. margin: 0px;
  302. padding: 0px;
  303. text-align: center;
  304. font-size: 10px;
  305. }
  306. #navcontainer { display: inline; }
  307. #navcontainer a
  308. {
  309. text-decoration: none;
  310. padding: .2em 1em;
  311. color: #fff;
  312. font-size: 10px;
  313. }
  314.  
  315.  
  316. #navcontainer a:hover
  317. {
  318. color: #fff;
  319. background-color: #369;
  320. font-size: 10px;
  321. }
  322.  
  323.  
  324. ::-webkit-scrollbar {
  325. height: 30px;
  326. width: 8px;
  327. background: #ffffff;
  328. }
  329. ::-webkit-scrollbar-thumb {
  330. background: #555555;
  331.  
  332. }
  333. ::-webkit-scrollbar-corner {
  334. background: #ffffff;
  335. }
  336.  
  337.  
  338. .box { margin:auto; z-index: 1; width: 200px;
  339. background-image: url({image:Background}); height: 400px; border: 20px solid #eeeeee; }
  340. .main { background-color: #f0f0f0; color: #000000; padding: 0px;}
  341. .b5 {opacity: 0.0; height: 400px; width: 200px; position: absolute; font-size: 7px; text-transform: uppercase; transition-duration: 0.6s; -moz-transition-duration: 0.6s; -webkit-transition-duration: 0.6s; -o-transition-duration: 0.6s;}
  342. .box:hover
  343. .b5 { opacity: 1.0; height: 200px; font-size: 7px; text-transform: uppercase; transition-duration: 0.9s; -moz-transition-duration: 0.9s; -webkit-transition-duration: 0.9s; -o-transition-duration: 0.9s; }
  344.  
  345. ol.notes {
  346. padding: 0px;
  347. margin: 25px 0px;
  348. font-size: 10px;
  349. list-style-type: none;
  350.  
  351. }
  352.  
  353. ol.notes li.note {
  354. padding: 2px;
  355. }
  356.  
  357. ol.notes li.note img.avatar {
  358. vertical-align: -4px;
  359. margin-right: 10px;
  360. width: 10px;
  361. height: 10px;
  362. }
  363.  
  364. ol.notes li.note span.action {
  365. font-weight: none;
  366. }
  367.  
  368. ol.notes li.note .answer_content {
  369. font-weight: normal;
  370. }
  371.  
  372. ol.notes li.note blockquote {
  373. border-color: none;
  374. padding: 4px 10px;
  375. margin: 5px 0px 0px 25px;
  376. }
  377.  
  378. ol.notes li.note blockquote a {
  379. text-decoration: none;
  380.  
  381.  
  382.  
  383.  
  384. {CustomCSS}
  385. </style>
  386.  
  387. <center><title>{Title}</title></center>
  388.  
  389. </head>
  390.  
  391.  
  392.  
  393. <body>
  394.  
  395.  
  396.  
  397.  
  398.  
  399.  
  400. <div style="position: relative; right: 5px; bottom:5px; position: fixed; color: #000; "><a href="http://haffalump.tumblr.com/">theme</a></div>
  401.  
  402. <div class="content">
  403.  
  404.  
  405. {block:Posts}
  406. {block:Odd}
  407.  
  408.  
  409. {block:Text}
  410. <div class="post">
  411. {block:Title}
  412. <h3><a href="{Permalink}">{Title}</a></h3>
  413. {/block:Title}
  414. {Body}
  415. </div>
  416. {/block:Text}
  417.  
  418. {block:Photo}
  419. <div class="post">
  420. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  421. {block:PermalinkPage}{block:Caption}
  422. {Caption}{/block:Caption}{/block:PermalinkPage}
  423. </div>
  424. {/block:Photo}
  425.  
  426. {block:Photoset}
  427. <div class="post">
  428. <center>{Photoset-400}</center>
  429. {block:PermalinkPage}{block:Caption}
  430. {Caption}{/block:Caption}{/block:PermalinkPage}
  431. </div>
  432. {/block:Photoset}
  433.  
  434. {block:Quote}
  435. <div class="post">
  436. <span class="quote">"{Quote}"</span>
  437. {block:Source}
  438. <div class="source">– {Source}</div>
  439. {/block:Source}
  440. </div>
  441. {/block:Quote}
  442.  
  443. {block:Link}
  444. <div class="post">
  445. <a href="{URL}" class="link" {Target}>{Name}</a>
  446. {block:Description}
  447. <div class="description">{Description}</div>
  448. {/block:Description}
  449. </div>
  450. {block:ContentSource}
  451. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  452. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  453. {/block:SourceLogo}
  454. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  455. {/block:ContentSource}
  456. {/block:Link}
  457.  
  458. {block:Chat}
  459. <div class="post">
  460. {block:Title}
  461. <h3><a href="{Permalink}">{Title}</a></h3>
  462. {/block:Title}
  463. <ul class="chat">
  464. {block:Lines}
  465. <li class="{Alt} user_{UserNumber}">
  466. {block:Label}
  467. <span class="label">{Label}</span>
  468. {/block:Label}
  469. {Line}
  470. </li>
  471. {/block:Lines}
  472. </ul>
  473. </div>
  474. {/block:Chat}
  475.  
  476. {block:Video}
  477. <div class="post">
  478. <center>{Video-400}</center>
  479. {block:Caption}
  480. {/block:Caption}
  481. </div>
  482. {/block:Video}
  483.  
  484.  
  485. {block:Audio}
  486. <div class="post">
  487. {AudioPlayerBlack}
  488. {Caption}
  489. </div>
  490. {block:ContentSource}
  491. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  492. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  493. {/block:SourceLogo}
  494. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  495. {/block:ContentSource}
  496. {/block:Audio}
  497.  
  498. <div class="notesandtags">
  499. <div class="time">{block:Date}Posted <a href="{Permalink}">{TimeAgo}</a>{/block:Date}
  500. <div class="tags">{block:Tags}<a href="{TagURL}" class="tag">{Tag}</a> {/block:Tags} {block:NoteCount}{NoteCount}{/block:NoteCount}</div>
  501. </div>
  502. </div>
  503.  
  504. {PostNotes}
  505.  
  506. {/block:Odd}
  507. {/block:Posts}
  508.  
  509. </div>
  510.  
  511. <div class="content2">
  512. <div style="margin-top: 250px;">
  513.  
  514. {block:Posts}
  515. {block:Even}
  516.  
  517.  
  518. {block:Text}
  519. <div class="post">
  520. {block:Title}
  521. <h3><a href="{Permalink}">{Title}</a></h3>
  522. {/block:Title}
  523. {Body}
  524. </div>
  525. {/block:Text}
  526.  
  527. {block:Photo}
  528. <div class="post">
  529. {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
  530. {block:PermalinkPage}{block:Caption}
  531. {Caption}{/block:Caption}{/block:PermalinkPage}
  532. </div>
  533. {/block:Photo}
  534.  
  535. {block:Photoset}
  536. <div class="post">
  537. <center>{Photoset-400}</center>
  538. {block:PermalinkPage}{block:Caption}
  539. {Caption}{/block:Caption}{/block:PermalinkPage}
  540. </div>
  541. {/block:Photoset}
  542.  
  543. {block:Quote}
  544. <div class="post">
  545. <span class="quote">"{Quote}"</span>
  546. {block:Source}
  547. <div class="source">– {Source}</div>
  548. {/block:Source}
  549. </div>
  550. {/block:Quote}
  551.  
  552. {block:Link}
  553. <div class="post">
  554. <a href="{URL}" class="link" {Target}>{Name}</a>
  555. {block:Description}
  556. <div class="description">{Description}</div>
  557. {/block:Description}
  558. </div>
  559. {block:ContentSource}
  560. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  561. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  562. {/block:SourceLogo}
  563. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  564. {/block:ContentSource}
  565. {/block:Link}
  566.  
  567. {block:Chat}
  568. <div class="post">
  569. {block:Title}
  570. <h3><a href="{Permalink}">{Title}</a></h3>
  571. {/block:Title}
  572. <ul class="chat">
  573. {block:Lines}
  574. <li class="{Alt} user_{UserNumber}">
  575. {block:Label}
  576. <span class="label">{Label}</span>
  577. {/block:Label}
  578. {Line}
  579. </li>
  580. {/block:Lines}
  581. </ul>
  582. </div>
  583. {/block:Chat}
  584.  
  585. {block:Video}
  586. <div class="post">
  587. <center>{Video-400}</center>
  588. {Caption}
  589. </div>
  590. {/block:Video}
  591.  
  592.  
  593. {block:Audio}
  594. <div class="post">
  595. {AudioPlayerBlack}
  596. {Caption}
  597. </div>
  598. {block:ContentSource}
  599. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  600. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  601. {/block:SourceLogo}
  602. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  603. {/block:ContentSource}
  604. {/block:Audio}
  605.  
  606. <div class="notesandtags">
  607. <div class="time">{block:Date}Posted <a href="{Permalink}">{TimeAgo}</a>{/block:Date}
  608. <div class="tags">{block:Tags}<a href="{TagURL}" class="tag">{Tag}</a> {/block:Tags} {block:NoteCount}{NoteCount}{/block:NoteCount}</div>
  609. </div>
  610. </div>
  611.  
  612. {PostNotes}
  613.  
  614. {/block:Even}
  615. {/block:Posts}
  616. </div>
  617. </div>
  618.  
  619.  
  620. <div style=" position: fixed; right: 70px; top:90px; ">
  621.  
  622. <center><div class="title">{Title}</div> </center>
  623. <div class="box">
  624.  
  625.  
  626.  
  627.  
  628. <div class="main">
  629.  
  630.  
  631.  
  632. </div>
  633.  
  634. <div class="b5" style="text-align: center;">
  635.  
  636. <div class="sidebar">
  637.  
  638.  
  639.  
  640.  
  641.  
  642. <center><p align="center"><div style="font-size: 7px; color: #000000; ">
  643. {block:AskEnabled}<a href="/ask">ask</a> - {/block:AskEnabled} {block:SubmissionsEnabled}<a href="/submit">{SubmitLabel}</a> - {/block:SubmissionsEnabled} <a href="/">home</a> - <a href="/archive">Archive</a> </div></center>
  644.  
  645. <center><div style="font-size: 7px; color: #000; width: 150px;"><div id=”navcontainer”>
  646. {block:HasPages}
  647. {block:Pages}
  648.  
  649. <a href={URL}>{Label}</a> -
  650.  
  651. {/block:Pages}
  652. {/block:HasPages}</div></div></center>
  653.  
  654.  
  655.  
  656. {block:Description}<p><div class="sidebartransition">{Description}</div>{/block:Description}
  657. </div>
  658.  
  659.  
  660.  
  661. </div>
  662.  
  663. <div style=" position: fixed; right: 160px; bottom:70px; width: 40px; background-color: #ffffff; color: #000000; padding: 10 0 10 0px; height: 20px; font-size: 6px; text-transform: uppercase; ">
  664. <p align="center">
  665.  
  666. {block:Pagination}
  667. {block:PreviousPage}
  668. <a href="{PreviousPage}">«</a>
  669. {/block:PreviousPage}
  670.  
  671. {block:JumpPagination length="4"}
  672. {block:CurrentPage}
  673. <span class="current_page">{PageNumber}</span>
  674. {/block:CurrentPage}
  675.  
  676. {block:JumpPage}
  677. <a class="jump_page" href="{URL}">{PageNumber}</a>
  678. {/block:JumpPage}
  679. {/block:JumpPagination}
  680.  
  681. {block:NextPage}
  682. <a href="{NextPage}">»</a>
  683. {/block:NextPage}
  684. {/block:Pagination}
  685.  
  686. </div>
  687.  
  688. </div>
  689. </div>
  690.  
  691.  
  692.  
  693. </div>
  694.  
  695. </body>
  696. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement