Advertisement
haffalump

haffalump theme eight

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