API tools faq
paste
Advertisement
sunkei

yokai 0.1

sunkei
Aug 5th, 2012
35,775
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.25 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. Yokai 0.2
  3. theme made by gyapo.tumblr.com
  4. don't remove this comment
  5.  
  6. img overflow fixed.
  7. caption fixed
  8. -->
  9.  
  10. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  11.  
  12. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  13.  
  14.  
  15. <head>
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}" />
  21. {/block:Description}
  22.  
  23.  
  24. <meta name="color:Background" content="#fff" />
  25.  
  26. <meta name="color:Icon" content="#fff" />
  27. <meta name="color:Icon Border" content="#fff" />
  28. <meta name="color:Icon Hover" content="#000" />
  29.  
  30. <meta name="color:Bar1" content="#d1d538" />
  31. <meta name="color:Bar2" content="#c85032" />
  32. <meta name="color:Bar3" content="#48745b" />
  33.  
  34. <meta name="color:Description" content="#858585" />
  35. <meta name="color:Description Border" content="#48745b" />
  36.  
  37. <meta name="color:EntryBG" content="#fff" />
  38. <meta name="color:Texts" content="#888" />
  39. <meta name="color:Link" content="#8b942a" />
  40. <meta name="color:Link hover" content="#c85032" />
  41. <meta name="color:Infos" content="#9ba064" />
  42. <meta name="color:InfosBG" content="#e2e6b5" />
  43.  
  44. <meta name="image:Background" content="http://static.tumblr.com/onhp7lq/XXWm875xz/tumblr_ls2e05cme11r3vazto1_402.png"/>
  45. <meta name="image:Icon1" content="http://static.tumblr.com/onhp7lq/jf2m871pc/natsu1.png"/>
  46. <meta name="image:Icon2" content="http://static.tumblr.com/onhp7lq/4UEm871qg/natsu2.png"/>
  47. <meta name="image:Icon3" content="http://static.tumblr.com/onhp7lq/WHxm871qu/natsu3.png"/>
  48.  
  49. <meta name="if:EndlessScroll" content="0"/>
  50. <meta name="if:ShowCaption" content="0"/>
  51. <meta name="if:250" content="0"/>
  52. <meta name="if:400" content="1"/>
  53. <meta name="if:500" content="0"/>
  54.  
  55. <meta name="text:Notes" content="souls" />
  56. <meta name="text:Link1 title" content="link 1" />
  57. <meta name="text:Link1" content="" />
  58. <meta name="text:Link2 title" content="link 2" />
  59. <meta name="text:Link2" content="" />
  60. <meta name="text:Link3 title" content="link 3" />
  61. <meta name="text:Link3" content="" />
  62. <meta name="text:Link4 title" content="link 4" />
  63. <meta name="text:Link4" content="" />
  64. <meta name="text:Link5 title" content="link 5" />
  65. <meta name="text:Link5" content="" />
  66. <meta name="text:Link6 title" content="link 6" />
  67. <meta name="text:Link6" content="" />
  68.  
  69.  
  70. <script src="http://static.tumblr.com/ko3o6ju/QzNls3n3y/smoothscroll.js" type="text/javascript"></script>
  71.  
  72. {block:IfEndlessScroll}<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:IfEndlessScroll}
  73.  
  74. <style type="text/css">
  75.  
  76. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  77.  
  78. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  79.  
  80.  
  81.  
  82. body
  83. {font-family:lucida console;
  84. font-size:9px;
  85. color:{color:Texts};
  86. background-color:{color:Background};
  87. background-image:url('{image:Background}');
  88. background-position: fixed;
  89. background-attachment:fixed;
  90. background-repeat:repeat;}
  91.  
  92. a
  93. {text-decoration:none;
  94. color:{color:Link};
  95. -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;
  96. opacity:1;}
  97.  
  98. a:hover
  99. {text-decoration:none;
  100. color:{color:Link hover};
  101. opacity:1;}
  102.  
  103. blockquote
  104. {border-left:2px solid;
  105. padding-left:5px;}
  106.  
  107. #left
  108. {top:85px;
  109. margin-left:-97px;
  110. position:fixed;}
  111.  
  112. .icon
  113. {width:100px;
  114. height:100px;
  115. overflow:hidden;
  116. border-bottom:4px solid {color:Icon Border};
  117. border-radius:50px;
  118. moz-border-radius:50px;
  119. margin:15px 0px 15px 0px;
  120. -webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
  121.  
  122. .hover
  123. {letter-spacing:4px;
  124. color:{color:Icon};
  125. text-align:center;
  126. position:absolute;
  127. width:0px;
  128. background-color:{color:Icon Hover};
  129. overflow:hidden;
  130. margin-left:75px;
  131. margin-top:-5px;
  132. opacity:0;
  133. -webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
  134.  
  135. .icon:hover
  136. {border-bottom:4px solid {color:Icon Hover};}
  137.  
  138. .icon:hover .hover
  139. {margin-left:-12px;
  140. padding:2px 12px 1px 16px;
  141. width:96px;
  142. margin-top:50px;
  143. opacity:1;}
  144.  
  145. #bars
  146. {position:absolute;
  147. z-index:-1;
  148. margin-top:15px;
  149. margin-left:44px;}
  150.  
  151. .bar
  152. {float:left;
  153. width:4px;
  154. overflow:hidden;
  155. border-radius:2px;
  156. moz-border-radius:2px;}
  157.  
  158. #ichi
  159. {height:400px;
  160. background-color:{color:Bar1};}
  161.  
  162. #ni
  163. {height:440px;
  164. background-color:{color:Bar2};}
  165.  
  166. #san
  167. {height:380px;
  168. background-color:{color:Bar3};}
  169.  
  170.  
  171. #right
  172. {/*left:{block:If250}610px{block:If250} {block:If400}760px{block:If400} {block:If500}860px{block:If500};*/
  173. top:145px;
  174. position:fixed;}
  175.  
  176. #title
  177. {font-size:22px;letter-spacing:5px;
  178. padding-left:5px;
  179. color:{color:Bar3};
  180. text-shadow: 1px 1px {color:Bar1};
  181. border-left:22px solid {color:Bar1};}
  182.  
  183. #navigation
  184. {margin-top:5px;}
  185.  
  186. .link
  187. {margin:5px 0px 5px 0px;
  188. width:150px;
  189. border-left:40px solid {color:Icon Border};
  190. padding-left:5px;
  191. text-shadow:1px 1px {color:Icon Border};
  192. color:{color:Bar3};
  193. text-transform:uppercase;letter-spacing:1px;font-size:8px;
  194. -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;}
  195.  
  196. .link:hover
  197. {color:{color:Bar2};
  198. border-left:55px solid {color:Bar3};}
  199.  
  200. #description
  201. {width:150px;
  202. text-align:justify;
  203. margin:5px 0px 3px 0px;
  204. padding-bottom:3px;
  205. border-bottom:1px dashed {color:Description Border};
  206. color:{color:Description};}
  207.  
  208. #posts
  209. {margin-top:20px;}
  210.  
  211. .posted
  212. {text-align:left;
  213. color:{color:Infos};}
  214.  
  215. .soul
  216. {float:right;}
  217.  
  218. .time
  219. {opacity:0.8;}
  220.  
  221. .post
  222. {width:{block:If250}250px{block:If250} {block:If400}400px{block:If400} {block:If500}500px{block:If500};
  223. padding:10px;
  224. background-color:{color:EntryBG};
  225. margin:15px 22px 15px 22px;
  226. text-align:justify;
  227. overflow:hidden;}
  228.  
  229. .post img
  230. {max-width:width:{block:If250}250px{block:If250} {block:If400}400px{block:If400} {block:If500}500px{block:If500};}
  231.  
  232. #caption
  233. {padding:0px;
  234. width:{block:If250}240px{block:If250} {block:If400}390px{block:If400} {block:If500}490px{block:If500};
  235. margin-top:5px;}
  236.  
  237. #infos
  238. {background-color:{color:InfosBG};
  239. color:{color:Infos};
  240. padding:5px;
  241. width:{block:If250}240px{block:If250} {block:If400}390px{block:If400} {block:If500}490px{block:If500};
  242. margin-top:5px;
  243. text-transform:uppercase;
  244. font-size:9px;}
  245.  
  246. #perm
  247. {width:{block:If250}270px{block:If250} {block:If400}420px{block:If400} {block:If500}520px{block:If500};
  248. margin-left:25px;}
  249.  
  250. #titre
  251. {text-transform:uppercase;letter-spacing:1px;
  252. border-left:55px solid {color:Bar2};
  253. color: {color:Bar2};
  254. padding-left:5px;}
  255.  
  256. #name
  257. {color:{color:Bar3};
  258. border-left:55px solid {color:Bar3};
  259. padding-left:5px;}
  260.  
  261. #pseu
  262. {text-transform:uppercase;}
  263.  
  264. .even
  265. {color:{color:Bar3};}
  266.  
  267. .odd
  268. {color:{color:Bar2};}
  269.  
  270. #quote
  271. {text-transform:uppercase;
  272. color:{color:Bar2};}
  273.  
  274. #all
  275. {margin:0 auto;}
  276.  
  277.  
  278. #pages
  279. {margin-top:15px;}
  280.  
  281.  
  282. .page
  283. {font-size:50px;
  284. margin-right:5px;
  285. background-color:{color:InfosBG};
  286. padding:0px 5px 0px 5px;
  287. color:{color:Infos};}
  288.  
  289.  
  290.  
  291. #audio
  292. {width:{block:If250}250px{block:If250} {block:If400}400px{block:If400} {block:If500}500px{block:If500};
  293. margin-bottom:10px;
  294. overflow:hidden;}
  295.  
  296. #player
  297. {margin:10px;
  298. width:{block:If250}100px{block:If250} {block:If400}290px{block:If400} {block:If500}390px{block:If500};
  299. background-color:#000;}
  300.  
  301.  
  302. #namae
  303. {border-left:5px solid {color:Bar3};
  304. margin:10px;
  305. padding:5px 0px 5px 0px;}
  306.  
  307. .pen
  308. {padding:0px 5px 0px 5px;}
  309.  
  310. .imasu
  311. {color:{color:Bar2};}
  312.  
  313. .people
  314. {float:left;
  315. border-radius:6px;
  316. moz-border-radius:6px;
  317. overflow:hidden;
  318. margin:0px 5px 5px 0px;}
  319.  
  320. .asker
  321. {letter-spacing:1px;
  322. color:{color:Bar2};}
  323.  
  324. .question
  325. {border-bottom:1px dashed {color:Bar3};
  326. margin-bottom:5px;
  327. padding-bottom:3px;
  328. color:{color:Bar3};}
  329.  
  330. .words
  331. {padding-top:3px;}
  332.  
  333. </style>
  334. </head>
  335. <body>
  336. <table align="center" id="all">
  337. <tr><td>
  338. <div id="left">
  339. <div id="bars">
  340. <div class="bar" id="ichi"></div>
  341. <div class="bar" id="ni"></div>
  342. <div class="bar" id="san"></div>
  343. </div><!--bars-->
  344. <div id="menu">
  345. <a href="/"><div class="icon">
  346. <div class="hover">home</div>
  347. <img width="100px" src="{image:Icon1}"></div></a><!--icon1-->
  348. <a href="/ask"><div class="icon">
  349. <div class="hover">ask</div>
  350. <img width="100px" src="{image:Icon2}"></div><a/><!--icon2-->
  351. <a href="/archive"><div class="icon">
  352. <div class="hover">past</div>
  353. <img width="100px" src="{image:Icon3}"></div></a><!--icon3-->
  354. </div><!--menu-->
  355. </div><!--left-->
  356. </td>
  357. <td>
  358. <div id="posts">
  359.  
  360.  
  361.  
  362. {block:Posts}
  363.  
  364. <div class="post">
  365.  
  366. {block:Answer}
  367. <div class="question">
  368. <span class="people"><img src="{AskerPortraitURL-30}"/></span> <span class="words"><span class="asker">{Asker}: </span>{Question}</span></div>
  369. <div class="answer">{Answer}</div>
  370. {/block:Answer}
  371.  
  372. {block:Quote}
  373. <div id="quote">"{Quote}"
  374. </div>
  375. <div id="source" class="name">- {Source}</div>
  376. {/block:Quote}
  377.  
  378. {block:Photo}
  379. {block:IndexPage}
  380. <a href="{Permalink}"><div><img src="{PhotoURL-500}" width="{block:If250}250px{/block:If250} {block:If400}400px{/block:If400} {block:If500}500px{/block:If500}"/></div></a>
  381. {block:IfShowCaption}
  382. <div id="caption">{Caption}</div>
  383. {/block:IfShowCaption}
  384. {/block:IndexPage}
  385. {block:PermalinkPage}
  386. {LinkOpenTag}<div><img src="{PhotoURL-500}" width="{block:If250}250px{/block:If250} {block:If400}400px{/block:If400} {block:If500}500px{/block:If500}"/></div>
  387. {LinkCloseTag}
  388. <div id="caption">{Caption}</div>
  389. {/block:PermalinkPage}
  390. {/block:Photo}
  391.  
  392. {block:Text}
  393. {block:Title}<div id="titre">{Title}</div> {/block:Title}
  394. <div id="body">{Body}</div>
  395. {/block:Text}
  396.  
  397. {block:Link}
  398. <a href="{URL}" target="_blank"><div id="name">{Name}</div></a>
  399. <div id="body">{block:Description} {Description}{/block:Description}</div>
  400. {/block:Link}
  401.  
  402. {block:Chat}
  403. {block:Title}<div id="titre">{Title}</div> {/block:Title}
  404. <div id="body">
  405. {block:Lines} <div>- {block:Label}<span class="{Alt}" id="pseu">{Label}</span> : {/block:Label}{Line}</div>{/block:Lines}
  406. </div>
  407. {/block:Chat}
  408.  
  409. {block:Audio}
  410. <table border="0" cellpadding="0" cellspacing="0" id="audio">
  411. <tr>
  412. {block:AlbumArt}
  413. <td><div id="album">
  414. <img src="{AlbumArtURL}" width="100px"/></div>
  415. </td>
  416. {/block:AlbumArt}
  417. <td>
  418. <div id="player">{AudioPlayerBlack}</div>
  419. <div id="namae">
  420. {block:Artist}
  421. <div class="pen">Artist: <span class="imasu">{Artist}</span></div>
  422. {/block:Artist}
  423. {block:TrackName}
  424. <div class="pen">Title: <span class="imasu">{TrackName}</span></div>
  425. {/block:TrackName}
  426. <div class="pen">{PlayCountWithLabel}</div>
  427. </div>
  428. </td>
  429. </tr>
  430. </table>
  431. {/block:Audio}
  432.  
  433.  
  434. {block:Photoset}
  435. <div>
  436. {block:If250}
  437. {Photoset-250}
  438. {/block:If250}
  439. {block:If400}
  440. {Photoset-400}
  441. {/block:If400}
  442. {block:If500}
  443. {Photoset-500}
  444. {/block:If500}
  445. </div>
  446. {block:IfShowCaption}
  447. <div id="caption">{Caption}</div>
  448. {/block:IfShowCaption}
  449. {/block:Photoset}
  450.  
  451. {block:Video}
  452. <div>
  453. {block:If250}
  454. {Video-250}
  455. {/block:If250}
  456. {block:If400}
  457. {Video-400}
  458. {/block:If400}
  459. {block:If500}
  460. {Video-500}
  461. {/block:If500}
  462. </div>
  463. {block:IfShowCaption}
  464. <div id="caption">{Caption}</div>
  465. {/block:IfShowCaption}
  466. {/block:Video}
  467.  
  468.  
  469. <div id="infos">
  470. <a href="{Permalink}"><span class="posted">posted <span class="time">{TimeAgo}</span></span></a>
  471. <span class="soul">{NoteCount} {Text:Notes} || <a href="{ReblogURL}" target="_blank"><span class="time">Reblog</span></a></span>
  472. </div><!--infos-->
  473.  
  474. </div><!--post-->
  475.  
  476. {block:PermalinkPage}
  477. <div id="perm">
  478. {block:HasTags}<div id="tags">Tagged : {block:Tags}<a href="{TagURL}">#{Tag}</a>, {/block:Tags}</div> {/block:HasTags}
  479. <div>{PostNotes}</div>
  480. </div>
  481. {/block:PermalinkPage}
  482.  
  483.  
  484. {/block:Posts}
  485. </div><!--posts-->
  486. </td>
  487. <td>
  488. <div id="right">
  489. <div id="title">{Title}</div>
  490. <div id="description">{Description}</div>
  491. <div id="navigation">
  492. <a href="{text:Link1}"><div class="link">{text:Link1 title}</div></a>
  493. <a href="{text:Link2}"><div class="link">{text:Link2 title}</div></a>
  494. <a href="{text:Link3}"><div class="link">{text:Link3 title}</div></a>
  495. <a href="{text:Link4}"><div class="link">{text:Link4 title}</div></a>
  496. <a href="{text:Link5}"><div class="link">{text:Link5 title}</div></a>
  497. <a href="{text:Link6}"><div class="link">{text:Link6 title}</div></a>
  498. <a href="http://gyapo.tumblr.com" title="yokai theme" ><div class="link">theme</div></a>
  499. </div><!--navigation-->
  500. <div id="pages">
  501. {block:IfEndlessScroll}
  502. <a href="#top"><span class="page">▲</span></a>{/block:IfEndlessScroll}
  503.  
  504. {block:IfNotEndlessScroll}
  505. {block:Pagination}
  506. {block:PreviousPage}
  507. <a href="{PreviousPage}"><span class="page">«</span></a>
  508. {/block:PreviousPage}
  509. {block:NextPage}
  510. <a href="{NextPage}"><span class="page" id="next">»</span></a>
  511. {/block:NextPage}
  512. {/block:Pagination}
  513. {/block:IfNotEndlessScroll}
  514. </div>
  515. </div><!--right-->
  516.  
  517.  
  518.  
  519.  
  520.  
  521. </td></tr>
  522. </table>
  523. </body>
  524. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!