Advertisement
kngroo

forprecioushsh

Aug 1st, 2016
66
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.99 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!----------- BASE CODE by clumhood :> ------------>
  5.  
  6. <title>ʜᴀɴ sᴇᴏᴋ ʜᴀɴ。</title>
  7. <link rel="shortcut icon" href="http://65.media.tumblr.com/8f0a1fddc95d778273787fed97392fd3/tumblr_inline_na18ecrOjj1r5hm2z.png">
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  9. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  10.  
  11. <!----------------SCRIPTS---------------->
  12.  
  13. <link href="http://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  14. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  15. <script src="http://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  16. <script>
  17. (function($){
  18. $(document).ready(function(){
  19. $("[title]").style_my_tooltips({
  20. tip_follows_cursor:true,
  21. tip_delay_time:200,
  22. tip_fade_speed:300
  23. });
  24. });
  25. })(jQuery);
  26. </script>
  27.  
  28. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  29.  
  30. <style type="text/css">
  31.  
  32. .bottom {
  33. position:fixed;
  34. left:-500px;
  35. bottom:-300px;
  36. width:100%;
  37. height:800px;
  38. background:#fbd89b;
  39. z-index:0;
  40. transform: rotate(50deg);
  41. -ms-transform: rotate(50deg);
  42. -webkit-transform: rotate(50deg);
  43. -o-transform: rotate(50deg);
  44. -moz-transform: rotate(50deg);
  45.  
  46. }
  47.  
  48. /*---TEXT SELECTION---*/
  49.  
  50. ::selection {
  51. background: #ffc869;
  52. color: #fff;
  53. }
  54. ::-moz-selection {
  55. background: #ffc869;
  56. color: #fff;
  57. }
  58.  
  59. /*----------SCROLLBAR---------*/
  60.  
  61. ::-webkit-scrollbar {
  62. background-color: #fff;
  63. border:2px solid #f8f8f8;
  64. height:8px;
  65. width:5px;
  66. }
  67.  
  68. ::-webkit-scrollbar-thumb:vertical {
  69. background-color:#fff;
  70. height:50px;
  71. }
  72.  
  73. ::-webkit-scrollbar-thumb:horizontal {
  74. background-color:#fff;
  75. height:8px;
  76. }
  77.  
  78. /*----------TOOLTIPS---------*/
  79.  
  80. #s-m-t-tooltip {
  81. max-width:300px;
  82. margin:15px;
  83. padding:5px;
  84. border-radius:0px;
  85. background:#fff;
  86. color:#888;
  87. border-bottom-left-radius:10px;
  88. border-right:11px solid #ffc869;
  89. z-index:999999;
  90. font-size:7px;
  91. font-style:none;
  92. letter-spacing:2px;
  93. font-family:arial;
  94. text-transform:uppercase;
  95. box-shadow:1px 1px 3px rgba(0,0,0,.0);
  96. }
  97.  
  98. /*----------BASICS---------*/
  99.  
  100. body {
  101. cursor:crosshair;
  102. background:#f8f8f8;
  103. color:#000;
  104. font-family:arial;
  105. font-size:11px;
  106. line-height:150%;
  107. margin:0;
  108. text-align:left;
  109. }
  110.  
  111.  
  112. a {
  113. cursor:help;
  114. color:#000;
  115. text-transform:uppercase;
  116. text-decoration:none;
  117. }
  118.  
  119. a:hover {
  120. color:{color:links hover};
  121. transition:1s;
  122. -webkit-transition:1s;
  123. -moz-transition:1s;
  124. -o-transition:1s;
  125. }
  126.  
  127. img {
  128. opacity:1;
  129. text-decoration:none;
  130. }
  131.  
  132. h1 {
  133. font-size:14px;
  134. font-weight:bold;
  135. font-family:arial;
  136. line-height:150%;
  137. text-transform:uppercase;
  138. }
  139.  
  140. blockquote {
  141. padding-left:10px;
  142. margin:10px;
  143. border-left:1px solid #eee;
  144. }
  145.  
  146. /*----------SIDEBAR---------*/
  147.  
  148. .sidebar {
  149. position:fixed;
  150. bottom:70px;
  151. width:260px;
  152. margin-left:380px;
  153. background:#fff;
  154. }
  155.  
  156. .title {
  157. font-size:60px;
  158. color:#fff;
  159. text-transform:uppercase;
  160. font-weight:bold;
  161. margin-top:-36px;
  162. width:250px;
  163. position:fixed;
  164. }
  165.  
  166. .boop {
  167. margin-top:5px;
  168. margin-left:5px;
  169. width:250px;
  170. height:145px;
  171. }
  172.  
  173. .boop img {
  174.  
  175. width:250px;
  176. height:145px;
  177. -webkit-filter: grayscale(100%);
  178. }
  179.  
  180. .description {
  181. width:231px;
  182. text-align:justify;
  183. margin-top:0px;
  184. margin-left:9px;
  185. padding:5px;
  186. }
  187.  
  188. .links {
  189. margin-top:5px;
  190. margin-left:0px;
  191. position:fixed;
  192. width:280px;
  193. text-align:right;
  194. font-size:10px;
  195. text-transform:lowercase;
  196. }
  197.  
  198. .links a{
  199. margin-bottom:1px;
  200. display:inline-block;
  201. background:#fff;
  202. width:51.6px;
  203. height:12px;
  204. padding:1px;
  205. -webkit-transition: all 0.6s ease-in-out;
  206. -moz-transition: all 0.6s ease-in-out;
  207. -o-transition: all 0.6s ease-in-out;
  208. -ms-transition: all 0.6s ease-in-out;
  209. transition: all 0.6s ease-in-out;
  210. }
  211.  
  212. .links a:hover {
  213. background:#f8f8f8;
  214. }
  215.  
  216.  
  217. /*----------POSTS---------*/
  218.  
  219. .entries {
  220. margin-left:820px;
  221. margin-top:50px;
  222. margin-bottom:60px;
  223. width:400px;
  224. }
  225.  
  226. .posts {
  227. background:#fff;
  228. padding:5px;
  229. width:400px;
  230. margin-bottom:70px;
  231. }
  232.  
  233. /*----------PAGINATION---------*/
  234.  
  235. .jump_page {
  236. padding: 5px 5px;
  237. color:#000;
  238. font-family:century gothic;
  239. font-size:11px;
  240. text-decoration:none;
  241. margin-bottom:70px;
  242. }
  243.  
  244. .current_page, .jump_page:hover {
  245. padding: 5px 5px;
  246. color: #000;
  247. font-style:bold;
  248. font-family:century gothic;
  249. font-size:11px;
  250. text-decoration:none;
  251. margin-bottom:70px;
  252. }
  253.  
  254.  
  255. /*----------QUOTE---------*/
  256.  
  257. .quote {
  258. padding:10px;
  259. font-size:15px;
  260. }
  261.  
  262. .quotesource {
  263. padding:10px;
  264. text-align:center;
  265. }
  266.  
  267. /*----------CHAT---------*/
  268.  
  269. .chat {
  270. line-height:150%;
  271. list-style:none;
  272. }
  273.  
  274. .line.odd {
  275. padding:10px;
  276. background:#000;
  277. }
  278.  
  279. .line.even {
  280. padding:10px;
  281. }
  282.  
  283. .label {
  284. text-transform:uppercase;
  285. font-size:10px;
  286. letter-spacing:1px;
  287. font-weight:bold;
  288. }
  289.  
  290. /*----------AUDIO---------*/
  291.  
  292. .cover {
  293. position:relative;
  294. z-index:1;
  295. max-width:100px;
  296. padding:10px;
  297. float:left;
  298. }
  299.  
  300. .playbutton {
  301. width:20px;
  302. height:30px;
  303. overflow:hidden;
  304. position:relative;
  305. z-index:2;
  306.  
  307. }
  308.  
  309.  
  310. .playbox {
  311. background-color:#000;
  312. position:absolute;
  313. z-index:2;
  314. padding:15px 24px 13px 16px;
  315. margin-top:30px;
  316. margin-left:30px;
  317. opacity:0.5;
  318. }
  319.  
  320. .trackdetails {
  321. padding:10px;
  322. width:auto;
  323. height:100px;
  324. margin-top:10px;
  325. margin-left:100px;
  326. }
  327.  
  328. /*----------ASK---------*/
  329.  
  330. .question {
  331. padding:10px;
  332. background:#ffeac2;
  333. border-top-right-radius:10px;
  334. border-bottom-left-radius:10px;
  335. border-top-left-radius:10px;
  336. }
  337.  
  338.  
  339. .asker {
  340. text-transform:uppercase;
  341. }
  342.  
  343. .answer {
  344. margin:10px;
  345. }
  346.  
  347. /*----------INFO---------*/
  348.  
  349. .info {
  350. padding:10px;
  351. text-transform:uppercase;
  352. background:#fff;
  353. border-bottom:1px solid #eee;
  354. width:390px;
  355. margin-top:15px;
  356. }
  357.  
  358.  
  359. .tags {
  360. background:#f8f8f8;
  361. padding:6px;
  362. margin-top:-5px;
  363. }
  364.  
  365. .tags a {
  366. margin-right:10px;
  367. letter-spacing:1px;
  368. }
  369.  
  370. /*----------POST NOTES---------*/
  371.  
  372. ol.notes {
  373. padding:0px;
  374. margin:25px 0px 0px -10px;
  375. list-style-type:none;
  376. }
  377.  
  378. ol.notes li.note {
  379. padding:10px;
  380. }
  381.  
  382. ol.notes li.note img.avatar {
  383. vertical-align:-4px;
  384. margin-right:10px;
  385. width:16px;
  386. height:16px;
  387. }
  388.  
  389. ol.notes li.note span.action {
  390. font-weight:none;
  391. }
  392.  
  393. ol.notes li.note .answer_content {
  394. font-weight:normal;
  395. }
  396.  
  397. ol.notes li.note blockquote {
  398. padding:4px 10px;
  399. margin:10px 0px 0px 25px;
  400. }
  401.  
  402. ol.notes li.note blockquote a {
  403. text-decoration:none;
  404. }
  405.  
  406. </style>
  407. </head>
  408.  
  409. <img src="https://67.media.tumblr.com/e44632de0970574bf156c4dfcc8d04a3/tumblr_ob7scxAECH1vbzszuo1_540.png" height=230 style='position:fixed;bottom:110px;left:560px;z-index:999'/>
  410.  
  411. <div class="bottom"></div>
  412.  
  413.  
  414. <body>
  415.  
  416.  
  417. <div class="sidebar">
  418. <div class="title">EST.1990</div>
  419. <div class="boop"><img src="https://s-media-cache-ak0.pinimg.com/736x/69/d9/bf/69d9bf1d27bc94e7f2e1c37da01fee34.jpg"></div>
  420. <div class="description">&nbsp;&nbsp;&nbsp;<b>HAN SEOK HAN</b>, also known as OOO ) born OOO. He is the OOO, OOO and the OOO of the group, OOO, a co-ed idol group of five members under OOO entertainment.</div>
  421. <div class="links">
  422. <a title="001 : main" href="/"></a>
  423. <a title="002 : inbox" href="/ask"></a>
  424. <a title="003 : submit" href="/submit"></a>
  425. <a title="004 : profile" href="/about"></a>
  426. <a title="005 : credit" href="http://clumhood.tumblr.com/"></a>
  427. </div>
  428. </div>
  429.  
  430. <div class="entries">
  431.  
  432. {block:Posts}
  433. <div class="info">
  434. {block:Date}
  435. <b><i class="fa fa-clock-o" aria-hidden="true"></i> <a href="{Permalink}" title="{Month} {DayOfMonth}{DayOfMonthSuffix}">{TimeAgo}</b></a>
  436. {/block:Date}
  437.  
  438. &nbsp;&nbsp;
  439.  
  440. <i class="fa fa-retweet"></i> <a href="{ReblogURL}" target="_blank" class="details">REBLOG</a>
  441.  
  442. <font style="float:right">
  443. <a href="{Permalink}">{NoteCount} N</a>
  444. </font style>
  445.  
  446. </div>
  447. <div class="posts">
  448.  
  449.  
  450. {block:Text}
  451. <h1>{block:Title}{Title}{/block:Title}</h1>
  452. {Body}{/block:Text}
  453.  
  454.  
  455. {block:Photo}
  456. {LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  457. {block:Caption}{Caption}{/block:Caption}
  458. {/block:Photo}
  459.  
  460.  
  461. {block:Photoset}
  462. {Photoset-400}
  463. {block:Caption}{Caption}{/block:Caption}
  464. {/block:Photoset}
  465.  
  466.  
  467. {block:Quote}
  468. <div class="quote">"{Quote}"</div>
  469. {block:Source}<div class="quotesource"> — {Source}</div>
  470. {/block:Source}{/block:Quote}
  471.  
  472.  
  473. {block:Link}
  474. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  475. {block:Description}{Description}{/block:Description}
  476. {/block:Link}
  477.  
  478.  
  479. {block:Chat}
  480. {block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
  481. {/block:Chat}
  482.  
  483.  
  484. {block:Audio}
  485.  
  486. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
  487.  
  488. {block:AlbumArt}
  489. <img src="{AlbumArtURL}" class="cover">
  490. {/block:AlbumArt}
  491.  
  492.  
  493. <div class="trackdetails"><br>
  494. {block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}<br>
  495.  
  496. {block:Artist}<b>ARTIST:</b> {Artist}{/block:Artist}<br>
  497.  
  498. <b>PLAYS:</b> {FormattedPlayCount}</div>
  499.  
  500.  
  501. {block:Caption}
  502. <div class="caption">{Caption}</div>
  503. {/block:Caption}
  504. {/block:Audio}
  505.  
  506.  
  507. {block:Video}
  508. {Video-400}
  509. {block:Caption}{Caption}{/block:Caption}
  510. {/block:Video}
  511.  
  512.  
  513. {block:Answer}
  514. <div class="question">
  515. <div class="asker"><b>{Asker} said:</b></div>
  516. {Question}</div>
  517. <div class="answer">
  518. {Answer}</div>
  519. {/block:Answer}
  520.  
  521. <div class="tags">
  522. <b><i class="fa fa-floppy-o" aria-hidden="true"></i> SAVED UNDER: </b>{block:HasTags}
  523. {block:Tags}
  524. <a href="{TagURL}">{Tag}</a>
  525. {/block:Tags}
  526. {/block:HasTags}
  527. </div>
  528. </div>
  529.  
  530.  
  531. {block:PostNotes}
  532. {PostNotes}
  533. {/block:PostNotes}
  534.  
  535. {/block:Posts}
  536.  
  537. {block:ContentSource}
  538. <!---{SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  539. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  540. {/block:SourceLogo}
  541. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  542. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  543.  
  544. <div class="pagination"><center>
  545. {block:Pagination}
  546. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  547. {block:JumpPagination length="5"}
  548. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  549. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  550. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  551. {/block:Pagination}</center>
  552. </div>
  553. </body>
  554. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement