API tools faq
paste
chezshay

theme 20 "andy"

chezshay
Mar 22nd, 2014
1,243
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.30 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <head>
  5.  
  6.  
  7. <script type="text/javascript" src="http://css-tricks.com/examples/MenuFader/js/jquery.js"></script>
  8.  
  9. <script type="text/javascript">
  10.  
  11. $(function(){
  12. $("#about-button").css({
  13. opacity: 0.3
  14. });
  15.  
  16. $("#page-wrap div.button").click(function(){
  17.  
  18. $clicked = $(this);
  19.  
  20. // if the button is not already "transformed" AND is not animated
  21. if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
  22.  
  23. $clicked.animate({
  24. opacity: 1,
  25. borderWidth: 5
  26. }, 600 );
  27.  
  28. // each button div MUST have a "xx-button" and the target div must have an id "xx"
  29. var idToLoad = $clicked.attr("id").split('-');
  30.  
  31. //we search trough the content for the visible div and we fade it out
  32. $("#content").find("div:visible").fadeOut("fast", function(){
  33. //once the fade out is completed, we start to fade in the right div
  34. $(this).parent().find("#"+idToLoad[0]).fadeIn();
  35. })
  36. }
  37.  
  38. //we reset the other buttons to default style
  39. $clicked.siblings(".button").animate({
  40. opacity: 0.5,
  41. borderWidth: 1
  42. }, 600 );
  43.  
  44. });
  45. });
  46.  
  47. </script>
  48.  
  49. </script>
  50. <title>{Title}</title>
  51. <link rel="shortcut icon" href="{Favicon}">
  52. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  53. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  54.  
  55.  
  56.  
  57.  
  58. <!---@shayofrp--->
  59.  
  60. <meta name="color:Background" content="#ffffff"/>
  61. <meta name="color:Text" content="#a8a8a8"/>
  62. <meta name="color:Hover" content="#f2f2f2"/>
  63. <meta name="color:Scrollbar" content="#000000"/>
  64. <meta name="color:ScrollbarBg" content="#ffffff"/>
  65. <meta name="color:Answer Backg" content="#000000"/>
  66. <meta name="color:Links" content="#000000"/>
  67. <meta name="color:Links Background" content="#000000"/>
  68. <meta name="color:Description Background" content="#000000"/>
  69. <meta name="color:postbg" content="#ffffff"/>
  70. <meta name="color:Info Background" content="#ffffff"/>
  71. <meta name="image:header" content=""/>
  72. <meta name="image:tab1" content=""/>
  73. <meta name="image:tab2" content=""/>
  74. <meta name="image:background" content=""/>
  75. <meta name="text:Link 1" content="">
  76. <meta name="text:Link 1 URL" content="/">
  77. <meta name="text:Link 2" content="">
  78. <meta name="text:Link 2 URL" content="/">
  79. <meta name="text:Link 3" content="">
  80. <meta name="text:Link 3 URL" content="/">
  81. <meta name="text:Link 4" content="">
  82. <meta name="text:Link 4 URL" content="/">
  83. <meta name="text:Link 5" content="">
  84. <meta name="text:Link 5 URL" content="/">
  85. <meta name="text:Link 6" content="">
  86. <meta name="text:Link 6 URL" content="/">
  87. <meta name="text:Link 7" content="">
  88. <meta name="text:Link 7 URL" content="/">
  89. <meta name="text:Link 8" content="">
  90. <meta name="text:Link 8 URL" content="/">
  91. <meta name="text:Link 9" content="">
  92. <meta name="text:Link 9 URL" content="/">
  93. <meta name="text:Link 10" content="">
  94. <meta name="text:Link 10 URL" content="/">
  95. <link href='http://fonts.googleapis.com/css?family=Pontano+Sans' rel='stylesheet' type='text/css'>
  96.  
  97. <style type="text/css">
  98.  
  99.  
  100. ::-webkit-scrollbar-thumb {
  101. height:auto;
  102. background-color:{color:Scrollbar};
  103. }
  104.  
  105. ::-webkit-scrollbar {
  106. height:9px;
  107. width:4px;
  108. background-color:{color:ScrollbarBg};
  109. }
  110.  
  111.  
  112. body {
  113. background:{color:background};
  114. margin:0px;
  115. color:{color:text};
  116. font-family: 'Pontano Sans', sans-serif;
  117. font-size:9px;
  118. line-height:100%;
  119. letter-spacing:0px;
  120. text-align:justify;
  121. background-image:url('{image:background}');
  122. }
  123.  
  124. a {
  125. text-decoration:none;
  126. outline:none;
  127. -moz-outline-style:none;
  128. color:{color:links};
  129. font-weight:bold;
  130. font-family:courier;
  131. text-decoration:underline;
  132. }
  133.  
  134. pre{color:{color:postbg};
  135. padding:5px;
  136. background-color:{color:text};}
  137.  
  138. img {
  139. border:none;
  140. }
  141.  
  142. h1 {
  143. font-size:24px;
  144. color:{color:text};
  145. text-transform:uppercase;
  146. font-family:'arial';
  147. font-style:bold, italic;
  148. text-align:left;
  149. }
  150.  
  151. blockquote {border-left: solid 1px {color:links};
  152. padding-left:5px;
  153. }
  154.  
  155. a:hover {
  156. color:{color:postbg};
  157. -moz-transition-duration:0.3s;
  158. -webkit-transition-duration:0.3s;
  159. -o-transition-duration:0.3s;
  160. }
  161.  
  162. /*ENTRIES*/
  163.  
  164. #entries {
  165. padding:10px;
  166. width:500px;
  167. margin-left:550px;
  168. margin-top:-250px;
  169. letter-spacing:0px;
  170. line-height:140%;
  171. z-index:-99;
  172. font-size:9px;
  173. position:absolute;
  174. }
  175.  
  176. #post {
  177. width:500px;
  178. padding-bottom:10px;
  179. padding:10px;
  180. margin-top:10px;
  181. background-color:{color:postbg};
  182. }
  183.  
  184.  
  185. /*SIDEBAR*/
  186.  
  187.  
  188. #sidebar {
  189. width:500px;
  190. margin-left:189px;
  191. margin-top:250px;
  192. }
  193.  
  194. #sidebarimage img{
  195. position:fixed;
  196. margin-top:-140px;
  197. -webkit-border-radius: 5px;
  198. -moz-border-radius: 5px;
  199. border-radius: 5px;
  200. margin-left:-70px;
  201. }
  202.  
  203. #description{position:fixed; margin-top:115px; margin-left:120px; width:208px;background-color:{color:Description Background};padding:1px;font-size:9px; font-family: 'Pontano Sans', sans-serif;;color:{color:Background};font-family:courier;text-transform:uppercase;
  204. height:67px;}
  205.  
  206.  
  207. #faq2{position:fixed; margin-top:200px; margin-left:715px; width:210px;height:80px;padding:7px;font-size:9px; font-family: 'Pontano Sans', sans-serif;;}
  208.  
  209. /*CLICKABLE LINKS*/
  210.  
  211. body {
  212. font-size: 62.5%;
  213. font-family: Helvetica, sans-serif;
  214. }
  215.  
  216. .clear {
  217. clear: both;
  218. }
  219.  
  220. #page-wrap {
  221. width: 400px;
  222. position:fixed;
  223. margin-top:160px;
  224. margin-left:100px;
  225. padding: 20px;
  226. }
  227.  
  228. .button {
  229. float: left;
  230. margin: 10px;
  231. }
  232.  
  233. #home {
  234. display: block;
  235. padding: 15px;
  236. background-color:{color:postbg};
  237. }
  238. #home-button {
  239. opacity: 1.0;
  240. border-bottom: 1px solid {color:text};
  241. }
  242.  
  243. #about {
  244. display: none;
  245. padding: 15px;
  246. background-color:{color:postbg};
  247. }
  248. #about-button {
  249. opacity: 0.5;
  250. margin-left:50px;
  251. border-bottom: 1px solid {color:text};
  252. }
  253.  
  254. /*POST INFO*/
  255.  
  256. #info {
  257. width:500px;
  258. text-align:center;
  259. font-family:'courier new';
  260. text-transform:uppercase;
  261. margin-top:1px;
  262. margin-left:-4px;
  263. font-size:10px;
  264. font-style:none;
  265. padding:4px;
  266. line-height:10px;
  267. background-color:{color:Info Background};
  268. color:{color:Postbg};
  269. }
  270.  
  271. #info a {
  272. text-align:center;
  273. color:{color:Text};
  274. }
  275.  
  276. .tags {
  277. float:left;
  278. width:489px;
  279. opacity:1;
  280. margin-top:1px;
  281. margin-left:-5px;
  282. text-align:left;
  283. font-size:6px;
  284. padding:5px;
  285. font-size:8px;
  286. transition-duration: 0.5s;
  287. -moz-transition-duration: 0.5s;
  288. -webkit-transition-duration: 0.5s;
  289. -o-transition-duration: 0.5s
  290. color:{color:text};
  291. }
  292.  
  293. .tags a {
  294. letter-spacing:0px;
  295. font-size:8px;
  296. text-align:center;
  297. font-family:'arial';
  298. text-decoration:none;
  299. display:inline-block;
  300. color:{color:text};
  301. }
  302.  
  303. .tags:hover{background-color:{color:Links};}
  304.  
  305.  
  306.  
  307. /*SIDELINKS*/
  308. .links {
  309. padding:5px;
  310. padding-bottom:6px;
  311. line-height:150%;
  312. z-index:10000000000000000;
  313. text-align:center;
  314. font-size:8px;
  315. letter-spacing:4px;
  316. opacity:1;
  317. position:fixed;
  318. font-family:'arial';
  319. position:absolute;
  320. text-transform:uppercase;
  321. text-align:center;}
  322.  
  323. .links a{
  324. z-index:10000000000000000;
  325. margin-left:10px;
  326. padding:5px;
  327. display:inline-block;
  328. }
  329.  
  330. .links a:hover{
  331. color:{color:postbg};
  332. -moz-transition-duration:.2s;
  333. -webkit-transition-duration:.2s;
  334. -o-transition-duration:.2s;
  335. background-color:{color:Links Background};
  336. }
  337.  
  338. #navi{
  339. text-align:center;
  340. margin-left:-400px;
  341. width:210px;
  342. margin-top:-92px;
  343. font-family:courier;
  344. position:fixed;
  345. }
  346.  
  347. #navi a{
  348. width:81px;
  349. color:{color:Links};
  350. border-left:solid 2px{color:Info Background};
  351. display:inline-block;
  352. font-style:none;
  353. margin-left:-4px;
  354. margin-top:-1px;
  355. text-transform:uppercase;
  356. font-size:8px;
  357. margin-bottom:3px;
  358. padding:6px;
  359. background-color:{color:Description Background};
  360. }
  361.  
  362. /*QUESTION*/
  363.  
  364. #asker {
  365. color:{color:text};
  366. border-left:solid 2px{color:links};
  367. padding:14px;
  368. font-family:'arial';
  369. font-size:9px;
  370. letter-spacing:0px;
  371. text-align:left;
  372. margin-top:0px;
  373. text-transform:lowercase;
  374. line-height:100%;
  375. background-color:{color:Answer backg};
  376. }
  377.  
  378. #asker a{color:{color:postbg};}
  379.  
  380. #url{color:{color:Text};
  381. padding:4px;
  382. border-left:solid 2px{color:links};
  383. font-family:'arial';
  384. font-size:9px;
  385. letter-spacing:0px;
  386. text-align:center;
  387. margin-top:0px;
  388. text-transform:uppercase;
  389. line-height:100%;
  390. background-color:{color:Info Background};
  391. }
  392.  
  393. #url a{color:{color:postbg}}
  394.  
  395. #pagination {
  396. font-size:9px;
  397. letter-spacing:5px;
  398. padding:10px;
  399. text-transform:uppercase;
  400. margin-top:-180px;
  401. margin-left:1100px;
  402. text-align:center;
  403. position:fixed;
  404. color:{color:text};
  405. background-color:{color:Description Background};
  406. border-left:solid 2px{color:links};
  407. }
  408. #pagination a{color:{color:Links};}
  409.  
  410. /*CREDIT*/
  411.  
  412. #cred {
  413. position:fixed;
  414. font-family:'courier';
  415. text-transform:uppercase;
  416. font-size:8px;
  417. right:9px;
  418. bottom:9px;
  419. padding:4px;
  420. background-color:{color:postbg};
  421. letter-spacing:1px;
  422. }
  423.  
  424.  
  425. {CustomCSS}</style></head><body>
  426. <div id="page-wrap">
  427.  
  428. <div id="home-button" class="button">
  429. <img src="{image:tab1}" alt="home" class="button" />
  430. </div>
  431. <div id="about-button" class="button">
  432. <img src="{image:tab2}" alt="home" class="button" />
  433. </div><br><br><br><br><br><br><br><br>
  434. <div id="content">
  435.  
  436. <div id="home">
  437. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ultrices sit amet arcu at laoreet. Nulla in consectetur risus, non tristique lorem. Nulla lectus nibh, condimentum blandit euismod in, tempus et nunc. Quisque fringilla venenatis felis, et suscipit tellus faucibus id. Cras scelerisque dignissim lobortis.
  438. </p>
  439. </div>
  440.  
  441. <div id="about">
  442.  
  443. <p>Sed at nibh accumsan, sodales quam vel, viverra lectus. Morbi turpis risus, posuere sed rhoncus sit amet, varius et quam. Cras et elit volutpat, euismod erat eget, ornare orci. Sed ut pharetra massa. Suspendisse in mollis elit. Duis varius sem in urna ullamcorper, nec rutrum metus lacinia.</p>
  444. </div>
  445. </div>
  446. </div>
  447. <div id="sidebar">
  448. <div id="sidebarimage"><img src="{image:header}"></div>
  449. </div>
  450.  
  451. <div id="description"><div align="justify">
  452. <blockquote>{description}</blockquote>
  453. </div></div>
  454.  
  455. </div>
  456.  
  457. <div id="faq2">
  458.  
  459. <div id="navi">
  460. <a href="{text:link 5 url}">{text:link 5}</a>
  461. <a href="{text:link 6 url}">{text:link 6}</a>
  462. <a href="{text:link 7 url}">{text:link 7}</a>
  463. <a href="{text:link 8 url}">{text:link 8}</a>
  464. <a href="{text:link 9 url}">{text:link 9}</a>
  465. <a href="{text:link 10 url}">{text:link 10}</a>
  466. <br>
  467. </div>
  468.  
  469. </div></div></div></div>
  470.  
  471. <div id="entries">
  472. {block:Posts}
  473. <div id="post">
  474.  
  475. {block:Text}
  476. <h1>{block:Title}{Title}{/block:Title}</h1>
  477. {Body}{/block:Text}
  478.  
  479. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
  480. {block:Caption}{Caption}{/block:Caption}{/block:Photo}
  481.  
  482. {block:Photoset}{Photoset-500}{block:Caption}{Caption}
  483. {/block:Caption}{/block:Photoset}
  484.  
  485. {block:Quote}<h2>"{Quote}"</h2>
  486. {block:Source}<div class="qsource"> —{Source}</div>
  487. {/block:Source}{/block:Quote}
  488.  
  489. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  490.  
  491. {block:Chat}{block:Title}{Title}{/block:Title}{block:Lines}{block:Label}<b><u>{Label}</u></b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  492.  
  493. {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px" />{/block:AlbumArt}<span class="audio">{AudioPlayerBlack}</left></span>
  494. {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
  495. {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  496. {/block:ExternalAudio}<b>Played:</b> {PlayCount} times <br>
  497. {/block:Audio}<br>
  498.  
  499. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  500.  
  501. {block:Answer}<div id="asker">{Question}</div> <div id="url">{Asker}</div>{Answer}{/block:Answer}
  502.  
  503. <div id="info">
  504. <div id="permalink">
  505. <a href="{Permalink}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a> —
  506. {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
  507. and {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}
  508. {block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom}
  509. with {NoteCountWithLabel}</a></div>
  510.  
  511. {block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}</div>
  512.  
  513. {block:HasTags}<div class="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}<br>
  514. </div>{/block:Posts}{/block:Posts}</div>
  515. <div id="pagination"> {text:title}{block:Pagination}
  516. {block:PreviousPage}
  517. <a href="{PreviousPage}">back</a>
  518. {/block:PreviousPage}
  519.  
  520. {block:NextPage}
  521. <a href="{NextPage}">forward</a>
  522. {/block:NextPage}
  523. </div>
  524. {/block:Pagination}
  525. </div>
  526.  
  527. <div id="cred">
  528. <a href="http://shayofrp.tumblr.com/">SHAYOFRP</a>
  529. </div>
  530. </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!