Advertisement
leowatch

miki theme

Feb 7th, 2016
69
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.28 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!-----
  5. base code by animecharacter.tumblr.com
  6.  
  7. for help visit:
  8. tumblr.com/docs/en/custom_themes
  9. tumblr.com/docs/en/localizing_themes
  10. w3schools.com
  11. (please dont send me customization asks)
  12.  
  13. credit if used is not compulsory but it's nice if you mention where you got this
  14.  
  15. ----->
  16.  
  17. <meta charset="utf-8">
  18. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}" />
  21. {/block:Description}
  22.  
  23. <title>{Title}</title>
  24.  
  25. <link rel="shortcut icon" href="{image:Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27. <link rel="stylesheet" href="http://static.tumblr.com/qxrkgx6/RWPmgn2qa/normalize.min.css">
  28.  
  29. <script src="http://static.tumblr.com/qxrkgx6/LuRmgn2rm/modernizr-2.6.2.min.js"></script>
  30.  
  31. <meta name="image:favicon" content="">
  32. <meta name="image:side" content="">
  33. <meta name="image:corner img" content="">
  34.  
  35. <meta name="color:bg" content="#ffffff">
  36. <meta name="color:text" content="#000000">
  37. <meta name="color:links" content="#999999">
  38. <meta name="color:hover" content="#cccccc">
  39.  
  40. <meta name="if:rounded" content="">
  41. <meta name="if:shadow" content="">
  42. <meta name="if:shadow2" content="">
  43. <meta name="if:infinitescroll" content="">
  44. <meta name="if:transparent" content="">
  45. <meta name="if:semitransparent" content="">
  46.  
  47. <meta name="text:battery" content="">
  48. <meta name="text:desc" content="">
  49. <meta name="text:sb img" content="100">
  50. <meta name="text:corner img width" content="">
  51. <meta name="text:corner img left" content="0">
  52. <meta name="text:corner img bottom" content="0">
  53.  
  54. <meta name="select:Spoons" content="#zero" title="0"/>
  55. <meta name="select:Spoons" content="#zerohalf" title="0.5"/>
  56. <meta name="select:Spoons" content="#one" title="1"/>
  57. <meta name="select:Spoons" content="#onehalf" title="1.5"/>
  58. <meta name="select:Spoons" content="#two" title="2"/>
  59. <meta name="select:Spoons" content="#twohalf" title="2.5"/>
  60. <meta name="select:Spoons" content="#three" title="3"/>
  61. <meta name="select:Spoons" content="#threehalf" title="3.5"/>
  62. <meta name="select:Spoons" content="#four" title="4"/>
  63. <meta name="select:Spoons" content="#fourhalf" title="4.5"/>
  64. <meta name="select:Spoons" content="#five" title="5"/>
  65.  
  66. <meta name="image:" content="">
  67. <meta name="color:" content="#">
  68. <meta name="if:" content="">
  69. <meta name="text:" content="">
  70. <meta name="select:" content="">
  71.  
  72. {block:ifInfiniteScroll}
  73. <script type="text/javascript" src="http://yourjavascript.com/21212225154/esz.js"></script>
  74. {block:ifInfiniteScroll}
  75.  
  76. <div id="imageright" style="position:fixed; bottom:{text:corner img bottom}px; right:{text:corner img left}px; z-index:-1;"><img src="{image:corner img}"width="{text:corner img width}"></div>
  77. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  78.  
  79. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  80.  
  81. <script>
  82.  
  83. (function($){
  84.  
  85. $(document).ready(function(){
  86.  
  87. $("a[title]").style_my_tooltips({
  88.  
  89. tip_follows_cursor:true,
  90.  
  91. tip_delay_time:80,
  92.  
  93. tip_fade_speed:400,
  94.  
  95. attribute:"title"
  96.  
  97. });
  98.  
  99. });
  100.  
  101. })(jQuery);
  102.  
  103. </script>
  104.  
  105. <style type="text/css">
  106.  
  107. #s-m-t-tooltip {
  108.  
  109. max-width:280px; /* maximum width */
  110. text-align:center;
  111. background-color:#fff; /* color background */
  112.  
  113. -webkit-box-shadow: 3px 3px 10px 10px rgba(0, 0, 0, 0.1);
  114. -moz-box-shadow: 3px 3px 10px 10px rgba(0, 0, 0, 0.1);
  115. box-shadow: 3px 3px 1px 1px rgba(0, 0, 0, 0.1);
  116.  
  117. border-radius:4px;
  118.  
  119. border:none /* color, shape and thickness of the border */
  120.  
  121. font-size:9px; /* font size */
  122.  
  123. color:#000; /* font color */
  124. font-weight:bold;
  125. font-family:helvetica;
  126.  
  127. letter-spacing:1px; /* font spacing */
  128.  
  129. text-transform:lowercase; /* uppercase, lowercase, none */
  130.  
  131. padding:4px; /* padding size */
  132.  
  133. margin:20px 0px 0px 20px; /* margin size */
  134.  
  135. z-index:9999999999999999999999;
  136.  
  137.  
  138.  
  139. }
  140.  
  141. #one, #two, #zero, #three, #four, #five, #onehalf, #zerohalf, #twohalf, #threehalf, #fourhalf {
  142. display:none;
  143. }
  144. {select:Spoons}, {select:Spoons} img {display: inline !important;}
  145.  
  146. /*
  147. general text styles, fonts and colours
  148. */
  149.  
  150. body {
  151. margin:0px;
  152. background:{color:bg};
  153. font-family: franklin gothic book;
  154. font-size:11px;
  155. line-height:150%;
  156. color: {color:text};
  157. }
  158.  
  159. p{
  160. margin:0 0 10px 0;
  161. padding:0;
  162. }
  163.  
  164. pre {
  165. white-space: pre-wrap;
  166. white-space: -moz-pre-wrap;
  167. white-space: -pre-wrap;
  168. white-space: -o-pre-wrap;
  169. word-wrap: break-word;
  170. }
  171.  
  172. a{
  173. color:{color:links};
  174. text-decoration:none;
  175. }
  176.  
  177. a:hover{
  178. color:{color:hover};
  179. text-decoration:none;
  180. }
  181.  
  182. ol,ul {
  183. margin-left:-5px;
  184. list-style-type:katakana;
  185. }
  186.  
  187. /*
  188. containers etc
  189. */
  190.  
  191. #wrapper{
  192. width:600px;
  193. margin:50px auto;
  194. }
  195.  
  196. #sidebar{
  197. width:{text:sb img}px;
  198. position:fixed;
  199. margin-left:-25px;
  200. }
  201.  
  202. #buster img {
  203. {block:ifrounded}
  204. border-radius:5px;
  205. {/block:ifrounded}
  206. }
  207.  
  208. #content{
  209. width:300px;
  210. {block:permalinkpage}
  211. width:350px;
  212. {/block:permalinkpage}
  213. margin-left:100px;
  214. overflow:hidden;
  215. }
  216.  
  217. .post{
  218. width:250px;
  219. {block:permalinkpage}
  220. width:300px;
  221. {/block:permalinkpage}
  222. margin:0 0 35px 0;
  223. overflow:hidden;
  224. padding:15px;
  225. background:#fff;
  226. {block:iftransparent}
  227. background:transparent;
  228. {/block:iftransparent}
  229. {block:ifsemitransparent}
  230. background:rgba(255,255,255,0.5);
  231. {/block:ifsemitransparent}
  232. {block:ifrounded}
  233. border-radius:5px;
  234. {/block:ifrounded}
  235. {block:ifshadow}
  236. -webkit-box-shadow: 5px 5px 10px 10px rgba(0, 0, 0, 0.1);
  237. -moz-box-shadow: 5px 5px 10px 10px rgba(0, 0, 0, 0.1);
  238. box-shadow: 5px 5px 1px 1px rgba(0, 0, 0, 0.1);
  239. {/block:ifshadow}
  240. {block:ifshadow2}
  241. -moz-box-shadow: inset 0 0 10px #888;
  242. -webkit-box-shadow: inset 0 0 10px #888;
  243. box-shadow: inset 0 0 10px #888;
  244. {/block:ifshadow2}
  245. }
  246.  
  247. #sidebar img, .post img{
  248. max-width:100%;
  249. }
  250.  
  251. #nav{
  252. margin:50px 0 0 0;
  253. }
  254.  
  255. #farewell {
  256. font-size:11px;
  257. text-align:center;
  258. line-height:130%;
  259. }
  260.  
  261. #problem {
  262. text-align:center;
  263. margin-top:5px;
  264. font-size:12px;
  265. word-spacing:1px;
  266. letter-spacing:1px;
  267. }
  268.  
  269. #miki {
  270. padding-top:3px;
  271. }
  272.  
  273. #miki a {
  274. background:{color:bg};
  275. }
  276.  
  277. #spoons {
  278. margin-top:5px;
  279. border-radius:100px;
  280. }
  281.  
  282. {block:permalinkpage}
  283. img{
  284. {block:ifrounded}
  285. border-radius:5px;
  286. {/block:ifrounded}
  287. -webkit-transition: 0.6s ease;transition: 0.6s ease;
  288. -o-transition: 0.6s ease;-moz-transition: 0.6s ease;
  289. -moz-opacity: 1;
  290. opacity: 1;
  291. }
  292. img:hover{
  293. -webkit-transition: 0.6s ease;transition: 0.6s ease;
  294. -o-transition: 0.6s ease;-moz-transition: 0.6s ease;
  295. -moz-opacity: 0.80;
  296. opacity: 0.80;
  297. }
  298.  
  299. #spoons {
  300. border-radius:0px;
  301. }
  302. {/block:permalinkpage}
  303.  
  304. /*
  305. content in the body of the posts - quotes, asks, etc
  306. "media" contains photos, photosets, videos, audio posts
  307. */
  308. .media{
  309. margin:0 0 10px 0;
  310. }
  311.  
  312. .title{
  313. font-weight:normal;
  314. font-size:18px;
  315. margin:0 0 10px 0;
  316. }
  317.  
  318. .quote{
  319. font-weight:normal;
  320. font-size:16px;
  321. font-style:italic;
  322. margin:0 0 10px 0;
  323. }
  324.  
  325. .question{
  326. margin-bottom:10px;
  327. }
  328.  
  329. blockquote{
  330. margin:0 0 10px 10px;
  331. padding:0 0 0 10px;
  332. border-left:dashed 1px {color:bg};
  333. }
  334.  
  335. #audio {
  336. width:100%;
  337. height:50px;
  338. margin-bottom:10px;
  339. display:block;
  340. }
  341.  
  342. #audio .player{background:#FFF;height:26px;width:26px;padding:2px;overflow:hidden;position:absolute;margin-top:8px;margin-left:8px;border:2px solid #fff;opacity:0.8;z-index:2;}
  343.  
  344.  
  345. .art{width:50px;height:50px; position:absolute;display:block;z-index:1;}
  346. .art img{width:50px;height:50px;}
  347.  
  348. .songtitle{margin-left:60px;height:40px;padding:5px 10px;border-left:1px solid {color:border};line-height:13px;overflow:auto;font-size:10px;}
  349.  
  350. .video-container {
  351. position: center;
  352. overflow: hidden;
  353. }
  354.  
  355. .video-container iframe,
  356. .video-container object,
  357. .video-container embed {
  358. position: center;
  359. max-width:250px;
  360. max-height:250px;
  361. }
  362.  
  363. .video-wrapper {
  364. max-width:250px;
  365. max-height:250px;
  366. }
  367.  
  368. .askerportrait {
  369. position: absolute;
  370. border: 5px solid {color:bg};
  371. width:35px;
  372. }
  373. .a {
  374. margin-left: 70px;
  375. background-color: {color:bg};
  376. min-height:64px;
  377. max-height: 100px;
  378. padding: 10px;
  379. margin-bottom:8px;
  380. height:0px;
  381. font-family: calibri,geneva;
  382. font-size: 11px;
  383. color: {color:text};
  384. }
  385. .asker {
  386. color: {color:text};
  387. font-family: anaheim, sans-serif;
  388. font-size: 10px;
  389. text-transform: uppercase;
  390. }
  391. .asker a {color: {color:links};border-bottom: 1px dashed {color:links};}
  392. .q {margin-top: 5px;}
  393. .tri {
  394. position: absolute;
  395. font-size: 30px;
  396. margin: 15px 0 0 50px;
  397. color: {color:bg};
  398. }
  399.  
  400. /*
  401. post footers - date, tags, via and source
  402. */
  403. .post .footer{
  404. margin:0;
  405. text-align:left;
  406. }
  407.  
  408. /*
  409. post notes
  410. */
  411. ol.notes{
  412. list-style-type:none;
  413. padding:0;
  414. margin:0;
  415. }
  416.  
  417. ol.notes li.note img{
  418. width:16px;
  419. height:16px;
  420. }
  421.  
  422. ol.notes li.note{
  423. margin:0px;
  424. }
  425.  
  426. {CustomCSS}
  427. </style>
  428. </head>
  429.  
  430. <body>
  431. <div id="wrapper">
  432.  
  433.  
  434. <div id="sidebar">
  435. <div id="buster"><a href="/"/><img src="{image:side}"></a></div>
  436.  
  437. <div id="farewell">{text:desc}</div>
  438.  
  439. <div id="problem">
  440. <a href="/about">about</a>
  441. <a href="/disclaimer">id</a>
  442. <a href="/links">links</a>
  443. </div>
  444.  
  445. <div id="spoons"><center><a href="/battery" title="{text:battery}" style="border:none;" target="_blank">
  446. <div id="zero" style="display:none;">
  447. <img src="https://33.media.tumblr.com/d7537366a4b6843e83f26ce2f257105f/tumblr_inline_ngoenth8YW1t6231t.png">
  448. </div>
  449. <div id="zerohalf" style="display:none;">
  450. <img src="https://33.media.tumblr.com/7a829f931360087b3be5cbc96c76eb1c/tumblr_inline_ngoenwyjdR1t6231t.png">
  451. </div>
  452. <div id="one" style="display:none;">
  453. <img src="https://38.media.tumblr.com/5d5d4551471e7550d577c37287d98700/tumblr_inline_ngoenz3Owg1t6231t.png">
  454. </div>
  455. <div id="onehalf" style="display:none;">
  456. <img src="https://33.media.tumblr.com/b486961ec60a28bbbdc6c891bc0d65ea/tumblr_inline_ngoeo3VpaS1t6231t.png">
  457. </div>
  458. <div id="two" style="display:none;">
  459. <img src="https://31.media.tumblr.com/837982bcc31d7e739e78164ca8669ca1/tumblr_inline_ngoeo6Kvde1t6231t.png">
  460. </div>
  461. <div id="twohalf" style="display:none;">
  462. <img src="https://33.media.tumblr.com/c2ca73bc9cb9ee7c1d341229d586420e/tumblr_inline_ngoeocPnyN1t6231t.png">
  463. </div>
  464. <div id="three" style="display:none;">
  465. <img src="https://38.media.tumblr.com/e7b5b6b94875e21448e667339f7b8340/tumblr_inline_ngoeogD0J11t6231t.png">
  466. </div>
  467. <div id="threehalf" style="display:none;">
  468. <img src="https://31.media.tumblr.com/89eee7f0fc0248f98374d95427391830/tumblr_inline_ngoeokQpQP1t6231t.png">
  469. </div>
  470. <div id="four" style="display:none;">
  471. <img src="https://38.media.tumblr.com/ceae6133cb2cfc748cb6f7b1b99ecd1d/tumblr_inline_ngoeoocYNN1t6231t.png">
  472. </div>
  473. <div id="fourhalf" style="display:none;">
  474. <img src="https://31.media.tumblr.com/1b6f48d06383c14126aa1876d0092e4a/tumblr_inline_ngoeosQj7f1t6231t.png">
  475. </div>
  476. <div id="five" style="display:none;">
  477. <img src="https://33.media.tumblr.com/780c8c9b4fb363717b8b9e95df5b4ab9/tumblr_inline_ngoeowegnB1t6231t.png">
  478. </div>
  479. </a></center></div>
  480.  
  481. {block:HasPages}
  482. {block:Pages}
  483. <a href="{URL}">{Label}</a><br>
  484. {/block:Pages}
  485. {/block:HasPages}
  486. </div>
  487.  
  488.  
  489.  
  490. <div id="content">
  491. {block:Posts}
  492.  
  493. <div class="post">
  494.  
  495. {block:Text}
  496. {block:Title}
  497. <div class="title">{Title}</div>
  498. {/block:Title}
  499. {Body}
  500. {/block:Text}
  501.  
  502. {block:Photo}{block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}<img src="{PhotoURL-HighRes}">{block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}{/block:Photo}
  503.  
  504. {block:Photoset}<div style="width:100%;opacity:1.0;margin:0 0 -1px 0;">{Photoset}</div>{block:Caption}<div class="cap">{Caption}</div>{/block:Caption}{/block:Photoset}
  505. {block:Quote}
  506. <div class="quote">"{Quote}"</div>
  507. {block:Source}
  508. <div class="quotesource">{Source}</div>
  509. {/block:Source}
  510. {/block:Quote}
  511.  
  512. {block:Link}
  513. <div class="title"><a href="{URL}">{Name}</a></div>
  514. {block:Description}
  515. <div class="description">{Description}</div>
  516. {/block:Description}
  517. {/block:Link}
  518.  
  519. {block:Chat}
  520. {block:Title}
  521. <div class="title">{Title}</div>
  522. {/block:Title}
  523.  
  524. {block:Lines}
  525. <div class="{Alt} user_{UserNumber}">
  526. {block:Label}
  527. <b>{Label}</b>{/block:Label}
  528. &nbsp;{Line}
  529. </div>
  530. {/block:Lines}
  531. {/block:Chat}
  532.  
  533. {block:Video}
  534. <div class="media"><div class="video-wrapper">
  535. <div class="video-container">{Video-400}</div>
  536. </div></div>
  537. {/block:Video}
  538.  
  539. {block:Audio}
  540. <div id="audio">
  541. <div class="art">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
  542. <div class="player">{AudioPlayerWhite}</div>
  543. <div class="songtitle">
  544. {block:TrackName}<i>{TrackName}</i>{/block:TrackName}<br>
  545. {block:Artist}{Artist}{/block:Artist}<br>
  546. {block:Album}{Album}{/block:Album}
  547. </div>
  548. </div>
  549. {/block:Audio}
  550.  
  551. {block:Answer}
  552. <img class="askerportrait" src="{AskerPortraitURL-64}">
  553. <div class="tri">◀</div>
  554. <div class="a">
  555. <span class="asker">{Asker}:</span>
  556. <div class="q">{Question}</div>
  557. </div>
  558. <div class="text">{Answer}</div>
  559. {/block:Answer}
  560.  
  561.  
  562. {block:Date}
  563. <div class="footer">
  564. <a href="{Permalink}"><div style="margin-top:-2px; letter-spacing:1px; text-align:center; word-spacing:1px;">{TimeAgo} ({NoteCount})<br> <div id="miki">{block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}</div></div>
  565. </div>
  566.  
  567. {block:PermalinkPage}
  568. {block:NoteCount}
  569. {block:PostNotes}{PostNotes}{/block:PostNotes}
  570. {/block:NoteCount}
  571. {/block:PermalinkPage}
  572. {/block:Date}
  573.  
  574. </div>
  575. {/block:Posts}
  576.  
  577. {block:ContentSource}
  578. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  579. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  580. {/block:SourceLogo}
  581. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  582. {/block:ContentSource}
  583.  
  584. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  585.  
  586. {block:ifNotInfiniteScroll}
  587. {block:Pagination}
  588. <div id="nav">
  589. {block:PreviousPage}<a href="{PreviousPage}">{lang:Previous}</a>{/block:PreviousPage}
  590.  
  591. {block:NextPage}<a href="{NextPage}">{lang:Next}</a>{/block:NextPage}
  592. </div>
  593. {/block:Pagination}
  594. </div>
  595. </div>
  596.  
  597. </div>
  598. {/block:ifNotInfiniteScroll}
  599.  
  600. {block:ifInfiniteScroll}
  601. </div>
  602. {/block:ifInfiniteScroll}
  603.  
  604. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  605. <script>window.jQuery || document.write('<script src="http://static.tumblr.com/qxrkgx6/q6kmgn2w2/jquery-1.8.3.min.js"><\/script>')</script>
  606.  
  607. </body>
  608. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement