Advertisement
hor4ny

"Truly, Madly, Deeply" theme - TwistedMiracles

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