jaesoonie

THEME #24 CHANYEOL

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