Advertisement
iusedtobeher-themes

~The blue box~

Jan 13th, 2013
69
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.43 KB | None | 0 0
  1. <!--Theme by iusedtobeher | tumblr . Please don't remove credit. I love you. Have an amazing day! β™₯-->
  2.  
  3. <html lang="en">
  4. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6.  
  7.  
  8. <head>
  9.  
  10. <link href='http://fonts.googleapis.com/css?family=Donegal+One' rel='stylesheet' type='text/css'>
  11.  
  12.  
  13. <script type="text/javascript"
  14. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  15.  
  16. <!-- DEFAULT VARIABLES -->
  17. <link href='http://fonts.googleapis.com/css?family=Didact+Gothic' rel='stylesheet' type='text/css'>
  18. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  19. <meta name="color:background" content=""/>
  20. <meta name="color:links" content=""/>
  21. <meta name="color:link shadow" content=""/>
  22. <meta name="color:hover" content=""/>
  23. <meta name="color:text" content=""/>
  24. <meta name="color:description" content=""/>
  25. <meta name="color:title" content=""/>
  26. <meta name="color:Blog Title" content="">
  27. <meta name="color:Borders" content="">
  28. <meta name="color:scrollbar" content=""/>
  29. <meta name="color:Blog Title Shadow" content="" />
  30. <meta name="image:background" content=""/>
  31. <meta name="image:sidebar" content=""/>
  32. <meta name="text:Blog Title" content="" />
  33.  
  34. <meta name="text:Link One" content="" />
  35. <meta name="text:Link One Title" content="link" />
  36.  
  37. <meta name="text:Link Two" content="" />
  38. <meta name="text:Link Two Title" content="link" />
  39.  
  40. <meta name="text:Link Three" content="" />
  41. <meta name="text:Link Three Title" content="link" />
  42.  
  43. <style type="text/css">
  44.  
  45. ::-webkit-scrollbar {width: 5px; height: 4px; background: #fff; border-left: 1px transparent #aaaaaa; }
  46.  
  47. ::-webkit-scrollbar-thumb { background-color:{color:scrollbar}; border-bottom: 1px transparent #aaaaaa; border-top: 1px transparent #aaaaaa; border-left: 1px transparent
  48. #aaaaaa; border-right: 1px transparent #aaaaaa; }
  49.  
  50. #tumblr_controls {
  51. right:3px !important;
  52. position: fixed !important;
  53. }
  54.  
  55. body {
  56. padding: 0px;
  57. margin: 0px;
  58. color:{color:text};
  59. font-family: pixel;
  60. line-height: 8px;
  61. font-size: 8px;
  62. letter-spacing: 0px;
  63. background-color: {color:Background};
  64. background-image:url({image:Background});
  65. background-attachment: fixed;
  66. background-repeat: repeat;
  67. }
  68.  
  69. a:link, a:active, a:visited{
  70. color: {color:links};
  71. text-decoration: none;
  72. }
  73.  
  74. a:hover {
  75. color:{color:hover};
  76. text-decoration: none;
  77. -webkit-transition: color 0.3s ease-out;
  78. -moz-transition: color 0.3s ease-out;
  79. text-shadow:1px 1px 5px {color:link shadow};
  80. }
  81.  
  82. askk {
  83. font-family: arsenalewhite;
  84. font-size:35px;
  85. text-transform:none;
  86. z-index:1;
  87. color: {color:links};
  88. }
  89.  
  90. @font-face { font-family: "arsenalewhite"; src: url('http://static.tumblr.com/5fd89aw/H0ilkmgoh/arsenale_white.ttf'); }
  91.  
  92. @font-face { font-family: "halohandletter"; src: url('http://static.tumblr.com/loouiuu/Ttaloide6/halohandletter.ttf'); }
  93.  
  94.  
  95. div#center{
  96. margin:auto;
  97. position:relative;
  98. width:900px;
  99. background-color:;
  100. overflow:auto;
  101. overflow-y:hidden;
  102. }
  103.  
  104. div#sidebar{
  105. position: fixed;
  106. padding: 2px;
  107. height:100%;
  108. width:275px;
  109. margin-left:0px;
  110. margin-top:0px;
  111. border-right:5px solid {color:Borders};
  112. transition: all 0.9s ease;
  113. -o-transition-transition: all 0.9s ease;
  114. -webkit-transition: all 0.9s ease;
  115. -moz-transition: all 0.9s ease;
  116. }
  117.  
  118. #sidebar:hover{
  119. transition: all 0.9s ease;
  120. -o-transition-transition: all 0.9s ease;
  121. -webkit-transition: all 0.9s ease;
  122. -moz-transition: all 0.9s ease;
  123. }
  124.  
  125. #desc{
  126. position:fixed;
  127. opacity:0;
  128. width:270px;
  129. height:auto;
  130. font-family:pixel;
  131. margin-top:340px;
  132. margin-left:3px;
  133. font-size:8px;
  134. color:white;
  135. text-align:center;
  136. transition: all 0.9s ease;
  137. -o-transition-transition: all 0.9s ease;
  138. -webkit-transition: all 0.9s ease;
  139. -moz-transition: all 0.9s ease;
  140. }
  141.  
  142. #sideimage {
  143. opacity:0;
  144. width:275px;
  145. height:150px;
  146. border:1px white;
  147. margin-left:0px;
  148. margin-top:50px;
  149. background-image:url({image:sidebar});
  150. background-attachment: center;
  151. background-repeat: no-repeat;
  152. transition: all 0.9s ease;
  153. -o-transition-transition: all 0.9s ease;
  154. -webkit-transition: all 0.9s ease;
  155. -moz-transition: all 0.9s ease;
  156. }
  157.  
  158. #sidebar:hover #sideimage{
  159. opacity:1;
  160. transition: all 0.9s ease;
  161. -o-transition-transition: all 0.9s ease;
  162. -webkit-transition: all 0.9s ease;
  163. -moz-transition: all 0.9s ease;
  164. }
  165.  
  166. #sidebar:hover #desc{
  167. margin-top:350px;
  168. opacity:1;
  169. transition: all 0.9s ease;
  170. -o-transition-transition: all 0.9s ease;
  171. -webkit-transition: all 0.9s ease;
  172. -moz-transition: all 0.9s ease;
  173. }
  174.  
  175. #derp{
  176. width:250px;
  177. height:150px;
  178. opacity:0;
  179. margin-top:-150px;
  180. background:transparent;
  181. transition: all 0.9s ease;
  182. -o-transition-transition: all 0.9s ease;
  183. -webkit-transition: all 0.9s ease;
  184. -moz-transition: all 0.9s ease;
  185. }
  186.  
  187. #sidebar:hover #derp{
  188. opacity:0.8;
  189. margin-left:100px;
  190. transition: all 0.9s ease;
  191. -o-transition-transition: all 0.9s ease;
  192. -webkit-transition: all 0.9s ease;
  193. -moz-transition: all 0.9s ease;
  194. }
  195.  
  196. #linkbar{
  197. font-size:15px;
  198. font-family:Donegal One;
  199. text-align:center;
  200. position:fixed;
  201. height: 10px;
  202. width: 200px;
  203. margin-left:35px;
  204. margin-top:100px;
  205. opacity:0;
  206. color:white;
  207. line-height:16px;
  208. padding:2px;
  209. transition: all 0.9s ease;
  210. -o-transition-transition: all 0.9s ease;
  211. -webkit-transition: all 0.9s ease;
  212. -moz-transition: all 0.9s ease;
  213. }
  214.  
  215. #sidebar:hover #linkbar{
  216. opacity:1;
  217. margin-left:35px;
  218. transition: all 0.9s ease;
  219. -o-transition-transition: all 0.9s ease;
  220. -webkit-transition: all 0.9s ease;
  221. -moz-transition: all 0.9s ease;
  222. }
  223.  
  224. #sidebar:hover #blogtitle{
  225. margin-top:270px;
  226. font-size:100px;
  227. transition: all 0.9s ease;
  228. -o-transition-transition: all 0.9s ease;
  229. -webkit-transition: all 0.9s ease;
  230. -moz-transition: all 0.9s ease;
  231. -webkit-transform: rotate(0deg);
  232. -moz-transform: rotate(0deg);
  233. }
  234.  
  235. #blogtitle{
  236. position:fixed;
  237. margin-top:300px;
  238. margin-left:20px;
  239. text-align:left;
  240. font-family:halohandletter;
  241. font-size:200px;
  242. color:{color:Blog Title};
  243. text-shadow: 2px 1px 0px {color:Blog Title Shadow};
  244. transition: all 0.9s ease;
  245. -o-transition-transition: all 0.9s ease;
  246. -webkit-transition: all 0.9s ease;
  247. -moz-transition: all 0.9s ease;
  248. -webkit-transform: rotate(-90deg);
  249. -moz-transform: rotate(-90deg);
  250. }
  251.  
  252. #posts {
  253. width:800px;
  254. margin-top: 0px;
  255. margin-left:310px;
  256. right:auto;
  257. margin-right:auto;
  258. position:relative;
  259. overflow-y: hidden;
  260. padding:2px;
  261. {block:PermalinkPage}
  262. width:360px;
  263. padding:3px;
  264. text-align:center;
  265. {/block:PermalinkPage}
  266. {block:IndexPage}
  267. {/block:IndexPage}
  268. }
  269.  
  270. @font-face {font-family: 'pixel'; src: local('04b24'), url('http://static.tumblr.com/zm7jcjw/dtClscghb/04b_24__.ttf') format('woff'); }
  271.  
  272. .entry {
  273. float:left;
  274. display: block;
  275. overflow:hidden;
  276. width:200px;
  277. margin:2px;
  278. border:1px solid {color:Borders};
  279. padding-right:3px;
  280. padding-left:1px;
  281. padding-top:3px;
  282. padding-bottom:1px;
  283. font-family:pixel;
  284. letter-spacing:0px;
  285. font-size: 8px;
  286. line-height:10px;
  287. {block:PermalinkPage}
  288. width:350px;
  289. margin-left:0px;
  290. margin-top: 3px;
  291. text-align:center;
  292. {/block:PermalinkPage}
  293. background: transparent;
  294. opacity:1;
  295. webkit-transition: all 0.4s linear;
  296. -moz-transition: all 0.4s linear;
  297. transition: all 0.4s linear;
  298. }
  299.  
  300. .entry .permados a{
  301. color: #aaa;
  302. }
  303.  
  304. .entry .permalinktext a{
  305. color:#aaa;
  306. }
  307.  
  308. .entry .permados{
  309. position:absolute;
  310. margin-top: 5px;
  311. margin-left:-5px;
  312. width:auto;
  313. height:10px;
  314. text-transform: uppercase;
  315. background-color:#ffffff;
  316. padding:5px;
  317. overflow:hidden;
  318. font-family: pixel;
  319. letter-spacing:0px;
  320. font-size: 8px;
  321. line-height:10px;
  322. text-align:center;
  323. opacity:0.0;
  324. border: 1px solid #aaa;
  325. transition: all 0.9s ease;
  326. -o-transition-transition: all 0.9s ease;
  327. -webkit-transition: all 0.9s ease;
  328. -moz-transition: all 0.9s ease;
  329. }
  330.  
  331. .entry:hover .permados{
  332. margin-left: 5px;
  333. overflow:visible;
  334. opacity:0.9;
  335. transition: all 0.9s ease;
  336. -o-transition-transition: all 0.9s ease;
  337. -webkit-transition: all 0.9s ease;
  338. -moz-transition: all 0.9s ease;
  339. }
  340.  
  341. .permalinktext {
  342. display: block;
  343. padding: 1px;
  344. margin: 2px 0px 0px 5px;
  345. text-transform: uppercase;
  346. font-family:pixel;
  347. font-size: 8px;
  348. color: {color:text};
  349. line-height: 11px;
  350. letter-spacing:0px;
  351. text-align: right;
  352. text-decoration: none;
  353. border-top: 1px dotted #ddd;
  354. webkit-transition: all 0.2s linear;
  355. -webkit-transition: all 0.2s linear;
  356. -moz-transition: all 0.2s linear;
  357. transition: all 0.2s linear;
  358. }
  359.  
  360. .permalinktext:hover{
  361. margin:2px 4px 0px 5px;
  362. webkit-transition: all 0.2s linear;
  363. -webkit-transition: all 0.2s linear;
  364. -moz-transition: all 0.2s linear;
  365. transition: all 0.2s linear;
  366. }
  367.  
  368. .title{
  369. text-align: center;
  370. font-family: arsenalewhite;
  371. text-transform:none;
  372. font-size: 35px;
  373. line-height:12px;
  374. letter-spacing: 0px;
  375. color: {color:Title};
  376. }
  377.  
  378. #infscr-loading{
  379. bottom: -70px;
  380. position: absolute;
  381. left: 50%;
  382. margin-left:-8px;
  383. width:16px;
  384. height:11px;
  385. overflow:hidden;
  386. margin-bottom: 50px;
  387. }
  388.  
  389. #postnotes{
  390. text-align: center;}
  391.  
  392. #postnotes blockquote{
  393. border: 0px;}
  394.  
  395. blockquote{
  396. padding:0px 0px 0px 0px;
  397. margin:0px 0px 0px 0px;
  398. border-left: 1px dotted #555555;
  399. }
  400.  
  401. blockquote p, ul{
  402. margin:0px;
  403. padding:0px;
  404. }
  405.  
  406. a img{border: 0px;}
  407.  
  408.  
  409. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  410.  
  411. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  412. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  413.  
  414. .notes img{width:10px; position:relative; top:3px;}
  415. <--ses-->
  416. small{font-size: 90%;}
  417.  
  418. {CustomCSS}
  419.  
  420. </style>
  421.  
  422. {block:IndexPage}
  423. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  424. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  425.  
  426. <script type="text/javascript">
  427. $(window).load(function () {
  428. var $content = $('#posts');
  429. $content.masonry({itemSelector: '.entry'}),
  430. $content.infinitescroll({
  431. navSelector : 'div#pagination',
  432. nextSelector : 'div#pagination a#nextPage',
  433. itemSelector : '.entry',
  434. loading: {
  435. finishedMsg: '',
  436. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  437. },
  438. bufferPx : 600,
  439. debug : false,
  440. },
  441. // call masonry as a callback.
  442. function( newElements ) {
  443. var $newElems = $( newElements );
  444. $newElems.hide();
  445. // ensure that images load before adding to masonry layout
  446. $newElems.imagesLoaded(function(){
  447. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  448.  
  449.  
  450. });
  451. });
  452. });
  453. </script>
  454.  
  455. {/block:IndexPage}
  456.  
  457.  
  458. <title>{title}</title>
  459.  
  460. <link rel="shortcut icon" href="http://media.tumblr.com/tumblr_llidlpN38o1qzbrv5.png">
  461. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  462. <meta name="viewport" content="width=820" />
  463. </head>
  464.  
  465. <body>
  466. <div class="wrapper">
  467. <div class="header">
  468. </div>
  469.  
  470. <div id="sidebar">
  471.  
  472. <div id="blogtitle">{text:Blog Title}</div>
  473.  
  474. <div id="desc">{Description}</div>
  475. <div id="sideimage"></div>
  476. <div id="derp"></div>
  477.  
  478. <div id="linkbar">
  479. <a href="/">Home</a>
  480. <a href="/ask">Ask</a>
  481. <a href="{text:Link One}">{text:Link One Title}</a>
  482. <a href="{text:Link Two}">{text:Link Two Title}</a>
  483. <a href="{text:Link Three}">{text:Link Three Title}</a>
  484. </div>
  485.  
  486.  
  487. </div>
  488.  
  489. <div class="center">
  490. <div id="posts">
  491. {block:Posts}
  492. <div class="entry">
  493.  
  494. {block:Answer}
  495. <div style="min-height:30px; padding: 3px; border: 1px solid #ddd; background: white; color: black; padding:4px; box-shadow: 1px 1px 1px #ddd;">
  496. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  497. <askk>{Asker}</askk>: {Question}</div>
  498. <div style="padding:3px; text-align:left;"></div>
  499. {Answer}
  500. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>
  501. {/block:Answer}
  502.  
  503. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>
  504. {/block:Text}
  505.  
  506. {block:Link}<br><a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>{block:Link}
  507.  
  508. {block:Photo}
  509. {block:IndexPage}
  510. <div class="permados">
  511. <a href="{permalink}">{NoteCountWithLabel}</a> - <a href="{ReblogURL}" target="_blank"> Reblog </a></div>
  512. {LinkOpenTag}<a href="{permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" width=200px></a>{LinkCloseTag}</center>
  513. {/block:IndexPage}
  514. {block:PermalinkPage}
  515. {LinkOpenTag}
  516. <img src="{PhotoURL-500}" alt="{PhotoAlt}"width=270px/>
  517. {LinkCloseTag}
  518. {/block:PermalinkPage}
  519. {/block:Photo}
  520.  
  521. {block:Photoset}
  522. {block:IndexPage}
  523. <center>
  524. {Photoset-250}</center>
  525. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>
  526. {/block:IndexPage}
  527. {block:PermalinkPage}
  528. <center>
  529. {Photoset-500}</center>
  530. {/block:PermalinkPage}
  531. {/block:Photoset}
  532.  
  533. {block:Quote}<span class="title">"{Quote}"</span> β€” {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>{/block:Quote}
  534.  
  535. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  536. <ul class="chat">
  537. {block:Lines}
  538. <li class="user_{UserNumber}">
  539. {block:Label}
  540. <span class="label">{Label}</span>
  541. {/block:Label}
  542.  
  543. {Line}
  544. </li>
  545. {/block:Lines}
  546. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago}</a> </div>
  547. {/block:Chat}
  548.  
  549. {block:Audio}
  550. <div style="width:300px; height:30px;">
  551. {AudioPlayerBlack}
  552. </div>
  553. {block:IndexPage}<div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago}</a> </div>{/block:IndexPage}
  554. {/block:Audio}
  555.  
  556. {block:Video}{block:indexpage}{block:indexpage}{Video-400}<div class="perma"><a href="{permalink}" target="_blank">{NoteCountwithlabel}</a></div>{/block:IndexPage}<div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> &middot posted <a href="{permalink}">{timeago} </a> </div>{block:PermalinkPage}{Video-500}{/block:PermalinkPage}{/block:Video}
  557.  
  558. {block:PostNotes}<div align="middle">{caption}</div>
  559. <center>
  560.  
  561. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  562.  
  563. {block:HasTags}
  564. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  565. {block:RebloggedFrom}
  566. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  567. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  568.  
  569. {/block:RebloggedFrom}
  570. </center></span>
  571. <br>
  572. <div id="postnotes">{PostNotes}</div><br>
  573.  
  574. <center>{block:ContentSource}
  575. <br><a href="{SourceURL}">
  576. {lang:Source}:
  577. {block:SourceLogo}
  578. <img src="{BlackLogoURL}" width="{LogoWidth}"
  579. height="{LogoHeight}" alt="{SourceTitle}" />
  580. {/block:SourceLogo}
  581. {block:NoSourceLogo}
  582. {SourceLink}
  583. {/block:NoSourceLogo}
  584. </a>
  585. {/block:ContentSource}</center>
  586.  
  587. {/block:PostNotes}
  588. </div>
  589. {/block:Posts}
  590. </div></div>
  591.  
  592. {block:IndexPage}
  593. {block:Pagination}
  594. <div id="pagination">
  595. {block:NextPage}
  596. <a id="nextPage" href="{NextPage}"></a>
  597. {/block:NextPage}
  598. {block:PreviousPage}
  599. <a href="{PreviousPage}"></a>
  600. {/block:PreviousPage}
  601. </div>
  602. {/block:Pagination}
  603. {/block:IndexPage}
  604.  
  605.  
  606. <div style="position:fixed; bottom: 1px; left:3px;">
  607. <a href="http://iusedtobeher.tumblr.com/">C</a>
  608. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement