API tools faq
paste
kamikies

01 - KAMIKI THEME

kamikies
Oct 29th, 2014
1,160
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.98 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3. <head>
  4.  
  5. <title>{Title}</title>
  6.  
  7. <!-----------
  8.  
  9.  
  10.  
  11.  
  12. theme by KANGJAN.tumblr.com
  13.  
  14. edit as much as you want, but PLEASE do NOT remove credit or redistribute or any of that stuff, it's illegal and i work hard on themes.
  15.  
  16. have fun and enjoy this theme!!
  17.  
  18. base code by kaiguk and music code from bakaothemes
  19.  
  20.  
  21.  
  22.  
  23. ------------>
  24.  
  25.  
  26. <link rel="shortcut icon" href="{image:favicon}">
  27.  
  28. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  29.  
  30. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  31.  
  32. <meta name="color:bold" content="#e89e8c"/>
  33. <meta name="color:italic" content="#666666"/>
  34. <meta name="color:background" content="#ffffff"/>
  35. <meta name="color:sidebar bg" content=""/>
  36. <meta name="color:text" content="#000000"/>
  37. <meta name="color:link" content="#222222"/>
  38. <meta name="color:hover" content="#f3ccc5"/>
  39. <meta name="color:border" content="#222222"/>
  40. <meta name="color:ask bubble" content="#f7dfd9"/>
  41. <meta name="color:scrollbar" content="#fdb7a2">
  42. <meta name="color:linktitlebg" content="#eeeeee"/>
  43. <meta name="color:linktitletext" content="#888888"/>
  44. <meta name="color:selection text" content="#888888"/>
  45. <meta name="color:selection bg" content="#eeeeee"/>
  46.  
  47. <meta name="image:sidebar img" content=""/>
  48. <meta name="image:banner" content="" />
  49. <meta name="image:bg" content=""/>
  50. <meta name="image:corner img" content=""/>
  51. <meta name="image:favicon" content="" />
  52. <meta name="image:to top" content=""/>
  53.  
  54. <meta name="text:corner img height"content="400"/>
  55. <meta name="text:ask text" content="" />
  56. <meta name="text:Link 1 URL" content="" />
  57. <meta name="text:Link 1" content="" />
  58. <meta name="text:Link 2 URL" content="" />
  59. <meta name="text:Link 2" content="" />
  60. <meta name="text:Link 3 URL" content="" />
  61. <meta name="text:Link 3" content="" />
  62. <meta name="text:Link 4 URL" content="" />
  63. <meta name="text:Link 4" content="" />
  64.  
  65. <meta name="text:music code" content="" />
  66. <meta name="if:music player" content="1" />
  67.  
  68.  
  69.  
  70.  
  71. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  72. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  73. <script>
  74. (function($){
  75. $(document).ready(function(){
  76. $("[title]").style_my_tooltips();
  77. });
  78. })(jQuery);
  79. </script>
  80.  
  81.  
  82.  
  83.  
  84. <style type="text/css">
  85.  
  86.  
  87.  
  88.  
  89.  
  90.  
  91. ::-webkit-scrollbar{height: 9px; width: 9px; -webkit-border-radius: 0px; background:{color:background};
  92. }
  93.  
  94. ::-webkit-scrollbar-thumb{background:{color:scrollbar};}
  95. ::-webkit-scrollbar-track{background:{color:bg};
  96. }
  97.  
  98. /* If you want a certain font, background color, your text color, font color, etc. for the theme. */
  99.  
  100. body {
  101. background:{color:background};
  102. background-image:url('{image:bg}');
  103. background-attachment:fixed;
  104. color:{color:text};
  105. font-family:arial;
  106. font-size:11px;
  107. text-align:justify;
  108. margin:0;
  109. line-height:16px;
  110. }
  111.  
  112. h1 {
  113. color:{color:text};
  114. font-family:arial;
  115. text-transform:uppercase;
  116. font-size:15;
  117. }
  118.  
  119. /* blockquote */
  120.  
  121. blockquote {
  122. padding:5px 0 5px 30px;
  123. border-left:1px solid {color:border};
  124. margin-left:30px;
  125. }
  126.  
  127. /* bold (b), italic (i,em), and underlined (u) */
  128.  
  129. b,strong{
  130. color:{color:bold};
  131. }
  132.  
  133.  
  134. i,em{
  135. color:{color:italic};
  136. }
  137.  
  138.  
  139. #banner {
  140.  
  141. width:100%;
  142.  
  143. height:110px;
  144.  
  145. background: url('{image:banner}') top fixed repeat-x;
  146.  
  147. position:fixed;
  148.  
  149. margin-top:-50px;
  150.  
  151. opacity: 0.8;
  152.  
  153. }
  154.  
  155.  
  156.  
  157. /* Links & hovers */
  158.  
  159.  
  160. a {
  161. color:{color:link};
  162. text-decoration:none;
  163. -moz-transition-duration:1s;
  164. -webkit-transition-duration:1s;
  165. -o-transition-duration:1s;
  166. }
  167.  
  168.  
  169. a:hover {
  170. color:{color:hover};
  171. /* transition of the image when you hover on it */
  172. -moz-transition-duration:1s;
  173. -webkit-transition-duration:1s;
  174. -o-transition-duration:1s;
  175. }
  176.  
  177. /* Your sidebar, image, description and links */
  178.  
  179.  
  180. #sidebar {
  181. padding:6px;
  182. border:1px solid {color:border};
  183. text-align:right;
  184. background:{color:sidebar bg};
  185. position:fixed;
  186. margin-left:-180px;
  187. margin-top:200px;
  188. width:135px;
  189. }
  190.  
  191.  
  192. #sideimg img {
  193. width:100px;
  194. border-radius:60px;
  195. padding:8px;
  196. -moz-transition-duration:1s;
  197. -webkit-transition-duration:1s;
  198. -o-transition-duration:1s;
  199. }
  200.  
  201.  
  202. #sideimg img:hover {
  203. border-radius:0px;
  204. /* transition of the image when you hover on it */
  205. -moz-transition-duration:1s;
  206. -webkit-transition-duration:1s;
  207. -o-transition-duration:1s;
  208.  
  209. }
  210.  
  211. #ask img {
  212. border-radius:50px;
  213. /* transition of the image when you hover on it */
  214. -moz-transition-duration:1s;
  215. -webkit-transition-duration:1s;
  216. -o-transition-duration:1s;
  217.  
  218. }
  219.  
  220. #ask img:hover {
  221. border-radius:0px;
  222. /* transition of the image when you hover on it */
  223. -moz-transition-duration:1s;
  224. -webkit-transition-duration:1s;
  225. -o-transition-duration:1s;
  226.  
  227. }
  228.  
  229.  
  230. #links {
  231. width:150px;
  232. text-transform:lowercase;
  233. word-spacing:3px;
  234. text-align:left;
  235. margin-left:18px;
  236. }
  237.  
  238.  
  239. #links a {
  240. margin-top:5px;
  241. display:inline-block;
  242. margin-bottom:5px;
  243. }
  244.  
  245.  
  246. #desc {
  247. width:100px;
  248. margin-left:18px;
  249. text-align:left;
  250. font-size:11px;
  251. }
  252.  
  253.  
  254. #theme {
  255. left:50%;
  256. margin-left:-250px;
  257. position:absolute;
  258. }
  259.  
  260.  
  261. /* Your post */
  262.  
  263.  
  264. #entries {
  265. margin-top:75px;
  266. width:350px;
  267.  
  268. }
  269.  
  270.  
  271. #posts {
  272. background:#fff;
  273. width:400px;
  274. margin-left:50px;
  275. margin-bottom:75px;
  276. border:1px solid {color:border};
  277. padding:20px;
  278. }
  279.  
  280.  
  281. #posts img {
  282. max-width:400px;
  283. }
  284.  
  285. h1 {
  286. font-family: arial;
  287. font-size: 20px;
  288. text-transform:lowercase;
  289. color: black;
  290. letter-spacing:5px;
  291. text-align:center;
  292. }
  293.  
  294.  
  295. /* Quote & Source */
  296.  
  297. #quote{
  298. text-align:left;
  299. font-size:14px;
  300. text-transform:lowercase;
  301. line-height:18px;
  302. letter-spacing:1px;
  303. font-weight:italic;
  304. }
  305.  
  306.  
  307. #source {
  308. margin-top:15px;
  309. text-align:right;
  310. }
  311.  
  312.  
  313. /* Audio */
  314.  
  315.  
  316. .player {
  317. width:25px;
  318. height:25px;
  319. overflow:hidden;
  320. position:absolute;
  321. background:white;
  322. }
  323.  
  324.  
  325. .audioinfo {
  326. margin-left:50px;
  327. line-height:120%;
  328. }
  329.  
  330.  
  331. /* Speech Bubble for Question */
  332.  
  333.  
  334. .bubble {
  335. width:300px;
  336. position: relative;
  337. background:{color:ask bubble};
  338. left:60px;
  339. margin: 0;
  340. padding:10px;
  341. text-align:center;
  342. -moz-border-radius:10px;
  343. -webkit-border-radius:10px;
  344. -webkit-box-shadow: 0px 0 1px rgba(0,0,0,0);
  345. -moz-box-shadow: 0px 0 1px rgba(0,0,0,0);
  346. box-shadow: 0px 0 1px rgba(0,0,0,0);
  347. }
  348.  
  349.  
  350. .bubble:after {
  351. position: absolute;
  352. display: block;
  353. content: "";
  354. border-color: {color:ask bubble} transparent transparent transparent;
  355. border-style: solid;
  356. border-width: 15px 15px 0px;
  357. height:0;
  358. width:0;
  359. position:absolute;
  360. left:-15px;
  361. top:10px;
  362. }
  363.  
  364.  
  365. /* Chats */
  366.  
  367.  
  368. .chat ol {
  369. padding:0;
  370. list-style:none;
  371. }
  372.  
  373.  
  374. .line {
  375. list-style:none;
  376. padding:5px 0;
  377. }
  378.  
  379.  
  380. .label {
  381. text-decoration:bold;
  382. }
  383.  
  384.  
  385. /* Permalink & Info */
  386.  
  387.  
  388. #info {
  389. padding:10px;
  390. width:374px;
  391. text-align:justify;
  392. line-height:15px;
  393. margin-top:10px;
  394. height:auto;
  395. background:#fafafa;
  396. padding:10px;
  397. }
  398.  
  399.  
  400. #perma {
  401. margin-top:10px;
  402. padding:5px;
  403. font-size:9px;
  404. color:{color:link};
  405. text-transform:normal;
  406. font-style:normal;
  407. letter-spacing:2px;
  408. text-align:center;
  409. }
  410.  
  411.  
  412. /* Notes */
  413.  
  414.  
  415. .note li {
  416. list-style-type:none;
  417. padding:10px 25px 10px 25px;
  418. text-align:left;
  419. margin:0px;
  420. border-bottom:1px solid {color:border};
  421. line-height:140%;
  422. -moz-transition-duration:0.5s;
  423. -webkit-transition-duration:0.5s;
  424. -o-transition-duration:0.5s;
  425. }
  426.  
  427.  
  428. .notes img {
  429. display:none!important;
  430. }
  431.  
  432.  
  433. /* For Hovering Over Links*/
  434.  
  435.  
  436. #s-m-t-tooltip {
  437. z-index: 9999;
  438. background: {color:LinkTitleBG};
  439. font-size: 10px;
  440. line-height: 11px;
  441. font-family: arial;
  442. letter-spacing: 1px;
  443. text-transform: normal;
  444. color: {color:LinkTitleText};
  445. max-width: 150px;
  446. word-wrap: break-word;
  447. padding: 2px 5px 2px 6px;
  448. display: block;
  449. margin: 24px 14px 7px 12px;
  450. -webkit-box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.10);
  451. -moz-box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.10);
  452. box-shadow: 2px 2px 2px rgba(50, 50, 50, 0.10);
  453. }
  454.  
  455.  
  456. /* Selection Text & BG (instead of having that blue background when you highlight something) */
  457.  
  458.  
  459. ::selection {
  460. background:{color:selection bg};
  461. color:{color:selection text};
  462. }
  463.  
  464.  
  465. /* Scroll to Top button*/
  466.  
  467.  
  468. #scrollToTop:link, #scrollToTop:visited {
  469. display:none;
  470. position:fixed;
  471. bottom: 10px;
  472. right:70px;
  473. }
  474.  
  475.  
  476. #ongaku {
  477. position:fixed;
  478. margin-left:-170px;
  479. margin-top:365px;
  480. width:30px;
  481. height:30px;
  482. z-index:9999;
  483. border:4px double #ccc; /*Border Colour*/
  484. background-color:#fff; /*Music Tab Background Colour*/
  485. border-radius:30px;
  486. opacity:.6;
  487. -webkit-transition: all 0.6s ease-in-out;
  488. -moz-transition: all 0.6s ease-in-out;
  489. -ms-transition: all 0.6s ease-in-out;
  490. -o-transition: all 0.6s ease-in-out;
  491. transition: all 0.6s ease-in-out;
  492. }
  493.  
  494. #gaku {
  495. width:24px;
  496. height:24px;
  497. margin-top:3px;
  498. margin-left:3px;
  499. overflow:hidden;
  500. -webkit-transition: all 0.6s ease-in-out;
  501. -moz-transition: all 0.6s ease-in-out;
  502. -ms-transition: all 0.6s ease-in-out;
  503. -o-transition: all 0.6s ease-in-out;
  504. transition: all 0.6s ease-in-out;
  505. }
  506.  
  507. #kero {
  508. height:26px;
  509. }
  510.  
  511. #kero img {
  512. margin-right:10px;
  513. margin-left:3px;
  514. margin-top:3px;
  515. }
  516.  
  517. #kero embed {
  518. margin-top:-5px;
  519. }
  520.  
  521. #kero embed, #kero {
  522. -webkit-transition: all 0.6s ease-in-out;
  523. -moz-transition: all 0.6s ease-in-out;
  524. -ms-transition: all 0.6s ease-in-out;
  525. -o-transition: all 0.6s ease-in-out;
  526. transition: all 0.6s ease-in-out;
  527. }
  528.  
  529. #ongaku:hover {
  530. opacity:1;
  531. width:80px;
  532. }
  533.  
  534. #ongaku:hover #gaku {
  535. width:74px;
  536. }
  537.  
  538. #ongaku:hover #kero {
  539. margin-left:-50px;
  540. }
  541.  
  542.  
  543.  
  544.  
  545. {CustomCSS}
  546.  
  547. </style>
  548.  
  549.  
  550. <!-- infinite scroll -->
  551.  
  552. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  553.  
  554. <!-- scroll to top button -->
  555.  
  556. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  557. <script src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  558. <a href="javascript:;" id="scrollToTop" title="top"><img src="{image:To Top}"></a></a>
  559.  
  560.  
  561. </head>
  562.  
  563.  
  564. <body>
  565. <div id="banner"></div>
  566.  
  567.  
  568.  
  569. <img src='{image:corner img}' height={text:corner img height} style='position:fixed;bottom:0px;left:0px;z-index:999'/>
  570.  
  571.  
  572.  
  573. <div id="theme">
  574.  
  575. <div id="sidebar">
  576.  
  577. <div id="sideimg"><center><a href="/"><img src="{image:Sidebar img}"></a></center></div>
  578.  
  579. <div id="links">
  580.  
  581. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}
  582.  
  583. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}
  584.  
  585. {block:ifLink3}<a href="{text:Link 3 URL}" >{text:Link 3}</a>{/block:ifLink3}
  586.  
  587. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:ifLink4}
  588.  
  589. </div>
  590.  
  591. <div id="desc">{Description}</div>
  592.  
  593.  
  594. </div>
  595.  
  596. <div id="entries">
  597.  
  598. {block:ifmusicplayer}
  599. <div id="ongaku">
  600. <div id="gaku">
  601. <div id="kero">
  602. <table cellspacing"0" cellpadding="0"><tr><td>
  603. <img src="http://media.tumblr.com/tumblr_m7w0seu08Y1r6o8v2.gif"></td><td>
  604. {text:music code}</td></tr>
  605. </table>
  606. </div>
  607. </div></div>
  608. {/block:ifmusicplayer}
  609.  
  610. </div>
  611.  
  612. <!-- for your infinite scroll to work -->
  613.  
  614. <div class="autopagerize_page_element">
  615.  
  616.  
  617. {block:Posts}
  618.  
  619. <div id="posts">
  620.  
  621. {block:Quote}
  622. <div id="quote">“{Quote}”</div>
  623. {block:Source}<div id="source">— {Source}</div>{/block:Source}
  624. {/block:Quote}
  625.  
  626.  
  627. {block:Text}
  628. {block:Title}
  629. <div id="title"><div style="letter-spacing:2px; text-transform:lowercase; font-size:17px; text-align:center;">{Title}</div></div>{/block:Title}
  630. {Body}
  631. {/block:Text}
  632.  
  633. {block:Link}
  634. <div id="title">
  635. <div style="letter-spacing:1px; text-transform:lowercase; font-size:17px; text-align:center;"><a href="{URL}">{Name} »</a></div></div>
  636. {block:Description}{Description}{/block:Description}
  637. {/block:Link}
  638.  
  639. {block:Chat}
  640. {block:Title}
  641. <h1>{Title}</h1>
  642. {/block:Title}
  643. <div class="chat">
  644. <ol>{block:Lines}
  645. <li class="line {Alt}">
  646. {block:Label}
  647. <span class="label">
  648. <b>{Label}</b></span>
  649. {/block:Label}{Line}</li>
  650. {/block:Lines}
  651. </ol></div>
  652. {/block:Chat}
  653.  
  654. {block:Photo}
  655. {LinkOpenTag}<center><img src="{PhotoURL-400}" alt="{PhotoAlt}"/></center>
  656. {LinkCloseTag}
  657. {/block:Photo}
  658.  
  659. {block:Photoset}
  660. <center>{Photoset-400}</center>
  661. {/block:Photoset}
  662.  
  663. {block:Video}
  664. {Video-400}
  665. {/block:Video}
  666.  
  667. {block:Audio}<div class="player">{AudioPlayerWhite}</div><div class="audioinfo">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br> by {Artist}{/block:Artist}</div>
  668. {/block:Audio}
  669.  
  670.  
  671. {block:Answer}
  672. <div class="post"><br>
  673. <div class="askerportrait">
  674. <img style="border-radius:50px;" src="{AskerPortraitURL-40}" align="left" /></div><div class="bubble"><b><font color="black">{Asker}</font></b> {text:ask text}: {Question}</div><br>
  675. <div style="center"><center>{Answer}</center></div>
  676. </div>
  677. {/block:Answer}
  678.  
  679. {block:IndexPage}
  680. <div id="perma">
  681. <a href="{ReblogURL}">reblog</a> - <a href="{Permalink}">{NoteCount} notes</a><br><a href="{TagURL}">{Tag}</a> </div>
  682. {block:IndexPage}
  683.  
  684. {block:PermalinkPage}
  685. {block:Date}
  686. <div id="info">
  687. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}<br>
  688. <b>Date:</b> {ShortMonth} {DayOfMonthWithZero}, {Year}<br>
  689. {block:NoteCount}
  690. <b>Notes:</b> {NoteCount}<br>
  691. {/block:NoteCount}
  692. {block:RebloggedFrom}
  693. <b>Via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  694. {/block:RebloggedFrom}
  695. {block:ContentSource}
  696. <b>Source:</b> <a href="{SourceURL}">{SourceTitle}</a><br>
  697. {/block:ContentSource}
  698. {block:HasTags}
  699. <b>Tagged:</b>
  700. {block:Tags}
  701. <a href="{TagURL}">#{Tag}</a>
  702. {/block:Tags}
  703. {/block:HasTags}
  704. </div>
  705. {/block:Date}
  706. {/block:PermalinkPage}
  707.  
  708. <div class="note">{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  709.  
  710. </div>
  711.  
  712. {/block:Posts}
  713.  
  714. <div style="position:fixed;bottom:3px; right:3px; font-size:11px; letter-spacing:1px; font-family:arial;"><a href="http://kangjan.tumblr.com/" title="theme by ava">THEME</a>
  715.  
  716. </div>
  717.  
  718. </div>
  719.  
  720. </body>
  721.  
  722. </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!