Advertisement
ryeou

[#1] Falling

Jan 24th, 2013
2,270
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.82 KB | None | 0 0
  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.  
  8.      ∧ ∧          
  9.     ( ・ω・) < do not remove credits
  10.     / つつ do not redistribute the theme code
  11.    ~/  ノ do not use as a base code
  12.     し'し'   do not claim as your own
  13.    
  14. FALLING THEME BY RYEOU // thank you for using
  15.  
  16. ------------>
  17.  
  18. {block:iftinycursor}
  19. <style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/random/tiny_cursor.png'), auto }</style>
  20. {/block:iftinycursor}
  21.  
  22. <title>{Title}</title>
  23. <link rel="shortcut icon" href="{Favicon}">
  24. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  25.  
  26. {block:Description}
  27. <meta name="description" content="{MetaDescription}" />
  28. {/block:Description}
  29.  
  30. <meta name="color:text" content="#aaa">
  31. <meta name="color:bold" content="#99d5bd">
  32. <meta name="color:italics" content="#f9e1d6">
  33. <meta name="color:title" content="#3d3d3d">
  34. <meta name="color:title shadow a" content="#e9e9e9">
  35. <meta name="color:title shadow b" content="#b8f5bb">
  36. <meta name="color:nav bg color" content="#f9e1d6">
  37. <meta name="color:nav text" content="#838282">
  38. <meta name="color:nav border" content="#e8e8e8">
  39. <meta name="color:nav bg hover" content="#f9d0be">
  40. <meta name="color:highlight" content="#f7dfcc">
  41. <meta name="color:highlight text" content ="#fff">
  42. <meta name="color:scrollbar" content="#f9dbdb">
  43. <meta name="color:scrollbar bg" content="#fafafa">
  44. <meta name="color:post wrap color" content="#fbfbfb">
  45. <meta name="color:chat post bg" content="#eaf7f6">
  46. <meta name="color:blockquote color" content="#f0f0f0">
  47. <meta name="color:pagination color" content="#ccc">
  48. <meta name="color:links" content="#abccc7">
  49. <meta name="color:links hover" content="#bababa">
  50.  
  51. <meta name="image:bg image" content="http://static.tumblr.com/924c68864a1f8de72aedcf66e338478a/p7wg3p9/29Qmg8dzf/tumblr_static_tumblr_ltqq73kh5g1qhvdofo4_4003432432432423.png">
  52. <meta name="image:sidebar" content="http://static.tumblr.com/7347589dc1e10e8c064f7dee90e789e6/p7wg3p9/TBMmshf6c/tumblr_static_icon200.png" />
  53. <meta name="image:post wrap bg" content="http://static.tumblr.com/924c68864a1f8de72aedcf66e338478a/p7wg3p9/29Qmg8dzf/tumblr_static_tumblr_ltqq73kh5g1qhvdofo4_4003432432432423.png">
  54.  
  55. <meta name="text:link 1 title" content="link 1">
  56. <meta name="text:link 1 url" content="/links">
  57. <meta name="text:link 2 title" content="link 2">
  58. <meta name="text:link 2 url" content="/links">
  59. <meta name="text:link 3 title" content="link 3">
  60. <meta name="text:link 3 url" content="/links">
  61.  
  62. <meta name="if:tiny cursor" content="1">
  63. <meta name="if:pixel font" content="0"/>
  64. <meta name="if:round sidebar" content="1"/>
  65.  
  66. <style type="text/css">
  67.  
  68. @font-face {
  69. font-family: "tinytots";
  70. src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');
  71. }
  72.  
  73. ::selection {
  74. background: {color:highlight};
  75. color: {color:highlight text};
  76. }
  77.  
  78. ::-moz-selection {
  79. background: {color:highlight};
  80. color: {color:highlight text};
  81. }
  82.  
  83. ::-webkit-scrollbar-thumb:vertical {
  84. width:5px;
  85. background-color: {color:scrollbar};
  86. }
  87.  
  88. ::-webkit-scrollbar {
  89. width:5px;
  90. background-color:{color:scrollbar bg};
  91. }
  92.  
  93. body {
  94. {block:ifPixelFont}
  95. font-family: tinytots;
  96. font-size: 8px;
  97. {/block:ifPixelFont}
  98. {block:ifnotPixelFont}
  99. font-family: lucida console;
  100. font-size: 8px;
  101. {/block:ifnotPixelFont}
  102. color: {color:text};
  103. margin: 0;
  104. background-image: url("{image:bg image}");
  105. }
  106.  
  107. a {
  108. color:{color:links};
  109. text-decoration: none;
  110. }
  111.  
  112. a:hover {
  113. color: {color:links hover};
  114. }
  115.  
  116. ul, ol {
  117. list-style-type: hiragana;
  118. }
  119.  
  120. b, strong {
  121. color: {color:bold};
  122. }
  123.  
  124. i, em {
  125. color: {color:italics};
  126. }
  127.  
  128. h3{
  129. font: 14px lucida console;
  130. font-weight: 800;
  131. text-align: center;
  132. text-transform:uppercase;
  133. letter-spacing:5px;
  134. }
  135.  
  136. blockquote {
  137. border-left: 2px solid {color:blockquote color};
  138. padding: 1px 1px 1px 10px;
  139. margin: 5px;
  140. }
  141.  
  142. #content {
  143. background-color: {color:post wrap bg color};
  144. background-image: url('{image:post wrap bg}');
  145. padding: 1px 5px 5px 5px;
  146. width: 408px;
  147. margin-left: 400px;
  148. }
  149.  
  150. .posts {
  151. padding: 3px;
  152. border: 1px solid #F0F0F0;
  153. margin-top: 5px;
  154. overflow: hidden;
  155. background: #fff;
  156. width: 400px;
  157. }
  158.  
  159. .posts img {
  160. max-width: 100%;
  161. }
  162.  
  163. #captions {
  164. background: #FBFBFB;
  165. display: block;
  166. padding: 1px 10px 1px 10px;
  167. margin-top: 10px;
  168. display: none;
  169. }
  170.  
  171. .audio img {
  172. max-width: 80px;
  173. margin-right: 10px;
  174. float: left;
  175. border: 5px solid #e8e8e8;
  176. }
  177.  
  178. .mplayer {
  179. background-color: #fff;
  180. margin-left: 17px;
  181. margin-top: 17px;
  182. height: 30px;
  183. width: 30px;
  184. padding: 13px;
  185. overflow: hidden;
  186. position:absolute;
  187. opacity: 0;
  188. transition: .7s;
  189. -moz-transition: .7s;
  190. -webkit-transition: .7s;
  191. -o-transition: .7s;
  192. -border-radius: 10px;
  193. -moz-border-radius:10px;
  194. -webkit-border-radius:10px;
  195. }
  196.  
  197. .mplayer:hover {
  198. opacity: .8;
  199. }
  200.  
  201. .quote {
  202. font: 14px lucida console;
  203. font-weight: bold;
  204. font-style:italic;
  205. text-align: center;
  206. text-transform:uppercase;
  207. letter-spacing:2px;
  208. }
  209.  
  210. .source {
  211. text-align: right;
  212. }
  213.  
  214. ul.chat {
  215. margin: 0 0 0 0;
  216. padding: 0 0 0 0;
  217. }
  218.  
  219. .chat li {
  220. list-style-type: none;
  221. padding: 2px;
  222. }
  223.  
  224. .chat li.odd {
  225. background-color: {color:chat post bg};
  226. }
  227.  
  228. #sidebar {
  229. position:fixed;
  230. top:0px;
  231. left:100px;
  232. height: 100%;
  233. width:200px;
  234. background-color: transparent;
  235. }
  236.  
  237. #kebin {
  238. position:fixed;
  239. top:50px;
  240. left:100px;
  241. }
  242.  
  243. .transition {
  244. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
  245. }
  246.  
  247. #picture {
  248. width:200px;
  249. }
  250.  
  251. #picture:hover {
  252. width:260px;
  253. }
  254.  
  255. #left {
  256. float:left;
  257. overflow:hidden;
  258. width:100px;
  259. {block:ifroundsidebar}
  260. -border-radius: 100px 0px 0px 100px;
  261. -moz-border-radius:100px 0px 0px 100px;
  262. -webkit-border-radius:100px 0px 0px 100px;
  263. {/block:ifroundsidebar}
  264. }
  265.  
  266. #right {
  267. overflow:hidden;
  268. width:100px;
  269. {block:ifroundsidebar}
  270. -border-radius: 0px 100px 100px 0px;
  271. -moz-border-radius:0px 100px 100px 0px;
  272. -webkit-border-radius:0px 100px 100px 0px;
  273. {/block:ifroundsidebar}
  274. }
  275.  
  276. #about {
  277. float:left;
  278. width:0px;
  279. height:0px;
  280. opacity:0;
  281. text-align: center;
  282. vertical-align: middle;
  283. }
  284.  
  285. #picture:hover #about {
  286. width:100px;
  287. padding:20px 10px 20px 10px;
  288. opacity:1;}
  289.  
  290. #picture:hover #left {
  291. margin-left:-65px;
  292. }
  293.  
  294. #picture:hover #title {
  295. letter-spacing:10px;
  296. margin-top: 120px;
  297. opacity: 0;
  298. -webkit-transition: opacity .7s linear;
  299. -webkit-transition: all .7s ease-in-out;
  300. -moz-transition: all .7s ease-in-out;
  301. -o-transition: all .7s ease-in-out;
  302. }
  303.  
  304. #kissip {
  305. background-color: {color:nav bg color};
  306. border:1px dotted {color:nav border};
  307. color: {color:nav text};
  308. display: inline-block;
  309. text-transform:uppercase;
  310. padding: 2px;
  311. width: 90px;
  312. height:8px;
  313. margin-bottom: 3px;
  314. -webkit-transition: opacity .7s linear;
  315. -webkit-transition: all .7s ease-in-out;
  316. -moz-transition: all .7s ease-in-out;
  317. -o-transition: all .7s ease-in-out;
  318. }
  319.  
  320. #kissip:hover {
  321. background-color: {color:nav bg hover};
  322. -border-radius: 10px;
  323. -moz-border-radius:10px;
  324. -webkit-border-radius:10px;
  325. }
  326.  
  327. #credit{
  328. position:fixed;
  329. width:76px;
  330. right:-67px;
  331. bottom:8px;
  332. line-height:150%;
  333. padding:2px;
  334. font: 8px consolas;
  335. border:1px dashed #e8e8e8;
  336. -webkit-transition-duration: 0.7s;
  337. -moz-transition-duration: 0.7s;
  338. -o-transition-duration: 0.7s;
  339. transition-duration: 0.7s;
  340. }
  341.  
  342. #credit:hover {
  343. right:10px;
  344. -webkit-transition-duration: 0.7s;
  345. -moz-transition-duration: 0.7s;
  346. -o-transition-duration: 0.7s;
  347. transition-duration: 0.7s;
  348. }
  349.  
  350. #title {
  351. position:absolute;
  352. width:200px;
  353. top:90px;
  354. left: 2px;
  355. font:20px consolas;
  356. color: {color:title};
  357. letter-spacing:5px;
  358. text-align:center;
  359. font-weight: bold;
  360. text-shadow: 2px 0 .2px {color:title shadow a}, -2px 0 .2px {color:title shadow b};
  361. -webkit-transition: opacity .7s linear;
  362. -webkit-transition: all .7s ease-in-out;
  363. -moz-transition: all .7s ease-in-out;
  364. -o-transition: all .7s ease-in-out;
  365. }
  366.  
  367. #info {
  368. text-transform:uppercase;
  369. letter-spacing:1px;
  370. opacity: 0;
  371. position: absolute;
  372. margin-top: 0px;
  373. margin-left:415px;
  374. text-align: left;
  375. width: 80px;
  376. background-color: #transp;
  377. color: #387dcc;
  378. -webkit-transition: all .7s ease;
  379. -moz-transition: all .7s ease;
  380. -o-transition: all .7s ease;
  381. }
  382.  
  383. .posts:hover #info {
  384. opacity:1;
  385. }
  386.  
  387. #asker {
  388. margin-right:5px;
  389. float:left;
  390. -moz-border-radius:100px;
  391. border-radius:100px;
  392. }
  393.  
  394. .pagination {
  395. font: 18px consolas;
  396. height:auto;
  397. color:{color:pagination color};
  398. opacity:0.4;
  399. text-align: center;
  400. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
  401. }
  402.  
  403. .pagination:hover {
  404. opacity:1;
  405. }
  406.  
  407. iframe#tumblr_controls {
  408. position: fixed !important;
  409. z-index: 9999;
  410. }
  411.  
  412. </style>
  413.  
  414. {block:IfEndlessScroll}
  415. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  416. {/block:IfEndlessScroll}
  417.  
  418. </head>
  419.  
  420. <body>
  421.  
  422. <div id="content">
  423.  
  424. <div id="sidebar">
  425.  
  426. <div id="kebin">
  427. <div id="picture" class="transition">
  428. <div id="title">{Title}</div>
  429. <div id="left" class="transition" style="-border-radius: 100 0 0 100;">
  430. <img width="200px" src="{image:sidebar}">
  431. </div>
  432. <div id="about" class="transition">{Description}<br><br>
  433. <a href="/"><div id="kissip">home</div></a>
  434. <a href="/ask"><div id="kissip">ask</div></a>
  435. <a href="{text:link 1 url}"><div id="kissip">{text:link 1 title}</div></a>
  436. <a href="{text:link 2 url}"><div id="kissip">{text:link 2 title}</div></a>
  437. <a href="{text:link 3 url}"><div id="kissip">{text:link 3 title}</div></a>
  438. <br>
  439.  
  440. {block:Pagination} {block:PreviousPage}<div class="pagination"><a href="{PreviousPage}">«</a></div>{/block:PreviousPage} {block:NextPage}<div class="pagination"><a href="{NextPage}">»</a></div>{/block:NextPage}
  441. {/block:Pagination}
  442. </div>
  443. <div id="right" class="transition" style="-border-radius: 0 100 100 0;">
  444. <img width="200px" style="margin-left:-100px;" src="{image:sidebar}">
  445. </div>
  446. </div>
  447.  
  448. </div>
  449.  
  450. </div>
  451.  
  452. {block:Posts}
  453.  
  454. <div class="posts">
  455.  
  456. {Block:IndexPage}<div id="info">
  457. <a href="{Permalink}" title="{NoteCountWithLabel}"><big><big><big>✖</big></big></big></a><br>
  458. <a href="{ReblogURL}" target="_blank" title="reblog?"><big><big><big>➡</big></big></big></a>
  459. </div>{/Block:IndexPage}
  460.  
  461. {block:Text}
  462. {block:Title}
  463. <h3><a href="{Permalink}">{Title}</a></h3>
  464. {/block:Title}
  465. {Body}
  466. {/block:Text}
  467.  
  468. {block:Photo}
  469. <center>
  470. <img src="{PhotoURL-400}">
  471. </center>
  472. {/block:Photo}
  473.  
  474. {block:Photoset}
  475. <div class="photoset">
  476. {Photoset-400}
  477. </div>
  478. {block:Caption}
  479. <div id="captions">
  480. {Caption}</div>
  481. {/block:Caption}
  482. {/block:Photoset}
  483.  
  484. {block:Quote}
  485. <div class="quote">❝{Quote}❞</div>
  486. {block:Source}
  487. <div class="source">{Source}</div>
  488. {/block:Source}
  489.  
  490. {/block:Quote}
  491.  
  492. {block:Link}
  493. <center><h3><a href="{URL}" {Target}>{Name}</a></h3></center>
  494. {block:Description}
  495. {Description}
  496. {/block:Description}
  497. {/block:Link}
  498.  
  499. {block:Chat}
  500. {block:Title}
  501. <h3>{Title}</h3>
  502. {/block:Title}
  503. <ul class="chat">
  504. {block:Lines}
  505. <li class="{Alt} user_{UserNumber}">
  506. {block:Label}
  507. <span class="label">{Label}</span>
  508. {/block:Label}
  509. {Line}
  510. </li>
  511. {/block:Lines}
  512. </ul>
  513. {/block:Chat}
  514.  
  515. {block:Audio}
  516. {block:AlbumArt}<div class="audio"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  517. <div class="mplayer">{AudioPlayerWhite}</div>
  518. <div style="text-transform: uppercase;">{block:Artist}<b>Artist:</b> {Artist}{/block:Artist}<br>{block:TrackName}<b>Song:</b> {TrackName}{/block:TrackName}</div>
  519. {block:Caption}{Caption}{/block:Caption}<br>
  520. {/block:Audio}
  521.  
  522. {block:Video}
  523. <div class="video">
  524. {block:IndexPage}{Video-250}{/block:IndexPage}
  525. {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
  526. </div>
  527.  
  528. {block:Caption}
  529. <div id="captions">
  530. {Caption}</div>
  531. {/block:Caption}
  532.  
  533. {/block:Video}
  534.  
  535. {block:Answer}
  536. <img src="{AskerPortraitURL-48}" id="asker"><div style="text-transform:uppercase; border-bottom:1px dotted #ccc; align:right; padding-bottom:2px;">{Asker}: {Question}</div>{Answer}
  537. {/block:Answer}
  538.  
  539. {block:PermalinkPage}
  540. <div style="text-align:justify; width:410px">{Caption}</div>
  541. <div style="text-align:justify; border-top:1px dotted #ccc; border-bottom:1px dotted #ccc; font-family:tinytots; width:410px"><div style="margin:5px 0px 5px 0px"><center>{block:NoteCount}{NoteCountWithLabel} ▴ {/block:NoteCount}{block:Date}{ShortYear}.{MonthNumberWithZero}.{DayOfMonthWithZero} ▴ {TimeAgo}{/block:Date}{block:HasTags} ▴ {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags} {/block:HasTags}</div></div>
  542. {block:PostNotes}<div style="margin-top:10px">{PostNotes}</div>{/block:PostNotes}</center>
  543. </div>
  544. {/block:PermalinkPage}
  545.  
  546. </div>
  547.  
  548. {/block:Posts}
  549.  
  550. <div id="credit">♚ theme by <a href="http://ryeou.tumblr.com">ryeou</a></div>
  551.  
  552. </body>
  553. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement