jaesoonie

THEME #28

Aug 27th, 2013
8,614
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.24 KB | None | 0 0
  1. <!---------------------------------------------------------------------
  2. ᴛʜᴇᴍᴇ #28; ᴍᴀᴅᴇ ʙʏ >SOONJUN<. [ʏᴏɴɢ.ᴄᴏ.ᴠᴜ]
  3. sᴏᴏɴᴊᴜɴᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  4. ᴘʟᴇᴀsᴇ ʟᴇᴀᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ.
  5. ᴀɴʏ ǫᴜᴇsᴛɪᴏɴs ᴀᴛ ᴀʟʟ ᴄᴏᴍᴇ ᴀsᴋ.
  6. ----------------------------------------------------------------------->
  7.  
  8. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  9. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  10. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  11. <head>
  12. <title>{Title}</title>
  13. <link rel="shortcut icon" href="{favicon}">
  14. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  15. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
  16. </script>
  17.  
  18. {block:indexpage}
  19. <script type="text/javascript">
  20. /* Photoset Resize Code by Kevin - EXCOLO.TUMBLR.COM */
  21. $(document).ready(function() {
  22. function photosetResize() {
  23. $('iframe.photoset').each(function(){
  24. var newSize = 200;
  25. var newSrc = $(this).attr('src').replace('500',newSize);
  26. $(this).attr('src', newSrc).width(newSize);
  27. var high = $(this).css('height');
  28. var calculate = parseInt(high, 10)* newSize/500;
  29. $(this).css('height', calculate);
  30. });
  31. }
  32. photosetResize();
  33. });
  34. </script>
  35. {/block:indexpage}
  36.  
  37. <meta name="font:body" content="trebuchet ms, sans-serif"/>
  38. <meta name="color:title" content="#ababab" />
  39. <meta name="color:posts title" content="#bbbbbb" />
  40. <meta name="color:text" content="#9b9898" />
  41. <meta name="color:bold" content="#6f6e6e" />
  42. <meta name="color:italic" content="#b9b8b8" />
  43. <meta name="color:borders" content="#f3f3f3" />
  44. <meta name="color:description" content="#b9b8b8" />
  45. <meta name="color:navigation links" content="#aaaaaa" />
  46. <meta name="color:navigation links bg" content="#f7f7f7" />
  47. <meta name="color:hyperlinks" content="#a2a2a2"/>
  48. <meta name="color:hyperlinks hover" content="#dadada" />
  49. <meta name="color:caption bg" content="#fafafa" />
  50. <meta name="color:info bg" content="#333333" />
  51. <meta name="color:quote bg" content="#f8f8f8" />
  52.  
  53. <meta name="text:Link1" content="/" />
  54. <meta name="text:Link1 Title" content="link 1" />
  55. <meta name="text:Link2" content="/" />
  56. <meta name="text:Link2 Title" content="link 2" />
  57. <meta name="text:Link3" content="/" />
  58. <meta name="text:Link3 Title" content="link 3" />
  59. <meta name="text:Link4" content="/" />
  60. <meta name="text:Link4 Title" content="link 4" />
  61.  
  62. <meta name="image:picture" content="" />
  63.  
  64. <meta name="if:3columns200" content="0"/>
  65. <meta name="if:2columns200" content="1"/>
  66.  
  67. <meta name="if:infinitescroll" content="0">
  68. <meta name="if:caption" content="1">
  69. <meta name="if:greyscale" content="0"/>
  70. <meta name="if:opacity" content="0"/>
  71.  
  72. <script type="text/javascript"
  73. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  74. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  75. <script>
  76. (function($){
  77. $(document).ready(function(){
  78. $("[title]").style_my_tooltips();
  79. });
  80. })(jQuery);
  81. </script>
  82.  
  83. <link href='http://fonts.googleapis.com/css?family=Libre+Baskerville:400italic' rel='stylesheet' type='text/css'></head>
  84.  
  85. <style type="text/css">
  86.  
  87. iframe#tumblr_controls {
  88. right:0px !important;
  89. position:fixed !important;
  90. -webkit-filter:invert(100%);
  91. opacity:0.2;
  92. z-index:99;
  93. -webkit-transition-duration:0.8s;
  94. -moz-transition-duration: 0.8s;
  95. }
  96.  
  97. iframe#tumblr_controls:hover {opacity:1;-webkit-transition-duration:0.8s;-moz-transition-duration: 0.8s;}
  98.  
  99.  
  100. ::-webkit-scrollbar-track {background-color:#fff;}
  101. ::-webkit-scrollbar-thumb {background-color:#f5f5f5;}
  102. ::-webkit-scrollbar {width:5px;height:5px;}
  103.  
  104.  
  105. body{
  106. font-family:trebuchet ms;
  107. font-family:{font:body};
  108. line-height:100%;
  109. color:{color:text};
  110. word-wrap: break-word;
  111. font-size:10px;}
  112.  
  113. li {list-style:square;}
  114.  
  115. a {
  116. text-decoration:none;
  117. cursor:pointer;
  118. color:{color:hyperlinks};
  119. -webkit-transition: all 0.7s ease-in-out;
  120. -moz-transition: all 0.7s ease-in-out;
  121. -o-transition: all 0.7s ease-in-out;
  122. -ms-transition: all 0.7s ease-in-out;
  123. transition: all 0.7s ease-in-out;}
  124.  
  125. a:link, a:active, a:visited {color: {color:hyperlinks};}
  126. a:hover {color:{color:hyperlinks hover};}
  127.  
  128. b, strong {
  129. font-weight:heavy;
  130. color:{color:bold};}
  131.  
  132. i, em {
  133. font-weight:light;
  134. color:{color:italic};}
  135.  
  136. blockquote {
  137. margin: 5px;
  138. padding:0px 3px 0px 3px;
  139. line-height:90%;
  140. text-align:justify;
  141. border-left: 1px solid #ddd;}
  142.  
  143. blockquote img {
  144. {block:indexpage}
  145. width:140px;
  146. {/block:indexpage}
  147. {block:permalinkpage}
  148. width:410px;
  149. {/block:permalinkpage}
  150. overflow: auto;}
  151.  
  152. #posts img {
  153. max-width:190px;
  154. height:auto;
  155. {block:permalinkpage}width:auto;height:auto;{/block:permalinkpage};}
  156.  
  157. #caption{padding: 1px 7px 1px 7px;background-color:{color:caption bg};}
  158.  
  159. pre, xmp, plaintext, listing {
  160. display: block;
  161. white-space: pre;
  162. background: {color:bg block};
  163. padding: 5px;
  164. word-wrap: break-word;
  165. font-size: 9px;}
  166.  
  167. #entry{
  168. margin-top:10px;
  169. margin-left:350px;
  170. {block:indexpage}
  171. {block:if3columns200}
  172. width:650px;float:left;left:-10px;top:-10px;padding:30px 0px 50px 20px;
  173. {/block:if3columns200}
  174. {block:if2columns200}
  175. width:550px;float:left;left:-10px;top:-10px;padding:30px 0px 50px 20px;
  176. {/block:if2columns200}
  177. {/block:indexpage}
  178. {block:permalinkpage}
  179. width:550px;padding:50px 10px 50px 20px;
  180. {/block:permalinkpage}
  181. z-index:33;}
  182.  
  183. #posts{
  184. {block:indexpage}
  185. {block:if3columns200}
  186. width:200px;margin-left:10px;margin-bottom:10px;
  187. {/block:if3columns200}
  188. {block:if2columns200}
  189. width:200px;margin-left:15px;margin-bottom:15px;
  190. {/block:if2columns200}
  191. {block:ifgreyscale}
  192. -webkit-filter: grayscale(95%);
  193. 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");
  194. {/block:ifgreyscale}
  195. {block:ifopacity}
  196. opacity:0.9;
  197. {/block:ifopacity}
  198. -webkit-transition-duration:0.6s;
  199. -moz-transition-duration: 0.6s;
  200. line-height:90%;
  201. background:#fff;
  202. {/block:indexpage}
  203. {block:PermalinkPage}
  204. width:500px;margin-bottom:20px;
  205. {/block:PermalinkPage}}
  206.  
  207. #posts:hover{{block:indexpage}opacity:1;-webkit-transition-duration:0.8s;-moz-transition-duration: 0.8s;-webkit-filter: grayscale(0%);{/block:indexpage}}
  208.  
  209. #text {padding: 3px 6px 0px 6px;text-align:justify;}
  210.  
  211. #border {border-bottom: 1px solid {color:borders}; position:fixed;top:0px; height:100px;width:100%;z-index:99;
  212. {block:if3columns200}
  213. left:1020px;
  214. {/block:if3columns200}
  215. {block:if2columns200}
  216. left:820px;
  217. {/block:if2columns200}
  218. {block:permalinkpage}
  219. left:910px;
  220. {/block:permalinkpage}}
  221.  
  222. #sidebar {
  223. position: fixed;
  224. top: 0px;
  225. height:100%;
  226. left: 100px;
  227. border-right:1px solid {color:borders};
  228. width:250px;
  229. overflow:hidden;}
  230.  
  231. #sidebarimagery {display: inline-block;margin:auto;width:235px;margin-top:5px;}
  232. #sidebarimage {display: inline-block;}
  233. #sidebarimage img {
  234. width: 160px;
  235. padding:8px;
  236. margin-left:30px;
  237. margin-top:30px;
  238. background:#fff;
  239. z-index:10px;
  240. position:relative;}
  241.  
  242. #description{
  243. font-size:9px;
  244. text-align: center;
  245. color:#999;
  246. font-family:trebuchet ms;
  247. letter-spacing:1px;
  248. padding: 10px;
  249. width: 110px;
  250. line-height:110%;
  251. overflow:hidden;
  252. background:#fff;
  253. border-top:1px solid {color:borders};
  254. margin-left:53px;
  255. margin-top:-120px;
  256. -webkit-transition-duration:0.8s;
  257. -moz-transition-duration: 0.8s;}
  258.  
  259. #navigation{
  260. z-index:88;
  261. display:inline-block;
  262. text-align:center;
  263. width:150px;
  264. -webkit-transition-duration:0.8s;
  265. -moz-transition-duration: 0.8s;
  266. opacity:1;
  267. margin-top:-30px;
  268. margin-left:40px;}
  269.  
  270. #sidebar:hover #navigation, #sidebar:hover #description {
  271. -webkit-transition-duration:0.8s;
  272. -moz-transition-duration: 0.8s;
  273. opacity:1;
  274. margin-top:5px;}
  275.  
  276. #navigation a.links {
  277. display:inline-block;
  278. text-align:center;
  279. text-transform: uppercase;
  280. color: {color:navigation links};
  281. width:28px;
  282. font-size:8px;
  283. letter-spacing:0px;
  284. margin:2px;
  285. padding:3px;
  286. margin-bottom:3px;
  287. font-family:calibri;
  288. background:{color:navigation links bg};
  289. -webkit-transition: all 0.7s ease-in-out;
  290. -moz-transition: all 0.7s ease-in-out;
  291. cursor:pointer;
  292. border-bottom: 1px solid transparent;}
  293.  
  294. #navigation a.links:hover {border-bottom: 1px solid #ccc;
  295. -webkit-transition: all 0.7s ease-in-out;
  296. -moz-transition: all 0.7s ease-in-out;
  297. -o-transition: all 0.7s ease-in-out;
  298. -ms-transition: all 0.7s ease-in-out;
  299. transition: all 0.7s ease-in-out;}
  300.  
  301. #pagination {
  302. display:inline-block;
  303. width:210px;
  304. padding:8px;
  305. line-height:30%;
  306. text-align:center;
  307. font-family: cambria;
  308. font-style:oblique;
  309. border-top: 1px solid {color:borders};
  310. color:#ababab;
  311. {block:ifinfinitescroll}display:none;{/block:ifinfinitescroll}}
  312.  
  313. #pagination a{
  314. color:#bbb;
  315. -webkit-transition: all 0.7s ease-in-out;
  316. -moz-transition: all 0.7s ease-in-out;
  317. -o-transition: all 0.7s ease-in-out;
  318. -ms-transition: all 0.7s ease-in-out;
  319. transition: all 0.7s ease-in-out;}
  320.  
  321. .info {
  322. z-index:33;
  323. position:absolute;
  324. text-transform:uppercase;
  325. text-align: left;
  326. letter-spacing:1px;
  327. font-family: calibri;
  328. overflow:auto;
  329. margin-top:0px;
  330. margin-left:0px;
  331. height:auto;
  332. font-size:8px;
  333. line-height:180%;
  334. color:#fff;
  335. border-bottom:2px solid 222;
  336. padding:10px;
  337. opacity:0;
  338. {block:if3columns200}
  339. width:180px;
  340. {/block:if3columns200}
  341. {block:if2columns200}
  342. width:180px;
  343. {/block:if2columns200}
  344. background:{color:info bg};
  345. {block:PermalinkPage}
  346. display:none;
  347. {/block:PermalinkPage}
  348. -webkit-transition: all 0.6s ease-in-out;
  349. -moz-transition: all 0.6s ease-in-out;}
  350.  
  351. .info a{color:#666;}
  352. .infotext{
  353. z-index:333;
  354. text-transform:uppercase;
  355. text-align: center;
  356. letter-spacing:1px;
  357. font-family: calibri;
  358. font-size:8px;
  359. color:#888;
  360. padding:3px;
  361. margin-bottom:-10px;
  362. margin-top:2px;
  363. border-top: 1px solid #f5f5f5;
  364. opacity:0;
  365. background:#fff;
  366. {block:PermalinkPage}
  367. display:none;
  368. {/block:PermalinkPage}
  369. -webkit-transition: all 0.8s ease-in-out;
  370. -moz-transition: all 0.8s ease-in-out;}
  371.  
  372. #posts:hover .info {
  373. opacity:1;
  374. -webkit-transition: all 0.8s ease-in-out;
  375. -moz-transition: all 0.8s ease-in-out;}
  376. #posts:hover .infotext {
  377. opacity:1;
  378. -webkit-transition: all 0.8s ease-in-out;
  379. -moz-transition: all 0.8s ease-in-out;}
  380.  
  381. #infoperm{
  382. font-family: calibri;
  383. font-size:9px;
  384. text-transform:uppercase;
  385. letter-spacing:0px;
  386. text-align:left;
  387. margin-top:10px;
  388. padding-left: 13px;
  389. padding-right: 13px;
  390. padding-top: 8px;
  391. padding-bottom: 8px;
  392. background-color: #f9f9f9;
  393. {block:permalinkpage}width:475px;{/block:permalinkpage}}
  394.  
  395. #tagperm{
  396. font-family:calibri;
  397. text-transform:normal;
  398. font-size:9px;
  399. letter-spacing: 1px;
  400. text-align:left;
  401. margin-top: 3px;
  402. padding-top: 3px;
  403. padding-bottom: 5px;
  404. background-color: #f8f8f8;}
  405.  
  406. #tagperm a {color:hyperlinks};
  407. #tagperm a:hover {color:{color:hyperlinks hover};}
  408.  
  409. .pnotes {
  410. background:transparent;
  411. max-height:300px;
  412. width:500px;
  413. text-align: left;
  414. overflow:auto;
  415. line-height:15px;
  416. padding:5px;
  417. margin-left: -20px;}
  418.  
  419. .pnotes img{width:16px;}
  420.  
  421. .pnotes li{list-style-type:none; border-bottom: 1px solid #ebebeb;padding:4px;margin-right: 20px;margin-bottom:2px;}
  422.  
  423. ol.notes {margin: 25px 0px;}
  424.  
  425. img.avatar {
  426. vertical-align: -4px;
  427. width: 16px;
  428. height: 16px;
  429. padding: 1px;}
  430.  
  431. .posttitle{
  432. color:{color:posts title};
  433. font-family: cambria;
  434. font-style:oblique;
  435. text-transform: lowercase;
  436. letter-spacing: -1px;
  437. line-height: 100%;
  438. text-align:justify;
  439. padding:9px;
  440. border-bottom: 1px solid #f5f5f5;
  441. font-size:15px;
  442. {block:permalinkpage}
  443. font-size:23px;
  444. {/block:permalinkpage}}
  445.  
  446. #asker {
  447. color:{color:posts title};
  448. font-family:libre baskerville;
  449. font-style:oblique;
  450. text-transform: lowercase;
  451. letter-spacing: 0px;
  452. line-height: 100%;
  453. text-align:left;
  454. padding:7px;
  455. font-size:15px;
  456. -webkit-transition: all 0.8s ease-in-out;
  457. -moz-transition: all 0.8s ease-in-out;}
  458.  
  459. #asker img{width:30px;}
  460.  
  461. #questions {
  462. text-align:justify;
  463. color: {color:text};
  464. padding:10px;
  465. font-family:cambria;
  466. font-style:oblique;
  467. font-size:10px;
  468. overflow:auto;
  469. background: #f8f8f8;
  470. margin-top:0px;
  471. border: 3px double #fff;
  472. -webkit-transition: all 0.8s ease-in-out;
  473. -moz-transition: all 0.8s ease-in-out;}
  474.  
  475. #asker a {color:{color:posts title};
  476. -webkit-transition: all 0.8s ease-in-out;
  477. -moz-transition: all 0.8s ease-in-out;}
  478.  
  479. #quote {
  480. font-family: libre baskerville;
  481. font-style:oblique;
  482. background:{color:quote bg};
  483. font-size: 12px;
  484. letter-spacing:1px;
  485. line-height: 100%;
  486. padding: 18px;
  487. text-align:justify;
  488. border: 6px double #fff;}
  489.  
  490. #source {font-size: 9px; text-align: right;font-family:calibri;}
  491.  
  492. .label {color:{color:bold};font-weight:bold;font-size:9px;text-transform:uppercase;}
  493. ul.chat{margin-bottom:0px;margin-top:0px;padding:0px;}
  494. .chat li{
  495. list-style-type: none;
  496. margin-top:2px;
  497. padding:8px;
  498. background-color:{color:caption bg};
  499. border-bottom: 2px solid #f5f5f5;}
  500.  
  501. .audio {height:47px;margin-bottom:23px;}
  502. .audio-player{height:26px;width:26px;border:3px double #eee; margin-top: 16px; margin-left: 16px;overflow:hidden;opacity:0.6; position:absolute; z-index:2; }
  503. .audio-album { position:absolute; width:45px; border: 3px double #fff;background:#efefef;padding:7px;}
  504. .audio-info { height: 30px;margin-left:70px;padding:19px 10px 15px 15px;text-align:left; font-family:calibri;font-size:9px;line-height:110%;background-color:#fafafa;}
  505.  
  506. #s-m-t-tooltip {
  507. display: block;
  508. background: #666;
  509. font-size: 8px;
  510. font-family: calibri;
  511. letter-spacing: 1px;
  512. text-transform: uppercase;
  513. line-height:100%;
  514. color: #fff;
  515. text-align: center;
  516. margin-left: 18px;
  517. padding:4px;
  518. min-width: 40px;
  519. max-width: 200px;
  520. z-index: 99;}
  521.  
  522. #cr{font-size:10px;right:15px;bottom:15px;position:fixed;font-family:calibri;letter-spacing:1px;background:#f7f7f7;padding: 2px 5px 3px 5px;border-radius:3px;z-index:99;}
  523. a.cr {color:#bbb;}
  524.  
  525.  
  526. </style>
  527.  
  528. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  529. <script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  530. <script type="text/javascript">
  531. $(window).load(function () {
  532. $('#entry').masonry({
  533. itemSelector : "#posts",
  534. },
  535. function() { $('#entry').masonry({ appendedContent: $(this) }); },
  536. // trigger Masonry as a callback
  537. function( newElements ) {
  538. var $newElems = $( newElements ).css({ opacity: 0 });
  539. // ensure that images load before adding to masonry layout
  540. $newElems.imagesLoaded(function(){
  541. $newElems.animate({ opacity: 1 });
  542. $container.masonry( 'appended', $newElems, true );
  543. });
  544. }
  545. );
  546. });
  547. </script>
  548. <body>
  549.  
  550. <div id="border"></div>
  551. <div id="content">
  552. <div id="sidebar">
  553. <div id="sidebarimage"><img src="{image:picture}"></div>
  554. <div id="description">
  555. {block:Description}{Description}{/block:Description}
  556. </div>
  557.  
  558. <div id="navigation">
  559. <a class="links" href="/">home</a><a class="links" href="/ask">ask</a>{block:ifLink1}<a class="links" href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}{block:ifLink2}<a class="links" href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}{block:ifLink3}<a class="links" href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}{block:ifLink4}<a class="links" href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}
  560. </div>
  561. <div id="pagination">
  562. {block:Pagination}
  563. {block:PreviousPage} - <a href="{PreviousPage}">newer </a>{/block:PreviousPage} - {CurrentPage} of {TotalPages} - {block:NextPage}<a href="{NextPage}"> older</a> - {/block:NextPage}
  564. {/block:Pagination}
  565. </div>
  566.  
  567. </div></div>
  568.  
  569. <div id="entry">
  570. {block:Posts}
  571. <div id="posts">
  572.  
  573. {block:Text}
  574. {block:Title}
  575. <div class="posttitle">{Title}</div>
  576. {/block:Title}
  577. <div id="text">{Body}</div>
  578. <div class="infotext">
  579. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  580. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  581. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  582. {/block:Text}
  583.  
  584. {block:Link}
  585. <a href="{URL}" class="link" {Target}><div class="posttitle">{Name} &rarr;</div></a>
  586. {block:Description}<div id="text">{Description}<br/></div>{/block:Description}
  587. <div class="infotext">
  588. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  589. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  590. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  591. {block:Link}
  592.  
  593. {block:Photo}
  594. {block:indexpage}
  595. <div class="info">
  596. {block:Date}
  597. <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{Permalink}" title="permalink">{Month} {DayofMonth} at {24Hour}:{Minutes}</a></span>{/block:Date}
  598. {block:RebloggedFrom}<br>rebloged from <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogParentURL}">{ReblogParentName}</a></span>
  599. <br>posted by <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogRootURL}">{ReblogRootName}</a></span>{/block:RebloggedFrom}
  600. {block:NoteCount}<br> with {NoteCount} notes{/block:NoteCount}<br>
  601. <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogURL}" title="reblog">reblog</a></span>
  602. {block:HasTags}<span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogURL}" title="reblog"><a href="{TagURL}" title="{block:Tags} #{Tag}{/block:Tags}">Tags</a></span>{/block:HasTags}</div>
  603. <center><a href="{PhotoURL-HighRes}" target="_blank"><img src="{PhotoURL-500}" style="{block:if3columns200}max-width:200px;{/block:if3columns200}{block:if2columns200}max-width:200px;{/block:if2columns200}"/></a></center>
  604. {block:ifcaption}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:ifcaption}
  605. {/block:indexpage}
  606. {block:permalinkpage}
  607. <center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" style="max-width:500px;">{LinkCloseTag}</center>
  608. {block:Caption}<br><div id="caption">{Caption}</div>{/block:Caption}
  609. {/block:permalinkpage}
  610. {/block:Photo}
  611.  
  612. {block:Photoset}
  613. {block:indexpage}
  614. <div class="info">
  615. {block:Date}
  616. <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{Permalink}" title="permalink">{Month} {DayofMonth} at {24Hour}:{Minutes}</a></span>{/block:Date}
  617. {block:RebloggedFrom}<br>rebloged from <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogParentURL}">{ReblogParentName}</a></span>
  618. <br>posted by <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogRootURL}">{ReblogRootName}</a></span>{/block:RebloggedFrom}
  619. {block:NoteCount}<br> with {NoteCount} notes{/block:NoteCount}<br>
  620. <span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogURL}" title="reblog">reblog</a></span>
  621. {block:HasTags}<span style="background:#fff; padding:1px 3px 1px 3px;color:#666;"><a href="{ReblogURL}" title="reblog"><a href="{TagURL}" title="{block:Tags} #{Tag}{/block:Tags}">Tags</a></span>{/block:HasTags}</div>
  622. <center>{Photoset-500}</center>
  623. {block:ifcaption}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:ifcaption}
  624. {/block:indexpage}
  625. {block:permalinkpage}
  626. <center>{Photoset-500}</center>
  627. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}
  628. {/block:permalinkpage}
  629. {/block:Photoset}
  630.  
  631. {block:Quote}
  632. <div id="quote">{Quote}<br><div id="source">---{Source}</small></div></div>
  633. <div class="infotext">
  634. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  635. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  636. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  637. {/block:Quote}
  638.  
  639. {block:Chat}
  640. {block:Title}<div class="posttitle">{Title}</div>{/block:Title}
  641. <ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span> {/block:Label}{Line}{/block:Lines}</li></ul>
  642. {/block:Label}
  643. <div class="infotext">
  644. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  645. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  646. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  647. {/block:Chat}
  648.  
  649. {block:Audio}
  650. <div class="audio">
  651. {block:AlbumArt}<img class="audio-album" src="{AlbumArtURL}" style="width:45px;">{/block:AlbumArt}
  652. <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  653. <div class="audio-info">
  654. {block:TrackName} <div style="font-family:cambria;font-style:oblique; font-size:12px;">{TrackName}</div><br>{/block:TrackName}
  655. {block:PlayCount} {FormattedPlayCount} plays<br>{/block:PlayCount}
  656. </div></div>
  657. {block:ifcaption}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:ifcaption}
  658. <div class="infotext">
  659. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  660. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  661. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  662. {/block:Audio}
  663.  
  664. {block:Video}
  665. {block:if2columns400}{Video-400}{/block:if2columns400}{block:if3columns250}{Video-250}{/block:if3columns250}{block:if2columns250}{Video-250}{/block:if2columns250}{block:indexpage}{block:if250px}{Video-250}{/block:if250px}{block:if400px}{Video-400}{/block:if400px}{block:if500px}{Video-500}{/block:if500px}
  666. {block:ifcaption}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:ifcaption}
  667. <div class="infotext">
  668. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  669. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  670. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  671. {/block:indexpage}
  672. {block:permalinkpage}
  673. <center>{Video-500}</center>
  674. {block:Caption}{Caption}{/block:Caption}
  675. {/block:permalinkpage}
  676. {block:Video}
  677.  
  678. {block:Answer}
  679. <div id="asker"><img src="{AskerPortraitURL-30}" style="vertical-align:-10px;border-right:1px solid #f3f3f3;"> {Asker}</div><div id="questions">{Question}</div><div id="text">{Answer}</div>
  680. <div class="infotext">
  681. {block:Date}<a href="{Permalink}" title="permalink">{DayofMonth}/{MonthNumber}/{ShortYear} </a> {/block:Date}
  682. {block:RebloggedFrom} · <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> · <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>{/block:RebloggedFrom} {block:NoteCount} &middot; {NoteCount}{/block:NoteCount} &middot; <a href="{ReblogURL}" title="reblog">reblog</a>
  683. {block:HasTags} &middot; <a title="{block:Tags} #{Tag}{/block:Tags}">Tags</a>{/block:HasTags}</div>
  684. {/block:Answer}
  685.  
  686. {block:permalinkpage}
  687. <div id="infoperm">
  688. {block:Date}{Month} {DayOfMonth}, {Year} at {24Hour}:{Minutes}{/block:Date}
  689. {block:RebloggedFrom} / <b>via:</b> <a href="{ReblogParentURL}">{ReblogParentName}</a> {/block:RebloggedFrom}
  690. {block:ContentSource} / <b>source:</b> <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}
  691.  
  692. {block:HasTags}
  693. <div id="tagperm">
  694. <b>Tagged as:</b>{block:Tags} <a href="{TagURL}"> <small>#</small>{Tag}</a> {/block:Tags}</div>{/block:HasTags} </div>
  695. {block:NoteCount}<p>{NoteCountWithLabel}{/block:NoteCount}
  696.  
  697. <div class="pnotes">
  698. {block:PostNotes}
  699. {PostNotes-16}
  700. {/block:PostNotes}
  701.  
  702. </div>{/block:permalinkpage}</div>
  703. {/block:Posts}
  704. </div>
  705.  
  706.  
  707. {block:ifinfinitescroll}
  708. {block:indexpage}
  709. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  710. <script src="jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
  711. <script src="/jquery.masonry.min.js" type="text/javascript"></script>
  712. <script src="/jquery.infinitescroll.min.js" type="text/javascript" ></script>
  713. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  714. <script type="text/javascript">
  715. $(document).ready(function() {
  716. $('iframe.photoset').each(function() {
  717. var i = this;
  718. $(i).attr("onload", "ps_resize(this)");
  719. var s = $(i).attr("src");
  720. s = s.replace(/\/500\//, "/200/");
  721. $(i).attr("src", s);
  722. });
  723. $(function(){
  724. var $container = $('#entry');
  725. $container.imagesLoaded(function(){
  726. $container.masonry({
  727. itemSelector: '#posts',
  728. });
  729. });
  730. $container.infinitescroll({
  731. navSelector : '#page-nav',
  732. nextSelector : '#page-nav a',
  733. itemSelector : '#posts',
  734. loading: {
  735. finishedMsg: '~ THE END ~',
  736. img: '',
  737. text: '....'
  738. }
  739. },
  740. function( newElements ) {
  741. $(newElements).find('iframe.photoset').each(function() {
  742. var i = this;
  743. $(i).attr("onload", "ps_resize(this)");
  744. var s = $(i).attr("src");
  745. s = s.replace(/\/500\//, "/200/");
  746. $(i).attr("src", s);
  747. });
  748. var $newElems = $( newElements ).css({ opacity: 0 });
  749. $newElems.imagesLoaded(function(){
  750. $newElems.animate({ opacity: 1 });
  751. $container.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  752. });
  753. }
  754. );
  755. });
  756. });
  757.  
  758. function ps_resize(i) {
  759. $(i).contents().find("body").imagesLoaded(function() {
  760. $(i).attr("width", 200);
  761. $(i).attr("height", $(this).height());
  762. var $container = $('#entry');
  763. $container.imagesLoaded(function(){
  764. $container.masonry({
  765. itemSelector: '#posts',
  766. });
  767. });
  768. });
  769. return false;
  770. }
  771. </script>
  772. <script type="text/javascript">
  773. (function($, undefined) {
  774. $.extend($.infinitescroll.prototype,{
  775. _callback_masonry: function infscr_callback_masonry (newElements) {
  776. $(this).masonry('appended',$(newElements));
  777. }
  778. });
  779. })(jQuery);
  780. </script>
  781.  
  782. {/block:indexpage}
  783. {/block:ifinfinitescroll}
  784.  
  785.  
  786.  
  787. </body>
  788. <div id="cr"><center><a href="http://soonjunthemes.tumblr.com/" class="cr" title="theme created by soonjun"> theme. </a></div></div>
  789. </html>
Advertisement
Add Comment
Please, Sign In to add comment