API tools faq
paste
jaesoonie

THEME #30

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