API tools faq
paste
Advertisement
emrys

16th theme

emrys
Jan 20th, 2013
45
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.00 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- theme by your mom (@ariahasting). don't steal -->
  4.  
  5. <script type="text/javascript"
  6. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  7.  
  8. <script>
  9.  
  10.  
  11.  
  12. $(document).ready(function() {
  13.  
  14. //
  15.  
  16.  
  17.  
  18. //When you click on a link with class of poplight and the href starts with a #
  19.  
  20. $('a.poplight[href^=#]').click(function() {
  21.  
  22. var popID = $(this).attr('rel'); //Get Popup Name
  23.  
  24. var popURL = $(this).attr('href'); //Get Popup href to define size
  25.  
  26.  
  27.  
  28. //Pull Query & Variables from href URL
  29.  
  30. var query= popURL.split('?');
  31.  
  32. var dim= query[1].split('&');
  33.  
  34. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  35.  
  36.  
  37.  
  38. //Fade in the Popup and add close button
  39.  
  40. $('#' + 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>');
  41.  
  42.  
  43. //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
  44.  
  45. var popMargTop = ($('#' + popID).height() + 80) / 2;
  46.  
  47. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  48.  
  49.  
  50.  
  51. //Apply Margin to Popup
  52.  
  53. $('#' + popID).css({
  54.  
  55. 'margin-top' : -popMargTop,
  56.  
  57. 'margin-left' : -popMargLeft
  58.  
  59. });
  60.  
  61.  
  62.  
  63. //Fade in Background
  64.  
  65. $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  66.  
  67. $('#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
  68.  
  69.  
  70.  
  71. return false;
  72.  
  73. });
  74.  
  75.  
  76.  
  77. //Close Popups and Fade Layer
  78.  
  79. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  80.  
  81. $('#fade , .popup_block').fadeOut(function() {
  82.  
  83. $('#fade, a.close').remove(); //fade them both out
  84.  
  85. });
  86.  
  87. return false;
  88.  
  89. });
  90.  
  91.  
  92.  
  93.  
  94.  
  95. });
  96.  
  97. </script>
  98. <head>
  99.  
  100.  
  101.  
  102. <!-- DEFAULT VARIABLES -->
  103. <meta name="color:background" content="#ffffff" />
  104. <meta name="color:entry" content="#ffffff" />
  105.  
  106.  
  107.  
  108. <meta name="color:title" content="#cccccc" />
  109. <meta name="color:text" content="#b1b1b1" />
  110. <meta name="color:link" content="#cccccc" />
  111. <meta name="color:qbackground" content="#f2f2f2" />
  112. <meta name="color:info"content="#CCCCCC">
  113. <meta name="color:border" content="#cccccc">
  114.  
  115.  
  116. <meta name="font:title" content="arial" />
  117. <meta name="font:body" content="arial" />
  118.  
  119. <meta name="image:sidebar" content=""/>
  120. <meta name="image:background" content="" />
  121.  
  122.  
  123.  
  124. <meta name="text:Link1" content="" />
  125. <meta name="text:Link1 Title" content="" />
  126. <meta name="text:Link2" content="" />
  127. <meta name="text:Link2 Title" content="" />
  128. <meta name="text:Link3" content="" />
  129. <meta name="text:Link3 Title" content="" />
  130. <meta name="text:Link4" content="" />
  131. <meta name="text:Link4 Title" content="" />
  132. <meta name="text:Link5" content="" />
  133. <meta name="text:Link5 Title" content="" />
  134. <meta name="color:scrollbarbg" content="#ffffff"/>
  135. <meta name="color:scrollbar" content="#f4f4f4"/>
  136.  
  137. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  138. <title>{Title}</title>
  139. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  140. <link rel="shortcut icon" href="{Favicon}" />
  141. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  142. <link href='http://fonts.googleapis.com/css?family=La+Belle+Aurore|Yesteryear|Marck+Script|Contrail+One|Reenie+Beanie|Open+Sans+Condensed:700,300|Nothing+You+Could+Do|Kaushan+Script&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
  143.  
  144.  
  145.  
  146. <style type="text/css">
  147.  
  148. #fade {
  149. display: none;
  150. background: #000;
  151. position: fixed;
  152. left: 0;
  153. top: 0;
  154. width: 100%;
  155. height: 100%;
  156. opacity: .80;
  157. z-index: 9999;
  158. }
  159.  
  160. .popup_block{
  161. display: none;
  162. background: #FFFFFF;
  163. padding: 20px;
  164. float: left;
  165. position: fixed;
  166. top: 50%;
  167. left: 50%;
  168. z-index: 99999;
  169. }
  170.  
  171. img.btn_close {
  172. float: right;
  173. margin: -55px -55px 0 0;
  174. }
  175.  
  176. *html #fade {
  177. position: absolute;
  178. }
  179.  
  180. *html .popup_block {
  181. position: absolute;
  182. }
  183.  
  184. ::-webkit-scrollbar {
  185.  
  186. height: 5px;
  187.  
  188. width: 5px;
  189.  
  190. background-color: {color:scrollbar};}
  191.  
  192.  
  193.  
  194. ::-webkit-scrollbar-thumb {
  195.  
  196. background-color:{color:scrollbar};
  197.  
  198. }
  199.  
  200.  
  201.  
  202. ::-webkit-scrollbar-track{
  203.  
  204. background-color: {color:scrollbarbg};
  205.  
  206. }
  207.  
  208.  
  209.  
  210. ::-webkit-scrollbar-buttom{
  211.  
  212. background-color:{color:scrollbarbg};
  213.  
  214. }
  215.  
  216.  
  217. body {color:{color:text}; background-color:{color:background}; background-image: url('{image:Background}'); background-attachment:fixed; font-family:Consolas; font-size:10px; line-height:110%; text-align:justify; }
  218.  
  219. a:link, a:active, a:visited{color: {color:link}; text-decoration:none}
  220. a:hover{color:{color:linkhover}; transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out}
  221.  
  222. #entries{ margin-left:320px; margin-top:10px; width:520px; line-height:110%;}
  223.  
  224. #posts{overflow:hidden; background-color: {color:entry}; padding:12px;margin-top:20px;}
  225.  
  226.  
  227. #sbar {width:210px; height:100%; margin-left:20px; margin-top:-20px; position:fixed; overflow:hidden; z-index:99;background: url(http://i47.tinypic.com/k49i6b.jpgimages/bg.jpg) repeat center center fixed;}
  228.  
  229. #simg {text-align:center; margin-left:5px;margin-top:15px;}
  230. #simg img {max-width: 150px; height: auto; text-align:center;
  231. border:1px solid {color:border};padding:5px;}
  232. #texty {margin-top:10px;font-family:consolas; font-size:10px;margin-left:25px;position:fixed;width:150px;}
  233. #simg:hover #links {opacity:1;margin-left:160px;transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out}
  234.  
  235.  
  236. #links {position:fixed;
  237. margin-top:-150px;
  238. margin-left:65px;
  239. padding:5px;
  240. text-align:center;
  241. letter-spacing:1px;
  242. width:140px;
  243. opacity:0;}
  244.  
  245. #links a{display:block;
  246. line-height:5px;
  247. color:{color:link};
  248. padding:3px;
  249. font-family:consolas;
  250. font-size:10px;
  251. text-transform:lowercase;
  252. margin-top:7px;
  253. text-transform:uppercase;;}
  254.  
  255. #links a:hover{font-style:italic;}
  256.  
  257.  
  258. #credit {width:80px;
  259. height:15px;
  260. text-align:center;
  261. bottom:10px;
  262. right:5px;
  263. position:fixed;
  264. opacity:0.5;
  265. font-family:trebuchet ms;
  266. text-transform:uppercase;
  267. font-size:10px;
  268. background:{color:credit};
  269. border:1px solid #eee;}
  270.  
  271. #credit:hover {right:15px;
  272. text-align:center;
  273. text-transform:uppercase;
  274. opacity:1;
  275. transition: all 0.5s ease-in-out;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out}
  276.  
  277. #pagination{margin-left:80px; margin-top:85px; color: {color:link}; font-size:20px; font-family:georgia; position:fixed; text-align:center; }
  278.  
  279.  
  280. h1{color:{color:title}; font-family: cambria; font-size:15px; line-height:15px; font-weight:lowercase; text-align:center; }
  281.  
  282. h2{color:{color:title}; font-family:Arial; font-size:12px; line-height:12px; letter-spacing:0px; font-weight:normal; text-transform:lowercase; text-align:left}
  283.  
  284.  
  285. h3{color:{color:link}; font-family:georgia; font-size:15px; letter-spacing:0px; font-weight:normal; font-style:italic; text-transform:lowercase; line-height:14px; margin-left:5px; margin-top:50px; margin-bottom:-60px; text-align:center; letter-spacing:1px}
  286.  
  287. h3 a:hover{background-color:transparent}
  288.  
  289. #source {text-align: left}
  290.  
  291. #info {text-align:center; font-family:consolas; font-size: 10px; margin-top:10px;padding:3px; text-transform:lowercase;}
  292. #info:hover { }
  293.  
  294. #tags {width:510px; font:10px consolas; text-transform: lowercase;text-align:center;}
  295. #tags:hover { }
  296.  
  297.  
  298. #ask {font-size: 10px; background-color:{color:qbackground}; color:{color:text};margin-bottom:8px; padding: 8px;text-align:center;}
  299. #answer {font-size:10px;font-family:consolas;margin-left:5px;}
  300. b, strong{color:{color:title};}
  301. i, em {color:{color:text};}
  302. p{margin-top:5px; margin-bottom:5px}
  303. blockquote {padding:0px; padding-left:5px; margin-left:10px; border-left:1px solid {color:border};}
  304. small {font-size:10px;}
  305.  
  306. img a{border:none; width:100%}
  307. .audio{background-color:black; display:block;}
  308.  
  309. .user_1 .label {color:{color:link}; font-weight:bold}
  310. .user_2 .label {color:{color:text}; font-weight:bold}
  311. ul.chat, .chat ol, .chat li {list-style:none; margin:0px; padding:0px;}
  312.  
  313. .notes img{width:10px; position:relative; top:1px;}
  314. ol.notes, .notes li{list-style:none; margin:0px; padding:0px;}
  315. iframe input, iframe submit, iframe textarea, iframe div, iframe table {background-color:transparent!important;}
  316. .ads {margin-left:920px;position:fixed;margin-top:550px;opacity:0.9;}
  317.  
  318. </style>
  319. <style type="text/css">{CustomCSS}</style>
  320.  
  321.  
  322. </head>
  323.  
  324. <body>
  325.  
  326.  
  327. <div id="credit"><a href="http://ariahasting.tumblr.com">credit</a></div>
  328. <div id="sbar">
  329. <div id="simg">
  330. <img src="{image:sidebar}"/><div id="links">
  331. <a href="/" >home</a>
  332. <a href="#?w=400" rel="ask" class="poplight">ask</a>
  333. {block:ifLink1}<a href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}
  334. {block:ifLink2}<a href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}
  335. {block:ifLink3}<a href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}
  336. {block:ifLink4}<a href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}
  337. {block:ifLink5}<a href="{text:Link5}">{text:Link5 Title}</a>{/block:ifLink5}
  338. </div>
  339. <div id="texty">{block:Description}{Description}{/block:Description}</div>
  340. </div><br>
  341. <div id="pagination">{block:PreviousPage}<a href="{PreviousPage}">←</a> &nbsp;{/block:PreviousPage}{block:NextPage}&nbsp;<a href="{NextPage}"> →</a>{/block:NextPage}</div>
  342. </div>
  343.  
  344.  
  345. <div id="ask" class="popup_block">
  346. <iframe frameborder="0"
  347. height="150"
  348. id="ask_form"
  349. scrolling="no"
  350. src="http://www.tumblr.com/ask_form/INSERTUSERNAME.tumblr.com"
  351. width="100%">
  352. </iframe>
  353. </div>
  354.  
  355.  
  356. <div id="entries">
  357. {block:Posts}
  358. <div id="posts">
  359.  
  360.  
  361. {block:Title}<h1>{Title}&nbsp;</h1>{/block:Title}
  362. {block:Text}{Body}{/block:Text}
  363.  
  364. {block:Quote}<h2>"{Quote}" — {Source}</h2>{/block:Quote}
  365.  
  366. {block:Link}<a href="{URL}" class="link" {Target}><h1>{Name}&nbsp;</h1></a>
  367. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}
  368.  
  369. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  370. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  371.  
  372. {block:Chat}<ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  373.  
  374. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  375.  
  376. {block:Answer}
  377. <div id="ask"> {Asker} asked: {Question}</div>
  378. <div id="answer">{Answer}</div>{/block:Answer}
  379.  
  380. {block:Audio}<span class="audio"><center>{AudioPlayerBlack}</center></span>{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  381.  
  382. <div id="info">
  383. {block:Date} posted {TimeAgo} {/block:Date}{block:NoteCount} with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom} {block:ContentSource}<a href="{SourceURL}">© <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}{block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom}</div>
  384.  
  385. <div id="tags">
  386. {block:HasTags}{block:Tags}#<a href="{TagUrl}">{Tag} </a>{/block:Tags}{/block:HasTags}</div></div>
  387. {/block:Posts}
  388. {block:PostNotes}{PostNotes}{/block:PostNotes}
  389.  
  390. </div>
  391.  
  392. </body>
  393.  
  394. </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!