API tools faq
paste
Advertisement
Ditasaur

Hye Theme

Ditasaur
Jul 5th, 2012
30,057
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 31.63 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5.  
  6. <!-- HYE THEME BY RAMYEONS // http://ramyeons.tumblr.com / http://hobakjeon.tumblr.com
  7.  
  8. ---------------------RULES--------------------------------
  9.  
  10. *DO NOT USE MY THEME CODES AS BASE CODES FOR YOUR OWN THEME
  11. *DO NOT CLAIM AS YOUR OWN OR I WILL HUNT YOU DOWN
  12. *DO NOT BREAK ANY RULES OR YOU WILL BE REPORTED
  13. *YOU MAY EDIT THIS THEME, BUT LEAVE THE CREDITS ALONE
  14. *DO NOT TAKE MY CREDITS OUT
  15.  
  16. ----------------------FAQ---------------------------------
  17. 1. I will not help with customizing my themes or other themes.
  18. 2. Check ALL of the appearance options before asking a question.
  19. 3. I do not compile or give any codes for anyone, im not a coding machine.
  20. 4. I do not take theme requests no matter how much you beg.
  21. 5. My themes are not means to be used as base codes for anything.
  22. 6. If you do not want infinite scrolling, just uncheck it.
  23. 7. If your infinite scrolling is not working, thats because you have a SCM music player.
  24. 8. To find the install link, go to the first post of the live previews.
  25. 9. For more questions, please go to http://ramyeons.tumblr.com and visit the FAQ links.
  26.  
  27.  
  28. -->
  29.  
  30.  
  31. <head>
  32. <title>{Title}</title>
  33. <link rel="shortcut icon" href="{Favicon}" />
  34. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  35.  
  36. {block:Description}
  37. <meta name="description" content="{MetaDescription}"/>
  38. {/block:Description}
  39.  
  40.  
  41. <script type="text/javascript">$(document).ready(function(){$( '.content' ).fadeIn("slow");});</script>
  42.  
  43. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/BH7lio0yf/jquery.js"></script>
  44. <script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
  45.  
  46. <script type="text/javascript" charset="utf-8">
  47. var $j = jQuery.noConflict();
  48. $j(function() {
  49. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  50. $j("img").lazyload({
  51. placeholder : "",
  52. effect: "fadeIn",
  53. });
  54. });
  55. </script>
  56.  
  57.  
  58. <!--BASIC FLUFF-->
  59.  
  60. <meta name="if:500px posts" content="0"/>
  61. <meta name="if:400px posts" content="1"/>
  62. <meta name="if:250px posts" content="0"/>
  63. <meta name="if:Image Opacity" content="1"/>
  64. <meta name="if:Cute Cursor" content="1"/>
  65. <meta name="if:Infinite Scrolling" content="1"/>
  66. <meta name="if:Title Underline" content="1"/>
  67. <meta name="if:Show Tags On Post Hover" content="1"/>
  68. <meta name="if:Show Reblog Button On Perm Hover" content="1"/>
  69. <meta name="if:Show Desc On Hover" content="1"/>
  70. <meta name="if:Pixel Text" content="1"/>
  71.  
  72.  
  73. <meta name="text:Custom Header Text" content="alone in the dead of night"/>
  74. <meta name="text:Custom Header Text Hover" content="where should i go?"/>
  75. <meta name="text:Other Music Player Codes" content=""/>
  76. <meta name="text:Billy Music Player Codes" content=""/>
  77. <meta name="text:Song 1 Name" content=""/>
  78. <meta name="text:Song 1 Artist" content=""/>
  79. <meta name="text:Song 2 Name" content=""/>
  80. <meta name="text:Song 2 Artist" content=""/>
  81. <meta name="text:Song 3 Name" content=""/>
  82. <meta name="text:Song 3 Artist" content=""/>
  83. <meta name="text:Song 4 Name" content=""/>
  84. <meta name="text:Song 4 Artist" content=""/>
  85. <meta name="text:Song 5 Name" content=""/>
  86. <meta name="text:Song 5 Artist" content=""/>
  87. <meta name="text:Link 1" content=""/>
  88. <meta name="text:Link 1 URL" content=""/>
  89. <meta name="text:Link 2" content=""/>
  90. <meta name="text:Link 2 URL" content=""/>
  91. <meta name="text:Link 3" content=""/>
  92. <meta name="text:Link 3 URL" content=""/>
  93. <meta name="text:Link 4" content=""/>
  94. <meta name="text:Link 4 URL" content=""/>
  95. <meta name="text:Link 5" content=""/>
  96. <meta name="text:Link 5 URL" content=""/>
  97.  
  98.  
  99. <meta name="image:Background IMG" content="http://static.tumblr.com/iuggpng/7nbm6ltvn/lightpaperfibers.png"/>
  100. <meta name="image:Sidebar" content="http://static.tumblr.com/iuggpng/Wlvm6lwcn/hyesidebar.jpg"/>
  101. <meta name="image:Post Wrap" content="http://static.tumblr.com/iuggpng/gk2m6lwcd/woodsat.png"/>
  102.  
  103.  
  104.  
  105. <meta name="color:Scrollbar" content="#ccc"/>
  106. <meta name="color:Background" content="#eee"/>
  107. <meta name="color:Posts BG" content="#fff"/>
  108. <meta name="color:Link" content="#fdc6b3"/>
  109. <meta name="color:Link Hover" content="#aaa"/>
  110. <meta name="color:Link Hover Underline" content="#eee"/>
  111. <meta name="color:Text" content="#222"/>
  112. <meta name="color:Post Titles" content="#aaa"/>
  113. <meta name="color:Chat Post Name Underline" content="#aaa"/>
  114. <meta name="color:Title" content="#aaa"/>
  115. <meta name="color:Title Underline Color" content="#d3e9e5"/>
  116. <meta name="color:Title Hover Underline Color" content="#fdc6b3"/>
  117. <meta name="color:Perm BG" content="#fff"/>
  118. <meta name="color:Perm Text" content="#999"/>
  119. <meta name="color:Perm Border Color" content="#eee"/>
  120. <meta name="color:Reblog Button BG" content="#000"/>
  121. <meta name="color:Reblog Button Text" content="#fff"/>
  122. <meta name="color:Desc BG" content="#fff"/>
  123. <meta name="color:Desc Color" content="#bbb"/>
  124. <meta name="color:Desc Border" content="#eee"/>
  125. <meta name="color:Nav Background" content="#fff"/>
  126. <meta name="color:Nav Text" content="#ccc"/>
  127. <meta name="color:Nav Border" content="#eee"/>
  128. <meta name="color:Nav Text Hover" content="#c2dfda"/>
  129. <meta name="color:Nav Border Hover" content="#d3e9e5"/>
  130. <meta name="color:Sidebar IMG Inside Border" content="#fff"/>
  131. <meta name="color:Sidebar IMG Outside Border" content="#f7f7f7"/>
  132. <meta name="color:Custom Text Color" content="#000"/>
  133. <meta name="color:Custom Text BG" content="#fff"/>
  134. <meta name="color:Music Player BG" content="#fff"/>
  135. <meta name="color:Music Player Border" content="#eee"/>
  136. <meta name="color:Music Playlist BG" content="#fff"/>
  137. <meta name="color:Music Playlist Text" content="#aaa"/>
  138. <meta name="color:Music Playlist Border" content="#eee"/>
  139. <meta name="color:Music Playlist Title" content="#aaa"/>
  140. <meta name="color:Music Playlist Artist Text" content="#c2dfda"/>
  141.  
  142.  
  143.  
  144. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  145.  
  146.  
  147. <style type="text/css">
  148. {CustomCSS}
  149. ::-webkit-scrollbar-thumb:vertical {background-color:{color:Scrollbar};height:10px; border:3px solid white;}
  150.  
  151. ::-webkit-scrollbar {height:0px;width:10px;background-color:white;}
  152.  
  153.  
  154. iframe#tumblr_controls {
  155. right:3px !important;
  156. position: fixed !important;
  157. -webkit-transition: opacity 0.7s linear;
  158. opacity: 0.7;
  159. -webkit-transition: all 0.8s ease-out;
  160. -moz-transition: all 0.8s ease-out;
  161. transition: all 0.8s ease-out;
  162. }
  163.  
  164. iframe#tumblr_controls:hover {
  165. -webkit-transition: opacity 0.7s linear;
  166. opacity: 1;
  167. -webkit-transition: all 0.4s ease-out;
  168. -moz-transition: all 0.4s ease-out;
  169. transition: all 0.4s ease-out;
  170. }
  171.  
  172. body{
  173. background-image:url("{image:Background IMG}");
  174. background-color:{color:Background};
  175. background-repeat:repeat;
  176. background-attachment:fixed;
  177. color:{color:Text};
  178. {block:ifnotpixeltext}
  179. font-family:helevtica new;
  180. font-size:9px;
  181. {/block:ifnotpixeltext}
  182.  
  183. {block:ifpixeltext}
  184. font-family:tinytots;
  185. font-size:8px;
  186. {/block:ifpixeltext}
  187.  
  188. {block:ifcutecursor}cursor: url(http://i39.tinypic.com/hwd9xi.png), progress !important;{/block:ifcutecursor}
  189. }
  190.  
  191. a, a:link, a:visited, a:active{
  192. color:{color:Link};
  193. z-index:999;
  194. border-bottom:0px solid #eee;
  195. padding-bottom:10px;
  196. text-decoration:none;
  197. letter-spacing:1px;
  198. -webkit-transition: all 0.4s ease-out;
  199. -moz-transition: all 0.4s ease-out;
  200. transition: all 0.4s ease-out;
  201. }
  202.  
  203. a:hover {
  204. color:{color:Link Hover};
  205. border-bottom:1px solid {color:Link Hover Underline};
  206. padding-bottom:1px;
  207. text-decoration:none;
  208. {block:ifcutecursor} cursor: url(http://i39.tinypic.com/hwd9xi.png), progress !important;{/block:ifcutecursor}
  209. -webkit-transition: all 0.4s ease-out;
  210. -moz-transition: all 0.4s ease-out;
  211. transition: all 0.4s ease-out;
  212. }
  213.  
  214.  
  215. #posts {
  216. {block:ifcustomheadertext}margin-top:50px;{/block:ifcustomheadertext}
  217. {block:ifnotcustomheadertext}margin-top:16px;{/block:ifnotcustomheadertext}
  218. margin-left:462px;
  219.  
  220.  
  221. }
  222.  
  223. .posteu {
  224. {block:PermalinkPage}width:500px;{/block:PermalinkPage}
  225. {block:IndexPage}{block:if500pxposts}width:500px;{/block:if500pxposts}
  226. {block:if400pxposts}width:400px;{/block:if400pxposts}
  227. {block:if250pxposts}width:250px;{/block:if250pxposts}{/block:IndexPage}
  228. {block:ifnotpixeltext}
  229. font-family:helevtica new;
  230. font-size:9px;
  231. {/block:ifnotpixeltext}
  232.  
  233. {block:ifpixeltext}
  234. font-family:tinytots;
  235. font-size:8px;
  236. text-transform:uppercase;
  237. {/block:ifpixeltext}
  238. height:auto;
  239. overflow:hidden;
  240. margin-bottom:22px;
  241. color:{color:Text};
  242. background-color:{color:Posts BG};
  243. padding:4px;
  244. opacity:1;
  245. -webkit-transition: all 0.4s ease-out;
  246. -moz-transition: all 0.4s ease-out;
  247. transition: all 0.4s ease-out;
  248.  
  249.  
  250. }
  251.  
  252. .jjong {
  253. padding:7px;
  254. border:1px solid {color:Posts BG};
  255. {block:ifnotpixeltext}
  256. font-family:helevtica new;
  257. font-size:9px;
  258. {/block:ifnotpixeltext}
  259.  
  260. {block:ifpixeltext}
  261. font-family:tinytots;
  262. font-size:8px;
  263. text-transform:uppercase;
  264. {/block:ifpixeltext}
  265. height:auto;
  266. overflow:hidden;
  267. color:{color:Text};
  268. background-color:{color:Posts BG};
  269. }
  270.  
  271. .title {
  272. font-family:dk;
  273. font-size:25px;
  274. line-height:18px;
  275. text-align:center;
  276. letter-spacing:3px;
  277. color:{color:Post Titles};
  278. text-transform:lowercase;
  279. }
  280.  
  281. .title a {
  282. color:{color:Post Titles};
  283. }
  284.  
  285. .linktit {
  286. font-family:dk;
  287. font-size:20px;
  288. text-align:center;
  289. background-color:transparent;
  290. letter-spacing:3px;
  291. margin-left:15px;
  292. color:{color:Post Titles};
  293. text-transform:lowercase;
  294. }
  295.  
  296.  
  297. .texts, .chat, .link, .quote, .audio{
  298. {block:ifnotpixeltext}
  299. font-family:helevtica new;
  300. font-size:9px;
  301. {/block:ifnotpixeltext}
  302.  
  303. {block:ifpixeltext}
  304. font-family:tinytots;
  305. font-size:8px;
  306. text-transform:uppercase;
  307. {/block:ifpixeltext}
  308. line-height:15px;
  309. margin-bottom:5px;
  310. margin-top:5px;
  311. color:{color:Text};
  312. letter-spacing:0px;
  313. }
  314.  
  315. {block:IndexPage}{block:ifimageopacity}img, a img {
  316. opacity:.89;
  317. }
  318.  
  319. .posteu img, .posteu a img, .photoset img, .photoset a img{
  320. opacity:.89;
  321. -webkit-transition: all 0.4s ease-out;
  322. -moz-transition: all 0.4s ease-out;
  323. transition: all 0.4s ease-out;
  324. {block:PermalinkPage}max-width:500px;{/block:PermalinkPage}
  325. {block:IndexPage}{block:if500pxposts}max-width:500px;{/block:if500pxposts}
  326. {block:if400pxposts}max-width:400px;{/block:if400pxposts}
  327. {block:if250pxposts}max-width:250px;{/block:if250pxposts}{/block:IndexPage}
  328. }
  329.  
  330. .photoset {
  331. opacity:.9;
  332. -webkit-transition: all 0.4s ease-out;
  333. -moz-transition: all 0.4s ease-out;
  334. transition: all 0.4s ease-out;
  335. }
  336.  
  337. .photoset:hover {
  338. opacity:.8;
  339. -webkit-transition: all 0.4s ease-out;
  340. -moz-transition: all 0.4s ease-out;
  341. transition: all 0.4s ease-out;
  342. }
  343.  
  344. .posteu img:hover, .posteu a img:hover, .photoset img:hover, .photoset a img:hover{
  345. opacity:.7;
  346. -webkit-transition: all 0.4s ease-out;
  347. -moz-transition: all 0.4s ease-out;
  348. transition: all 0.4s ease-out;
  349. }
  350. {/block:ifimageopacity}{/block:IndexPage}
  351.  
  352. #perm {
  353. font-family:onuava;
  354. font-size:7px;
  355. text-align:center;
  356. background-color:{color:Perm BG};
  357. padding:5px;
  358. {block:PermalinkPage}opacity:0;{/block:PermalinkPage}
  359. {block:IndexPage}min-width:100px;{/block:IndexPage}
  360. position:absolute;
  361. border:1px solid {color:Perm Border Color};
  362. margin-top:0px;
  363. margin-left:10px;
  364. letter-spacing:1px;
  365. color:{color:Perm Text};
  366. opacity:0;
  367. text-transform:uppercase;
  368. -webkit-transition: all 0.8s ease-out;
  369. -moz-transition: all 0.8s ease-out;
  370. transition: all 0.8s ease-out;
  371. }
  372.  
  373. {block:ifshowtagsonposthover}#tags {
  374. font-family:onuava;
  375. font-size:7px;
  376. background-color:{color:Perm BG};
  377. padding:5px;
  378. {block:PermalinkPage}opacity:0;{/block:PermalinkPage}
  379. {block:IndexPage}max-width:230px;{/block:IndexPage}
  380. position:absolute;
  381. border:1px solid {color:Perm Border Color};
  382. margin-top:0px;
  383. margin-left:10px;
  384. letter-spacing:1px;
  385. color:{color:Perm Text};
  386. opacity:0;
  387. overflow:auto;
  388. max-height:15px;
  389. text-transform:uppercase;
  390. -webkit-transition: all 0.8s ease-out;
  391. -moz-transition: all 0.8s ease-out;
  392. transition: all 0.8s ease-out;
  393. }
  394. {/block:ifshowtagsonposthover}
  395.  
  396.  
  397. #reblog {
  398. position:absolute;
  399. background-color:{color:Reblog Button BG};
  400. {block:ifnotshowreblogbuttononpermhover}opacity:1;{/block:ifnotshowreblogbuttononpermhover}
  401. {block:ifshowreblogbuttononpermhover}opacity:0;{/block:ifshowreblogbuttononpermhover}
  402. color:{color:Reblog Button Text};
  403. padding:3px;
  404. margin-top:-30px;
  405. -webkit-transition: all 0.8s ease-out;
  406. -moz-transition: all 0.8s ease-out;
  407. transition: all 0.8s ease-out;
  408. }
  409.  
  410. {block:ifshowreblogbuttononpermhover}#reblog:hover {
  411. padding-left:30px;
  412. }
  413. {/block:ifshowreblogbuttononpermhover}
  414.  
  415. #reblog a {
  416. color:{color:Reblog Button Text};
  417. }
  418.  
  419. #perm a, #tags a {
  420. color:{color:Perm Text};
  421. }
  422.  
  423.  
  424. {block:IndexPage}.posteu:hover #perm {
  425. opacity:.9;
  426. margin-top:-32px;
  427. -webkit-transition: all 0.8s ease-out;
  428. -moz-transition: all 0.8s ease-out;
  429. transition: all 0.8s ease-out;
  430. }
  431.  
  432. {block:ifshowreblogbuttononpermhover}#perm:hover #reblog {
  433. opacity:.9;
  434. -webkit-transition: all 0.8s ease-out;
  435. -moz-transition: all 0.8s ease-out;
  436. transition: all 0.8s ease-out;
  437. }{/block:ifshowreblogbuttononpermhover}
  438.  
  439. {block:ifshowtagsonposthover}.posteu:hover #tags {
  440. opacity:.9;
  441. margin-top:-32px;
  442. margin-left:145px;
  443. -webkit-transition: all 0.8s ease-out;
  444. -moz-transition: all 0.8s ease-out;
  445. transition: all 0.8s ease-out;
  446. }{/block:ifshowtagsonposthover}
  447.  
  448. {/block:IndexPage}
  449.  
  450. #permalink {
  451. display:block;
  452. width:500px;
  453. padding:5px;
  454. height:auto;
  455. color:{color:Text};
  456.  
  457. }
  458.  
  459. #taemin {
  460. display:block;
  461. width:500px;
  462. padding:0px;
  463. }
  464.  
  465. #askpic {
  466. margin-right:5px;
  467. float:left;
  468. -moz-border-radius:100px;
  469. border-radius:100px;
  470. }
  471.  
  472.  
  473. li, ul {
  474. list-style:hiragana;
  475. margin-left:-5px;
  476. }
  477.  
  478. @font-face {font-family: "tinytots";src: url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf');}
  479.  
  480. @font-face {font-family: "silkscreen";src: url('http://static.tumblr.com/qbwrk8v/zmWlpdkl0/slkscr.ttf');}
  481.  
  482. @font-face {font-family: "print";src: url('http://static.tumblr.com/iuggpng/oQfm4mzne/princ___.ttf');}
  483.  
  484. @font-face {font-family: "open sans";src: url('http://static.tumblr.com/iuggpng/jrXm0dlyf/opensans-condlight.ttf');}
  485.  
  486. @font-face {font-family: "dk";src: url('http://static.tumblr.com/iuggpng/XaZm5hhme/dk_pimpernel.ttf');}
  487.  
  488. @font-face {font-family: "sign";src: url('http://static.tumblr.com/iuggpng/59bm5hhnc/sign-handwriting_demo-version.ttf');}
  489.  
  490. .trans1, #trans1 {
  491. -webkit-transition: all 1s ease-out;
  492. -moz-transition: all 1s ease-out;
  493. transition: all 1s ease-out;
  494. }
  495.  
  496. #seohyun {
  497. {block:PermalinkPage}width:565px;{/block:PermalinkPage}
  498. {block:IndexPage}{block:if500pxposts}width:565px;{/block:if500pxposts}
  499. {block:if400pxposts}width:465px;{/block:if400pxposts}
  500. {block:if250pxposts}width:315px;{/block:if250pxposts}{/block:IndexPage}
  501. background-image:url({image:Post Wrap});
  502. opacity:.81;
  503. height:100%;
  504. position:fixed;
  505. top:0px;
  506. left:440px;
  507. z-index:-999;
  508. }
  509.  
  510. #custom {
  511. background-color:{color:Custom Text BG};
  512. {block:PermalinkPage}width:580px;{/block:PermalinkPage}
  513. {block:IndexPage}{block:if500pxposts}width:580px;{/block:if500pxposts}
  514. {block:if400pxposts}width:480px;{/block:if400pxposts}
  515. {block:if250pxposts}width:330px;{/block:if250pxposts}{/block:IndexPage}
  516. padding:5px;
  517. top:-35px;
  518. opacity:.68;
  519. padding-top:10px;
  520. left:430px;
  521. position:fixed;
  522. z-index:999;
  523. font-family:arial;
  524. color:{color:Custom Text Color};
  525. font-size:15px;
  526. text-align:center;
  527. letter-spacing:3px;
  528. }
  529.  
  530. #custom:hover {
  531. top:-1px;
  532. }
  533.  
  534. #eunhyuk {
  535. top:220px;
  536. left:140px;
  537. position:fixed;
  538. }
  539.  
  540. #nav {
  541. position:absolute;
  542. margin-left:200px;
  543. margin-top:45px;
  544. }
  545.  
  546. #links {
  547. display:block;
  548. font-family:consolas;
  549. font-size:8px;
  550. text-transform:uppercase;
  551. background-color:{color:Nav Background};
  552. border:1px solid {color:Nav Border};
  553. padding:1px;
  554. padding-left:2px;
  555. padding-right:2px;
  556. margin-bottom:3px;
  557. width:75px;
  558. }
  559.  
  560. #links:hover {
  561. color:{color:Nav Text Hover};
  562. border-left:15px solid {color:Nav Border Hover};
  563. border-right:1px solid {color:Nav Border Hover};
  564. border-top:1px solid {color:Nav Border Hover};
  565. border-bottom:1px solid {color:Nav Border Hover};
  566. }
  567.  
  568. #nav a {
  569. color:{color:Nav Text};
  570. }
  571.  
  572. #main {
  573. padding:4px;
  574. background-color:{color:Nav Background};
  575. border:1px solid {color:Nav Border};
  576. position:absolute;
  577. margin-left:200px;
  578. margin-top:10px;
  579. width:70px;
  580. }
  581.  
  582. #main img{
  583. opacity:.3;
  584. }
  585.  
  586. #main a:hover {
  587. border-bottom:0px solid #eee;
  588. }
  589.  
  590.  
  591. #image {
  592. width:190px;
  593. height:150px;
  594. overflow:hidden;
  595. -webkit-transition: all 0.8s ease-out;
  596. -moz-transition: all 0.8s ease-out;
  597. transition: all 0.8s ease-out;
  598. }
  599.  
  600. {block:ifshowdesconhover}#image:hover #desc {
  601. margin-left:15px;
  602. -webkit-transition: all 0.8s ease-out;
  603. -moz-transition: all 0.8s ease-out;
  604. transition: all 0.8s ease-out;
  605. }{/block:ifshowdesconhover}
  606.  
  607.  
  608. #desc {
  609. font-family:tinytots; font-size:8px; text-transform:uppercase; width:145px;
  610. margin-top:-105px;
  611. z-index:999;
  612. opacity:.9;
  613. {block:ifshowdesconhover}margin-left:-180px;{/block:ifshowdesconhover}
  614. {block:ifnotshowdesconhover}margin-left:15px;{/block:ifnotshowdesconhover}
  615. background-color:{color:Desc BG};
  616. padding:6px;
  617. color:{color:Desc Color};
  618. border:1px solid {color:Desc Border};
  619. -webkit-transition: all 0.8s ease-out;
  620. -moz-transition: all 0.8s ease-out;
  621. transition: all 0.8s ease-out;
  622. }
  623.  
  624.  
  625. #title {
  626. font-family:print; position:absolute; margin-top:-35px; font-size:25px; letter-spacing:5px; color:{color:Title}; margin-left:19px;
  627. text-align:center; width:160px;
  628. }
  629.  
  630. #title a {
  631. letter-spacing:5px;
  632. color:{color:Title};
  633. {block:iftitleunderline}border-bottom:5px dashed {color:Title Underline Color}; {/block:iftitleunderline}
  634. padding-bottom:0px;
  635. }
  636.  
  637. {block:iftitleunderline}#title a:hover {
  638. border-bottom:5px dashed {color:Title Hover Underline Color};
  639. padding-bottom:0px;
  640. }{/block:iftitleunderline}
  641.  
  642. {block:ifbillymusicplayercodes}#tab {
  643. -moz-border-radius:0px 0px 70px 70px;
  644. border-radius:0px 0px 70px 70px;
  645. background-color:white;
  646. padding:5px;
  647. width:70px;
  648. height:7px;
  649. }
  650.  
  651. #tabaround {
  652. width:80px;
  653. -moz-border-radius:0px 0px 70px 70px;
  654. border-radius:0px 0px 70px 70px;
  655. border:1px solid #f7f7f7;
  656. position:absolute;
  657. margin-top:-17px;
  658. }
  659.  
  660. #music {
  661. overflow:hidden;
  662. width:60px;
  663. }
  664.  
  665. #tabaround:hover #playlist {
  666. opacity:1;
  667. margin-top:-15px;
  668. margin-left:90px;
  669. }
  670.  
  671.  
  672. #playlist {
  673. border:1px solid #eee;
  674. background-color:white;
  675. color:#aaa;
  676. padding:5px;
  677. font-family:consolas;
  678. letter-spacing:1px;
  679. text-transform:uppercase;
  680. width:100px;
  681. font-size:8px;
  682. position:absolute;
  683. margin-left:90px;
  684. margin-top:40px;
  685. line-height:12px;
  686. opacity:0;
  687. }
  688. {/block:ifbillymusicplayercodes}
  689.  
  690. {block:ifothermusicplayercodes}
  691. #music {
  692. position:fixed;
  693. top:0px;
  694. left:0px;
  695. width:45px;
  696. overflow:hidden;
  697. background-color:transparent;
  698. }
  699.  
  700. #boom {
  701. background-color:{color:Music Player BG};
  702. padding:15px;
  703. }
  704.  
  705. #music:hover{
  706. width:300px;
  707. }
  708.  
  709. #musicall:hover #playlistother{
  710. opacity:1;
  711. margin-top:0px;
  712. margin-left:0px;
  713. }
  714.  
  715. #player {
  716. position:absolute;
  717. margin-left:50px;
  718. margin-top:-27px;
  719. }
  720.  
  721. #playlistother {
  722. border:1px solid #eee;
  723. background-color:white;
  724. color:#aaa;
  725. padding:5px;
  726. font-family:consolas;
  727. letter-spacing:1px;
  728. text-transform:uppercase;
  729. width:150px;
  730. font-size:8px;
  731. position:absolute;
  732. margin-left:-200px;
  733. margin-top:0px;
  734. line-height:12px;
  735. opacity:0;
  736. }
  737.  
  738. {/block:ifothermusicplayercodes}
  739.  
  740. #credit {
  741. position:fixed;
  742. left:5px;
  743. top:5px;
  744. font-family:consolas;
  745. text-transform:uppercase;
  746. font-size:8px;
  747. }
  748.  
  749. #credit a {
  750. color:#222;
  751. padding-bottom:20px;
  752. border-bottom:0px dashed #aaa;
  753. }
  754.  
  755. #credit a:hover {
  756. border-bottom:1px dashed #aaa;
  757. padding-bottom:2px;
  758. }
  759.  
  760. </style>
  761.  
  762. {block:ifinfinitescrolling}<script type="text/javascript"
  763. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js">
  764. </script>
  765. <script type="text/javascript" language="javascript">
  766. $(function () {
  767. $('#scrlBotm').click(function () {
  768. $('html, body').animate({
  769. scrollTop: $(document).height()
  770. },
  771. 1500);
  772. return false;
  773. });
  774.  
  775. $('#scrlTop').click(function () {
  776. $('html, body').animate({
  777. scrollTop: '0px'
  778. },
  779. 1500);
  780. return false;
  781. });
  782. });
  783. </script>{/block:ifinfinitescrolling}
  784.  
  785.  
  786. </head>
  787. <body>
  788.  
  789. <div id="credit"><a href="http://hobakjeon.tumblr.com">☁ theme</a></div>
  790.  
  791.  
  792. {block:ifinfinitescrolling}<a id="scrlTop" title="back to top" href="#" style="position: fixed; bottom:-10px; {block:IndexPage}left:370px;{/block:IndexPage}">
  793. <div style="font-size:60px;">▲</div></a>{/block:ifinfinitescrolling}
  794.  
  795.  
  796. <div id="seohyun"></div>
  797.  
  798. {block:ifcustomheadertext}<div id="custom" class="trans1">
  799. {text:Custom Header Text Hover}
  800. <div style="margin-top:15px;">{text:Custom Header Text}</div></div>
  801. {/block:ifcustomheadertext}
  802.  
  803. <div id="eunhyuk">
  804.  
  805. <div id="title"><a href="/">{Title}</a></div>
  806.  
  807. <div id="nav">
  808. {block:iflink1}<a href="{text:Link 1 URL}" id="links">▸{text:Link 1}</a>
  809. {/block:iflink1}
  810. {block:iflink2}<a href="{text:Link 2 URL}" id="links">▸{text:Link 2}</a>
  811. {/block:iflink2}
  812. {block:iflink3}<a href="{text:Link 3 URL}" id="links">▸{text:Link 3}</a>
  813. {/block:iflink3}
  814. {block:iflink4}<a href="{text:Link 4 URL}" id="links">▸{text:Link 4}</a>
  815. {/block:iflink4}
  816. {block:iflink5}<a href="{text:Link 5 URL}" id="links">▸{text:Link 5}</a>
  817. {/block:iflink5}
  818. </div>
  819.  
  820. <div id="main">
  821.  
  822. <a title="home" href="/"><img src="http://i44.tinypic.com/2gt3q6f.gif" style="margin-left:5px;"></a>
  823.  
  824. <a title="message" href="/ask"><img src="http://i44.tinypic.com/rihipt.gif" style="margin-left:12px;"></a>
  825.  
  826. <a title="memories" href="/archive"><img src="http://i40.tinypic.com/2nl8jzr.gif" style="margin-left:12px;"></a>
  827.  
  828. </div>
  829.  
  830. <div id="image">
  831.  
  832. <img src="{image:Sidebar}" style="width:170px; background-color:{color:Sidebar IMG Inside Border}; padding:5px; border:5px solid {color:Sidebar IMG Outside Border};">
  833. <div id="desc">{Description}</div>
  834.  
  835. </div>
  836.  
  837.  
  838. {block:ifnotinfinitescrolling}
  839. {block:Pagination}<center> {block:PreviousPage}<a href="{PreviousPage}">◀</a> {/block:PreviousPage} {block:JumpPagination length="5"} {block:CurrentPage} <span class="current_page">{PageNumber}</span> {/block:CurrentPage} {block:JumpPage} <a class="jump_page" href="{URL}">{PageNumber}</a> {/block:JumpPage} {/block:JumpPagination} {block:NextPage} <a href="{NextPage}">▶</a> {/block:NextPage}</center> {/block:Pagination}{/block:ifnotinfinitescrolling}
  840.  
  841.  
  842.  
  843.  
  844.  
  845. <!----------MUSIC PLAYER // BILLY----------->
  846. {block:ifbillymusicplayercodes}{block:IndexPage}<div id="tabaround" class="trans1"><div id="tab" class="trans1"><div id="music" class="trans1">
  847. <div style="margin-left:-30px; margin-top:-2px;">{Text:Billy Music Player Codes}</div>
  848. </div></div>
  849.  
  850. {block:ifsong1name}<div id="playlist" class="trans1">
  851. <div style="font-family:open sans; color:{color:Music Playlist Title}; letter-spacing:3px; font-size:13px; text-align:center; margin-bottom:5px;">Playlist</div>
  852. <font color="{color:Music Playlist Artist Text}">{text:Song 1 Artist}</font> - {text:Song 1 Name}{/block:ifsong1name}
  853. {block:ifsong2name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 2 Artist}</font> - {text:Song 2 Name}{/block:ifsong2name}
  854. {block:ifsong3name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 3 Artist}</font> - {text:Song 3 Name}{/block:ifsong3name}
  855. {block:ifsong4name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 4 Artist}</font> - {text:Song 4 Name}{/block:ifsong4name}
  856. {block:ifsong5name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 5 Artist}</font> - {text:Song 5 Name}{/block:ifsong5name}
  857.  
  858. </div>
  859. </div>{/block:IndexPage}{/block:ifbillymusicplayercodes}
  860.  
  861. <!----------MUSIC PLAYER END // BILLY--------->
  862. </div>
  863.  
  864.  
  865. <!----------MUSIC PLAYER // OTHER----------->
  866.  
  867. {block:ifothermusicplayercodes}
  868. <div id="musicall"><div id="music" class="trans1"><img src="http://i122.photobucket.com/albums/o260/mhilka/minigifs/minigif01.gif" id="boom">
  869. <div id="player">{text:Other Music Player Codes}
  870. </div></div>
  871. <div id="playlistother" class="trans1">
  872. <div style="font-family:open sans; color:{color:Music Playlist Title}; letter-spacing:3px; font-size:13px; text-align:center; margin-bottom:5px;">Playlist</div>
  873. {block:ifsong1name}<font color="{color:Music Playlist Artist Text}">{text:Song 1 Artist}</font> - {text:Song 1 Name}{/block:ifsong1name}
  874. {block:ifsong2name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 2 Artist}</font> - {text:Song 2 Name}{/block:ifsong2name}
  875. {block:ifsong3name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 3 Artist}</font> - {text:Song 3 Name}{/block:ifsong3name}
  876. {block:ifsong4name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 4 Artist}</font> - {text:Song 4 Name}{/block:ifsong4name}
  877. {block:ifsong5name}<br><font color="{color:Music Playlist Artist Text}">{text:Song 5 Artist}</font> - {text:Song 5 Name}{/block:ifsong5name}
  878.  
  879. </div>
  880.  
  881. </div>
  882. {/block:ifothermusicplayercodes}
  883.  
  884. <!----------MUSIC PLAYER END // OTHER--------->
  885.  
  886.  
  887.  
  888.  
  889.  
  890.  
  891. <div id="posts">
  892. {block:Posts}
  893.  
  894. {block:ifinfinitescrolling}<div class="autopagerize_page_element"><script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:ifinfinitescrolling}
  895.  
  896. <div class="posteu">
  897.  
  898. {block:Text}
  899. <div class="jjong">
  900. <div class="texts">
  901. {block:Title}
  902. <div class="title"><a href="{Permalink}">{Title}</a></div>
  903. {/block:Title}
  904. {Body}</div>
  905. </div>
  906. {/block:Text}
  907.  
  908.  
  909.  
  910. {block:Photo}
  911. <a href="{Permalink}"><img class="photo"
  912. {block:IndexPage}
  913. {block:if500pxposts}src="{PhotoURL-500}"{/block:if500pxposts}
  914. {block:if400pxposts}src="{PhotoURL-500}" width="400px"{/block:if400pxposts}
  915. {block:if250pxposts}src="{PhotoURL-250}"{/block:if250pxposts}
  916. {/block:IndexPage}
  917. {block:PermalinkPage}src="{PhotoURL-500}"{/block:PermalinkPage} alt="{PhotoAlt}"/></a>
  918. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
  919. {/block:Photo}
  920.  
  921.  
  922.  
  923. {block:Photoset}
  924. <div class="photoset">
  925. <a href="{Permalink}">
  926. {block:IndexPage}
  927. {block:if500pxposts}{Photoset-500}{/block:if500pxposts}
  928. {block:if400pxposts}{Photoset-400}{/block:if400pxposts}
  929. {block:if250pxposts}{Photoset-250}{/block:if250pxposts}
  930. {/block:IndexPage}
  931. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  932. </a>
  933. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}</div>
  934. {/block:Photoset}
  935.  
  936.  
  937.  
  938. {block:Quote}
  939. <div class="jjong">
  940. <div class="quote">
  941. <div style="font-size:25px; float:left; align:left; margin-right:5px;">❝</div> {Quote}
  942. {block:Source}
  943. <div class="source" style="margin-top:10px; font-family:consolas; padding-top:3px; border-top:1px solid #aaa; font-style:italic; text-align:right;">- {Source}</div>
  944. {/block:Source}
  945. </div>
  946. </div>
  947. {/block:Quote}
  948.  
  949.  
  950.  
  951. {block:Link}
  952. <div class="jjong">
  953. <div class="link">
  954. <a href="{URL}" class="linktit" {Target}>{Name}</a>
  955. {block:Description}
  956. <div class="description" style="border-left:5px solid #f1f1f1;">
  957. <div style="margin-left:10px;">{Description}</div></div>
  958. {/block:Description}
  959. </div>
  960. </div>
  961. {/block:Link}
  962.  
  963.  
  964.  
  965. {block:Chat}
  966. <div class="jjong">
  967. <div class="post chat">
  968. {block:Title}
  969. <h3><a href="{Permalink}">{Title}</a></h3>
  970. {/block:Title}
  971.  
  972. <div class="chat">
  973. {block:Lines}
  974. <div class="{Alt} user_{UserNumber}">
  975. {block:Label}
  976. <span class="label" style="border-bottom:1px solid {color:Chat Post Name Underline};">{Label}</span>
  977. {/block:Label}
  978. {Line}</div>
  979. {/block:Lines}
  980. </div>
  981. </div>
  982. </div>
  983. {/block:Chat}
  984.  
  985.  
  986.  
  987. {block:Video}
  988. <div class="video">
  989. {block:IndexPage}{block:if500pxposts}{Video-500}{/block:if500pxposts}
  990. {block:if400pxposts}{Video-400}{/block:if400pxposts}
  991. {block:if250pxposts}{Video-250}{/block:if250pxposts}{/block:IndexPage}
  992. {block:PermalinkPage}{Video-500}
  993. {block:PermalinkPage}{block:Caption}
  994. <div class="caption">{Caption}</div>
  995. {/block:Caption}{/block:PermalinkPage}
  996. </div>
  997. {/block:Video}
  998.  
  999.  
  1000. {block:Audio}
  1001. <div class="jjong">
  1002. <div class="audio">
  1003. <div style="width:100%; background-color:black;">{AudioPlayerBlack}</div>
  1004. {block:AlbumArt}<div style="float:left; margin-top:5px; margin-right:10px;">
  1005. {block:PermalinkPage}<img src="{AlbumArtURL}" width="100" style="align:left;">{/block:PermalinkPage}
  1006. {block:IndexPage}<img src="{AlbumArtURL}" width="60">{/block:IndexPage}
  1007. </div>
  1008.  
  1009. {/block:AlbumArt}
  1010. {block:Caption}
  1011. <div class="caption">
  1012.  
  1013. {block:Artist}
  1014. <p><b>ARTIST</b>: {Artist}
  1015. {/block:Artist}
  1016.  
  1017. {block:Album}
  1018. <br><b>ALBUM</b>: {Album}
  1019. {/block:Album}
  1020.  
  1021. {block:TrackName}
  1022. <br><b>TRACK</b>: {TrackName}
  1023. {/block:TrackName}
  1024.  
  1025. {block:PlayCount}
  1026. <br><b>PLAYS</b>: {FormattedPlayCount}
  1027. {/block:PlayCount}
  1028.  
  1029. {Caption}</div>
  1030. {/block:Caption}
  1031. </div>
  1032. </div>
  1033. {/block:Audio}
  1034.  
  1035.  
  1036.  
  1037. {block:Answer}
  1038. <div class="jjong">
  1039. <div class="askeu">
  1040. <div id="asku"><img src="{AskerPortraitURL-48}" id="askpic">
  1041. <div style="border-bottom:1px dashed #eee; align:right; padding-bottom:2px;">→ {Asker} whispered : {Question}</div></div>
  1042. {Answer}
  1043. </div>
  1044. </div>
  1045. {/block:Answer}
  1046.  
  1047. <!-----------PERMALINK------------->
  1048. <div id="perm"><a href="{Permalink}">{MonthNumber}.{DayOfMonth}.{ShortYear} → {NoteCountWithLabel}</a>
  1049. <div id="reblog"><a href="{ReblogURL}" target="new">Reblog ?</a></div>
  1050. </div>
  1051. {block:ifshowtagsonposthover}{block:HasTags}<div id="tags">tagged :{block:Tags}
  1052. &#160<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}{/block:ifshowtagsonposthover}
  1053.  
  1054. <!-----------PERMALINK------------->
  1055.  
  1056.  
  1057. {block:PermalinkPage}
  1058. <div style="margin-top:10px; border-left:20px solid #eee; font-family:consolas; text-transform:uppercase;">&nbsp; {DayOfWeek} {DayOfMonth}, {Year}.</div>
  1059. <div style="margin-top:5px; border-left:30px solid #ccc; font-family:consolas; text-transform:uppercase;">&nbsp; {NoteCountwithLabel}</div>
  1060. <div style="margin-top:5px; border-left:40px solid #aaa; font-family:consolas; text-transform:uppercase;">&nbsp; Via: {block:RebloggedFrom}<a href="{ReblogParentURL}" target="new">{ReblogParentName}</a>; Original: <a href="{ReblogRootURL}" target="new">{ReblogRootName}</a>{/block:RebloggedFrom}</div>
  1061. <div style="margin-top:5px; border-left:25px solid #eee; font-family:consolas; text-transform:uppercase; margin-bottom:20px;">&nbsp; Navigation: <a href="/">Home</a> | <a href="/ask">Ask</a> | <a href="/archive">Archive</a> </div>
  1062.  
  1063.  
  1064. {block:HasTags}tagged :{block:Tags}
  1065. &#160<a href="{TagURL}">#{Tag}</a>{/block:Tags}{/block:HasTags}
  1066. {PostNotes}{/block:PermalinkPage}
  1067. </div>
  1068.  
  1069.  
  1070. {/block:Posts}
  1071. {block:ifinfinitescrolling}</div>{/block:ifinfinitescrolling}
  1072. </div>
  1073. </body>
  1074. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!