Advertisement
hor4ny

"Rainy Days" theme - Twistedmiracles

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