Jyuubi

[Theme] → #14 Hikari

Jul 22nd, 2012
6,947
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.00 KB | None | 0 0
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3.  
  4. <!--
  5. PLEASE DO NOT REMOVE THIS.
  6. IF YOU REMOVE CREDIT, MAKE SURE IT'S ON A CREDITS PAGE.
  7.  
  8. THEME: #14 HIKARI
  9. jyuubi.org | manatopia.org
  10.  
  11. --RULES--
  12. 1) DO NOT REMOVE CREDIT.
  13. 2) DO NOT USE TO MAKE YOUR OWN THEME TO RESDISTRIBUTE.
  14. 3) DO NOT USE TO MAKE YOUR OWN THEME AND REMOVE CREDIT.
  15. 4) IF YOU USE ANYTHING FROM MY THEMES, ALWAYS CREDIT.
  16. 5) DO USE ANY GRAPHICS MADE FOR A PREVIEW.
  17. -->
  18.  
  19. <meta name="color:BackgroundM" content="#ffffff">
  20.  
  21. <meta name="color:Top Background" content="#dad9ca">
  22. <meta name="color:Top Title" content="#8eafa0">
  23. <meta name="color:Top Link" content="#db758d">
  24. <meta name="color:Top Link Hover" content="#73b0aa">
  25. <meta name="color:Top Icon Border" content="#d1d0c6">
  26.  
  27. <meta name="color:Nav Drops" content="#73b0aa">
  28. <meta name="color:Nav Drops Hover" content="#db758d">
  29.  
  30. <meta name="color:Sidebar Background" content="#e4e4e4">
  31. <meta name="color:Sidebar Text" content="#9c9c9c">
  32. <meta name="color:Sidebar Bold" content="#db758d">
  33. <meta name="color:Sidebar Italic" content="#8eafa0">
  34. <meta name="color:Sidebar Link" content="#d48d88">
  35.  
  36. <meta name="color:Pagination Background" content="#dad9ca">
  37. <meta name="color:Pagination Arrow" content="#db758d">
  38.  
  39. <meta name="color:Content Background" content="#e4e4e4">
  40. <meta name="color:Post Background" content="#ebebeb">
  41. <meta name="color:Post Text" content="#9c9c9c">
  42. <meta name="color:Post Bold" content="#db758d">
  43. <meta name="color:Post Italic" content="#8eafa0">
  44. <meta name="color:Post Link" content="#d48d88">
  45. <meta name="color:Post Title" content="#8eafa0">
  46. <meta name="color:Post Blockquote" content="#e4e4e4">
  47.  
  48. <meta name="color:Permalink Background" content="#e4e3d5">
  49. <meta name="color:Permalink Link" content="#d48d88">
  50. <meta name="color:Permalink Link Hover" content="#73b0aa">
  51.  
  52. <meta name="image:BackgroundM" content="http://static.tumblr.com/pdgxkke/AZem1ko6f/passion.png">
  53. <meta name="image:Sidebar" content="">
  54.  
  55. <meta name="if:Infinite Scrolling" content="0">
  56. <meta name="if:Show Captions" content="0">
  57. <meta name="if:Photo Fading" content="1">
  58.  
  59. <meta name="text:Name 1" content="">
  60. <meta name="text:URL 1" content="">
  61. <meta name="text:Name 2" content="">
  62. <meta name="text:URL 2" content="">
  63. <meta name="text:Name 3" content="">
  64. <meta name="text:URL 3" content="">
  65. <meta name="text:Name 4" content="">
  66. <meta name="text:URL 4" content="">
  67. <meta name="text:Name 5" content="">
  68. <meta name="text:URL 5" content="">
  69. <meta name="text:Name 6" content="">
  70. <meta name="text:URL 6" content="">
  71.  
  72. <head>
  73. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  74. <link href='http://fonts.googleapis.com/css?family=Bilbo' rel='stylesheet' type='text/css'>
  75. <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
  76. <meta http-equiv="content-type" content="text/html; charset=utf-8">
  77. <title>{Title}</title>
  78. <link rel="shortcut icon" href="{Favicon}">
  79. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  80. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  81.  
  82. <style type="text/css">
  83. /* BODY */
  84. body {
  85. background-image: url("{image:BackgroundM}");
  86. background-attachment: fixed;
  87. background-color: {color:BackgroundM};
  88. margin: 0;
  89. }
  90.  
  91.  
  92. /* TOP NAV */
  93. #topnav {
  94. background-color: {color:Top Background};
  95. font-family: 'Open Sans Condensed', sans-serif;
  96. font-size: 11px;
  97. color: {color:Top Title};
  98. letter-spacing: 1px;
  99. text-align: right;
  100. width: 873px;
  101. height: 75px;
  102. top: 0px;
  103. position: fixed;
  104. z-index: 200;
  105. -moz-border-radius: 0px 40px 40px 0px;
  106. -webkit-border-radius: 0px 40px 40px 0px;
  107. border-radius: 0px 40px 40px 0px;
  108. }
  109.  
  110. #icon img {
  111. max-width: 48px;
  112. border: 4px solid {color:Top Icon Border};
  113. padding: 3px;
  114. margin-right: 30px;
  115. margin-left: 5px;
  116. margin-top: 7px;
  117. opacity: .7;
  118. }
  119.  
  120. #header {
  121. font-family: 'Bilbo', cursive;
  122. font-size: 22px;
  123. color: {color:Top Title};
  124. letter-spacing: 2px;
  125. text-align: right;
  126. margin-right: 20px;
  127. {block:IfName1}margin-top: 18px;{/block:IfName1}
  128. {block:IfNotName1}margin-top: 29px;{/block:IfNotName1}
  129. }
  130.  
  131. #customnavi {
  132. margin-right: 25px;
  133. margin-top: -3px;
  134. }
  135.  
  136. #customnavi a {
  137. font-family: 'Open Sans Condensed', sans-serif;
  138. color: {color:Top Link};
  139. text-transform: uppercase;
  140. text-decoration: none;
  141. -webkit-transition: all 0.5s ease;
  142. -moz-transition: all 0.5s ease;
  143. -o-transition: all 0.5s ease;
  144. }
  145.  
  146. #customnavi a:hover {
  147. color: {color:Top Link Hover};
  148. }
  149.  
  150.  
  151. /* SIDEBAR */
  152. #side {
  153. left: 570px;
  154. top: 90px;
  155. width: 196px;
  156. position: fixed;
  157. }
  158.  
  159. #desc {
  160. background-color: {color:Sidebar Background};
  161. width: 180px;
  162. padding: 8px;
  163. font-family: 'Lato', sans-serif;
  164. font-size: 10px;
  165. color: {color:Sidebar Text};
  166. letter-spacing: 1px;
  167. text-align: justify;
  168. line-height: 16px;
  169. }
  170.  
  171. #desc b, strong {
  172. color: {color:Sidebar Bold};
  173. font-weight: normal;
  174. }
  175.  
  176. #desc i, em {
  177. color: {color:Sidebar Italic};
  178. }
  179.  
  180. #desc a {
  181. color: {color:Sidebar Link};
  182. text-decoration: none;
  183. }
  184.  
  185. #desc img {
  186. max-width: 180px;
  187. }
  188.  
  189. #page {
  190. margin-top: 15px;
  191. text-align: center;
  192. }
  193.  
  194. #page a {
  195. background-color: {color:Pagination Background};
  196. display: inline-block;
  197. font-family: 'Open Sans Condensed', sans-serif;
  198. font-size: 18px;
  199. color: {color:Pagination Arrow};
  200. text-decoration: none;
  201. text-align: center;
  202. width: 80px;
  203. height: 40px;
  204. line-height: 38px;
  205. }
  206.  
  207.  
  208. /* NAVIGATION */
  209. #links {
  210. top: 74px;
  211. left: 790px;
  212. position: fixed;
  213. }
  214.  
  215. #links a.index {
  216. background-color: {color:Nav Drops};
  217. display: inline-block;
  218. width: 8px;
  219. height: 100px;
  220. text-decoration: none;
  221. -moz-border-radius: 0px 0px 70px 70px;
  222. -webkit-border-radius: 0px 0px 70px 70px;
  223. border-radius: 0px 0px 70px 70px;
  224. -webkit-transition: all 0.5s ease;
  225. -moz-transition: all 0.5s ease;
  226. -o-transition: all 0.5s ease;
  227. }
  228.  
  229. #links a.index:hover {background-color: {color:Nav Drops Hover}; padding-bottom: 20px;}
  230.  
  231. #links a.archive {
  232. background-color: {color:Nav Drops};
  233. display: inline-block;
  234. width: 8px;
  235. height: 65px;
  236. text-decoration: none;
  237. -moz-border-radius: 0px 0px 70px 70px;
  238. -webkit-border-radius: 0px 0px 70px 70px;
  239. border-radius: 0px 0px 70px 70px;
  240. -webkit-transition: all 0.5s ease;
  241. -moz-transition: all 0.5s ease;
  242. -o-transition: all 0.5s ease;
  243. }
  244.  
  245. #links a.archive:hover {background-color: {color:Nav Drops Hover}; padding-bottom: 65px;}
  246.  
  247. #links a.ask {
  248. background-color: {color:Nav Drops};
  249. display: inline-block;
  250. width: 4px;
  251. height: 80px;
  252. text-decoration: none;
  253. -moz-border-radius: 0px 0px 70px 70px;
  254. -webkit-border-radius: 0px 0px 70px 70px;
  255. border-radius: 0px 0px 70px 70px;
  256. -webkit-transition: all 0.5s ease;
  257. -moz-transition: all 0.5s ease;
  258. -o-transition: all 0.5s ease;
  259. }
  260.  
  261. #links a.ask:hover {background-color: {color:Nav Drops Hover}; padding-bottom: 40px;}
  262.  
  263. #links a.theme {
  264. background-color: {color:Nav Drops};
  265. display: inline-block;
  266. width: 8px;
  267. height: 50px;
  268. text-decoration: none;
  269. -moz-border-radius: 0px 0px 70px 70px;
  270. -webkit-border-radius: 0px 0px 70px 70px;
  271. border-radius: 0px 0px 70px 70px;
  272. -webkit-transition: all 0.5s ease;
  273. -moz-transition: all 0.5s ease;
  274. -o-transition: all 0.5s ease;
  275. }
  276.  
  277. #links a.theme:hover {background-color: {color:Nav Drops Hover}; padding-bottom: 80px;}
  278.  
  279.  
  280. /* ENTRIES */
  281. #content {
  282. background-color: {color:Content Background};
  283. width: 520px;
  284. height: 100%;
  285. padding: 5px;
  286. position: fixed;
  287. margin-left: 20px;
  288. top: 0px;
  289. }
  290.  
  291. #posts {
  292. margin-top: 80px;
  293. margin-left: 30px;
  294. }
  295.  
  296. .entry {
  297. background-color: {color:Post Background};
  298. border: 5px solid {color:Post Background};
  299. width: 500px;
  300. overflow: hidden;
  301. margin-bottom: 14px;
  302. z-index: 100;
  303. position: relative;
  304. font-family: 'Lato', sans-serif;
  305. font-size: 12px;
  306. color: {color:Post Text};
  307. letter-spacing: 1px;
  308. }
  309.  
  310. .entry b, strong {
  311. color: {color:Post Bold};
  312. }
  313.  
  314. .entry i, em {
  315. color: {color:Post Italic};
  316. }
  317.  
  318. .entry a {
  319. color: {color:Post Link};
  320. text-decoration: none;
  321. }
  322.  
  323. .entry h1 {
  324. margin-top: 0px;
  325. margin-bottom: 5px;
  326. border-left: 10px solid {color:Post Blockquote};
  327. padding-left: 10px;
  328. font-family: 'Bilbo', cursive;
  329. font-size: 24px;
  330. color: {color:Post Title};
  331. font-weight: normal;
  332. letter-spacing: 2px;
  333. text-transform: lowercase;
  334. text-align: left;
  335. line-height: 18px;
  336. }
  337.  
  338. .entry blockquote {
  339. border-left: 4px solid {color:Post Blockquote};
  340. padding-left: 6px;
  341. margin-left: 10px;
  342. }
  343.  
  344. {block:IfPhotoFading}
  345. .entry img {
  346. opacity: .9;
  347. -webkit-transition: all 0.5s ease;
  348. -moz-transition: all 0.5s ease;
  349. -o-transition: all 0.5s ease;
  350. }
  351.  
  352. .entry img:hover {
  353. opacity: 1;
  354. }
  355.  
  356. .photoset {
  357. opacity: .9;
  358. -webkit-transition: all 0.5s ease;
  359. -moz-transition: all 0.5s ease;
  360. -o-transition: all 0.5s ease;
  361. }
  362.  
  363. .photoset:hover {
  364. opacity: 1;
  365. }
  366. {/block:IfPhotoFading}
  367.  
  368.  
  369. /* ASK POSTS */
  370. .ask {
  371. background-color: {color:Content Background};
  372. padding: 2px;
  373. font-family: 'Open Sans Condensed', sans-serif;
  374. font-size: 11px;
  375. text-transform: uppercase;
  376. }
  377.  
  378. .ask i {
  379. font-style: normal;
  380. }
  381.  
  382.  
  383. /* QUOTE POST */
  384. .entry h2 {
  385. font-family: 'Open Sans Condensed', sans-serif;
  386. font-size: 14px;
  387. color: {color:Post Title};
  388. font-weight: normal;
  389. text-transform: uppercase;
  390. letter-spacing: 2px;
  391. text-align: left;
  392. }
  393.  
  394. .quote {
  395. font-family: georgia;
  396. font-size: 34px;
  397. color: {color:Post Bold};
  398. float: left;
  399. }
  400.  
  401.  
  402. /* AUDIO */
  403. .audio img {
  404. max-width: 40px;
  405. float: left;
  406. margin-right: 5px;
  407. }
  408.  
  409. .player {
  410. background-color: #e4e4e4;
  411. height: 27px;
  412. width: 454px;
  413. float: right;
  414. }
  415.  
  416.  
  417. /* PERMALINK */
  418. .perma {
  419. background-color: {color:Permalink Background};
  420. opacity: 0;
  421. width: 65px;
  422. height: 12px;
  423. line-height: 11px;
  424. position: absolute;
  425. right: 0px;
  426. top: 0px;
  427. font-family: 'Open Sans Condensed', sans-serif;
  428. font-size: 10px;
  429. text-align: left;
  430. text-transform: uppercase;
  431. padding: 3px;
  432. z-index: 1000;
  433. -moz-border-radius: 20px 0px 0px 20px;
  434. -webkit-border-radius: 20px 0px 0px 20px;
  435. border-radius: 20px 0px 0px 20px;
  436. -webkit-transition: all 1s ease;
  437. -moz-transition: all 1s ease;
  438. -o-transition: all 1s ease;
  439. }
  440.  
  441. .perma a {
  442. color: {color:Permalink Link};
  443. text-decoration: none;
  444. -webkit-transition: all 0.5s ease;
  445. -moz-transition: all 0.5s ease;
  446. -o-transition: all 0.5s ease;
  447. }
  448.  
  449. .perma a:hover {
  450. color: {color:Permalink Link Hover};
  451. }
  452.  
  453. .entry:hover .perma {
  454. opacity: 1;
  455. width: 100px;
  456. }
  457.  
  458.  
  459. /* PERMALINK PAGE */
  460. .permalink {
  461. font-family: 'Lato', sans-serif;
  462. font-size: 10px;
  463. color: {color:Post Text};
  464. text-transform: lowercase;
  465. text-align: center;
  466. width: 510px;
  467. z-index: 100;
  468. position: relative;
  469. letter-spacing: 1px;
  470. }
  471.  
  472. .permalink b {
  473. color: {color:Post Bold};
  474. font-weight: normal;
  475. }
  476.  
  477. #date {
  478. color: {color:Post Italic};
  479. }
  480.  
  481. .permalink a {
  482. color: {color:Post Link};
  483. text-decoration: none;
  484. }
  485.  
  486. ol.notes {
  487. padding: 0px;
  488. margin: 15px 0px;
  489. list-style-type: none;
  490. background: transparent;
  491. border: 0px;
  492. letter-spacing: 1px;
  493. }
  494.  
  495. ol.notes li.note {
  496. padding: 1px;
  497. text-align: left;
  498. letter-spacing: 1px;
  499. }
  500.  
  501. .notes img{
  502. width: 10px;
  503. position: relative;
  504. top: 1px;
  505. opacity: .5;
  506. }
  507.  
  508. /* FOLLOW CODE */
  509. iframe#tumblr_controls {
  510. right:3px !important;
  511. position: fixed !important;
  512. -webkit-transition: opacity 0.7s linear;
  513. opacity: 0.2;
  514. -webkit-transition: all 0.8s ease-out;
  515. -moz-transition: all 0.8s ease-out;
  516. transition: all 0.8s ease-out;
  517. }
  518.  
  519. iframe#tumblr_controls:hover {
  520. -webkit-transition: opacity 0.7s linear;
  521. opacity: 1;
  522. -webkit-transition: all 0.4s ease-out;
  523. -moz-transition: all 0.4s ease-out;
  524. transition: all 0.4s ease-out;
  525. }
  526.  
  527. {CustomCSS}
  528. </style>
  529. {block:IfInfiniteScrolling}
  530. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  531. {/block:IfInfiniteScrolling}
  532. </head>
  533. <body>
  534.  
  535. <div id="topnav">
  536. <div id="icon"><img src="{PortraitURL-48}" alt="" align="right"></div>
  537. <div id="header">{Title}</div>
  538. <div id="customnavi">
  539. {block:IfName1}<a href="{text:URL 1}">{text:Name 1}</a>{/block:IfName1}
  540. {block:IfName2}/ <a href="{text:URL 2}">{text:Name 2}</a>{/block:IfName2}
  541. {block:IfName3}/ <a href="{text:URL 3}">{text:Name 3}</a>{/block:IfName3}
  542. {block:IfName4}/ <a href="{text:URL 4}">{text:Name 4}</a>{/block:IfName4}
  543. {block:IfName5}/ <a href="{text:URL 5}">{text:Name 5}</a>{/block:IfName5}
  544. {block:IfName6}/ <a href="{text:URL 6}">{text:Name 6}</a>{/block:IfName6}
  545. </div>
  546. </div>
  547.  
  548. <div id="side">
  549. <div id="desc">
  550. <img src="{image:Sidebar}" alt="">
  551. {Description}
  552. </div>
  553. {block:IfNotInfiniteScrolling}{block:Pagination}<div id="page">
  554. {block:PreviousPage}<a href="{PreviousPage}">◄</a>{/block:PreviousPage}
  555. {block:NextPage}<a href="{NextPage}">►</a>{/block:NextPage}
  556. </div>{/block:Pagination}{/block:IfNotInfiniteScrolling}
  557. </div>
  558.  
  559. <div id="links">
  560. <a class="index" href="/" alt="return?" title="return?">&nbsp;</a>
  561. <a class="archive" href="/archive" alt="archive" title="archive">&nbsp;</a>
  562. <a class="ask" href="/ask" alt="message" title="message">&nbsp;</a>
  563. <a class="theme" href="http://jyuubi.org" alt="theme" title="theme">&nbsp;</a>
  564. </div>
  565.  
  566. <div id="content"></div>
  567. <div id="posts">
  568.  
  569. <div class="autopagerize_page_element">
  570. {block:Posts}
  571.  
  572. <div class="entry">
  573.  
  574. <div class="perma">
  575. &nbsp;&nbsp;<a href="{Permalink}">{ShortMonth} {DayOfMonthWithZero}, {Year}</a>
  576. </div>
  577.  
  578. {block:Text}
  579. {block:Title}<h1>{Title}</h1>{/block:Title}
  580. {Body}
  581. {/block:Text}
  582.  
  583. {block:Photo}
  584. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"></a>{LinkCloseTag}</center>
  585. {block:HighRes}<font size="1px"><a href="{PhotoURL-HighRes}">high resolution &rarr;</a></font>{/block:HighRes}
  586. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  587. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  588. {Caption}
  589. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  590. {/block:Photo}
  591.  
  592. {block:Photoset}
  593. <div class="photoset">{Photoset-500}</div>
  594. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  595. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  596. {Caption}
  597. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  598. {/block:Photoset}
  599.  
  600. {block:Quote}
  601. <div class="quote">&#10077;</div>
  602. <h2>{Quote}</h2>
  603. {block:Source}<p align="right">{Source} &mdash;</p>{/block:Source}
  604. {/block:Quote}
  605.  
  606. {block:Link}
  607. <h1><a href="{URL}" target="{Target}">{Name}</a></h1>
  608. {block:Description}{Description}{/block:Description}
  609. {/block:Link}
  610.  
  611. {block:Chat}
  612. {block:Title}<h1>{Title}</h1>{/block:Title}
  613. {block:Lines}
  614. {block:Label}
  615. <b>{Label}</b>
  616. {/block:Label}
  617. {Line}<br />
  618. {/block:Lines}
  619. {/block:Chat}
  620.  
  621. {block:Audio}
  622. {block:AlbumArt}<div class="audio"><img src="{AlbumArtURL}" alt=""></div>{/block:AlbumArt}
  623. <div class="player">{AudioPlayerGrey}</div>
  624. <b>{FormattedPlayCount}</b> plays{block:Artist} <b>|</b> by <i>{Artist}</i>{/block:Artist}
  625. {block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}
  626. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}<br />
  627. {Caption}
  628. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  629. {/block:Audio}
  630.  
  631. {block:Video}
  632. {Video-500}
  633. <p><center><i>{FormattedPlayCount}</i> plays</center>
  634. {block:IfShowCaptions}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaptions}
  635. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  636. {Caption}
  637. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  638. {/block:Video}
  639.  
  640. {block:Answer}
  641. <div class="ask"><i>{Asker}</i> <b>sent:</b> {Question}</div>
  642. {Answer}
  643. {/block:Answer}
  644.  
  645. </div>
  646.  
  647. {block:PermalinkPage}
  648. <div class="permalink">
  649. <center><div id="date">{block:Date}posted {12Hour}:{Minutes} {AmPm} on {DayOfWeek}, {Month} {DayOfMonth}, {Year}{/block:Date} {block:NoteCount}with {NoteCountWithLabel}{/block:NoteCount}</div>{block:RebloggedFrom}<b>origin:</b> <a href="{ReblogRootURL}">{ReblogRootName}</a> &nbsp;|&nbsp; <b>via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br />{/block:RebloggedFrom}
  650. {block:HasTags}<b>tags &raquo;</b> {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;{/block:Tags}{/block:HasTags}</center>
  651. {block:PostNotes}
  652. {PostNotes}
  653. {/block:PostNotes}
  654. </div>
  655. {/block:PermalinkPage}
  656.  
  657. {/block:Posts}
  658. </div>
  659.  
  660. </div>
  661. </body>
  662. </html>
Advertisement
Add Comment
Please, Sign In to add comment