API tools faq
paste
Advertisement
tanaxmercedes

Theme #16: Byte

tanaxmercedes
Jul 17th, 2015
1,627
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.19 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. THIS THEME WAS CREATED BY TANA AKA TANATHEKITTYGOESRAWR AKA...
  3.  
  4. ╱╱╱╭╮╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╭╮╭╮
  5. ╱╱╱┃┃╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╭╯╰┫┃
  6. ╭━━┫┃╭━━┳━━┳━━┳━╮╭━━┳━━╮╰╮╭┫╰━┳━━┳╮╭┳━━┳━━╮
  7. ┃┃━┫┃┃┃━┫╭╮┃╭╮┃╭╮┫╭━┫┃━┫╱┃┃┃╭╮┃┃━┫╰╯┃┃━┫━━┫
  8. ┃┃━┫╰┫┃━┫╰╯┃╭╮┃┃┃┃╰━┫┃━┫╱┃╰┫┃┃┃┃━┫┃┃┃┃━╋━━┃
  9. ╰━━┻━┻━━┻━╮┣╯╰┻╯╰┻━━┻━━╯╱╰━┻╯╰┻━━┻┻┻┻━━┻━━╯
  10. ╱╱╱╱╱╱╱╱╭━╯┃
  11. ╱╱╱╱╱╱╱╱╰━━╯
  12.  
  13. PLEASE KEEP ALL CREDITS AND NO STEALING CODING; IT IS VERY RUDE AND ALSO VERY I L L E G A L.
  14.  
  15. THANK YOU! I HOPE YOU ENJOY MY BYTE THEME!
  16.  
  17. - TANA XO
  18.  
  19. TANATHEKITTYGOESRAWR / STARBVCKS-WBU
  20. -->
  21. <!--
  22. Hello everyone, this code base was made by me (Hisabeel) so that you can use to make your own themes, appreciate it maintain that initial message and to give me credit on your blog by the base code, thanks. :)
  23. -->
  24.  
  25. <html lang="en">
  26. <script type="text/javascript"
  27. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  28. <script>
  29. $(document).ready(function() {
  30. //
  31. $('a.poplight[href^=#]').click(function() {
  32. var popID = $(this).attr('rel'); //Get Popup Name
  33. var popURL = $(this).attr('href'); //Get Popup href to define size
  34. var query= popURL.split('?');
  35. var dim= query[1].split('&');
  36. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  37. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  38. var popMargTop = ($('#' + popID).height() + 80) / 2;
  39. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  40. //Apply Margin to Popup
  41. $('#' + popID).css({
  42. 'margin-top' : -popMargTop,
  43. 'margin-left' : -popMargLeft
  44. });
  45. $('body').append('<div id="fade"></div>');
  46. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  47. return false;
  48. });
  49. $('a.close, #fade').live('click', function() {
  50. $('#fade , .popup_block').fadeOut(function() {
  51. $('#fade, a.close').remove(); //fade them both out
  52. });
  53. return false;
  54. });
  55. });
  56. </script>
  57.  
  58. <script type="text/javascript">
  59. <!--
  60.  
  61. // Disable Right Click Script
  62.  
  63. function IE(e)
  64. {
  65. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  66. {
  67. return false;
  68. }
  69. }
  70. function NS(e)
  71. {
  72. if (document.layers || (document.getElementById && !document.all))
  73. {
  74. if (e.which == "2" || e.which == "3")
  75. {
  76. return false;
  77. }
  78. }
  79. }
  80. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  81.  
  82. //-->
  83. </script>
  84.  
  85. <!--THESE CODES ARE DOING WORK THE THEME, BACKGROUND COLOR CHANGING OR ADDING A CUSTOM BACKGROUND, CHANGE THE NUMBER OF LINKS, ETC.-->
  86. <meta name="color:Background" content="#ffffff"/>
  87. <meta name="color:Title" content="#9999999"/>
  88. <meta name="color:Text" content="#999999"/>
  89. <meta name="color:Link" content="#999999"/>
  90. <meta name="color:Hover" content="#eeeeee"/>
  91. <meta name="color:Blog Title" content="#888888"/>
  92. <meta name="image:Background" content=""/>
  93. <meta name="image:Sidebar" content=""/>
  94. <meta name="image:Favicon" content=""/>
  95. <meta name="text:Blog Title" content="Blog Title"/>
  96. <meta name="text:Tab Title" content="Tab Title"/>
  97. <meta name="text:Music Player Code" content="Put the code to your billy music player here!"/>
  98. <meta name="if:MusicPlayer" content=""/>
  99. <meta name="text:Photo Hover Message" content="Here you can write a small or even somewhat long message to your visitors! When they hover over your sidebar image, they will see it."/>
  100. <meta name="text:Tab Title 1" content="Tab Title"/>
  101. <meta name="text:Tab Text 1" content="Tab Text"/>
  102. <meta name="text:Tab Title 2" content="Tab Title"/>
  103. <meta name="text:Tab Text 2" content="Tab Text"/>
  104. <meta name="text:Tab Title 3" content="Tab Title"/>
  105. <meta name="text:Tab Text 3" content="Tab Text"/>
  106.  
  107. <meta name="text:Popup Title" content="Popup Title"/>
  108. <meta name="text:Popup Text Here" content="Popup Text"/>
  109.  
  110. <meta name="color:Object Background" content="#f9f9f9"/>
  111. <meta name="color:Object Top Border" content="#ddd"/>
  112.  
  113. <!--HERE ARE THE SITES WHERE WILL GIVE LINKS-->
  114. <meta name="text:Link One" content="" />
  115. <meta name="text:Link Two" content="" />
  116. <meta name="text:Link Three" content="" />
  117. <meta name="text:Link Four" content="" />
  118.  
  119. <!--HERE ARE PLACED THE NAMES OF LINKS-->
  120. <meta name="text:Link 1 hover text" content="Title Here" />
  121. <meta name="text:Link 2 hover text" content="Title Here" />
  122. <meta name="text:Link 3 hover text" content="Title Here" />
  123. <meta name="text:Link 4 hover text" content="Title Here" />
  124.  
  125. <!--HERE ARE PLACED THE LABELS SAYING WHAT EACH LINK-->
  126. <meta name="text:Link One Title" content="refresh"/>
  127. <meta name="text:Link Two Title" content="inbox"/>
  128. <meta name="text:Link Three Title" content="navigation"/>
  129. <meta name="text:Link Four Title" content="archive"/>
  130. </script>
  131. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  132.  
  133. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  134.  
  135. <script>
  136.  
  137. (function($){
  138.  
  139. $(document).ready(function(){
  140.  
  141. $("a[title]").style_my_tooltips({
  142.  
  143. tip_follows_cursor:true,
  144.  
  145. tip_delay_time:90,
  146.  
  147. tip_fade_speed:600,
  148.  
  149. attribute:"title"
  150.  
  151. });
  152.  
  153. });
  154.  
  155. })(jQuery);
  156.  
  157. </script>
  158. <!--basic tooltip from tutorial-baby! Enjoy-->
  159. <style>
  160. .tooltip{
  161. display: inline;
  162. position: relative;
  163. }
  164. #s-m-t-tooltip {
  165. max-width:300px;
  166. border-top:{color:Object Top Border} 3px solid;
  167. border-radius:3px 3px 0px 0px;
  168. padding:4px 4px 4px 4px;
  169. margin:20px 7px -2px 20px; /*distance from word*/
  170. background-color:{color:Object Background};
  171. font-family:lucida grande;
  172. font-size:9px;
  173. letter-spacing:2px;
  174. text-transform:lowercase;
  175. color:#999; /*tooltip font color*/
  176. z-index:999999999999999999999999999999999999;
  177. }
  178. </style>
  179.  
  180. <style type="text/css">
  181. /*--IFRAME ARE THE CODES OF CONTROL BUTTONS (DASHBOARD, FOLLOW/UNFOLLOW)--*/
  182. iframe#tumblr_controls{
  183. z-index:9;
  184. opacity:0.5 !important;
  185. -webkit-filter:invert(100%);
  186. top:0px !important;
  187. right:8px !important;
  188. position:fixed!important;
  189. }
  190.  
  191. iframe#tumblr_controls {right:3px !important; position:fixed !important;-webkit-transition:opacity 0.7s linear; opacity:0.2; -webkit-transition: all 0.8s ease-out; -moz-transition:all 0.8s ease-out; transition:all 0.8s ease-out; z-index:99999}
  192.  
  193. iframe#tumblr_controls:hover {-webkit-transition:opacity 0.7s linear; opacity:1.0; -webkit-transition:all 0.4s ease-out; -moz-transition:all 0.4s ease-out; transition: all 0.4s ease-out; z-index:99999;}
  194.  
  195.  
  196. /*--SCROLLBAR IS THE SIDE BAR THAT APPEARS ON RIGHT CORNER OF THE THEME, WHAT DOES WALKING DOWN THE BLOG AND UP, JUST CHANGE NOW FOR EXPERIENCED--
  197. ::-webkit-scrollbar {width: 8px; height: 4px; background:#f5f5f5; border-left: 1px solid #f5f5f5; }
  198.  
  199. ::-webkit-scrollbar-thumb { background-color:{color:Title}; border-bottom: 1px solid #fff; border-radius:5px; border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #fff; }*/
  200.  
  201.  
  202. /*--I RECCOMMEND TO NOT TOUCH ANY OF THIS--*/
  203. a:link, a:active, a:visited{
  204. color:{color:Link};
  205. text-decoration:none;
  206. -webkit-transition:all 0.6s ease-out; -moz-transition:all 0.6s ease-out;-o-transition:all 0.6s ease-out; transition:all 0.6s ease-out;}
  207.  
  208. a:hover{
  209. color:{color:Hover};
  210. text-decoration:none;
  211. -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out; transition:all 0.3s ease-out;
  212. cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), auto;}
  213.  
  214.  
  215. /*--I RECCOMMEND TO NOT TOUCH ANY OF THIS--*/
  216. #audio {
  217. width:200px;
  218. height:auto;
  219. min-height:60px;
  220. padding-bottom:0px;
  221. }
  222.  
  223. .cover {
  224. position:absolute;
  225. z-index:1;
  226. width:60px;
  227. height:60px;
  228. }
  229.  
  230. .cover img {
  231. float:left;
  232. width:60px;
  233. height:60px;
  234. }
  235.  
  236. .playbox {
  237. opacity:0.6;
  238. width:27px;
  239. height:30px;
  240. overflow:hidden;
  241. position:absolute;
  242. z-index:1000;
  243. margin-left:17px;
  244. margin-top:17px;
  245. text-align:center;
  246. }
  247.  
  248. .info {
  249. margin-left:73px;
  250. margin-top:4px;
  251. line-height:14px;
  252. }
  253.  
  254. #cunt{width:250px; height:auto;}
  255. {block:PermalinkPage}
  256. width:10px;
  257. {/block:PermalinkPage}
  258. }
  259.  
  260. #center{
  261. padding-top:3px;
  262. padding-bottom:3px;
  263. position:fixed !important;
  264. width:250px;
  265. height:207px;
  266. background-color:#fff;
  267. {block:PermalinkPage}
  268. width:410px;
  269. height:207px;
  270. {/block:PermalinkPage}
  271. }
  272.  
  273. body {
  274. padding: 0px;
  275. margin: 0px;
  276. color:{color:text};
  277. font-family: calibri;
  278. line-height:13px;
  279. font-size:12px;
  280. background-color: {color:Background};
  281. background-image:url({image:Background});
  282. background-attachment: fixed;
  283. background-repeat: repeat;
  284. }
  285.  
  286. /*--HERE YOU CAN CHANGE THE AMOUNT OF COLUMNS YOU WANT--*/
  287. #posts{
  288. float:center;
  289. {block:indexpage}
  290. width:685px; /*--1000px for 4 columns, 800px for 3 columns, 600px for 2 columns and 200px for 1 columns--*/
  291. {/block:indexpage}
  292. {block:permalinkpage}
  293. width:600px;
  294. {/block:permalinkpage}
  295. margin-left:400px;
  296. margin-top:10px;
  297. z-index:;
  298. }
  299.  
  300. /*--CUSTOMIZE ENTRY SETTINGS--*/
  301. #entry img{
  302. {block:indexpage}
  303. background:#fff;
  304. max-width:250px;
  305. {block:PermalinkPage}
  306. width:500px;
  307. {/block:PermalinkPage}
  308. opacity:0.7;
  309. z-index:9;
  310. -webkit-transition:all 0.7s ease-out;
  311. -moz-transition:all 0.7s ease-out;
  312. transition:all 0.7s ease-out;
  313. {/block:indexpage}
  314. }
  315.  
  316. #entry{
  317. z-index:9;
  318. margin:8px;
  319. float:left;
  320. font-size:10px;
  321. line-height:13px;
  322. text-transform:normal;
  323. width:250px;
  324. margin-right:60px;
  325. margin-top:40px;
  326. padding:12px;
  327. background:{color:Object Background};
  328. border-top:{color:Object Top Border} 15px solid;
  329. border-radius:3px 3px 0px 0px;
  330. {block:PermalinkPage}
  331. opacity:0.8;
  332. width:500px;
  333. margin-top:15px;
  334. margin-left:20px;
  335. z-index:999;
  336. {/block:PermalinkPage}
  337. -moz-transition: all 3.9s ease-out;
  338. -o-transition: all 3.9s ease-out;
  339. -webkit-transition: all 3.9s ease-out;
  340. transition: all 3.9s ease-out;
  341. }
  342.  
  343. #entry:hover{
  344. -moz-transition: all 3.9s ease-out;
  345. -o-transition: all 3.9s ease-out;
  346. -webkit-transition: all 3.9s ease-out;
  347. transition: all 3.9s ease-out;
  348. }
  349.  
  350.  
  351. /*--CUSTOMIZE THE APPEARANCE OF PERMALINKS--*/
  352. #entry .perma{
  353. width:auto;
  354. height:auto;
  355. font-family:lucida grande;
  356. font-size:8px;
  357. line-height:12px;
  358. opacity:0;
  359. text-align:center;
  360. text-transform:uppercase;
  361. background:#fff;
  362. border:1px solid #eee;
  363. position:absolute;
  364. z-index:99999;
  365. overflow:hidden;
  366. margin-top:5px;
  367. right:-30px;
  368. padding:6px;
  369. -moz-transition: all .2s ease;
  370. -o-transition: all .2s ease;
  371. -webkit-transition: all .2s ease;
  372. transition: all .2s ease;
  373. }
  374. #entry:hover .perma{
  375. overflow:visible;
  376. opacity:1;
  377. margin-top:5px;
  378. transform: rotate(0deg);
  379. -ms-transform: rotate(0deg);
  380. -webkit-transform: rotate(0deg);
  381. -o-transform: rotate(0deg);
  382. -moz-transform: rotate(0deg);
  383. -moz-transition: all .2s ease;
  384. -o-transition: all .2s ease;
  385. -webkit-transition: all .2s ease;
  386. transition: all .2s ease;
  387. }
  388.  
  389. #entry .perma2{
  390. width:auto;
  391. height:auto;
  392. opacity:0;
  393. font-family:lucida grande;
  394. font-size:8px;
  395. line-height:12px;
  396. text-align:center;
  397. text-transform:uppercase;
  398. background:#fff;
  399. border:1px solid #eee;
  400. position:absolute;
  401. z-index:99999;
  402. overflow:hidden;
  403. margin-top:35px;
  404. right:-30px;
  405. padding:6px;
  406. -moz-transition: all .4s ease;
  407. -o-transition: all .4s ease;
  408. -webkit-transition: all .4s ease;
  409. transition: all .4s ease;
  410. }
  411. #entry:hover .perma2{
  412. overflow:visible;
  413. opacity:1;
  414. transform: rotate(0deg);
  415. -ms-transform: rotate(0deg);
  416. -webkit-transform: rotate(0deg);
  417. -o-transform: rotate(0deg);
  418. -moz-transform: rotate(0deg);
  419. -moz-transition: all .4s ease;
  420. -o-transition: all .4s ease;
  421. -webkit-transition: all .4s ease;
  422. transition: all .4s ease;
  423. }
  424.  
  425. #entry .perma3{
  426. opacity:0;
  427. width:16px;
  428. height:auto;
  429. font-family:lucida grande;
  430. font-size:8px;
  431. line-height:12px;
  432. text-align:center;
  433. text-transform:uppercase;
  434. background:#fff;
  435. border:1px solid #eee;
  436. position:absolute;
  437. z-index:99999;
  438. overflow:hidden;
  439. margin-top:65px;
  440. right:-30px;
  441. padding:6px;
  442. -moz-transition: all .8s ease;
  443. -o-transition: all .8s ease;
  444. -webkit-transition: all .8s ease;
  445. transition: all .8s ease;
  446. }
  447. #entry:hover .perma3{
  448. overflow:visible;
  449. opacity:1;
  450. transform: rotate(0deg);
  451. -ms-transform: rotate(0deg);
  452. -webkit-transform: rotate(0deg);
  453. -o-transform: rotate(0deg);
  454. -moz-transform: rotate(0deg);
  455. -moz-transition: all .8s ease;
  456. -o-transition: all .8s ease;
  457. -webkit-transition: all .8s ease;
  458. transition: all .8s ease;
  459. }
  460.  
  461. .permalinktext{
  462. display:block;
  463. text-align:right;
  464. text-decoration:none;
  465. font-size:8px;
  466. letter-spacing:1px;
  467. padding-top:5px;
  468. text-transform:uppercase;
  469. background:{color:Object Background};
  470. border:1px solid #f3f3f3;
  471. padding:2px;
  472. }
  473.  
  474.  
  475. /*--CUSTOMIZE TITLE OF ENTRIES--*/
  476. .title{
  477. line-height:12px;
  478. color:{color:Title};
  479. font-weight:normal;
  480. }
  481.  
  482.  
  483. /*--CUSTOMIZE TITLE OF SIDEBAR--*/
  484. #blogtitle{
  485. position: fixed !important;
  486. z-index:999999;
  487. width:250px;
  488. margin-top:360px;
  489. margin-left:165px;
  490. color:{color:Blog Title};
  491. font-family:lucida grande;
  492. font-size:20px;
  493. line-height:10px;
  494. }
  495.  
  496.  
  497. /*--CUSTOMIZE SIDEBAR--*/
  498. #sidebar{
  499. position:fixed !important;
  500. width:173px;
  501. height:173px;
  502. margin-top:100px;
  503. margin-left:40px;
  504. padding:12px;
  505. background:{color:Object Background};
  506. border-top:{color:Object Top Border} 15px solid;
  507. border-radius:3px 3px 0px 0px;
  508. }
  509.  
  510.  
  511. /*--CUSTOMIZE DESCRIPTION--*/
  512. div#desc{
  513. position:fixed !important;
  514. opacity:1.0;
  515. width:140px;
  516. max-height:200px;
  517. overflow:hidden;
  518. padding:12px;
  519. color:#999;
  520. margin-top:240px;
  521. margin-left:100px;
  522. font-size:8.5px;
  523. line-height:13px;
  524. font-family:lucida grande;
  525. background:{color:Object Background};
  526. border-top:{color:Object Top Border} 15px solid;
  527. border-radius:3px 3px 0px 0px;
  528. text-align:justify; /*--you can put center, left, right or justify--*/
  529. }
  530.  
  531. #musicplayer{
  532. position:fixed !important;
  533. background:{color:Object Background};
  534. border-top:{color:Object Top Border} 15px solid;
  535. border-radius:3px 3px 0px 0px;
  536. bottom:80px;
  537. left:100px;
  538. width:15px;
  539. height:20px;
  540. padding:10px;
  541. overflow:hidden;
  542. -webkit-transition: all 0.9s ease-in-out;
  543. -moz-transition: all 0.9s ease-in-out;
  544. -o-transition: all 0.9s ease-in-out;
  545. }
  546. #musicplayer:hover{
  547. width:200px;
  548. -webkit-transition: all 0.9s ease-in-out;
  549. -moz-transition: all 0.9s ease-in-out;
  550. -o-transition: all 0.9s ease-in-out;
  551. }
  552.  
  553. /*--CUSTOMIZE LINKS--*/
  554. #links{
  555. opacity:1.0;
  556. position:fixed!important;
  557. width:120px;
  558. height:125px;
  559. padding:10px;
  560. color:{color:Text};
  561. font-size:10px;
  562. font-family:lucida grande;
  563. letter-spacing:0px;
  564. text-transform:none;
  565. text-transform:lowercase;
  566. right:160px;
  567. line-height:26px;
  568. margin-top:320px;
  569. background:{color:Object Background};
  570. border-top:{color:Object Top Border} 15px solid;
  571. border-radius:3px 3px 0px 0px;
  572. -webkit-transition: all 0.9s ease-in-out;
  573. -moz-transition: all 0.9s ease-in-out;
  574. -o-transition: all 0.9s ease-in-out;
  575. }
  576.  
  577. #li1{
  578. border-radius:2px;
  579. text-align:left;
  580. position:fixed !important;
  581. width:110px;
  582. height:10px;
  583. padding:5px;
  584. margin-top:0px;
  585. margin-left:0px;
  586. background:#eee;
  587. font-size:10px;
  588. line-height:12px;
  589. -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.1);
  590. -webkit-transition: all .7s ease;
  591. -moz-transition: all .7s ease;
  592. -o-transition: all .7s ease;
  593. transition: all .7s ease;
  594. }
  595.  
  596. #li1:hover{
  597. -webkit-box-shadow: inset 150px 0px 0px #e1e1e1;
  598. }
  599.  
  600.  
  601. .updatesastats{
  602. padding:5px;
  603. font-family:arial;
  604. text-align:center;
  605. width:16px;
  606. height:auto;
  607. border:0px solid #eee;
  608. background:transparent;/*{color:Link}*/
  609. margin-top:100px;
  610. margin-left:70px;
  611. color:#fff;
  612. opacity:.3;
  613. font-size:11px;
  614. -webkit-transition: all 0.6s ease-out;
  615. -moz-transition:all 0.6s ease-out;
  616. transition:all 0.6s ease-out;
  617. }
  618.  
  619. .updatesastats:hover{
  620. -webkit-transition: all 0.6s ease-out;
  621. -moz-transition:all 0.6s ease-out;
  622. transition:all 0.6s ease-out;
  623. opacity:.2;
  624. }
  625.  
  626. #musicplayer{
  627. position:fixed !important;
  628. background:{color:Object Background};
  629. border-top:{color:Object Top Border} 15px solid;
  630. border-radius:3px 3px 0px 0px;
  631. bottom:80px;
  632. left:100px;
  633. width:15px;
  634. height:20px;
  635. padding:10px;
  636. overflow:hidden;
  637. -webkit-transition: all 0.9s ease-in-out;
  638. -moz-transition: all 0.9s ease-in-out;
  639. -o-transition: all 0.9s ease-in-out;
  640. }
  641.  
  642. #musicplayer:hover{
  643. width:200px;
  644. -webkit-transition: all 0.9s ease-in-out;
  645. -moz-transition: all 0.9s ease-in-out;
  646. -o-transition: all 0.9s ease-in-out;
  647. }
  648.  
  649. .credits{
  650. opacity:.5;
  651. padding:5px;
  652. font-size:11px;
  653. font-family:arial;
  654. text-align:center;
  655. width:16px;
  656. height:auto;
  657. border:0px solid #eee;
  658. background:transparent;/*{color:Link}*/
  659. color:#fff;
  660. margin-top:0px;
  661. margin-left:70px;
  662. -webkit-transition: all 0.6s ease-out;
  663. -moz-transition:all 0.6s ease-out;
  664. transition:all 0.6s ease-out;
  665. }
  666.  
  667. .credits:hover{
  668. opacity:.2;
  669. -webkit-transition: all 0.6s ease-out;
  670. -moz-transition:all 0.6s ease-out;
  671. transition:all 0.6s ease-out;
  672. }
  673.  
  674.  
  675. /*--I RECCOMMEND TO NOT TOUCH ANY OF THIS--*/
  676. #infscr-loading{
  677. bottom: -70px;
  678. position: absolute;
  679. left: 50%;
  680. margin-left:-8px;
  681. width:16px;
  682. height:11px;
  683. overflow:hidden;
  684. margin-bottom: 50px;
  685. }
  686.  
  687. #postnotes{
  688. text-align: justify;}
  689.  
  690. #postnotes blockquote{
  691. border: 0px;}
  692.  
  693. blockquote{
  694. padding:0px 0px 2px 5px;
  695. margin:0px 0px 2px 10px;
  696. border-left: 1px dotted #eee;
  697. }
  698.  
  699. blockquote p, ul{
  700. margin:0px;
  701. padding:0px;
  702. }
  703.  
  704.  
  705. #fade { /*--Transparent background layer--*/
  706. display: none; /*--hidden by default--*/
  707. background: #000;
  708. background-image: url('');
  709. position: fixed; left: 0; top: 0;
  710. width: 100%; height: 100%;
  711. opacity: .50;
  712. z-index: 9999;
  713. }
  714. .popup_block{
  715. display: none; /*--hidden by default--*/
  716. background:{color:Object Background};
  717. border-top:{color:Object Top Border} 15px solid;
  718. border-radius:3px 3px 0px 0px;
  719. padding: 30px;
  720. float: left;
  721. font-size: 12px;
  722. position: fixed;
  723. top: 50%; left: 50%;
  724. z-index: 99999;
  725. /*--CSS3 Box Shadows--
  726. -webkit-box-shadow: 0px 0px 20px #000;
  727. -moz-box-shadow: 0px 0px 20px #000;
  728. box-shadow: 0px 0px 20px #000;*/
  729. }
  730. .h2 {
  731. margin:0px 0px 10px;
  732. padding:0px 0px 10px;
  733. font-size:12px;
  734. color:#222;
  735. width:100%;
  736. font-weight:bold;
  737. text-transform:uppercase;
  738. text-align:center;
  739. border-bottom:1px solid #eee;
  740. }
  741.  
  742.  
  743. #tab01{ /*This is the customization of EACH tab*/
  744. margin-bottom:5px;
  745. padding-left:4px;
  746. height:14px;
  747. text-align:center;
  748. overflow:hidden;
  749. margin-top:1px1px;
  750. text-transform:ppercase;
  751. letter-spacing:1px;
  752. font-size:10px;
  753. line-height:10px;
  754. z-index:0;
  755. padding:4px;
  756. -webkit-transition: all 0.7s ease-in-out;
  757. -moz-transition: all 0.7s ease-in-out;
  758. -o-transition: all 0.7s ease-in-out;
  759. }
  760. #tab01:hover{/*This is the customization of the tabs HOVER*/
  761. height:135px; /*how long the tab slides down. To try new transitions and stuff I always just google how to do stuff. You can adjust the transitions by scale, opacity, color, rotation, etc. Google is your friend!*/
  762. -webkit-transition: all 0.7s ease-in-out;
  763. -moz-transition: all 0.7s ease-in-out;
  764. -o-transition: all 0.7s ease-in-out;
  765. }
  766.  
  767. #tab02{ /*This is the customization of EACH tab*/
  768. margin-bottom:5px;
  769. padding-left:4px;
  770. height:14px;
  771. text-align:center;
  772. overflow:hidden;
  773. text-transform:upercase;
  774. letter-spacing:1px;
  775. font-size:10px;
  776. line-height:10px;
  777. z-index:0;
  778. border-top:1px {color:Object Top Border} solid;
  779. padding:4px;
  780. -webkit-transition: all 0.7s ease-in-out;
  781. -moz-transition: all 0.7s ease-in-out;
  782. -o-transition: all 0.7s ease-in-out;
  783. }
  784. #tab02:hover{/*This is the customization of the tabs HOVER*/
  785. height:120px; /*how long the tab slides down. To try new transitions and stuff I always just google how to do stuff. You can adjust the transitions by scale, opacity, color, rotation, etc. Google is your friend!*/
  786. -webkit-transition: all 0.7s ease-in-out;
  787. -moz-transition: all 0.7s ease-in-out;
  788. -o-transition: all 0.7s ease-in-out;
  789. }
  790.  
  791. #tab03{ /*This is the customization of EACH tab*/
  792. margin-bottom:5px;
  793. padding-left:4px;
  794. height:14px;
  795. text-align:center;
  796. overflow:hidden;
  797. text-transform:upercase;
  798. letter-spacing:1px;
  799. font-size:10px;
  800. line-height:10px;
  801. z-index:0;
  802. border-top:1px {color:Object Top Border} solid;
  803. padding:4px;
  804. -webkit-transition: all 0.7s ease-in-out;
  805. -moz-transition: all 0.7s ease-in-out;
  806. -o-transition: all 0.7s ease-in-out;
  807. }
  808. #tab03:hover{/*This is the customization of the tabs HOVER*/
  809. height:120px; /*how long the tab slides down. To try new transitions and stuff I always just google how to do stuff. You can adjust the transitions by scale, opacity, color, rotation, etc. Google is your friend!*/
  810. -webkit-transition: all 0.7s ease-in-out;
  811. -moz-transition: all 0.7s ease-in-out;
  812. -o-transition: all 0.7s ease-in-out;
  813. }
  814.  
  815. #container{/*this controls the position of the tabs, the over-all width, and the title of each tab.*/
  816. background:{color:Object Background};
  817. border-top:{color:Object Top Border} 15px solid;
  818. border-radius:3px 3px 0px 0px;
  819. text-align:left;
  820. font-size:9px;
  821. text-transform:upercase;
  822. position:fixed;
  823. font-family:lucida grande;
  824. right:80px;
  825. letter-spacing:1px;
  826. width:120px;
  827. z-index:9999;
  828. padding:4px;
  829. top:100px;
  830. }
  831.  
  832.  
  833.  
  834. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  835. .user_7 .label, .user_8 .label, .user_9 .label {color:Title};}
  836. </style>
  837.  
  838. <!--THE TITLE IS THE SMALL TITLE THAT APPEARS IN TAB THE BLOG IN FRONT OF FAVICON, OVER THERE, WHERE IS HTTP, IF YOU DON'T UNDERSTAND, GO ON THIS LINK - http://static.tumblr.com/pmxvx4i/HBen83kl0/title.png -->
  839. <title>{text:Tab Title}</title>
  840. <!--THE FAVICON IS THE SMALL ICON THAT APPEARS IN TAB THE BLOG, OVER THERE, WHERE IS HTTP, IF YOU DON'T UNDERSTAND, GO ON THIS LINK - http://static.tumblr.com/pmxvx4i/jOrn83kin/favicon.png -->
  841. <link rel="shortcut icon" href="{image:Favicon}">
  842.  
  843. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  844. <meta name="viewport" content="width=720" />
  845. </head>
  846.  
  847. <body>
  848.  
  849.  
  850. <div id="structure">
  851. <div id="container"><!---this holds the entire tab together--->
  852.  
  853. <!---begin tab 1 code--->
  854. <div id="tab01">
  855. <!---div styles will style everything inside of the div. So you can make your colors all different, sizes, text-transforms, opacity, just about anything you need to style what shows in the hover--->
  856. <div style="font-size:10px;color:#999; text-transform:lowercase;">{text:Tab Title 1}</div> <div style="padding-top:1px; text-transform:lowercase; opacity:.9; font-family: calibri; font-size:9px; line-height:9px; text-align:center; color:#b9b9b9;"><br>
  857. {text:Tab Text 1}
  858.  
  859. </div>
  860. </div>
  861. <!---end tab 1 code--->
  862.  
  863. <!---begin tab 2 code--->
  864. <div id="tab02">
  865. <div style="font-size:10px;color:#999;text-transform:lowercase;">{text:Tab Title 2}</div> <div style="padding-top:1px; text-transform:lowercase; opacity:.9; font-family: calibri; font-size:9px; line-height:10px; text-align:center; color:#b9b9b9;"><br>
  866. {text:Tab Text 2}
  867. </div></div>
  868. <!---end tab 2 code--->
  869.  
  870. <!---begin tab 3 code--->
  871. <div id="tab03">
  872. <div style="font-size:10px;color:#999;text-transform:lowercase;">{text:Tab Title 3}</div> <div style="padding-top:1px; text-transform:lowercase; opacity:.9; font-family: calibri; font-size:9px; line-height:10px; text-align:center; color:#b9b9b9;"><br>
  873. {text:Tab Text 3}
  874. </div>
  875. </div>
  876. <!---end tab 3 code--->
  877.  
  878.  
  879. <!---to add more tabs just copy and paste the tab codes and change the div title to the number of the new tab.--->
  880. </div></div>
  881.  
  882.  
  883. <div id="box1" class="popup_block">
  884. <div class="h2" style="text-align:left; font-style:italic;">{text:Popup Title}</div><center>
  885.  
  886. {text:Popup Text Here}
  887.  
  888. </div>
  889.  
  890. </div></div></div></div></div></div></div></div></div></div>
  891.  
  892.  
  893.  
  894. <div id="center">
  895. <div id="content">
  896.  
  897. <!--THIS CODE DOES WORK THE TITLE OVER THE SIDEBAR-->
  898. <div id="blogtitle">{text:Blog Title}</div>
  899.  
  900. <!--THIS CODE DOES WORK SIDEBAR-->
  901. <div id="sidebar">
  902. <!--THIS CODE DOES WORK DESCRIPTION-->
  903. <div id="desc">{description}</div>
  904.  
  905.  
  906. <!--THIS CODE DOES WORK LINKS-->
  907. <div id="links">
  908.  
  909. <div id="li1"><a href="{text:Link One}" title="{text:Link 1 hover text}">{text:Link One Title}</a></div><br>
  910.  
  911. <div id="li1"><a href="{text:Link Two}" title="{text:Link 2 hover text}">{text:Link Two Title}</a></div><br>
  912.  
  913. <div id="li1"><a href="{text:Link Three}" title="{text:Link 3 hover text}">{text:Link Three Title}</a></div><br>
  914.  
  915. <div id="li1"><a href="{text:Link Four}" title="{text:Link 4 hover text}">{text:Link Four Title}</a></div><br>
  916.  
  917. <div id="li1"><a href="http://tanathekittygoesrawr.tumblr.com/thmrules" title="Theme Creator" target="_blank">theme</a></div><br>
  918. </div>
  919.  
  920. <!--THIS CODE DOES WORK IMAGE OF SIDEBAR-->
  921. <a href="/" title="{text:Photo Hover Message}">
  922. <img src="{image:sidebar}" draggable="false" style="border:1px solid #eee; padding:10px; opacity:.8; width:150px; height:150px; background:white;"></a>
  923.  
  924. <div class="updatesastats"><a href="#?w=300" rel="box1" class="poplight"style="color:#fff;" title="{text:Popup Title}"><img src="http://static.tumblr.com/haqz6pj/quanr8jo8/8.png"></a></div>
  925.  
  926. </div>
  927.  
  928. {block:ifMusicPlayer}
  929. <div id="musicplayer">{text:Music Player Code}</div>
  930. {/block:ifMusicPlayer}
  931.  
  932. <!--THIS CODE DOES WORK POSTS, DON'T CHANGE ANYTHING IF NOT EXPERIENCED WITH CODES-->
  933. <div id="posts">
  934. {block:Posts}
  935. <div id="entry">
  936.  
  937. {block:Text}
  938. {block:Title}<span class="title">{Title}</span>{/block:Title}
  939. <span class="entrytext">{Body}</span>
  940. {block:IndexPage}<br>
  941. <div class="permalinktext">
  942. {DayOfMonth}, {ShortMonth} with <a href="{permalink}">{notecount} notes</a></div>{/block:IndexPage}
  943. {/block:Text}
  944.  
  945. {block:Link}
  946. <a href="{URL}" class="title">{Name}</a>
  947. {block:Description}{Description}{/block:Description}
  948. {block:IndexPage}<br>
  949. <div class="permalinktext">
  950. {Month} {DayOfMonth} with <a href="{permalink}">{notecount} notes</a>
  951. </div>
  952. {/block:IndexPage}
  953. {block:Link}
  954.  
  955. {block:Photo}{block:IndexPage}
  956. <div class="perma">
  957. <a title="permalink page" href="{Permalink}"><img src="http://static.tumblr.com/haqz6pj/HbAnr4xxd/link.png"></a></div>
  958.  
  959. <div class="perma2">
  960. <a title="click to reblog" href="{ReblogURL}"><img src="http://static.tumblr.com/haqz6pj/l1enr4xzu/repeat-2.png"></a></div>
  961.  
  962. <div class="perma3">
  963. <a title="click to like" href="{ReblogURL}">{LikeButton color="black" size="15"}</a></div>
  964.  
  965.  
  966. </center>{/block:IndexPage}
  967.  
  968.  
  969. {block:IndexPage}
  970. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=270px;>
  971. {/block:IndexPage}
  972. {block:permalinkpage}{LinkOpenTag}<center>
  973. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=360px;/>
  974. {LinkCloseTag}</center>{/block:permalinkpage}
  975. {/block:Photo}
  976.  
  977. {block:Photoset}
  978. {block:Photos}
  979. <div class="media">
  980. {LinkOpenTag}
  981. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  982. {LinkCloseTag}
  983. </div>
  984. {/block:Photos}
  985.  
  986. {/block:Photoset}
  987.  
  988. {block:Quote}
  989. <div class="quote" style="font-style:italic;">❝ {quote}</div>
  990. {block:IndexPage}<br>
  991. <div class="permalinktext">
  992. {DayOfMonth}, {ShortMonth} with <a href="{permalink}">{notecount} notes</a></div>{/block:IndexPage}
  993. {/block:Quote}
  994.  
  995. {block:Chat}
  996. {block:Title}<span class="title">{Title}</span>{/block:Title}
  997. <ul class="chat">
  998. {block:Lines}
  999. <li class="user_{UserNumber}">
  1000. {block:Label}
  1001. <span class="label">{Label}</span>
  1002. {/block:Label}
  1003.  
  1004. {Line}<br>
  1005. {/block:Lines}
  1006. {block:IndexPage}<br>
  1007. <div class="permalinktext">
  1008. {DayOfMonth}, {ShortMonth} with <a href="{permalink}">{notecount} notes</a></div>{/block:IndexPage}
  1009. {/block:Chat}
  1010.  
  1011. {block:Audio}
  1012. <div id="audio"><div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="playbox">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div><div class="info"><b>Artist:</b> <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br><b>Title:</b> <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><b>Album:</b> <span{block:Album} style="display:none;"{/block:Album}>Lovers</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br><b>Touch:</b> {FormattedPlayCount}{/block:PlayCount}</div></div>
  1013. {block:IndexPage}<br>
  1014. <div class="permalinktext">
  1015. <center> <font color="#fff">{DayOfMonth}, {ShortMonth} with</font> <a href="{permalink}"><font color="#fff">{notecount} notes</font></a></center></div>{/block:IndexPage}
  1016. {/block:Audio}
  1017.  
  1018. {block:Video}
  1019. <center>{block:IndexPage}
  1020. <div class="perma">
  1021. {DayOfMonth}, {ShortMonth} with <a href="{permalink}">{notecount}</a> - <a href="{reblogurl}">↻</a></div>
  1022. <div style="width:200px; overflow-x:hidden; overflow-y:hidden">{Video-250}</div>{/block:IndexPage}</center>
  1023.  
  1024. <center>{block:PermalinkPage}<div style="width: 450px; overflow-x:hidden; overflow-y:hidden">{Video-500}{/block:PermalinkPage}</center>
  1025. {block:Video}
  1026.  
  1027. {block:Answer}
  1028. <div style="border:1px solid #eee; margin:3px; margin-top:-5px; min-height:30px; padding:3px; background:#f7f7f7">
  1029. <img src="{AskerPortraitURL-30}" width="30" align="left"
  1030. style="margin-right:4px; margin-top:-6px; margin-left:0px; border:1px solid {color:Object Top Border}; padding:7px; background:#fff; box-shadow:0px 2px 6px rgba(0, 0, 0, 0.06); -moz-box-shadow:0px 2px 6px rgba(0, 0, 0, 0.06); -webkit-box-shadow:0px 2px 6px rgba(0, 0, 0, 0.06)">
  1031. <askk>{Asker}</askk>: {Question}</div>
  1032. <div style="font-family:; font-size:10px">{Answer}</div>
  1033. {/block:Answer}
  1034.  
  1035. {block:PermalinkPage}
  1036. <center><br>
  1037. {block:Date}posted <u>{DayOfWeek}</u>{/block:Date} {block:NoteCount}with {NoteCount} notes<br>{/block:NoteCount}
  1038. {block:RebloggedFrom}<b>source:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a> | <b>of:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br>{/block:RebloggedFrom}
  1039. {block:NoteCount} <div style="text-align:center; margin:5px"></div>{/block:NoteCount}</center>
  1040. {/block:PermalinkPage}
  1041. {block:PostNotes}
  1042. <div id="postnotes">{PostNotes}</div>
  1043. {/block:PostNotes}</div>{/block:Posts}
  1044. </div></div>
  1045.  
  1046.  
  1047.  
  1048. {block:indexpage}
  1049. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  1050. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  1051. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  1052. <script type="text/javascript">
  1053. $(window).load(function(){
  1054. var $wall = $('#posts');
  1055. $wall.imagesLoaded(function(){
  1056. $wall.masonry({
  1057. itemSelector: '#entry, #entry_photo',
  1058. isAnimated : false
  1059. });
  1060. });
  1061.  
  1062. $wall.infinitescroll({
  1063. navSelector : '#page-nav',
  1064. nextSelector : '#page-nav a',
  1065. itemSelector : '#entry, #entry_photo',
  1066. bufferPx : 2000,
  1067. debug : false,
  1068. errorCallback: function() {
  1069. $('#infscr-loading').fadeOut('normal');
  1070. }},
  1071. function( newElements ) {
  1072. var $newElems = $( newElements );
  1073. $newElems.hide();
  1074. $newElems.imagesLoaded(function(){
  1075. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1076. });
  1077. }); $('#content').show(500);
  1078. });
  1079. </script>
  1080. {/block:indexpage}
  1081.  
  1082. <body onkeydown="return false">
  1083. </body>
  1084. <div style="z-index:99999999999; position:fixed; text-shadow:1px 1px 2px #000; font-family:cambri; background:transparent; border:0px solid {color:Blog Title}; padding:3px; bottom:10px; right:10px; opacity:.9"><a href="http://tanathekittygoesrawr.tumblr.com/" title="Theme created by Tana xo"><img src="http://33.media.tumblr.com/644606c2c1397ef03ce62a585dc1c2c4/tumblr_inline_ni36jhJvPP1ry72eo.gif"></a></div>
  1085. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!