dec0der

Grade Eight Theme

Apr 20th, 2012
1,294
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.73 KB | None | 0 0
  1. <!--
  2. (c) 2012 | dec0der
  3. Theme #7: Grade Eight Theme
  4.  
  5. please, don't remove the credit!
  6. thank you.
  7. -->
  8.  
  9.  
  10. <script type="text/javascript"
  11. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  12. <script>
  13. $(document).ready(function() {
  14. //
  15. $('a.poplight[href^=#]').click(function() {
  16. var popID = $(this).attr('rel'); //Get Popup Name
  17. var popURL = $(this).attr('href'); //Get Popup href to define size
  18. var query= popURL.split('?');
  19. var dim= query[1].split('&');
  20. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  21. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://static.tumblr.com/iddq6cw/Atplvofrt/tooltip-closebutton.png" class="btn_close" title="Close" alt="Close" /></a>');
  22. var popMargTop = ($('#' + popID).height() + 80) / 2;
  23. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  24. //Apply Margin to Popup
  25. $('#' + popID).css({
  26. 'margin-top' : -popMargTop,
  27. 'margin-left' : -popMargLeft
  28. });
  29. $('body').append('<div id="fade"></div>');
  30. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  31. return false;
  32. });
  33. $('a.close, #fade').live('click', function() {
  34. $('#fade , .popup_block').fadeOut(function() {
  35. $('#fade, a.close').remove(); //fade them both out
  36. });
  37. return false;
  38. });
  39. });
  40. </script>
  41.  
  42. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  43. <head>
  44. <title>{Title}</title>
  45. <link rel="shortcut icon" href="{Favicon}">
  46. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  47. {block:Description}
  48. <meta name="description" content="{MetaDescription}" />
  49. {/block:Description}
  50. </head>
  51.  
  52. <title>{title}</title>
  53. <meta name="image:Background" content=""/>
  54. <meta name="image:Header" content=""/>
  55.  
  56. <meta name="color:Posts" content="#FFFFFF">
  57. <meta name="color:Background" content="#d4c8b3"/>
  58. <meta name="color:Borders" content="#ffa07a">
  59. <meta name="color:Text" content="#3D3D3D">
  60. <meta name="color:Links" content="#000000">
  61. <meta name="color:Hover" content="#CCCCCC">
  62. <meta name="color:Title" content="#000000">
  63. <meta name="color:Title Hover" content="#DDDDDD">
  64.  
  65. <meta name="text:Custom Link One" content="" />
  66. <meta name="text:Custom Link One Title" content="link 1" />
  67. <meta name="text:Custom Link Two" content="" />
  68. <meta name="text:Custom Link Two Title" content="link 2" />
  69. <meta name="text:Custom Link Three" content="" />
  70. <meta name="text:Custom Link Three Title" content="link 3" />
  71.  
  72. <link rel="shortcut icon" href="{Favicon}">
  73.  
  74. <style type="text/css">
  75. ::-webkit-scrollbar {width:8px; height:auto; background:{color:Background};}
  76.  
  77. ::-webkit-scrollbar-corner {background:{color:Borders};}
  78.  
  79. ::-webkit-scrollbar-thumb:vertical {background:{color:Borders};}
  80.  
  81. ::-webkit-scrollbar-thumb:horizontal {background:{color:Borders};}
  82.  
  83. @font-face {
  84.  
  85. font-family:clemente;
  86. src: url('http://static.tumblr.com/wl03of5/camm2ja8d/clementepdab-hairlineitalic.ttf');
  87. }
  88.  
  89. #fade { /*--Transparent background layer--*/
  90. display: none; /*--hidden by default--*/
  91. background: #000;
  92. position: fixed; left: 0; top: 0;
  93. width: 100%; height: 100%;
  94. opacity: .80;
  95. z-index: 9999;
  96. }
  97.  
  98. .popup_block{
  99. display: none; /*--hidden by default--*/
  100. background: #fff;
  101. padding: 20px;
  102. border: 20px solid {color:Background};
  103. float:left;
  104. font-size:11px;
  105. position:fixed;
  106. top:50%; left:50%;
  107. z-index:99999;
  108. /*--CSS3 Box Shadows--*/
  109. -webkit-box-shadow: 0px 0px 20px #000;
  110. -moz-box-shadow: 0px 0px 20px #000;
  111. box-shadow: 0px 0px 20px #000;
  112. /*--CSS3 Rounded Corners--*/
  113. -webkit-border-radius:10px;
  114. -moz-border-radius:10px;
  115. border-radius:10px;
  116. }
  117. img.btn_close {
  118. float: right;
  119. margin: -50px -50px 0 0;
  120. }
  121. /*--Making IE6 Understand Fixed Positioning--*/
  122. *html #fade {
  123. position: absolute;
  124. }
  125. *html .popup_block {
  126. position: absolute;
  127. }
  128.  
  129. img{-webkit-transition: opacity 0.7s linear; opacity: 50;}img:hover{-webkit-transition: opacity 0.7s linear; opacity: .7;}
  130.  
  131. body{ height:100%; text-align:justify; font-family: Arial !important; font-size: 10px !important; line-height: 12px !important; color:{color:text}; background-color:{Color:Background}; background-image:url({image:background}); background-attachment: fixed; background-repeat: repeat;}}
  132.  
  133. .tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
  134.  
  135. .contentcolumn{margin:auto; background:transparent; max-width:520px; margin-top:130px; padding-top:10px; overflow:shown;}
  136.  
  137. body a{text-decoration:none; -webkit-transition: 0.5s ease-in; color:{color:links};}
  138.  
  139. body a:hover{
  140. color:{color:hover}; -webkit-transition: 0.5s ease-in;}
  141.  
  142. a img{border:0px;}
  143.  
  144. #entry{margin-top:10px; padding:5px; background-color:{color:Posts}; {block:IndexPage}margin-bottom:15px; {/block:IndexPage} max-width:500px;}
  145.  
  146. #entry img{max-width:500px;}
  147. #entry:hover .permalink {opacity: 1;}
  148.  
  149. #wmyb {height:100px; width:100px; background-color: #f6f6e3; line-height:100px; float:left; border-top: 15px solid #f6f6e3; border-bottom: 15px solid #f6f6e3; font-family:Clemente;}
  150. #wmyb a {height:100px; width:100px; line-height:100px; color: #5f4642; background-color: #f6f6e3; border-top: 15px solid #f6f6e3; border-bottom: 15px solid #f6f6e3; letter-spacing:2px;}
  151. #wmyb:hover {letter-spacing:2px; -webkit-transition: opacity 0.7s linear; opacity:.7; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;transition: all 0.3s ease-out; border-bottom: 15px solid {color:Borders};}
  152.  
  153. #wmyb2 {height:100px; width:100px; background-color: #fbfbea; line-height:100px; float:left; border-bottom: 15px solid #fbfbea; border-top: 15px solid #fbfbea; font-family:Clemente;}
  154. #wmyb2 a {height:100px; width:100px; line-height:100px; color: #5f4642; background-color: #fbfbea; border-bottom: 15px solid #fbfbea; border-top: 15px solid #fbfbea; letter-spacing:2px;}
  155. #wmyb2:hover {letter-spacing:2px; -webkit-transition: opacity 0.7s linear; opacity:.7; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;transition: all 0.3s ease-out; border-top: 15px solid {color:Borders};}
  156.  
  157. #wmyb-des {height:130px; width:200px; background-color:{color:Posts}; line-height:130px; float:left; background-image: url({image:Header});}
  158.  
  159. #harry {width:600px; height:auto; top:0px; position:fixed; text-align:center; margin:auto; margin-left:-45px; background:{color:Background};}
  160.  
  161. #apropos {text-align:center; padding:8px; font-family:arial; font-size:9px; line-height:12px; color:{color:text}; letter-spacing:1px; text-transform:none; background: #FFFAF0; letter-spacing: 1px; padding-top:40px; filter:alpha(opacity=20); -moz-opacity:0.2; -khtml-opacity: 0.2; opacity: 0.2; height:82px;}
  162. #apropos:hover{filter:alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
  163.  
  164. .title{font-family: courier; font-size:16px; margin-bottom:-5px; line-height:16px; margin-bottom:4px; text-align:left; letter-spacing:2px;}
  165.  
  166. .links a{text-align:center; font-size:9px; padding-top:2px; padding-left:3px; padding-right:3px; padding-bottom:2px; text-transform:uppercase; color:{color:Text};}
  167.  
  168. .links a:hover{background:{color:Nav Hover Background}; color:#ffffff;}
  169.  
  170. .h2{font-style:bold; font-family:Clemente; font-size:22px; line-height:22px; letter-spacing:2px; display:block;}
  171.  
  172. .h3{text-transform:uppercase;}
  173.  
  174. .h4{font-style:bold; font-family:Clemente; font-size:22px; line-height:22px; letter-spacing:2px; text-transform:lowercase; display:block; background:{color:title background};}
  175.  
  176. .h5{color:{color:title}; font-style:bold; font-family:Clemente; font-size:22px; line-height:22px; letter-spacing:2px; text-transform:lowercase; text-align:right;}
  177.  
  178. .audio {
  179. background-color:#E7E7E7;
  180. margin-bottom : -10px;
  181. width:500px;
  182. }
  183. .answer{color:{Color:Text}; font-family:Courier; font-size:12px; line-height:12px; letter-spacing: 2px;}
  184. .answer b {color:{Color:Text}; font-family:Courier; font-size:12px; line-height:12px; letter-spacing: 1px; text-decoration:underline;}
  185.  
  186. div.video embed,
  187. div.post div.video object {
  188. width:500px !important;
  189. height:350px !important;
  190. }
  191.  
  192. blockquote{padding:0px 0px 2px 5px; margin:10px 0px 2px 20px; border-left:3px solid {color:Borders};}
  193. ol.notes { width:510px; padding: 0px; margin: 25px 0px; list-style-type:lower-roman; border-bottom: solid 1px #eee; }
  194. ol.notes li.note { border-top: solid 1px #eee; padding: 2px;}
  195. ol.notes li.note img.avatar {margin-right: 10px; width:0px; height: 0px;}
  196. iframe input, iframe submit, iframe textarea, iframe div, iframe table {background-color:transparent!important;}
  197.  
  198. #perma {width:488px; background-color:#e8e3d0; padding-left:3px; padding-right:3px; border-left:3px solid #ffa07a; border-right:3px solid #ffa07a; text-align:left; font-family:Gill Sans MT; font-size:9px; line-height:12px; margin-top:3px; font-weight:bold; opacity:.6; letter-spacing:0px;}
  199. .right { margin: 0 0 px 0; padding: px; overflow:hidden; -moz-border-radius:3px; border-radius:3px; text-align: left; text-transform:; }
  200. .totalright {float:right; margin-top:0px;}
  201.  
  202. .cred{bottom:5px; right:5px; position:fixed; background:{color:Posts}; opacity:1; color:#000;}
  203.  
  204. {CustomCSS}
  205.  
  206. </style>
  207.  
  208. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/J5bl3lkz1/tumblrautopagernopage.js"></script>
  209.  
  210. </head>
  211.  
  212. <body>
  213.  
  214. <div class="cred">
  215. <a href="http://www.dec0der.tumblr.com">C R E D I T</a>
  216. </div>
  217.  
  218. <div class="contentcolumn">
  219.  
  220. <div class="autopagerize_page_element">
  221.  
  222. {block:Posts}
  223.  
  224. {block:Text}
  225. <div id="entry">
  226. {block:Title}<div class="title">{Title}</div>{/block:Title}
  227. {Body}
  228. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  229. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  230. </div>
  231. {/block:Text}
  232.  
  233. {block:Photo}
  234. <div id="entry">
  235. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}
  236. {block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}
  237. <img src="{block:IndexPage}{PhotoURL-HighRes}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}" alt="{PhotoAlt}" width=500/>
  238. {block:IndexPage}</a>{/block:IndexPage}
  239. {block:PermalinkPage}{LinkCloseTag}
  240. {/block:PermalinkPage}
  241. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  242. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  243. </div>
  244. {/block:Photo}
  245.  
  246. {block:Photoset}
  247. <div id="entry">
  248. {Photoset-500}
  249. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  250. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  251. </div>
  252. {/block:Photoset}
  253.  
  254. {block:Quote}
  255. <div id="entry">
  256. "{Quote}" {block:Source}<br>
  257. — <b>{Source}</b>{/block:Source}
  258. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  259. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  260. </div>
  261. {/block:Quote}
  262.  
  263. {block:Link}
  264. <div id="entry">
  265. <div class="h2"><a href="{URL}"><big><big>&rarr;</big></big> {Name}</a></div>{block:Description}{Description}{/block:Description}
  266. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  267. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  268. </div>
  269. {/block:Link}
  270.  
  271. {block:Chat}
  272. <div id="entry">
  273. {block:Title}<b>{Title}</b>{/block:Title}
  274. {block:Lines}{block:Label}<b>{Label}</b> {Line}<br>{/block:Label}{/block:Lines}
  275. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  276. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  277. </div>
  278. {/block:Chat}
  279.  
  280. {block:Audio}
  281. <div id="entry">
  282. <div class="audio">
  283. {AudioPlayerGrey}</div><br>
  284. {block:IndexPage}<div style="padding:2px; font-size:10px; text-align:center;font-style:italic;">{block:TrackName}{TrackName} by {/block:TrackName}{block:Artist}{Artist}{/block:Artist}</div>{/block:IndexPage}
  285. {block:PermalinkPage}{block:ExternalAudio} <a href="{ExternalAudioURL}"> / download </a> </span>{/block:ExternalAudio}{/block:PermalinkPage}
  286. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  287. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  288. </div>
  289. {/block:Audio}
  290.  
  291. {block:Answer}
  292. <div id="entry">
  293. <div class="answer"><b>{Asker}:</b> {Question}</div><br>
  294. <div style="margin-top:-15px;">{Answer}</div>
  295. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  296. </div>
  297. {/block:answer}
  298.  
  299. {block:Video}
  300. <div id="entry">
  301. <div class="video">
  302. {Video-500}
  303. {block:IndexPage}<div id="perma"><a href="{Permalink}"> <div class="right">{TimeAgo}</a> <div class="totalright">{block:HasTags} {block:Tags}<a href="{TagURL}">#{Tag}</a>,&nbsp;{/block:Tags}{/block:HasTags} </div></div></div>{block:IndexPage}
  304. {block:PermalinkPage}{block:Caption}{LinkCloseTag}{Caption}<br>{/block:Caption}{/block:PermalinkPage}
  305. </div></div>
  306. {/block:Video}
  307.  
  308.  
  309. {block:PermalinkPage}
  310. {LinkCloseTag}
  311. {block:PostNotes}
  312. {PostNotes}
  313. {/block:PostNotes}
  314. {/block:PermalinkPage}
  315.  
  316. {/block:Posts}
  317. </div>
  318.  
  319. <div id="harry">
  320. <div id="wmyb">{block:ifCustomLinkOneTitle}<a href="{text:Custom Link One}">{text:Custom Link One Title}</a>{/block:ifCustomLinkOneTitle}</div>
  321. <div id="wmyb2">{block:ifCustomLinkTwoTitle}<a href="{text:Custom Link Two}">{text:Custom Link Two Title}</a>{/block:ifCustomLinkTwoTitle}</div>
  322. <div id="wmyb-des"><div id="apropos"><a href="/"><img src="http://media.tumblr.com/tumblr_m2u91l3slu1qhsyri.png" alt="home" title="home"></a> <a href="/ask"><img src="http://media.tumblr.com/tumblr_m2u90qPT8m1qhsyri.png" alt="ask" title="ask"></a> <a href="/archive"><img src="http://media.tumblr.com/tumblr_m2u903all41qhsyri.png" alt="archive" title="archive"></a><br>{Description}</div></div>
  323. <div id="wmyb">{block:ifCustomLinkThreeTitle}<a href="{text:Custom Link Three}">{text:Custom Link Three Title}</a>{/block:ifCustomLinkThreeTitle}</div>
  324. <div id="wmyb2"><a href="#?w=500" rel="blogroll" class="poplight">blogroll</a></div>
  325. </div>
  326.  
  327. <br>
  328.  
  329.  
  330.  
  331. </div>
  332. </body>
  333.  
  334. <div id="blogroll" class="popup_block">
  335. <div style="max-height:400px; overflow-y:scroll">
  336. <div style="font-family:courier;font-size:30px; text-align:center; line-height:40px; margin-top:5px; letter-spacing:2px;">Blogs I Follow</div><center>
  337. {block:Following}{block:Followed}<a target="_blank" href="{FollowedURL}"><img src="{FollowedPortraitURL-64}" />{block:Followed}{/block:Following}
  338. </center>
  339. </div>
  340. </div>
  341.  
  342. </html>
Advertisement
Add Comment
Please, Sign In to add comment