Advertisement
mogimochi

Theme [13]:re Interwoven

Dec 3rd, 2014
16,241
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 32.49 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!-----------------------------------------------------------------------
  6.  
  7. :: REVITALIZED PACK #01 ::
  8.  
  9. Theme 13 Interwoven
  10. by yukoki/s-ekki
  11.  
  12. 1. Light/Heavy CSS editting is allowed.
  13. 2. Do not use as base code.
  14. 3. Do not remove credit.
  15. 4. Do not claim theme as your own.
  16.  
  17. >> This is part of the Revitalized Pack #01. I have removed my 2012 theme, [13] Kitai. Hence to fill its empty spot, I have released a NEW theme [13] Interwoven. It looks nothing like Kitai. :v
  18.  
  19. ---------------------------------------------------------- VER 041215 -->
  20.  
  21. <meta name="image:sidebar" content="">
  22. <meta name="image:background" content="">
  23. <meta name="image:left border image" content="http://41.media.tumblr.com/tumblr_lzvjakQDzV1qhvdofo4_250.png">
  24. <meta name="image:corner image" content="">
  25.  
  26. <meta name="color:background" content="#ffffff">
  27.  
  28. <meta name="color:sidebar background" content="#fafafa">
  29. <meta name="color:sidebar border" content="#ededed">
  30.  
  31. <meta name="color:blog title" content="#c4c4c4">
  32. <meta name="color:blog title underline" content="#ededed">
  33.  
  34. <meta name="color:description" content="#bbbbbb">
  35. <meta name="color:desc bold" content="#a5a5a5">
  36. <meta name="color:desc italic" content="#c9c9c9">
  37. <meta name="color:desc links" content="#bbbbbb">
  38. <meta name="color:desc links highlight" content="#ededed">
  39. <meta name="color:desc links hover" content="#cccccc">
  40. <meta name="color:desc links highlight hover" content="#ffffff">
  41.  
  42. <meta name="color:navigation text" content="#bebebe">
  43. <meta name="color:navigation background" content="#efefef">
  44. <meta name="color:navigation text hover" content="#cccccc">
  45. <meta name="color:navigation background hover" content="#ffffff">
  46.  
  47. <meta name="color:custom links numbers" content="#b7b7b7">
  48. <meta name="color:custom links numbers background" content="#f1f1f1">
  49. <meta name="color:custom links title" content="#c6c6c6">
  50. <meta name="color:custom links title background" content="#f5f5f5">
  51.  
  52. <meta name="color:pagination links background" content="#eaeaea">
  53. <meta name="color:pagination links text" content="#9a9a9a">
  54. <meta name="color:hover pagination links background" content="#ffffff">
  55. <meta name="color:hover pagination links text" content="#bbbbbb">
  56. <meta name="color:pagination current background" content="#f9f9f9">
  57. <meta name="color:pagination current text" content="#979797">
  58.  
  59. <meta name="color:post background" content="#f6f6f6">
  60.  
  61. <meta name="color:body text" content="#aaaaaa">
  62. <meta name="color:body bold" content="#000000">
  63. <meta name="color:body italic" content="#c8c8c8">
  64. <meta name="color:body links" content="#aaaaaa">
  65. <meta name="color:body links highlight" content="#f0f0f0">
  66. <meta name="color:body links hover" content="#7a7a7a">
  67. <meta name="color:body links highlight hover" content="#f0f0f0">
  68.  
  69. <meta name="color:post title" content="#bbbbbb">
  70. <meta name="color:post title underline" content="#e9e9e9">
  71.  
  72. <meta name="color:quote post" content="#898989">
  73. <meta name="color:quote post quotation marks" content="#e2e2e2">
  74. <meta name="color:quote post source" content="#b1b1b1">
  75.  
  76. <meta name="color:chat even name" content="#ba9ec1">
  77. <meta name="color:chat even text" content="#b8b8b8">
  78. <meta name="color:chat odd name" content="#e48dbf">
  79. <meta name="color:chat odd text" content="#777777">
  80.  
  81. <meta name="color:audio info background" content="#ffffff">
  82. <meta name="color:audio info text" content="#929292">
  83.  
  84. <meta name="color:ask background" content="#f2f2f2">
  85. <meta name="color:ask text" content="#9b9b9b">
  86. <meta name="color:asker text" content="#5e5e5e">
  87. <meta name="color:asker link" content="#d4d4d4">
  88.  
  89. <meta name="color:permalink text" content="#777777">
  90. <meta name="color:permalink notes" content="#aaaaaa">
  91. <meta name="color:permalink notes background" content="#e5e5e5">
  92. <meta name="color:hover permalink notes" content="#adadad">
  93. <meta name="color:hover permalink notes background" content="#ffffff">
  94. <meta name="color:permalink divider" content="#eaeaea">
  95.  
  96. <meta name="color:tags" content="#999999">
  97. <meta name="color:tags background" content="#eaeaea">
  98. <meta name="color:hover tags" content="#aaaaaa">
  99. <meta name="color:hover tags background" content="#ffffff">
  100.  
  101. <meta name="if:always visible custom links" content="0">
  102. <meta name="if:infinite scroll" content="0">
  103. <meta name="if:250px posts" content="0">
  104. <meta name="if:400px posts" content="0">
  105. <meta name="if:500px posts" content="1">
  106. <meta name="if:1 column" content="1">
  107. <meta name="if:2 columns" content="0">
  108. <meta name="if:3 columns" content="0">
  109. <meta name="if:monochrome posts" content="0">
  110. <meta name="if:photo fading" content="0">
  111. <meta name="if:show captions" content="1">
  112. <meta name="if:show tags" content="1">
  113. <meta name="if:permalink sources" content="1">
  114.  
  115. <meta name="text:corner image width" content="360">
  116. <meta name="text:link 1" content="">
  117. <meta name="text:link 1 URL" content="">
  118. <meta name="text:link 2" content="">
  119. <meta name="text:link 2 URL" content="">
  120. <meta name="text:link 3" content="">
  121. <meta name="text:link 3 URL" content="">
  122. <meta name="text:link 4" content="">
  123. <meta name="text:link 4 URL" content="">
  124. <meta name="text:link 5" content="">
  125. <meta name="text:link 5 URL" content="">
  126. <meta name="text:link 6" content="">
  127. <meta name="text:link 6 URL" content="">
  128.  
  129. <title>{title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  130. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  131. <link rel="shortcut icon" href="{Favicon}" />
  132.  
  133. {block:indexpage}
  134. {block:ifnot1column}{block:ifinfinitescroll}
  135. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  136. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  137.  
  138. <script>
  139. $(function(){
  140. var $container = $('#content');
  141. $container.imagesLoaded(function(){
  142. $container.masonry({
  143. itemSelector: '.posts',
  144. });
  145. });
  146. $container.infinitescroll({
  147. itemSelector : ".posts",
  148. navSelector : "div.pagination",
  149. nextSelector : ".pagination a#next",
  150. loadingImg : "",
  151. loadingText : "<em></em>",
  152. bufferPx : 10000,
  153. extraScrollPx: 12000,
  154. },
  155. // trigger Masonry as a callback
  156. function( newElements ) {
  157. var $newElems = $( newElements ).css({ opacity: 0 });
  158. // ensure that images load before adding to masonry layout
  159. $newElems.imagesLoaded(function(){
  160. $newElems.animate({ opacity: 1 });
  161. $container.masonry( 'appended', $newElems, true );
  162. });
  163. }
  164. );
  165. });
  166. </script>
  167. {/block:ifinfinitescroll}
  168.  
  169. {block:ifnotinfinitescroll}
  170. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  171.  
  172. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  173. <script type="text/javascript">
  174. $(window).load(function () {
  175. $('#content').masonry({
  176. itemSelector : ".post",
  177. },
  178. function() { $('#content').masonry({ appendedContent: $(this) }); }
  179. );
  180. });
  181. </script>
  182. {/block:ifnotinfinitescroll}
  183.  
  184. {/block:ifnot1column}
  185.  
  186. {block:if1column}{block:ifinfinitescroll}
  187. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  188. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  189. <script type="text/javascript" charset="utf-8">
  190. var $j = jQuery.noConflict();
  191. $j(function() {
  192. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  193. $j("img").lazyload({
  194. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  195. effect: "fadeIn",
  196. });
  197. });
  198. </script>
  199. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/EIBmz7s0p/infinitescrolling.js"></script>
  200. {/block:ifinfinitescroll}{/block:if1column}
  201.  
  202. {/block:indexpage}
  203.  
  204. <style type="text/css">
  205.  
  206.  
  207. body {
  208. background-color: {color:background};
  209. background-image: url({image:background});
  210. background-attachment: fixed;
  211. margin: 0;
  212. word-wrap: break-word;
  213. }
  214. a { text-decoration:none; }
  215.  
  216. #sidebar {
  217. position: fixed;
  218. {block:ifinfinitescroll}bottom: 30px;{/block:ifinfinitescroll}
  219. {block:ifnotinfinitescroll}bottom: 80px;{/block:ifnotinfinitescroll}
  220. left: 1060px;
  221. width: 150px;
  222. padding: 20px;
  223. border-left: 1px solid {color:sidebar border};
  224. background-color: {color:sidebar background};
  225. {block:indexpage}
  226. {block:if1column}
  227. {block:if500pxposts}left: 680px;{/block:if500pxposts}
  228. {block:if400pxposts}left: 580px;{/block:if400pxposts}
  229. {block:if250pxposts}left: 420px;{/block:if250pxposts}
  230. {/block:if1column}
  231. {block:if2columns}
  232. {block:if400pxposts}left: 1050px;{/block:if400pxposts}
  233. {block:if250pxposts}left: 740px;{/block:if250pxposts}
  234. {/block:if2columns}
  235. {block:if3columns}
  236. {block:if250pxposts}left: 1070px;{/block:if250pxposts}
  237. {/block:if3columns}
  238. {/block:indexpage}
  239. {block:permalinkpage}
  240. left: 670px;
  241. {/block:permalinkpage}
  242. }
  243.  
  244. .sbimg {
  245. width: 150px;
  246. border-radius: 6px;
  247. display: block;
  248. }
  249.  
  250. .blogti {
  251. color: {color:blog title};
  252. border-bottom: 1px solid {color:blog title underline};
  253. font-family: courier new;
  254. font-size: 10px;
  255. text-transform: uppercase;
  256. text-align: center;
  257. padding: 7px 0;
  258. margin-top: 10px;
  259. letter-spacing: 1px;
  260. }
  261.  
  262. .desc {
  263. margin: 5px 0;
  264. text-align: justify;
  265. font-family: consolas;
  266. font-size: 10px;
  267. color: {color:description};
  268. }
  269.  
  270. .desc b,strong {
  271. color: {color:desc bold};
  272. }
  273.  
  274. .desc i,em {
  275. color: {color:desc italic};
  276. }
  277.  
  278. .desc a {
  279. color: {color:desc links};
  280. background-color: {color:desc links highlight};
  281. }
  282.  
  283. .desc a:hover {
  284. color: {color:desc links hover};
  285. background-color: {color:desc links highlight hover};
  286. }
  287.  
  288. .nav {
  289. font-family: courier new;
  290. font-size: 8px;
  291. text-transform: uppercase;
  292. letter-spacing: 1px;
  293. margin-right: 2px;
  294. background-color: {color:navigation background};
  295. color: {color:navigation text};
  296. padding: 3px;
  297. }
  298.  
  299. .nav:hover {
  300. background-color: {color:navigation background hover};
  301. color: {color:navigation text hover};
  302. }
  303.  
  304. .linku {
  305. position: absolute;
  306. margin: 4px 180px;
  307. font-family: courier new;
  308. font-size: 10px;
  309. color: #aaa;
  310. {block:ifnotalwaysvisiblecustomlinks}
  311. opacity: 0;
  312. {/block:ifnotalwaysvisiblecustomlinks}
  313. transition: 0.8s;
  314. }
  315.  
  316. #sidebar:hover .linku {
  317. opacity: 1;
  318. }
  319.  
  320. .link {
  321. margin-bottom: 14px;
  322. }
  323.  
  324. .linkutxt {
  325. font-family: courier new;
  326. font-size: 8px;
  327. text-transform: uppercase;
  328. letter-spacing: 1px;
  329. background-color: {color:custom links title background};
  330. color: {color:custom links title};
  331. margin: 0 16px;
  332. padding: 4px;
  333. opacity: 0;
  334. transition: 0.3s;
  335. }
  336.  
  337. .linkutxt a { color:{color:custom links title}; }
  338.  
  339. .link:hover .linkutxt {
  340. opacity: 1;
  341. }
  342.  
  343. .linkutxttri {
  344. position: absolute;
  345. color: red;
  346. margin: 3px -10px;
  347. color: #f5f5f5;
  348. }
  349.  
  350. .linkuno {
  351. background-color: {color:custom links numbers background};
  352. color: {color:custom links numbers};
  353. padding: 3px;
  354. }
  355.  
  356. .linkuno { color:{color:custom links numbers}; }
  357.  
  358. #content {
  359. width: 1000px;
  360. float: left;
  361. margin: 20px 110px;
  362. {block:if1column}
  363. {block:if500pxposts}width: 600px;{/block:if500pxposts}
  364. {block:if400pxposts}width: 500px;{/block:if400pxposts}
  365. {block:if250pxposts}width: 350px;{/block:if250pxposts}
  366. {/block:if1column}
  367. {block:if2columns}
  368. {block:if400pxposts}width: 1000px;{/block:if400pxposts}
  369. {block:if250pxposts}width: 700px;{/block:if250pxposts}
  370. {/block:if2columns}
  371. {block:if3columns}
  372. {block:if250pxposts}width: 1000px;{/block:if250pxposts}
  373. {/block:if3columns}
  374. }
  375.  
  376. .post {
  377. width: 250px;
  378. padding: 20px;
  379. background-color: {color:post background};
  380. margin-bottom: 30px;
  381. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  382. {block:if400pxposts}width: 400px;{/block:if400pxposts}
  383. {block:if250pxposts}width: 250px;{/block:if250pxposts}
  384. {block:permalinkpage}
  385. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  386. {block:if400pxposts}width: 500px;{/block:if400pxposts}
  387. {block:if250pxposts}width: 500px;{/block:if250pxposts}
  388. {/block:permalinkpage}
  389. {block:ifnot1column}
  390. float: left;
  391. margin-bottom: 30px;
  392. margin-right: 30px;
  393. {/block:ifnot1column}
  394. }
  395.  
  396. .photo {
  397. border-radius: 5px;
  398. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  399. {block:if400pxposts}width: 400px;{/block:if400pxposts}
  400. {block:if250pxposts}width: 250px;{/block:if250pxposts}
  401. {block:permalinkpage}
  402. {block:if500pxposts}width: 500px;{/block:if500pxposts}
  403. {block:if400pxposts}width: 500px;{/block:if400pxposts}
  404. {block:if250pxposts}width: 500px;{/block:if250pxposts}
  405. {/block:permalinkpage}
  406. display: block;
  407. {block:ifphotofading}opacity: 0.6;{/block:ifphotofading}
  408. {block:ifmonochromeposts}
  409. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  410. filter: gray; /* IE6-9 */
  411. -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
  412. {/block:ifmonochromeposts}
  413. transition: 0.8s;
  414. -moz-transition: 0.8s;
  415. webkit-transition: 0.8s;
  416. -o-transition: 0.8s;
  417. }
  418.  
  419. .post:hover .photo {
  420. opacity: 1;
  421. {block:ifmonochromeposts}
  422. filter: none;
  423. -webkit-filter: grayscale(0%);
  424. {/block:ifmonochromeposts}
  425. }
  426.  
  427. .post img {
  428. {block:if500pxposts}max-width: 500px;{/block:if500pxposts}
  429. {block:if400pxposts}max-width: 400px;{/block:if400pxposts}
  430. {block:if250pxposts}max-width: 250px;{/block:if250pxposts}
  431. {block:permalinkpage}
  432. {block:if500pxposts}max-width: 500px;{/block:if500pxposts}
  433. {block:if400pxposts}max-width: 500px;{/block:if400pxposts}
  434. {block:if250pxposts}max-width: 500px;{/block:if250pxposts}
  435. {/block:permalinkpage}
  436. }
  437. .post blockquote img {max-width: 100%;}
  438.  
  439. .text {
  440. font-family: consolas;
  441. font-size: 10px;
  442. color: {color:body text};
  443. }
  444.  
  445. .text b,strong, .permainfo b,strong {
  446. font-weight: 400;
  447. color: {color:body bold};
  448. }
  449.  
  450. .text i,em, .permainfo a {
  451. color: {color:body italic};
  452. }
  453.  
  454. .text a, .ptags a, .psrc a {
  455. background-color: {color:body links highlight};
  456. color: {color:body links};
  457. text-decoration: underline;
  458. }
  459.  
  460. .text a:hover, .ptags a:hover, .permainfo a:hover, .psrc a:hover {
  461. background-color: {color:body links highlight hover};
  462. color: {color:body links hover};
  463. }
  464.  
  465. .ptitle, .ltitle {
  466. font-family: courier new;
  467. font-size: 10px;
  468. border-bottom: 1px solid {color:post title underline};
  469. padding: 14px 5px;
  470. text-transform: uppercase;
  471. letter-spacing: 1px;
  472. text-align: center;
  473. color: {color:post title};
  474. }
  475.  
  476. .quom, .quomr {
  477. font-family: georgia;
  478. font-size: 100px;
  479. margin: -15px 0;
  480. position: absolute;
  481. color: {color:quote post quotation marks};
  482. z-index: 1;
  483. }
  484. .quomr {
  485. {block:if500pxposts}margin: -15px 460px;{/block:if500pxposts}
  486. {block:if400pxposts}margin: -15px 360px;{/block:if400pxposts}
  487. {block:if250pxposts}margin: -15px 210px;{/block:if250pxposts}
  488. }
  489.  
  490. .pquote {
  491. font-family: courier new;
  492. font-size: 14px;
  493. text-align: center;
  494. position: relative;
  495. z-index: 2;
  496. color: {color:quote post};
  497. }
  498.  
  499. .psrc {
  500. font-family: consolas;
  501. font-size: 8px;
  502. letter-spacing: 1px;
  503. text-transform: uppercase;
  504. text-align: center;
  505. margin-top: -20px;
  506. margin-bottom: 10px;
  507. color: {color:quote post source};
  508. }
  509.  
  510. .tumblr_audio_player {height: 40px; width: 210px;}
  511. .audiopost { height: 150px; }
  512. .albumno {
  513. width: 150px;
  514. height: 150px;
  515. background-color: {color:no album art};
  516. position: absolute;
  517. z-index: 1;
  518. {block:indexpage}{block:if250pxposts}
  519. width: 250px;
  520. height: 250px;
  521. {/block:if250pxposts}{/block:indexpage}
  522. }
  523.  
  524. .albumartp {
  525. z-index: 10;
  526. width: 150px;
  527. height: 150px;
  528. position: relative;
  529. z-index: 2;
  530. display: block;
  531. {block:indexpage}{block:if250pxposts}
  532. width: 250px;
  533. height: 250px;
  534. {/block:if250pxposts}{/block:indexpage}
  535. }
  536.  
  537. .albumart {
  538. width: 150px;
  539. height: 150px;
  540. display: block;
  541. position: relative;
  542. {block:indexpage}{block:if250pxposts}
  543. width: 250px;
  544. height: 250px;
  545. {/block:if250pxposts}{/block:indexpage}
  546. }
  547.  
  548. .audioplayer {
  549. position: absolute;
  550. z-index: 11;
  551. margin-top: -90px;
  552. margin-left: 65px;
  553. width: 25px;
  554. height: 25px;
  555. overflow: hidden;
  556. opacity: 0.5;
  557. {block:indexpage}{block:if250pxposts}
  558. margin-top: -140px;
  559. margin-left: 115px;
  560. {/block:if250pxposts}{/block:indexpage}
  561. transition: 0.6s;
  562. -moz-transition: 0.6s;
  563. -webkit-transition: 0.6s;
  564. -o-transition: 0.6s;
  565. }
  566. .audioplayer:hover {opacity: 1;}
  567.  
  568. .audioinfo {
  569. position: absolute;
  570. margin-left: 155px;
  571. height: 150px;
  572. }
  573.  
  574. .aline {
  575. {block:if500pxposts}width: 325px;{/block:if500pxposts}
  576. {block:if400pxposts}width: 225px;{/block:if400pxposts}
  577. {block:indexpage}{block:if250pxposts}margin-top: 5px;{/block:if250pxposts}{/block:indexpage}
  578. {block:permalinkpage}width: 325px;{/block:permalinkpage}
  579. font-family: consolas;
  580. font-size: 10px;
  581. padding: 11px 10px;
  582. margin-bottom: 5px;
  583. text-transform: uppercase;
  584. background-color: {color:audio info background};
  585. color: {color:audio info text};
  586. }
  587. .aline b,strong {
  588. font-weight: 400;
  589. color: {color:audio info list headings};
  590. }
  591.  
  592. .askerportrait {
  593. max-width: 64px;
  594. max-height: 64px;
  595. position: absolute;
  596. border: 10px solid {color:ask background};
  597. }
  598. .a {
  599. margin-left: 100px;
  600. background-color: {color:ask background};
  601. min-height: 64px;
  602. padding: 10px;
  603. font-family: consolas;
  604. font-size: 11px;
  605. color: {color:ask text};
  606. }
  607. .asker {
  608. color: {color:asker text};
  609. font-family: consolas;
  610. font-size: 11px;
  611. text-transform: uppercase;
  612. }
  613. .asker a {color: {color:asker link};border-bottom: 1px solid {color:asker link};}
  614. .q {margin-top: 10px;}
  615. .tri {
  616. position: absolute;
  617. font-size: 30px;
  618. margin: 20px 0 0 85px;
  619. color: {color:ask background};
  620. }
  621.  
  622. .line {
  623. font-family: courier new;
  624. font-size: 8px;
  625. letter-spacing: 1px;
  626. text-transform: uppercase;
  627. }
  628.  
  629. .odd .line {
  630. padding: 10px 5px;
  631. color:{color:chat odd text};
  632. background-color: {color:post background};
  633. }
  634. .even .line {
  635. padding: 10px 5px;
  636. color:{color:chat even text};
  637. background-color: #fff;
  638. }
  639. .odd .name {
  640. color: {color:chat odd name};
  641. padding: 3px 5px;
  642. }
  643. .even .name {
  644. color: {color:chat even name};
  645. padding: 3px 5px;
  646. }
  647.  
  648. #content blockquote {
  649. margin: 5px;
  650. padding: 0 10px;
  651. border-left: 1px solid {color:blockquote};
  652. }
  653.  
  654. .perma {
  655. font-family: courier new;
  656. {block:ifnot250pxposts}
  657. margin-top: 20px;
  658. {block:ifpermalinksources}padding-bottom: 12px;{/block:ifpermalinksources}
  659. {block:ifshowtags}padding-bottom: 12px;{/block:ifshowtags}
  660. {/block:ifnot250pxposts}
  661. {block:if250pxposts}
  662. margin-top: 10px;
  663. {/block:if250pxposts}
  664. font-size: 8px;
  665. text-transform: uppercase;
  666. letter-spacing: 1px;
  667. color: #777;
  668. }
  669.  
  670. .perma a {
  671. color: {color:body links};
  672. }
  673.  
  674. .perma a:hover {
  675. color: {color:body links hover};
  676. }
  677.  
  678. .permano {
  679. padding: 3px 5px;
  680. background-color: {color:permalink notes background};
  681. color: {color:permalink notes};
  682. text-decoration: none;
  683. }
  684.  
  685. .permano:hover {
  686. background-color: {color:hover permalink notes background};
  687. color: {color:hover permalink notes};
  688. text-decoration: none;
  689. }
  690.  
  691. .permatags {
  692. text-align: right;
  693. margin-top: -1px;
  694. padding-top: 2px;
  695. line-height: 16px;
  696. border-top: 1px solid {color:permalink divider};
  697. }
  698.  
  699. .permatags a {
  700. font-family: courier new;
  701. font-size: 8px;
  702. padding: 3px;
  703. background-color: {color:tags background};
  704. color: {color:tags};
  705. text-transform: uppercase;
  706. letter-spacing: 1px;
  707. }
  708.  
  709. .permatags a:hover {
  710. background-color: {color:hover tags background};
  711. color: {color:hover tags};
  712. }
  713.  
  714. .permaactions {
  715. border-top: 1px solid {color:permalink divider};
  716. {block:ifpermalinksources}{block:ifnotshowtags}
  717. text-align: right;
  718. {/block:ifnotshowtags}{/block:ifpermalinksources}
  719. }
  720.  
  721. .permaactions a {
  722. font-family: courier new;
  723. font-size: 8px;
  724. padding: 3px;
  725. background-color: {color:hover tags background};
  726. color: {color:hover tags};
  727. margin-left: 5px;
  728. margin-top: 6px;
  729. {block:ifpermalinksources}{block:ifshowtags}
  730. float: right;
  731. {/block:ifshowtags}{/block:ifpermalinksources}
  732. text-transform: uppercase;
  733. letter-spacing: 1px;
  734. }
  735.  
  736. .permaactions a:hover {
  737. background-color: {color:tags background};
  738. color: {color:tags};
  739. }
  740.  
  741. .permainfo {
  742. margin-top: 10px;
  743. width: 480px;
  744. padding: 30px 30px;
  745. font-family: consolas;
  746. font-size: 11px;
  747. text-align: center;
  748. background-color: {color:post background};
  749. color: {color:body text};
  750. }
  751.  
  752. #notecontainer {
  753. padding: 10px;
  754. text-decoration: none;
  755. width: 500px;
  756. background-color: {color:post background};
  757. padding: 20px;
  758. margin-top: 20px;
  759. }
  760.  
  761. ol.notes {
  762. list-style-type: none;
  763. letter-spacing: -1px;
  764. font-size: 11px;
  765. color: {color:body text};
  766. font-family: consolas;
  767. text-decoration: none;
  768. margin: 0;
  769. width: 500px;
  770. padding: 5px;
  771. text-align: left;
  772. }
  773. ol.notes a {
  774. color: {color:body links};
  775. -webkit-transition: all 0.4s ease-in-out;
  776. -moz-transition: all 0.4s ease-in-out;
  777. -o-transition: all 0.4s ease-in-out;
  778. -ms-transition: all 0.4s ease-in-out;
  779. transition: all 0.4s ease-in-out;}
  780.  
  781. ol.notes a:hover {color:{color:body links};}
  782.  
  783. img.avatar {
  784. margin-right: 5px;
  785. width: 10px;
  786. height: 10px;
  787. float: left;
  788. }
  789.  
  790. #left {
  791. position: fixed;
  792. width: 80px;
  793. height: 100%;
  794. background-image: url({image:left border image});
  795. }
  796.  
  797. .pagi {
  798. position: absolute;
  799. text-align: center;
  800. margin-top: 40px;
  801. margin-left: -20px;
  802. width: 150px;
  803. padding: 14px 20px;
  804. border-left: 1px solid {color:sidebar border};
  805. background-color: {color:sidebar background};
  806. }
  807.  
  808. .paginationss {
  809. width: 150px;
  810. text-align: left;
  811. font-family: calibri;
  812. font-size: 10px;
  813. }
  814.  
  815. .pagi a {
  816. background-color: {color:pagination links background};
  817. color: {color:pagination links text};
  818. padding: 1px 4px;
  819. margin: 0 2px;
  820. -webkit-transition: all 0.4s ease-in-out;
  821. -moz-transition: all 0.4s ease-in-out;
  822. -o-transition: all 0.4s ease-in-out;
  823. -ms-transition: all 0.4s ease-in-out;
  824. transition: all 0.4s ease-in-out;
  825. }
  826. .pagi a:hover {
  827. background-color: {color:hover pagination links background};
  828. color: {color:hover pagination links text};
  829. }
  830. .current_page {
  831. background-color: {color:pagination current background};
  832. color: {color:pagination current text};
  833. padding: 2px 5px;
  834. margin: 0 1px;
  835. }
  836.  
  837. {CustomCSS}
  838.  
  839. </style>
  840. </head>
  841. <body>
  842.  
  843. <img style="width:{text:corner image width}px;position: fixed; right: 0; bottom: 0; z-index: -1000;" src="{image:corner image}">
  844.  
  845. <div id="left"></div>
  846.  
  847. <div id="sidebar">
  848.  
  849. <div class="linku">
  850.  
  851. {block:iflink1}<a href="{text:link 1 URL}"><div class="link"><span class="linkuno">01</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 1}</span></div></a>{/block:iflink1}
  852. {block:iflink2}<a href="{text:link 2 URL}"><div class="link"><span class="linkuno">02</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 2}</span></div></a>{/block:iflink2}
  853. {block:iflink3}<a href="{text:link 3 URL}"><div class="link"><span class="linkuno">03</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 3}</span></div></a>{/block:iflink3}
  854. {block:iflink4}<a href="{text:link 4 URL}"><div class="link"><span class="linkuno">04</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 4}</span></div></a>{/block:iflink4}
  855. {block:iflink5}<a href="{text:link 5 URL}"><div class="link"><span class="linkuno">05</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 5}</span></div></a>{/block:iflink5}
  856. {block:iflink6}<a href="{text:link 6 URL}"><div class="link"><span class="linkuno">06</span><span class="linkutxt"><span class="linkutxttri">◀</span>{text:link 6}</span></div></a>{/block:iflink6}
  857.  
  858. </div><!--linku-->
  859.  
  860. <img class="sbimg" src="{image:sidebar}">
  861.  
  862. <div class="blogti">{Title}</div>
  863. <div class="desc">{description}</div>
  864.  
  865. <div style="width: 200px;">
  866. <a href="/"><span class="nav">index</span></a>
  867. <a href="/ask"><span class="nav">ask</span></a>
  868. <a href="/archive"><span class="nav">archive</span></a>
  869. <a href="http://yukoki.tumblr.com"><span class="nav">thm</span></a>
  870. </div>
  871.  
  872. {block:indexpage}{block:ifnotinfinitescroll}
  873. <div class="pagi">
  874. {block:Pagination}<div class="paginationss">
  875. {block:PreviousPage}
  876. <a href="{PreviousPage}">←</a>
  877. {/block:PreviousPage}
  878. {block:JumpPagination length="6"}
  879. {block:CurrentPage}
  880. <span class="current_page">X</span>
  881. {/block:CurrentPage}
  882. {block:JumpPage}
  883. <a class="jump_page" href="{URL}">{PageNumber}</a>
  884. {/block:JumpPage}
  885. {/block:JumpPagination}
  886. {block:NextPage}
  887. <a href="{NextPage}">→</a>
  888. {/block:NextPage}
  889. </div><!--paginationss-->{/block:Pagination}
  890. </div>
  891. {/block:ifnotinfinitescroll}{/block:indexpage}
  892.  
  893. </div><!--sidebar-->
  894.  
  895. <div id="content">
  896.  
  897. {block:Posts}
  898. <div class="post">
  899.  
  900. {block:quote}
  901. <div class="quom">“</div><div class="quomr">”</div>
  902. <div class="pquote">{quote}</div><br>
  903. <div class="psrc">- {Source} -</div>
  904. {/block:quote}
  905.  
  906. {block:Photo}
  907. {linkopentag}<center><img class="photo" src="{PhotoURL-500}"></center>{linkclosetag}
  908. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  909. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  910. <div class="text">{Caption}</div>
  911. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  912. {/block:Photo}
  913.  
  914. {block:Photoset}
  915. <div class="photo">
  916. {block:indexpage}
  917. {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  918. {block:if400pxposts}{Photoset-400}{/block:if400pxposts}
  919. {block:if250pxposts}{Photoset-250}{/block:if250pxposts}
  920. {/block:indexpage}
  921. {block:permalinkpage}
  922. {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  923. {block:if400pxposts}{Photoset-500}{/block:if400pxposts}
  924. {block:if250pxposts}{Photoset-500}{/block:if250pxposts}
  925. {/block:permalinkpage}
  926. </div>
  927. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  928. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  929. <div class="text">{Caption}</div>
  930. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  931. {/block:Photoset}
  932.  
  933. {block:text}
  934. {block:Title}<div class="ptitle">{Title}</div>{/block:Title}
  935. <div class="text">{body}</div>
  936. {/block:text}
  937.  
  938. {block:Audio}
  939.  
  940. {block:indexpage}{block:ifnot250pxposts}
  941. <div class="audiopost">
  942. <div class="audioinfo">
  943. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  944. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  945. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  946. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  947. </div><!--audioinfo-->
  948. {/block:ifnot250pxposts}{/block:indexpage}
  949.  
  950. {block:permalinkpage}
  951. <div class="audioinfo">
  952. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  953. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  954. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  955. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  956. </div><!--audioinfo-->
  957. {/block:permalinkpage}
  958.  
  959. <div class="albumart"><div class="albumno"></div>{block:AlbumArt}<img class="albumartp" src="{AlbumArtURL}">{/block:AlbumArt}</div>
  960. <div class="audioplayer">{AudioPlayer}</div>
  961.  
  962. {block:ifnot250pxposts}{block:indexpage}</div><!--audiopost-->{/block:indexpage}{/block:ifnot250pxposts}
  963.  
  964. {block:indexpage}{block:if250pxposts}
  965. {block:trackname}<div class="aline"><b>track name:</b> {trackname}</div>{/block:trackname}
  966. {block:artist}<div class="aline"><b>artist:</b> {artist}</div>{/block:artist}
  967. {block:album}<div class="aline"><b>album:</b> {album}</div>{/block:album}
  968. {block:playcount}<div class="aline"><b>play count:</b> {playcount}</div>{/block:playcount}
  969. {/block:if250pxposts}{/block:indexpage}
  970. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  971. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  972. <div class="text">{Caption}</div>
  973. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  974. {/block:Audio}
  975.  
  976. {block:Video}
  977. {block:indexpage}
  978. {block:if500pxposts}{Video-500}{/block:if500pxposts}
  979. {block:if400pxposts}{Video-400}{/block:if400pxposts}
  980. {block:if250pxposts}{Video-250}{/block:if250pxposts}
  981. {/block:indexpage}
  982. {block:permalinkpage}
  983. {block:if500pxposts}{Video-500}{/block:if500pxposts}
  984. {block:if400pxposts}{Video-500}{/block:if400pxposts}
  985. {block:if250pxposts}{Video-500}{/block:if250pxposts}
  986. {/block:permalinkpage}
  987. {block:IfShowCaptions}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}
  988. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}
  989. <div class="text">{Caption}</div>
  990. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  991. {/block:Video}
  992.  
  993. {block:Answer}
  994. <img class="askerportrait" src="{AskerPortraitURL-64}">
  995. <div class="tri">◀</div>
  996. <div class="a">
  997. <span class="asker">{Asker} whispered:</span>
  998. <span class="q">{Question}</span>
  999. </div>
  1000. <div class="text">{Answer}</div>
  1001. {/block:Answer}
  1002.  
  1003. {block:Chat}
  1004. {block:Title}<div class="ptitle">{Title}</div>{/block:Title}
  1005. <div class="text">
  1006. {block:Lines}<div class="{Alt}">
  1007. <div class="line">{block:Label}<span class="name">{Label}</span>{/block:Label} {Line}<br /></div></div>
  1008. {/block:Lines}
  1009. </div>
  1010. {/block:Chat}
  1011.  
  1012. {block:link}
  1013. <a href="{URL}"><div class="ltitle">{Name} ▷</div></a>
  1014. {block:Description}<div class="text">{Description}</div>{/block:Description}
  1015. {/block:link}
  1016.  
  1017. {block:indexpage}{block:date}
  1018. <div class="perma">
  1019. {block:if250pxposts}
  1020. <a href="{Permalink}"><span class="permano">{NoteCountWithLabel}<span class="permarblg"></a> // {TimeAgo}
  1021. {/block:if250pxposts}
  1022. {block:ifnot250pxposts}
  1023. <a href="{Permalink}"><span class="permano">{NoteCountWithLabel}<span class="permarblg"></a> // posted on {DayOfMonth} {ShortMonth} @ {12Hour}.{Minutes}{AmPm} [<a href="{ReblogURL}"> reblog? </a>]
  1024. {/block:ifnot250pxposts}
  1025. {/block:if1column}
  1026. </div>
  1027. {block:ifnot250pxposts}
  1028. {block:ifpermalinksources}<div class="permaactions">
  1029. {block:RebloggedFrom}
  1030. <a title="{ReblogParentName}" href="{ReblogParentURL}">via</a> <a href="{ReblogRootURL}" title="{ReblogRootName}">org</a>
  1031. {/block:RebloggedFrom}
  1032. {block:if250pxposts}<a title="reblog this post" href="{ReblogURL}">rbg</a>{/block:if250pxposts}
  1033. </div><!--permalinksources-->{/block:ifpermalinksources}
  1034. {block:ifshowtags}
  1035. {block:HasTags}<div class="permatags">{block:Tags}
  1036. <a href="{TagURL}">#{Tag}</a>
  1037. {/block:Tags}</div>{/block:HasTags}
  1038. {/block:ifshowtags}
  1039. {/block:ifnot250pxposts}
  1040.  
  1041. {/block:date}{/block:indexpage}
  1042.  
  1043. </div><!--posts-->
  1044.  
  1045. {block:permalinkpage}{block:date}
  1046. <div class="permainfo">
  1047. Posted on <b>{DayOfMonth} {Month} {Year}</b>, at <b>{12Hour}.{Minutes}{AmPm}</b>, with <b>{NoteCountWithLabel}</b><br>
  1048. {block:RebloggedFrom}
  1049. Reblogged via <a href="{ReblogParentURL}">{ReblogParentName}</a>, originally by <a href="{ReblogRootURL}">{ReblogRootName}</a><br>
  1050. {/block:RebloggedFrom}
  1051. {block:HasTags}<div class="ptags">{block:Tags}
  1052. <a href="{TagURL}">#{Tag} </a>
  1053. {/block:Tags}</div>{/block:HasTags}
  1054. </div><!--permainfo-->
  1055. {block:PostNotes}
  1056. <div id="notecontainer">{PostNotes}</div>
  1057. {/block:PostNotes}
  1058. {/block:date}{/block:permalinkpage}
  1059.  
  1060. {/block:Posts}
  1061.  
  1062. {block:ContentSource}
  1063. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1064. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1065. {/block:SourceLogo}
  1066. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1067. {/block:ContentSource}
  1068.  
  1069. <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom}-->
  1070.  
  1071. </div><!--content-->
  1072.  
  1073. </body>
  1074. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement