Advertisement
chromehearted

#01: Bᴀᴛᴛʟᴇ Rᴏʏᴀʟᴇ

Jun 4th, 2014
325
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.92 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4.  
  5. <title>{Title}</title>
  6.  
  7. <link rel="shortcut icon" href="{Favicon}">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11. <!--Default Variables-->
  12.  
  13. <meta name="color:Background" content="#ffffff"/>
  14. <meta name="color:Text" content="#aaaaaa"/>
  15. <meta name="color:Post Title" content="#000000"/>
  16. <meta name="color:Link" content="#707070"/>
  17. <meta name="color:Link Hover" content="#eeeeee"/>
  18. <meta name="color:Blog Title" content="#000000"/>
  19. <meta name="color:Description" content="#000000"/>
  20. <meta name="color:Tooltip Text" content="#000000"/>
  21. <meta name="color:Tooltip Border" content="#000000"/>
  22. <meta name="color:Tooltip Background" content="#ffffff"/>
  23. <meta name="color:Bold" content="#000000"/>
  24. <meta name="color:Italic" content="#333333"/>
  25. <meta name="color:Box 1" content="#000000"/>
  26. <meta name="color:Box 2" content="#333333"/>
  27. <meta name="color:Box 3" content="#666666"/>
  28. <meta name="color:Box 4" content="#999999"/>
  29. <meta name="color:Box 5" content="#bbbbbb"/>
  30. <meta name="color:Scrollbar Background" content="#ffffff"/>
  31. <meta name="color:Scrollbar Thumb" content="#000000"/>
  32.  
  33. <meta name="image:Sidebar Image" content="http://static.tumblr.com/fb5268d5f5d7549d601ca7f654cbc627/wfbltky/ixvn6moa7/tumblr_static_8ld5au1ymuckkgsc8g840ggg8.jpg"/>
  34.  
  35. <meta name="text:Link 1 URL" content="" />
  36. <meta name="text:Link 1" content="" />
  37. <meta name="text:Link 2 URL" content="" />
  38. <meta name="text:Link 2" content="" />
  39. <meta name="text:Link 3 URL" content="" />
  40. <meta name="text:Link 3" content="" />
  41.  
  42. <meta name="if:250px posts" content="0">
  43. <meta name="if:400px posts" content="1">
  44. <meta name="if:Infinite Scroll" content="0">
  45. <meta name="if:Grayscale" content="1">
  46.  
  47.  
  48. <!-- jquery for tooltips-->
  49.  
  50.  
  51. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  52.  
  53. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  54.  
  55. <script>
  56.  
  57. (function($){
  58.  
  59. $(document).ready(function(){
  60.  
  61. $("a[title]").style_my_tooltips({
  62.  
  63. tip_follows_cursor:true,
  64.  
  65. tip_delay_time:30,
  66.  
  67. tip_fade_speed:300,
  68.  
  69. attribute:"title"
  70.  
  71. });
  72.  
  73. });
  74.  
  75. })(jQuery);
  76.  
  77. </script>
  78.  
  79.  
  80.  
  81.  
  82.  
  83.  
  84. <!--CSS customization here. -->
  85.  
  86. <style type="text/css">
  87. @font-face {font-family:"silkscreen"; src: url(http://static.tumblr.com/qbwrk8v/zmWlpdkl0/slkscr.ttf);}
  88.  
  89. ::-webkit-scrollbar {width: 6px; height: 4px; background:{color:scrollbar background}; }
  90. ::-webkit-scrollbar-thumb { background-color: {color:scrollbar thumb};}
  91.  
  92. #s-m-t-tooltip{
  93. position:absolute;
  94. margin-top: 15px;
  95. z-index:9999;
  96. letter-spacing:0px;
  97. padding:3px;
  98. font-size:9px;
  99. background:{color:tooltip background};
  100. color:{color:tooltip text};
  101. border: 1px solid {color:tooltip border};
  102. border-radius:3px;
  103. font-family:"silkscreen";
  104. -webkit-transition: all 0.3s ease-in-out;
  105. -moz-transition: all 0.3s ease-in-out;
  106. -o-transition: all 0.3s ease-in-out;
  107. -ms-transition: all 0.3s ease-in-out;
  108. transition: all 0.3s ease-in-out;
  109. }
  110.  
  111.  
  112.  
  113. /*basics*/
  114. blockquote {padding:1px 0 1px 10px;
  115. border-left:1px solid {color:text};
  116. margin-left:7px;
  117. }
  118.  
  119. body {
  120. background:{color:background};
  121. color:{color:text};
  122. font-family:arial;
  123. font-size:11px;
  124. text-align:justify;
  125. margin:0;
  126. line-height:120%;}
  127.  
  128.  
  129. a {
  130. color:{color:Link};
  131. text-decoration:none;
  132. -webkit-transition: all 0.7s ease-in-out;
  133. -moz-transition: all 0.7s ease-in-out;
  134. -o-transition: all 0.7s ease-in-out;
  135. -ms-transition: all 0.7s ease-in-out;
  136. transition: all 0.7s ease-in-out;
  137. }
  138.  
  139. a:hover {
  140. color: {color:Link Hover};
  141. -webkit-transition: all 0.7s ease-in-out;
  142. -moz-transition: all 0.7s ease-in-out;
  143. -o-transition: all 0.7s ease-in-out;
  144. -ms-transition: all 0.7s ease-in-out;
  145. transition: all 0.7s ease-in-out;
  146. }
  147.  
  148. img{opacity:1;
  149. border:none;
  150. text-decoration:none}
  151.  
  152.  
  153. small {
  154. font-size:9px;}
  155.  
  156. big {
  157. font-size:12px;}
  158.  
  159. b, strong, bold {
  160. font-weight:bold;
  161. color:{color:Bold};
  162. }
  163.  
  164. i, em, italic {
  165. font-style:italic;
  166. color:{color:Italic};
  167. }
  168.  
  169.  
  170. #title {font-size:25px;
  171. line-height:120%;
  172. font-weight:bold;
  173. margin-bottom:10px;
  174. text-align:left;
  175. color:{color:Post Title};
  176. }
  177.  
  178. ul {
  179. list-style-type:hiragana;
  180. }
  181.  
  182. ol {
  183. list-style-type:cjk-ideographic;
  184. }
  185.  
  186. pre {
  187. width:95%;
  188. margin-left:auto;
  189. margin-right:auto;
  190. white-space:pre-wrap;
  191. word-wrap:break-word;
  192. background:#f0f0f0;
  193. padding:4px;
  194. }
  195.  
  196.  
  197. /*sidebar*/
  198. #sidebar {text-align:left;
  199. position:fixed;
  200. left:285px;
  201. top:0px;
  202. margin-top:100px;
  203. width:250px;
  204. }
  205.  
  206.  
  207.  
  208.  
  209.  
  210. #blogt {
  211. width:250px;
  212. height:auto;
  213. position:absolute;
  214. left:-5px;
  215. top:-85px;
  216. text-align:left;
  217. font-size: 70px;
  218. letter-spacing: 0px;
  219. font-family: Arial black;
  220. padding-right: 10px;
  221. text-decoration: none;
  222. line-height:120%;
  223. color:{color:Blog Title};
  224. }
  225.  
  226. #blogt a, a:hover {
  227. color:{color:Blog Title};
  228. text-decoration:none;
  229. }
  230.  
  231.  
  232.  
  233.  
  234. #colors {
  235. margin-left:0px;
  236. margin-top:90px;
  237. }
  238.  
  239. .home {
  240. margin-left:0px;
  241. margin-bottom:-75px;
  242. width:35px;
  243. height:75px;
  244. background-color:{color:Box 1};
  245. -webkit-filter: invert(0%);
  246. -webkit-transition: all 0.7s ease-in-out;
  247. -moz-transition: all 0.7s ease-in-out;
  248. -o-transition: all 0.7s ease-in-out;
  249. -ms-transition: all 0.7s ease-in-out;
  250. transition: all 0.7s ease-in-out;
  251. }
  252.  
  253. .home:hover {
  254. -webkit-filter: invert(100%);
  255. -webkit-transition: all 0.7s ease-in-out;
  256. -moz-transition: all 0.7s ease-in-out;
  257. -o-transition: all 0.7s ease-in-out;
  258. -ms-transition: all 0.7s ease-in-out;
  259. transition: all 0.7s ease-in-out;
  260. }
  261.  
  262. .ask {
  263. margin-left:47px;
  264. margin-bottom:-75px;
  265. width:35px;
  266. height:75px;
  267. background-color:{color:Box 2};
  268. -webkit-filter: invert(0%);
  269. -webkit-transition: all 0.7s ease-in-out;
  270. -moz-transition: all 0.7s ease-in-out;
  271. -o-transition: all 0.7s ease-in-out;
  272. -ms-transition: all 0.7s ease-in-out;
  273. transition: all 0.7s ease-in-out;
  274. }
  275.  
  276. .ask:hover {
  277. -webkit-filter: invert(100%);
  278. -webkit-transition: all 0.7s ease-in-out;
  279. -moz-transition: all 0.7s ease-in-out;
  280. -o-transition: all 0.7s ease-in-out;
  281. -ms-transition: all 0.7s ease-in-out;
  282. transition: all 0.7s ease-in-out;
  283. }
  284.  
  285. {block:ifLink1}
  286. .first {
  287. margin-left:94px;
  288. margin-bottom:-75px;
  289. -webkit-filter: invert(0%);
  290. width:35px;
  291. height:75px;
  292. background-color:{color:Box 3};
  293. -webkit-transition: all 0.7s ease-in-out;
  294. -moz-transition: all 0.7s ease-in-out;
  295. -o-transition: all 0.7s ease-in-out;
  296. -ms-transition: all 0.7s ease-in-out;
  297. transition: all 0.7s ease-in-out;
  298. }
  299.  
  300. .first:hover {
  301. -webkit-filter: invert(100%);
  302. -webkit-transition: all 0.7s ease-in-out;
  303. -moz-transition: all 0.7s ease-in-out;
  304. -o-transition: all 0.7s ease-in-out;
  305. -ms-transition: all 0.7s ease-in-out;
  306. transition: all 0.7s ease-in-out;
  307. }
  308. {/block:ifLink1}
  309. {block:ifLink2}
  310. .second {
  311. -webkit-filter: invert(0%);
  312. margin-left:141px;
  313. margin-bottom:-75px;
  314. width:35px;
  315. height:75px;
  316. background-color:{color:Box 4};
  317. -webkit-transition: all 0.7s ease-in-out;
  318. -moz-transition: all 0.7s ease-in-out;
  319. -o-transition: all 0.7s ease-in-out;
  320. -ms-transition: all 0.7s ease-in-out;
  321. transition: all 0.7s ease-in-out;
  322. }
  323.  
  324. .second:hover {
  325. -webkit-filter: invert(100%);
  326. -webkit-transition: all 0.7s ease-in-out;
  327. -moz-transition: all 0.7s ease-in-out;
  328. -o-transition: all 0.7s ease-in-out;
  329. -ms-transition: all 0.7s ease-in-out;
  330. transition: all 0.7s ease-in-out;
  331. }
  332. {/block:ifLink2}
  333. {block:ifLink3}
  334. .third {
  335. -webkit-filter: invert(0%);
  336. margin-left:188px;
  337. width:35px;
  338. height:75px;
  339. background-color:{color:Box 5};
  340. -webkit-transition: all 0.7s ease-in-out;
  341. -moz-transition: all 0.7s ease-in-out;
  342. -o-transition: all 0.7s ease-in-out;
  343. -ms-transition: all 0.7s ease-in-out;
  344. transition: all 0.7s ease-in-out;
  345. }
  346.  
  347. .third:hover {
  348. -webkit-filter: invert(100%);
  349. -webkit-transition: all 0.7s ease-in-out;
  350. -moz-transition: all 0.7s ease-in-out;
  351. -o-transition: all 0.7s ease-in-out;
  352. -ms-transition: all 0.7s ease-in-out;
  353. transition: all 0.7s ease-in-out;
  354. }
  355. {/block:ifLink3}
  356.  
  357.  
  358. #description {
  359. margin-top:120px;
  360. line-height:120%;
  361. font-size:12px;
  362. left:500px;
  363. color:{color:Description};
  364. }
  365.  
  366.  
  367. /*pagination*/
  368. #pagination {
  369. margin-left:0px;
  370. margin-top:20px;
  371. text-transform:lowercase;
  372. font-size:14px;
  373. font-weight:bold;
  374. {block:ifInfiniteScroll}
  375. display:none;
  376. {/block:ifInfiniteScroll}
  377. }
  378.  
  379.  
  380. /*container*/
  381. #con {
  382. left:50%;
  383. margin-left:-250px;
  384. position:absolute;
  385. }
  386.  
  387.  
  388.  
  389. /*posts*/
  390.  
  391. #entries {
  392. margin-left:260px;
  393. margin-top:45px;
  394. {block:if250pxPosts}
  395. width:250px;
  396. {block:if250pxPosts}
  397. {block:if400pxPosts}
  398. width:400px;
  399. {/block:if400pxPosts}
  400. }
  401.  
  402.  
  403.  
  404. #posts {
  405. {block:if250pxPosts}
  406. width:250px;
  407. {block:if250pxPosts}
  408. {block:if400pxPosts}
  409. width:400px;
  410. {/block:if400pxPosts}
  411. {block:IndexPage}
  412. margin-bottom:45px;
  413. {/block:IndexPage}
  414. {block:PermalinkPage}
  415. margin-bottom:50px;
  416. {/block:PermalinkPage}
  417.  
  418. }
  419. #posts img {
  420. max-width:500px;
  421. padding-bottom:10px;
  422. }
  423.  
  424. #posts img, #posts li, #posts blockquote {max-width: 100%;}
  425. .caption {width:100%;
  426. margin-top:10px;
  427. }
  428.  
  429. img{-webkit-filter: Grayscale(100%); -webkit-transition-duration: 0.8s; -moz-transition-duration:0.8s; transition-duration:0.8s; -o-transition-duration:0.8s;}
  430.  
  431. img:hover{-webkit-filter: Grayscale(0%); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
  432.  
  433. {block:ifGrayscale}
  434. .photoset{-webkit-filter: Grayscale(100%); -webkit-transition-duration: 0.8s; -moz-transition-duration:0.8s; transition-duration:0.8s; -o-transition-duration:0.8s;}
  435.  
  436. .photoset:hover{-webkit-filter: Grayscale(0%); -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; transition: all 0.5s ease-out;}
  437. {/block:ifGrayscale}
  438.  
  439. /*quote*/
  440.  
  441. #titlequote{text-align:left;
  442. font-size:14px;
  443. line-height:120%;
  444. font-weight:bold;
  445. }
  446. #source {
  447. margin-top:15px;
  448. margin-left:15px;}
  449.  
  450. /*audio*/
  451.  
  452. .player {
  453. width:25px;
  454. height:25px;
  455. overflow:hidden;
  456. position:absolute;
  457. background:white;}
  458.  
  459. .audioinfo {
  460. margin-left:50px;
  461. }
  462.  
  463.  
  464. /*asks*/
  465. .q {margin-bottom:10px;border-bottom:1px dashed {color:Link}; padding-bottom:7px;
  466. }
  467.  
  468. .a {
  469. margin-top:10px;
  470. }
  471.  
  472.  
  473. /*chat*/
  474.  
  475. .chat ol {
  476. padding:0;
  477. list-style:none;
  478. }
  479. .line {padding:5px 0;}
  480.  
  481. .label {font-weight:bold;
  482. }
  483.  
  484.  
  485.  
  486.  
  487.  
  488. /*permalink and notes*/
  489.  
  490. #permalink {
  491. padding-top:7px;
  492. font-size:10px;
  493. text-transform:uppercase;
  494.  
  495. border-top: 1px dashed {color:Link};
  496. }
  497. #permalink a {margin-right:10px;
  498. }
  499.  
  500.  
  501. .tags {
  502. word-break:break-all;
  503. font-size:10px;
  504. text-transform:none;
  505. }
  506.  
  507. .pagenotes {
  508. {block:IndexPage}
  509. display: none!important;
  510. {/block:IndexPage}
  511. {block:PermalinkPage}
  512. {block:if250pxPosts}
  513. width:250px;
  514. {block:if250pxPosts}
  515. {block:if400pxPosts}
  516. width:400px;
  517. {/block:if400pxPosts}
  518. {/block:PermalinkPage}
  519. text-align:left;
  520.  
  521. }
  522. .pagenotes img {
  523. display:none!important;}
  524. .pagenotes li {
  525. list-style-type:none;
  526. padding:5px 0px;
  527. text-align:left;
  528. margin:0 0 0 -40px;
  529. }
  530.  
  531. #mivabi {
  532. position:fixed;
  533. bottom:4px;
  534. right:4px;
  535. z-index:99;
  536. -webkit-filter: invert(0%);
  537. -webkit-transition: all 0.7s ease-in-out;
  538. -moz-transition: all 0.7s ease-in-out;
  539. -o-transition: all 0.7s ease-in-out;
  540. -ms-transition: all 0.7s ease-in-out;
  541. transition: all 0.7s ease-in-out;
  542. }
  543.  
  544. #mivabi:hover {
  545. -webkit-filter: invert(100%);
  546. -webkit-transition: all 0.7s ease-in-out;
  547. -moz-transition: all 0.7s ease-in-out;
  548. -o-transition: all 0.7s ease-in-out;
  549. -ms-transition: all 0.7s ease-in-out;
  550. transition: all 0.7s ease-in-out;
  551. }
  552.  
  553.  
  554. {CustomCSS}
  555.  
  556.  
  557. </style>
  558.  
  559.  
  560.  
  561. </head>
  562.  
  563. <body>
  564.  
  565.  
  566. <div id="con">
  567.  
  568.  
  569.  
  570. <div id="sidebar">
  571. <img height="100%" style="overflow:hidden;position:fixed;top:0px;left:0px;z-index:-999;" src="{image:Sidebar Image}">
  572.  
  573.  
  574. <div id="blogt"><a href="/">{Title}</a></div>
  575. <div id="description">{Description}
  576. {block:ifInfiniteScroll}
  577. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  578. {/block:ifInfiniteScroll}
  579.  
  580. </div>
  581.  
  582. <div id="colors">
  583. <a href="/" title="home"><div class="home"></div></a>
  584. <a href="/ask" title="message"><div class="ask"></div></a>
  585. {block:ifLink1}<a href="{text:Link 1 URL}" title="{text:Link 1}"><div class="first"></div></a>{/block:ifLink1}
  586. {block:ifLink2}<a href="{text:Link 2 URL}" title="{text:Link 2}"><div class="second"></div></a>{/block:ifLink2}
  587. {block:ifLink3}<a href="{text:Link 3 URL}" title="{text:Link 3}"><div class="third"></div></a>{/block:ifLink3}
  588. </div>
  589.  
  590.  
  591.  
  592. <div id="pagination">
  593. {block:Pagination}
  594. {block:PreviousPage}
  595. <a href="{PreviousPage}">&larr; previous </a>
  596. {/block:PreviousPage}
  597.  
  598.  
  599. {block:NextPage}
  600. <a href="{NextPage}">next &rarr;</a>
  601. {/block:NextPage}
  602. {/block:Pagination}
  603. </div>
  604.  
  605.  
  606. </div>
  607.  
  608.  
  609. <div id="entries">
  610.  
  611. {block:Posts}
  612. <div id="posts">
  613.  
  614.  
  615. {block:Quote}
  616.  
  617.  
  618. <div id="titlequote">“{Quote}”</div>
  619. {block:Source}<div id="source">&mdash; {Source}</div>{/block:Source}
  620. {/block:Quote}
  621.  
  622.  
  623.  
  624. {block:Text}
  625.  
  626. {block:Title}
  627. <div id="title">{Title}</div>{/block:Title}
  628. {Body}
  629. {/block:Text}
  630.  
  631. {block:Link}
  632. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  633. {/block:Link}
  634.  
  635. {block:Chat}
  636. {block:Title}
  637. <h1>{Title}</h1>
  638. {/block:Title}
  639. <div class="chat">
  640. <ol>{block:Lines}
  641. <li class="line {Alt}">
  642. {block:Label}
  643. <span class="label">
  644. {Label}</span>
  645. {/block:Label}{Line}</li>
  646. {/block:Lines}
  647. </ol></div>
  648. {/block:Chat}
  649.  
  650. {block:Photo}
  651. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}
  652. {/block:Photo}
  653.  
  654. <div class="photoset">
  655. {block:Photoset}
  656. {block:if250pxPosts}
  657. {Photoset-250}
  658. {/block:if250pxPosts}
  659. {block:if400pxPosts}
  660. {Photoset-400}
  661. {/block:if400pxPosts}
  662. {/block:Photoset}
  663. </div>
  664.  
  665. {block:Video}
  666. {block:if250pxPosts}
  667. {Video-250}
  668. {/block:if250pxPosts}
  669. {block:if400pxPosts}
  670. {Video-400}
  671. {/block:if400pxPosts}
  672. {/block:Video}
  673.  
  674. {block:Audio}
  675. <div class="player">{AudioPlayerWhite}</div>
  676. <div class="audioinfo">
  677. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}
  678. </div>
  679. {/block:Audio}
  680.  
  681. {block:Answer}
  682. <div class="q">
  683. <b>{Asker}</b> screamed: {Question}</div>
  684. <div class="a">{Answer}</div>
  685. {/block:Answer}
  686.  
  687. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  688.  
  689. {block:Date}
  690. <div id="permalink">
  691. <a href="{Permalink}" >{12Hour}:{Minutes} {AmPm}</a>{block:NoteCount}<a href="{Permalink}">+ {NoteCount}</a>{/block:NoteCount}{block:RebloggedFrom}<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource}<a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:ContentSource}{/block:RebloggedFrom}
  692. {block:HasTags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  693. </div>
  694. {/block:Date}
  695.  
  696.  
  697.  
  698. </div>
  699.  
  700.  
  701. {block:PostNotes}
  702. <div class="pagenotes">
  703. {PostNotes}
  704. </div>
  705. {/block:PostNotes}
  706.  
  707.  
  708. {/block:Posts}
  709.  
  710.  
  711.  
  712.  
  713.  
  714. </div>
  715.  
  716. </div>
  717.  
  718.  
  719. {block:ContentSource}
  720. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  721. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  722. {/block:SourceLogo}
  723. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  724. {/block:ContentSource}
  725.  
  726. <div id="mivabi"><a title="a mivabi orginal." href="http://mivabi.tumblr.com/"><img width="40px" src="http://i.imgur.com/ipxnASm.png"></a></div>
  727. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement