Advertisement
hor4ny

"Little Things" theme - TwistedMiracles

Nov 6th, 2012
466
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.03 KB | None | 0 0
  1. <!--
  2. "Little Things" theme by TWISTEDMIRACLES (used to be miserywishes).
  3. Keep credit or put it in your FAQ. Please and thank you!
  4.  
  5. IF YOU USE THIS THEME AS A BASECODE, PLEASE ASK ME BEFORE PUBLISHING! I'LL KNOW IF YOU USE MY THEME BECAUSE OF THE PERMALINK.
  6. -->
  7.  
  8. <html lang="en">
  9. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  10. <html xmlns="http://www.w3.org/1999/xhtml">
  11. <head>
  12.  
  13.  
  14. <script type="text/javascript">
  15. <!--
  16.  
  17. // Disable Right Click Script
  18.  
  19. function IE(e)
  20. {
  21. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  22. {
  23. return false;
  24. }
  25. }
  26. function NS(e)
  27. {
  28. if (document.layers || (document.getElementById && !document.all))
  29. {
  30. if (e.which == "2" || e.which == "3")
  31. {
  32. return false;
  33. }
  34. }
  35. }
  36. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  37.  
  38. //-->
  39. </script>
  40.  
  41.  
  42. <script type="text/javascript"
  43. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  44.  
  45. <!-- DEFAULT VARIABLES -->
  46. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  47. <meta name="color:background" content="#fff"/>
  48. <meta name="color:link" content="#777"/>
  49. <meta name="color:text" content="#777"/>
  50. <meta name="color:title" content="#333"/>
  51. <meta name="color:borders" content="#eee"/>
  52. <meta name="color:hover" content="#fff"/>
  53. <meta name="color:scrollbar" content="#ddd" />
  54. <meta name="image:sidebar" content=""/>
  55. <meta name="image:background" content="1"/>
  56. <meta name="text:link one" content="" />
  57. <meta name="text:link one title" content="" />
  58. <meta name="text:link two" content="" />
  59. <meta name="text:link two title" content="" />
  60. <meta name="text:link three" content="" />
  61. <meta name="text:link three title" content="" />
  62. <meta name="text:link four" content="" />
  63. <meta name="text:link four title" content="" />
  64. <meta name="text:link five" content="" />
  65. <meta name="text:link five title" content="" />
  66. <meta name="text:link separation" content="&middot;"/>
  67. <style type="text/css">
  68.  
  69.  
  70.  
  71. ::-webkit-scrollbar {width: 4px; height: 4px; border:1px solid {color:borders}; background-color:{color:background};background-image:url({image:background});}
  72. ::-webkit-scrollbar-thumb { border-left:0px solid #ddd; background: {color:scrollbar};}
  73.  
  74. iframe#tumblr_controls {right:2px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.3;-webkit-transition: all 0.8s ease-out;-moz-
  75.  
  76. transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  77.  
  78. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity:1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all
  79.  
  80. 0.4s ease-out;}
  81.  
  82. p {
  83. margin:0px;
  84. margin-top:0px;
  85. }
  86.  
  87.  
  88. ::selection {
  89. background: #ffffff;
  90. color: #ffffff;
  91. }
  92.  
  93. ::-moz-selection {
  94. background: #ffffff;
  95. color: #ffffff;
  96. }
  97.  
  98.  
  99. body {
  100. padding: 0px;
  101. margin: 0px;
  102. color:{color:text};
  103. font-family: dixel;
  104. line-height:7px;
  105. font-size:8px;
  106. background-image:url({image:background});
  107. background-color: {color:Background};
  108. background-attachment: fixed;
  109. background-repeat: repeat;
  110. }
  111.  
  112.  
  113. a:link, a:active, a:visited{
  114. text-decoration: none;
  115. -webkit-transition: color 0.3s ease-out;
  116. -moz-transition: color 0.3s ease-out;
  117. transition: color 0.3s ease-out;
  118. color:{color:link};
  119. }
  120.  
  121. a:hover {
  122. text-decoration: none;
  123. font-style:;
  124. text-shadow:0px 0px 2px #000;
  125. color: {color:Hover};
  126. }
  127.  
  128. askname{
  129. font-family:jenna;
  130. font-size:13px;
  131. z-index:1;
  132. }
  133.  
  134. div#center{
  135. margin:auto;
  136. position:relative;
  137. width:1000px;
  138. background-color:;
  139. overflow:auto;
  140. overflow-y:hidden;
  141. }
  142.  
  143. .entry {
  144. float:left;
  145. display: block;
  146. margin:3px;
  147. line-height:7px;
  148. padding:5px;
  149. border:2px solid {color:borders};
  150. overflow:hidden;
  151. width:205px;
  152. opacity:0.85;
  153. {block:PermalinkPage}
  154. width:428px;
  155. text-align:left;
  156. line-height:10px;
  157. {/block:PermalinkPage}
  158. background:white;
  159. background-image:URL();
  160. -webkit-transition: all .7s ease;
  161. -moz-transition: all .7s ease;
  162. -o-transition: all .7s ease;
  163. transition: all .7s ease;
  164. }
  165.  
  166. .entry:hover{
  167. opacity:1;}
  168.  
  169.  
  170. .entry .perma a{
  171. color:#444;}
  172.  
  173. .entry .perma a:hover {
  174. text-decoration: none;
  175. font-style:;
  176. text-shadow:0px 0px 2px #000;
  177. color: {color:Hover};
  178. }
  179.  
  180. .entry .perma{
  181. width:38px;
  182. height:30px;
  183. position: absolute;
  184. line-height: 33px;
  185. overflow:hidden;
  186. font-family:dixel;
  187. text-align:left;
  188. padding-left:4px;
  189. font-size:8px;
  190. left:-50px;
  191. bottom:5px;
  192. border-right:1px solid #f2f2f2;
  193. border-top:1px solid #f2f2f2;
  194. background:white;
  195. letter-spacing: 0px;
  196. opacity: 0.0;
  197. -webkit-transition: all .7s ease;
  198. -moz-transition: all .7s ease;
  199. -o-transition: all .7s ease;
  200. transition: all .7s ease;
  201. border-top-right-radius:90px;
  202. -moz-border-top-right-radius:90px;
  203. -webkit-border-top-right-radius:90px;
  204.  
  205. }
  206.  
  207. .entry:hover .perma{
  208. margin-left: 0px;
  209. left:5px;
  210. overflow:visible;
  211. opacity:0.85;
  212. }
  213.  
  214. .entry .perma2 a{
  215. color:#444;}
  216.  
  217. .entry .perma2 a:hover {
  218. text-decoration: none;
  219. font-style:;
  220. text-shadow:0px 0px 2px #000;
  221. color: {color:Hover};
  222. }
  223.  
  224. .entry .perma2{
  225. width:auto;
  226. height:30px;
  227. position: absolute;
  228. line-height: 28px;
  229. overflow:hidden;
  230. font-family:dixel;
  231. text-align:center;
  232. padding-left:20px;
  233. padding-right:10px;
  234. font-size:8px;
  235. right:-50px;
  236. top:5px;
  237. border-left:1px solid #f2f2f2;
  238. border-bottom:1px solid #f2f2f2;
  239. background:white;
  240. letter-spacing: 0px;
  241. opacity: 0.0;
  242. -webkit-transition: all .7s ease;
  243. -moz-transition: all .7s ease;
  244. -o-transition: all .7s ease;
  245. transition: all .7s ease;
  246. border-bottom-left-radius:90px;
  247. -moz-border-bottom-left-radius:90px;
  248. -webkit-border-bottom-left-radius:90px;}
  249.  
  250. .entry:hover .perma2{
  251. margin-left: 0px;
  252. right:5px;
  253. overflow:visible;
  254. opacity:0.85;
  255. -webkit-transition: all .7s ease;
  256. -moz-transition: all .7s ease;
  257. -o-transition: all .7s ease;
  258. transition: all .7s ease;
  259. }
  260.  
  261. #posts {
  262.  
  263. width:450px;
  264. margin-top:3px;
  265. z-index:1;
  266. margin-left:365px;
  267. right:auto;
  268. background:transparent;
  269. margin-right:auto;
  270. position:relative;
  271. overflow-y: hidden;
  272. }
  273.  
  274. #sidebar{
  275. position:fixed !important;
  276. width:220px;
  277. background-image:url('{image:sidebarbg}');
  278. background:white;
  279. height:100%;
  280. padding:5px;
  281. padding-top:120px;
  282. margin-top:6px;
  283. margin-left:127px;
  284. text-align:center;
  285. line-height:8px;
  286. opacity:0.85;
  287. border:2px solid {color:borders};
  288. -webkit-transition: all .7s ease;
  289. -moz-transition: all .7s ease;
  290. -o-transition: all .7s ease;
  291. transition: all .7s ease;
  292. }
  293.  
  294.  
  295. #sidebar:hover{
  296. opacity:1;
  297. }
  298.  
  299. #desc{
  300. position:fixed;
  301. width:224px;
  302.  
  303. padding:3px;
  304. padding-top:4px;
  305. height:auto;
  306. margin-left:-5px;
  307. margin-top:-4px;
  308. line-height:9px;
  309. overflow:hidden;
  310. background:white;
  311. border-top:1px solid {color:borders};
  312. -webkit-transition: all .7s ease;
  313. -moz-transition: all .7s ease;
  314. -o-transition: all .7s ease;
  315. transition: all .7s ease;
  316. }
  317.  
  318.  
  319.  
  320. #links{
  321. width:224px;
  322. line-height:18px;
  323. opacity:1;
  324. margin-top:-3px;
  325. margin-left:-6px;
  326. padding:3px;
  327. -webkit-transition: all .7s ease;
  328. -moz-transition: all .7s ease;
  329. -o-transition: all .7s ease;
  330. transition: all .7s ease;
  331. }
  332.  
  333.  
  334. #sidebarpic{
  335. width:220px;-webkit-filter:grayscale(0%);
  336. -webkit-transition: all .7s ease;
  337. -moz-transition: all .7s ease;
  338. -o-transition: all .7s ease;
  339. transition: all .7s ease;
  340. }
  341.  
  342. #sidebarpic img{
  343. width:220px;
  344. }
  345.  
  346. @font-face {
  347. font-family: "jenna";
  348. src: url('http://static.tumblr.com/jdjsstr/W6qm7fotz/simpleronde-regular_1_.ttf');
  349. }
  350.  
  351. .title{
  352. font-family:cedarville;
  353. font-size: 17px;
  354. line-height: 17px;
  355. color:{color:Title};
  356. letter-spacing: 0px;
  357. font-weight: normal;
  358. padding:0px 0px 0px 0px;
  359. }
  360.  
  361.  
  362. @font-face { font-family: "dixel"; src: url('http://static.tumblr.com/jdjsstr/8ovm78cbb/pf_arma_five_1_.ttf'); }
  363. @font-face { font-family: "cedarville"; src: url('http://themes.googleusercontent.com/static/fonts/cedarvillecursive/v2/cuCe6HrkcqrWTWTUE7dw-5zpMnghKP_wiJrQSyqob5U.woff'); }
  364.  
  365.  
  366. .permalink{
  367. text-transform: normal;
  368. display: block;
  369. text-align: right;
  370. text-decoration: none;
  371. }
  372.  
  373. #infscr-loading{
  374. bottom: -70px;
  375. position: absolute;
  376. left: 50%;
  377. margin-left:-8px;
  378. width:16px;
  379. height:11px;
  380. overflow:hidden;
  381. margin-bottom: 50px;
  382. }
  383.  
  384. #postnotes{
  385. text-align: justify;}
  386.  
  387. #postnotes blockquote{
  388. border: 0px;}
  389.  
  390. blockquote{
  391. padding:0px 0px 2px 5px;
  392. margin:0px 0px 2px 10px;
  393. border-left: 1px dotted #555555;
  394. }
  395.  
  396. blockquote p, ul{
  397. margin:0px;
  398. padding:0px;
  399. }
  400.  
  401. a img{border: 0px;}
  402.  
  403.  
  404. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  405.  
  406. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  407. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  408.  
  409. .notes img{width:10px; position:relative; top:3px;}
  410. <--ses-->
  411. small{font-size: 90%;}
  412.  
  413. {CustomCSS}
  414.  
  415. </style>
  416.  
  417. {block:IndexPage}
  418. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  419. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  420.  
  421. <script type="text/javascript">
  422. $(window).load(function(){
  423. var $wall = $('#posts');
  424. $wall.imagesLoaded(function(){
  425. $wall.masonry({
  426. itemSelector: '.entry, .entry_photo',
  427. isAnimated : false
  428. });
  429. });
  430.  
  431. $wall.infinitescroll({
  432. navSelector : '#pagination',
  433. nextSelector : '#pagination a',
  434. itemSelector : '.entry, .entry_photo',
  435. bufferPx : 2000,
  436. debug : false,
  437. errorCallback: function() {
  438. $('#infscr-loading').fadeOut('normal');
  439. }},
  440. function( newElements ) {
  441. var $newElems = $( newElements );
  442. $newElems.hide();
  443. $newElems.imagesLoaded(function(){
  444. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  445. });
  446. }); $('#posts').show(500);
  447. });
  448. </script>
  449.  
  450.  
  451. {/block:IndexPage}
  452.  
  453.  
  454. <title>{title}</title>
  455.  
  456. <link rel="shortcut icon" href="{Favicon}" />
  457. <meta name="viewport" content="width=820" />
  458. </head>
  459.  
  460. <body>
  461. <BODY onselectstart="return false;" ondragstart="return false;">
  462. <div class="wrapper">
  463. <div class="header">
  464. </div>
  465.  
  466. <div id="cage">
  467. <div id="center">
  468. <div id="sidebar">
  469.  
  470. <center>
  471. <div id="sidebarpic"><a href="/"><img src="{image:sidebar}"></a></div><div id="links">
  472. <a href="{text:link one}">{text:link one title}</a> {text:link separation} <a href="{text:link two}">{text:link two title}</a> {text:link separation} <a href="{text:link three}">{text:link three title}</a>{block:iflinkfourtitle} {text:link separation} <a href="{text:link four}">{text:link four title}</a>{/block:iflinkfourtitle}{block:iflinkfivetitle} {text:link separation} <a href="{text:link five}">{text:link five title}</a>{/block:iflinkfivetitle}</div><div id="desc">
  473. {description}
  474. </div></div>
  475. </center>
  476.  
  477.  
  478. <div class="left">
  479. <div id="posts">
  480. {block:Posts}
  481. <div class="entry">
  482.  
  483. {block:Answer}
  484. <div style="margin-top:2px; margin-bottom:0px; overflow:auto;height:40px; padding: 4px; background-color:#fff;border:1px solid {color:borders};border-radius:4px;">
  485. <img src="{AskerPortraitURL-40}" width="40" align="left" style="margin-right:3.5px;"/><askname>{asker}</askname>: {Question}</div>
  486. <div style="margin-top:2px; margin-bottom:4px; background: transparent;">{Answer}</div>
  487. <div class="permalink"> <a href="{permalink}">{notecountwithlabel}</a> </div>
  488. {/block:Answer}
  489.  
  490. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  491.  
  492. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{notecountwithlabel}</a></a><br>{/block:HasTags}</span></align>
  493. {/block:Text}
  494.  
  495. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  496.  
  497. class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"></span></align>{block:Link}
  498.  
  499. {block:Photo}
  500. {block:IndexPage}
  501. <center>
  502. <div class="perma2">
  503. <a href="{Permalink}"> {notecount}</a> </div>
  504. <div class="perma">
  505. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  506. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  507. {/block:IndexPage}
  508. {block:PermalinkPage}
  509. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  510.  
  511. {LinkCloseTag}
  512. {/block:PermalinkPage}
  513. {/block:Photo}
  514.  
  515. {block:Photoset}
  516. {block:IndexPage}
  517. <center>
  518. <div class="perma2">
  519. <a href="{Permalink}"> {notecount}</a> </div>
  520. <div class="perma">
  521. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  522. {Photoset-250}</center>
  523. {/block:IndexPage}
  524. {block:PermalinkPage}
  525. <center>
  526. {Photoset-500}</center>
  527. {/block:PermalinkPage}
  528. {/block:Photoset}
  529.  
  530. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  531.  
  532. href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </span>{/block:Quote}
  533.  
  534. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  535. <ul class="chat">
  536. {block:Lines}
  537. <li class="user_{UserNumber}">
  538. {block:Label}
  539. <span class="label">{Label}</span>
  540. {/block:Label}
  541.  
  542. {Line}
  543. </li>
  544. {/block:Lines}
  545. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}">
  546. {/block:Chat}
  547.  
  548. {block:Audio}
  549. <div style="width:200px; height:30px;">
  550. {AudioPlayerBlack}
  551. </div>
  552. {block:IndexPage}<span class="permalink">
  553. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </a>
  554. </span>{/block:IndexPage}
  555. {/block:Audio}
  556.  
  557. {block:Video}
  558. {block:IndexPage}
  559. <center>
  560. <div class="perma2">
  561. <a href="{Permalink}"> {notecount}</a> </div>
  562. <div class="perma">
  563. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  564. {Video-250}</center>
  565. {/block:IndexPage}
  566. {block:PermalinkPage}
  567. <center>
  568. {Video-400}</center>
  569. {/block:PermalinkPage}
  570. {block:Video}
  571.  
  572.  
  573. {block:PostNotes}<div align="middle">{caption}</div>
  574. <center>
  575.  
  576. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  577.  
  578. {block:HasTags}
  579. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  580. {block:RebloggedFrom}
  581. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  582. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  583.  
  584. {/block:RebloggedFrom}
  585. </center></span>
  586. <br>
  587. <div id="postnotes">{PostNotes}</div><br>
  588.  
  589. <center>{block:ContentSource}
  590. <br><a href="{SourceURL}">
  591. {lang:Source}:
  592. {block:SourceLogo}
  593. <img src="{BlackLogoURL}" width="{LogoWidth}"
  594. height="{LogoHeight}" alt="{SourceTitle}" />
  595. {/block:SourceLogo}
  596. {block:NoSourceLogo}
  597. {SourceLink}
  598. {/block:NoSourceLogo}
  599. </a>
  600. {/block:ContentSource}</center>
  601.  
  602. {/block:PostNotes}
  603. </div>
  604. {/block:Posts}
  605. </div></div>
  606.  
  607. {block:IndexPage}
  608. {block:Pagination}
  609. <div id="pagination">
  610. {block:NextPage}
  611. <a id="nextPage" href="{NextPage}"></a>
  612. {/block:NextPage}
  613. {block:PreviousPage}
  614. <a href="{PreviousPage}"></a>
  615. {/block:PreviousPage}
  616. </div>
  617. {/block:Pagination}
  618. {/block:IndexPage}
  619. </body>
  620. <div style="position:fixed;bottom:5px;right:5px;"><a href="http://twistedmiracles.tumblr.com">theme</a></div>
  621. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement