Jyuubi

[Theme] → #19 Lifestream

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