API tools faq
paste
darnpayne

themes page 1

darnpayne
Aug 2nd, 2013
85
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.45 KB | None | 0 0
raw download clone embed print report
  1. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  2. <head><title>{Title}</title>
  3. <link rel="shortcut icon" href="{Favicon}">
  4. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  5.  
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8.  
  9. <meta name="color:text" content""/>
  10. <meta name="color:links" content"#000000"/>
  11. <meta name="color:desc" content"#000000"/>
  12. <meta name="color:linkhover" content""/>
  13. <meta name="color:scrollbar" content"#000000"/>
  14. <meta name="color:border" content"#000000"/>
  15.  
  16.  
  17.  
  18. <script type="text/javascript" src="http://static.tumblr.com/iuggpng/bGqm4yfv9/jquery-1.7.2.js"></script>
  19. <script type="text/javascript"
  20. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  21. <script>
  22. $(document).ready(function() {
  23. //
  24. $('a.poplight[href^=#]').click(function() {
  25. var popID = $(this).attr('rel'); //Get Popup Name
  26. var popURL = $(this).attr('href'); //Get Popup href to define size
  27. var query= popURL.split('?');
  28. var dim= query[1].split('&');
  29. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  30. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('');
  31. var popMargTop = ($('#' + popID).height() + 80) / 2;
  32. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  33. //Apply Margin to Popup
  34. $('#' + popID).css({
  35. 'margin-top' : -popMargTop,
  36. 'margin-left' : -popMargLeft
  37. });
  38. $('body').append('<div id="fade"></div>');
  39. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  40. return false;
  41. });
  42. $('a.close, #fade').live('click', function() {
  43. $('#fade , .popup_block').fadeOut(function() {
  44. $('#fade, a.close').remove(); //fade them both out
  45. });
  46. return false;
  47. });
  48. });
  49. </script>
  50.  
  51.  
  52. <style type="text/css">
  53.  
  54.  
  55. #fade { /*--Transparent background layer--*/
  56. display: none; /*--hidden by default--*/
  57. background: #000;
  58. background-image: url('http://3.bp.blogspot.com/--iKHyzdRz-w/USTaF2IviZI/AAAAAAAADFw/p0Y9Ykpouwc/s1600/debut_dark.png');
  59. position: fixed; left: 0; top: 0;
  60. width: 100%; height: 100%;
  61. opacity: .90;
  62. z-index: 9999;
  63. }
  64. .popup_block{
  65.  
  66. border:1px solid #fff; /*the #fff (white) is for whatever color you want the border to be and the 1px is for how thick you want the border to be*/
  67.  
  68. border-radius:5px;
  69.  
  70. display: none;
  71.  
  72. background: #fff; /*background color is #fff*/
  73.  
  74. padding-top: 20px;
  75.  
  76. padding-bottom: 20px;
  77.  
  78. padding-left: 40px;
  79.  
  80. padding-right: 40px;
  81.  
  82. float: left;
  83.  
  84. position: fixed;
  85.  
  86. top: 50%;
  87.  
  88. left: 50%;
  89.  
  90. z-index: 9999999999999999999999999999999999999999;
  91.  
  92. }
  93.  
  94. img.btn_close {/*the close button*/
  95.  
  96. background-color:#fff;
  97.  
  98. padding:1px;
  99.  
  100. float: right;
  101.  
  102. margin-top:-20px;
  103.  
  104. margin-bottom:-20px;
  105.  
  106. margin-right:0px;
  107.  
  108. left:20px;
  109.  
  110. }
  111.  
  112. *html #fade {
  113.  
  114. position: absolute;
  115.  
  116. }
  117.  
  118. *html .popup_block {
  119.  
  120. position: absolute;
  121.  
  122. }
  123.  
  124. #fade {
  125.  
  126. background-color:#000;
  127.  
  128. display: none; /*--hidden by default--*/
  129.  
  130. position: fixed; left: 0; top: 0; width: 100%; height: 100%;
  131.  
  132. opacity: .6;
  133.  
  134. z-index: 9999;
  135.  
  136. }
  137.  
  138. body {
  139.  
  140. font-family: times new;
  141. font-size: 10px;
  142. color: {color:text};
  143. margin: 0;
  144. }
  145.  
  146. a {
  147. color: {color:links};
  148. text-decoration: none;
  149. }
  150.  
  151. a:hover {
  152. color: {color:linkhover};
  153. -webkit-transition: all 0.5s ease;
  154. -moz-transition: all 0.5s ease;
  155. -o-transition: all 0.5s ease;
  156. }
  157.  
  158.  
  159.  
  160.  
  161. #content {
  162. position: fixed;
  163. top: 150px;
  164. right: 100px;
  165. height:350px;
  166. width:500px;
  167. overflow:auto;
  168. padding: 1px;
  169. opacity: 1;
  170. }
  171.  
  172.  
  173.  
  174. .posts {
  175. padding: 19px;
  176. margin-top: 0px;
  177. overflow: hidden;
  178.  
  179. width: 450px;
  180.  
  181. }
  182.  
  183.  
  184. .posts img {
  185. max-width: 50%;
  186. }
  187.  
  188.  
  189. .posts a {
  190. letter-spacing: 1px;
  191. }
  192.  
  193. @font-face{font-family: Sweetly Broken;src:url(http://static.tumblr.com/iddq6cw/MZUlwm0mp/sweetly_broken.ttf);}
  194.  
  195. @font-face{font-family:Just Realize;src:url(http://static.tumblr.com/sghs9ih/2tFlu5il8/justrealize.ttf);}
  196.  
  197. .sidebartitle {
  198. margin-top:310px;
  199. margin-left:-250px;
  200. font-size:70px;
  201. position:fixed;
  202. font-family:sweetly broken;
  203. text-align:left;
  204. color:#000;
  205. text-shadow: -3px 2px #000;
  206. -webkit-transform:rotate(270deg);
  207. -moz-transform:rotate(270deg);
  208. -o-transform:rotate(270deg);
  209. }
  210.  
  211.  
  212. #themesection {
  213. width: 600px;
  214. padding:6px;
  215. margin-left:100px;
  216. margin-top:20px;
  217. border:12px solid #000;
  218. }
  219.  
  220. #theme {
  221. padding-bottom:7px;
  222. padding-left:25px;
  223. padding-top: 15px;
  224. padding-right:15px;
  225. margin-left:15px;
  226. display:inline-block;
  227. border:3px double #000;
  228. }
  229.  
  230. #theme img {
  231. width:225px;
  232. height:160px;
  233. padding:5px;
  234. margin-top:1px;
  235. }
  236.  
  237.  
  238. #top {
  239. background-image:url('{image:top}');
  240. position: fixed;
  241. top: 10px;
  242. left: 283px;
  243. width: 585px;
  244. height: 99px;
  245. text-align: justify;
  246. }
  247.  
  248.  
  249.  
  250.  
  251. #pagination {
  252. position: fixed;
  253. bottom: 120px;
  254. background-color: #fff;
  255. right: 100px;
  256. width: 300px;
  257. word-spacing: 10px;
  258. padding: 5px;
  259. margin-left: 0px;
  260. font-size:11px;
  261. text-align:center;
  262. opacity: 1;
  263. font-family: calibri;
  264. text-transform: uppercase;
  265. transition: all 0.7s ease-out;
  266. -o-transition-transition: all 0.7s ease-out;
  267. -webkit-transition: all 0.7s ease-out;
  268. -moz-transition: all 0.7s ease-out;
  269.  
  270. }
  271.  
  272.  
  273.  
  274. #description {
  275. position:fixed;
  276. font-family:cambria;
  277. line-height:90%;
  278. font-size:23px;
  279. font-style:italic;
  280. width:70px;
  281. margin-top:160px;
  282. padding:14px;
  283. margin-left:480px;
  284. text-align:center;
  285. color:#000;
  286. border:5px double #000;
  287. position:fixed;
  288. }
  289.  
  290.  
  291.  
  292.  
  293.  
  294. #links {
  295. text-align: center;
  296. width: 1080px;
  297. font-family: times new;
  298. letter-spacing:15px;
  299. font-size: 300%;
  300. color: #fff;
  301. margin-top: 60px;
  302. margin-left: 375px;
  303. text-transform: uppercase;
  304. opacity: .9;
  305. text-shadow: -1px 1px #df01a5;
  306. transition: all 0.8s ease-out;
  307. -o-transition-transition: all 0.8s ease-out;
  308. -webkit-transition: all 0.8s ease-out;
  309. -moz-transition: all 0.8s ease-out;
  310. }
  311.  
  312.  
  313. #links a {
  314. color: #000;
  315. display: free;
  316. padding: 4px;
  317. background-color: #fff;
  318. opacity: .9;
  319. transition: all 0.5s ease-out;
  320. -o-transition-transition: all 0.5s ease-out;
  321. -webkit-transition: all 0.5s ease-out;
  322. -moz-transition: all 0.5s ease-out;
  323. }
  324.  
  325.  
  326. #title {
  327. font-family:cambria;
  328. width:225px;
  329. text-transform:uppercase;
  330. font-size:13px;
  331. letter-spacing:1px;
  332. font-style:none;
  333. margin-bottom:-5px;
  334. margin-left:0px;
  335. text-align:center;
  336. color:#000;
  337. background-color:rgba;
  338. padding:5px;
  339. text-shadow: -1px 1px #df01a5;
  340. }
  341.  
  342. #title a {
  343. opacity:1;
  344. }
  345.  
  346.  
  347.  
  348. #info {
  349. text-align:center;
  350. padding:7px 2px 8px 6px;
  351. background-color:#000;
  352. margin-top:-4px;
  353. color:#fff;
  354. width:225px;
  355. font-family:cambria;
  356. letter-spacing:0px;
  357. background-color:#df01a5;
  358. font-size:12px;
  359. text-transform:uppercase;
  360. text-shadow: -1px 1px #000000;
  361. }
  362.  
  363. #info a {
  364. padding:3px 32px 3px 33px;
  365. margin-right:0px;
  366. color:#fff;
  367. }
  368.  
  369. #info a:hover {
  370. color:#fff;
  371. opacity:1;
  372. }
  373.  
  374.  
  375. #albumart img {
  376. width: 50px;
  377. height: 50px;
  378. }
  379.  
  380.  
  381. #permalink {
  382. padding: 5px 10px 5px 10px;
  383.  
  384. }
  385.  
  386. blockquote {
  387. padding: 1px 1px 1px 10px;
  388. margin: 5px;
  389. }
  390.  
  391.  
  392.  
  393. #captions {
  394. width:500px;
  395. text-align:justify;
  396. line-height:120%;
  397.  
  398. }
  399.  
  400. #audiocaptions {
  401. display: block;
  402. padding: 1px 10px 1px 10px;
  403. margin-top: 10px;
  404. {block:IfNotShowCaptions}
  405. {block:IndexPage}
  406. display: none;
  407. {/block:IndexPage}
  408. {/block:IfNotShowCaptions}
  409. }
  410.  
  411.  
  412. ::-webkit-scrollbar {background-color:#fff; height:8px; width:4px}
  413. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:50px}
  414. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar}; height:8px!important}
  415.  
  416. #answer a {
  417. font-style: italic;
  418. }
  419.  
  420. #credit a {
  421. position:fixed;
  422. bottom:5px;
  423. right:-52px;
  424. text-transform:uppercase;
  425. color:#666666;
  426. font-size:8px;
  427. width:80px;
  428. font-family:consolas;
  429. text-align:center;
  430. transition: all 0.7s ease-out;
  431. -o-transition-transition: all 0.7s ease-out;
  432. -webkit-transition: all 0.7s ease-out;
  433. -moz-transition: all 0.7s ease-out;
  434. }
  435.  
  436. #credit a:hover {
  437. right: -3px;
  438. transition: all 0.7s ease-out;
  439. -o-transition-transition: all 0.7s ease-out;
  440. -webkit-transition: all 0.7s ease-out;
  441. -moz-transition: all 0.7s ease-out;
  442. }
  443.  
  444.  
  445. iframe#tumblr_controls {
  446. position: fixed !important;
  447. z-index: 9999;
  448. }
  449.  
  450. #yolo {
  451. background-color: {color:scrollbar};
  452. color: #eee;
  453. width: 505px;
  454. padding-left: 20px;
  455. padding-right: 20px;
  456. padding-top: 5px;
  457. padding-bottom: 5px;
  458. font-size: 90%;
  459. text-transform: uppercase;
  460. letter-spacing: 1px;
  461. position: fixed;
  462. top: 130px;
  463. right: 100px;
  464. text-align: center;
  465. }
  466.  
  467. </style>
  468.  
  469. </head><script type="text/javascript"
  470. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  471.  
  472. <script>
  473.  
  474.  
  475.  
  476. $(document).ready(function() {
  477.  
  478. //
  479.  
  480.  
  481.  
  482. //When you click on a link with class of poplight and the href starts with a #
  483.  
  484. $('a.poplight[href^=#]').click(function() {
  485.  
  486. var popID = $(this).attr('rel'); //Get Popup Name
  487.  
  488. var popURL = $(this).attr('href'); //Get Popup href to define size
  489.  
  490.  
  491.  
  492. //Pull Query & Variables from href URL
  493.  
  494. var query= popURL.split('?');
  495.  
  496. var dim= query[1].split('&');
  497.  
  498. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  499.  
  500.  
  501.  
  502. //Fade in the Popup and add close button
  503.  
  504. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://tiny.cc/closeimg" class="btn_close" title="Close Window" alt="Close" /></a>');
  505.  
  506.  
  507. //Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
  508.  
  509. var popMargTop = ($('#' + popID).height() + 80) / 2;
  510.  
  511. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  512.  
  513.  
  514.  
  515. //Apply Margin to Popup
  516.  
  517. $('#' + popID).css({
  518.  
  519. 'margin-top' : -popMargTop,
  520.  
  521. 'margin-left' : -popMargLeft
  522.  
  523. });
  524.  
  525.  
  526.  
  527. //Fade in Background
  528.  
  529. $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  530.  
  531. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
  532.  
  533.  
  534.  
  535. return false;
  536.  
  537. });
  538.  
  539.  
  540.  
  541. //Close Popups and Fade Layer
  542.  
  543. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  544.  
  545. $('#fade , .popup_block').fadeOut(function() {
  546.  
  547. $('#fade, a.close').remove(); //fade them both out
  548.  
  549. });
  550.  
  551. return false;
  552.  
  553. });
  554.  
  555.  
  556.  
  557.  
  558.  
  559. });
  560.  
  561. </script>
  562.  
  563. <!-- DON'T TOUCH ANYTHING HERE -->
  564.  
  565. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  566. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  567. <script>
  568. $(function(){
  569. var $container = $('#container');
  570. $container.imagesLoaded(function(){
  571. $container.masonry({
  572. itemSelector: '.char',
  573. });
  574. });
  575. $container.infinitescroll({
  576. itemSelector : ".char",
  577. loadingImg : "",
  578. loadingText : "<em></em>",
  579. bufferPx : 10000,
  580. extraScrollPx: 12000,
  581. },
  582. // trigger Masonry as a callback
  583. function( newElements ) {
  584. var $newElems = $( newElements ).css({ opacity: 0 });
  585. // ensure that images load before adding to masonry layout
  586. $newElems.imagesLoaded(function(){
  587. $newElems.animate({ opacity: 1 });
  588. $container.masonry( 'appended', $newElems, true );
  589. });
  590. }
  591. );
  592. });
  593. </script> <div id="popup_name" class="popup_block">
  594. - faq stuff here</a><br>
  595. <br>
  596. <iframe style="frameborder="0" id="ask_form" height="190" width="440"scrolling="yes" src="http://www.tumblr.com/ask_form/YOURURLHEREOKAY.tumblr.com" ></iframe>
  597. </div>
  598.  
  599.  
  600.  
  601. <body>
  602.  
  603.  
  604. <div class="sidebartitle">swiggity swoat punch her in the throat</div>
  605. </div>
  606.  
  607. <div id="themesection">
  608. <div id="theme">
  609. <div id="title">theme 07: TITLE</div>
  610. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  611. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  612. <div id="theme">
  613. <div id="title">theme 06: TITLE</div>
  614. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  615. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  616. <div id="theme">
  617. <div id="title">theme 05: TITLE</div>
  618. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  619. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  620. <div id="theme">
  621. <div id="title">theme 04: TITLE</div>
  622. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  623. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  624. <div id="theme">
  625. <div id="title">theme 03: TITLE</div>
  626. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  627. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  628. <div id="theme">
  629. <div id="title">theme 02: TITLE</div>
  630. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  631. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  632. <div id="theme">
  633. <div id="title">theme 01: TITLE</div>
  634. <img src="http://axcelonbp.com/wp-content/uploads/2013/01/Comingsoon.png">
  635. <div id="info"><a href="/">prev</a><a href="/">stuffs</a></div></div>
  636.  
  637. </div>
  638.  
  639.  
  640. <div id="content">
  641.  
  642. <div id="top">
  643.  
  644.  
  645. <div id="description">{Description}</div>
  646.  
  647.  
  648. <div id="links">
  649. <a href="{text:link1url}">{text:link1name}</a> •
  650. <a href="#?w=500" rel="popup_name" class="poplight">ask</a>•
  651. <a href="{text:link3url}">{text:link3name}</a>
  652. </div>
  653.  
  654. </div>
  655.  
  656.  
  657. <div id="pagination">
  658. {block:Pagination}
  659. <div class="ha">
  660. {block:PreviousPage}
  661. <a href="{PreviousPage}">«</a>
  662. {/block:PreviousPage}
  663. {block:JumpPagination length="5"}
  664. {block:CurrentPage}
  665. <span class="current_page">{PageNumber}</span>
  666. {/block:CurrentPage}
  667.  
  668. {block:JumpPage}
  669. <a class="jump_page" href="{URL}">{PageNumber}</a>
  670. {/block:JumpPage}
  671. {/block:JumpPagination}
  672. {block:NextPage}
  673. <a href="{NextPage}">»</a>
  674. {/block:NextPage}
  675. </div>
  676. {/block:Pagination}
  677. </div>
  678.  
  679.  
  680.  
  681. <div id="yolo">stuff</div>
  682.  
  683. {block:Posts}
  684.  
  685. <div class="posts">
  686.  
  687.  
  688. {block:Text}
  689.  
  690. {block:Title}
  691. {Title}
  692. {/block:Title}
  693.  
  694. {Body}
  695.  
  696. {/block:Text}
  697.  
  698.  
  699.  
  700.  
  701. {block:Photo}
  702.  
  703. <center>
  704. <img src="{PhotoURL-500}">
  705. </center>
  706.  
  707. {block:Caption}
  708. <div id="captions">
  709. {Caption}</div>
  710. {/block:Caption}
  711.  
  712. {/block:Photo}
  713.  
  714.  
  715.  
  716. {block:Photoset}<center>{Photoset-500}</center>
  717. {block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  718.  
  719.  
  720.  
  721. {block:Quote}
  722.  
  723. ❝{Quote}
  724.  
  725. {block:Source}
  726. <br><br>—{Source}
  727. {/block:Source}
  728.  
  729. {/block:Quote}
  730.  
  731.  
  732.  
  733. {block:Link}
  734.  
  735. <a href="{URL}" {Target}>+ {Name}</a>
  736.  
  737. {block:Description}
  738. {Description}
  739. {/block:Description}
  740.  
  741. {/block:Link}
  742.  
  743.  
  744.  
  745. {block:Answer}
  746.  
  747. <center> <b>{Asker}</b>: <i>{Question}</i>
  748.  
  749. <div id="answer">{Answer}</div></center>
  750.  
  751. {/block:Answer}
  752.  
  753.  
  754. </div>
  755.  
  756. <div id="info">
  757.  
  758. {block:Date}
  759.  
  760.  
  761. {MonthNumberWithZero} / {DayOfMonthWithZero} / {Year}
  762. {/block:Date}
  763.  
  764. {/block:ContentSource}
  765.  
  766. {block:PermalinkPage}
  767. <span style="text-align:left;">{block:PostNotes}
  768. {PostNotes}
  769. {/block:PostNotes}</span>
  770. {/block:PermalinkPage}
  771.  
  772.  
  773. </div>
  774.  
  775.  
  776. {/block:Posts}
  777.  
  778. <div id="credit" data="credit"> <a href="http://sherinos.tumblr.com"><img src="http://i1362.photobucket.com/albums/r689/sheerinos/white_zpse41868d6.jpg?t=1374529320" width="75px" height="30px"</a>
  779.  
  780. </div>
  781. <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), progress !important;}</style><a href="http://www.cursors-4u.com/" target="_blank" title="Small Grey Outline Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Small Grey Outline Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>
  782.  
  783.  
  784. </div>
  785.  
  786. </body>
  787. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!