Advertisement
yoojin

Yoojin Theme 8

Jun 16th, 2013
846
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.24 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4. theme by uphorical
  5. dont steal or take off credit
  6.  
  7.  
  8. -->
  9.  
  10. <html lang="en">
  11. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  12. <html xmlns="http://www.w3.org/1999/xhtml">
  13. <head>
  14.  
  15.  
  16.  
  17.  
  18.  
  19. <script type="text/javascript"
  20. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  21.  
  22. <!--DEFAULT VARIABLES-->
  23. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  24. <meta name="color:background" content="#fff"/>
  25. <meta name="color:link" content="#777"/>
  26. <meta name="color:text" content="#777"/>
  27. <meta name="color:title" content="#333"/>
  28. <meta name="color:hover" content="#fff"/>
  29. <meta name="image:sidebar" content="http://static.tumblr.com/sutrz68/5kDmnlf6q/girl_with_sunglasses.jpg"/>
  30. <meta name="image:background" content="1"/>
  31. <meta name="text:Link One" content="/"/>
  32. <meta name="text:Link One Title" content="one"/>
  33. <meta name="text:Link Two" content=""/>
  34. <meta name="text:Link Two Title" content="two"/>
  35. <meta name="text:Link Three" content=""/>
  36. <meta name="text:Link Three Title" content="three"/>
  37. <meta name="text:Link Four" content=""/>
  38. <meta name="text:Link Four Title" content="four"/>
  39. <meta name="text:Link Five" content=""/>
  40. <meta name="text:Link Five Title" content="five"/>
  41. <meta name="text:Topbar Title" content="hello" />
  42.  
  43.  
  44.  
  45. <style type="text/css">
  46.  
  47.  
  48. body, a, a:hover {cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;}
  49.  
  50. iframe#tumblr_controls {right:2px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.3;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  51.  
  52. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 0.8;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  53.  
  54. ::-webkit-scrollbar {
  55. height: auto;
  56. width: 7px;
  57. background-color: #999999;
  58. border: 4px solid #fafafa;
  59. }
  60.  
  61. ::-webkit-scrollbar-thumb {
  62. background-color: #f39aab;
  63. border: 2px solid #fafafa;
  64. height: 7px;
  65. -moz-border-radius: 10px;
  66. border-radius: 10px;
  67. }
  68.  
  69. p {
  70. margin:0px;
  71. margin-top:0px;
  72. }
  73.  
  74.  
  75. body {
  76. padding: 0px;
  77. margin: 0px;
  78. color:{color:text};
  79. font-family: calibri;
  80. line-height:15px;
  81. font-size:10px;
  82. background-color: {color:Background};
  83. background-image:url({image:Background});
  84. background-attachment: fixed;
  85. background-repeat: repeat;
  86. }
  87.  
  88.  
  89. a:link, a:active, a:visited{
  90. text-decoration: none;
  91. -webkit-transition: color 0.3s ease-out;
  92. -moz-transition: color 0.3s ease-out;
  93. transition: color 0.3s ease-out;
  94. color:{color:link};
  95. }
  96.  
  97. a:hover {
  98. text-decoration: none;
  99. font-style:;
  100. color: {color:Hover};
  101. }
  102.  
  103. div#center{
  104. margin-left:50px;
  105. position:relative;
  106. width:1100px;
  107. background-color:;
  108. overflow:auto;
  109. overflow-y:hidden;
  110. }
  111.  
  112.  
  113.  
  114. .entry {
  115. float:left;
  116. display: block;
  117. margin:1px;
  118. overflow:hidden;
  119. padding:10px;
  120. border: 1px solid #eee;
  121. width:290px;
  122. opacity:1;
  123. {block:PermalinkPage}
  124. width:450px;
  125. text-align:left;
  126. line-height:10px;
  127. margin-left:200px;
  128. {/block:PermalinkPage}
  129. background:white;
  130. background-image:URL();
  131. }
  132.  
  133. .entry:hover {
  134. opacity:0.9;
  135. -webkit-transition: all 0.9s ease-in-out;
  136. -moz-transition: all 0.9s ease-in-out;
  137. -o-transition: all 0.9s ease-in-out;
  138. -ms-transition: all 0.9s ease-in-out;
  139. transition: all 0.9s ease-in-out;
  140. }
  141.  
  142.  
  143. .entry .perma{
  144. width:auto;
  145. height:auto;
  146. position: absolute;
  147. line-height: 11px;
  148. overflow:hidden;
  149. text-align:left;
  150. right:15px;
  151. top:15px;
  152. background:white;
  153. word-spacing:2px;
  154. letter-spacing:1px;
  155. padding-top:2px;
  156. padding-left:7px;
  157. padding-right:7px;
  158. padding-bottom:2px;
  159. opacity: 0.0;
  160. font-family:consolas;
  161. text-transform:uppercase;
  162. font-size:8px;
  163. line-height:10px;
  164. border-left:1px dashed #FFA07A;
  165. -webkit-transition: all .9s ease;
  166. -moz-transition: all .9s ease;
  167. -o-transition: all .9s ease;
  168. transition: all .9s ease;
  169.  
  170.  
  171. }
  172.  
  173. .entry:hover .perma{
  174. overflow:visible;
  175. opacity:1;
  176. }
  177.  
  178.  
  179. #posts {
  180. width:1000px;
  181. margin-top:29px;
  182. z-index:1;
  183. margin-left:8px;
  184. right:auto;
  185. background:transparent;
  186. margin-right:auto;
  187. position:relative;
  188. overflow-y: hidden;
  189. }
  190.  
  191. div#links {
  192. position: fixed !important;
  193. width:auto;
  194. opacity:1;
  195. margin-top:218px;
  196. margin-left:1137px;
  197. padding:0px;
  198. padding-top:-4px;
  199. position:fixed;
  200. font-family:"Calibri";
  201. font-size:8px;
  202. line-height:15px;
  203. text-transform:uppercase;
  204. letter-spacing:1px;
  205. border: 0px solid #ddd;
  206. -webkit-transition: all .7s ease;
  207. -moz-transition: all .7s ease;
  208. -o-transition: all .7s ease;
  209. transition: all .7s ease;
  210. }
  211.  
  212. .nav a{
  213. line-height:10px;
  214. margin-left:10px;
  215. margin-top:2px;
  216. display:inline-block;
  217. width:35px;
  218. padding:4px;
  219. background: #FAFAFA;
  220. }
  221.  
  222. .nav a:hover{
  223. opacity: 0.8;
  224. background:#afeeee;
  225. color: #fff;
  226. -webkit-transition: all .7s ease;
  227. -moz-transition: all .7s ease;
  228. -o-transition: all .7s ease;
  229. transition: all .7s ease;
  230. }
  231.  
  232. div#desc {
  233. position: fixed !important;
  234. width: 157px;
  235. height:auto;
  236. font-family:"Calibri";
  237. font-size:10px;
  238. line-height:15px;
  239. left: 1072px;
  240. margin-top: 337px;
  241. background: white;
  242. padding: 5px;
  243. text-align: justify;
  244. border:1px solid #eee;
  245. }
  246.  
  247. .desc {
  248. font-family:"Calibri";
  249. font-size:10px;
  250. line-height:11px;
  251. text-align: justify;
  252. }
  253.  
  254.  
  255. #sidebar{
  256. position:fixed !important;
  257. width:100px;
  258. height:92px;
  259. background:white;
  260. height:auto;
  261. margin-top:216px;
  262. padding:10px;
  263. border:1px solid #eee;
  264. left:1071px;
  265. text-align:center;
  266. {block:PermalinkPage}
  267. width:100px;
  268. height:92px;
  269. margin-top:220px;
  270. {/block:PermalinkPage}
  271. }
  272.  
  273. div#blogtitle{
  274. position:fixed;
  275. height:18px;
  276. width:100%;
  277. top:0px;
  278. left:60px;
  279. text-align:left;
  280. z-index:99;
  281. opacity:10;
  282. padding:4px;
  283. border-bottom:1px solid {color:link};
  284. border-left:0px solid {color:link};
  285. background:#fff;
  286. -webkit-transition: all 0.9s ease-in-out;
  287. -moz-transition: all 0.9s ease-in-out;
  288. -o-transition: all 0.9s ease-in-out;
  289. -ms-transition: all 0.9s ease-in-out;
  290. transition: all 0.9s ease-in-out;
  291. }
  292.  
  293. .blogtitle{
  294. font-family:"Calibri";
  295. font-size:8px;
  296. line-height:15px;
  297. padding-left:15px;
  298. color:{color:blogtitle};
  299. display:inline-block;
  300. letter-spacing:2px;
  301. text-transform:uppercase;
  302. text-shadow:0px 0px 0px #fff;
  303. }
  304.  
  305. askk {
  306. font-family: "Calibri";
  307. font color: {color:Title};
  308. font-size:8px;
  309. line-height:15px;
  310. letter-spacing:1px;
  311. z-index:1;
  312. text-transform:uppercase;
  313. }
  314.  
  315. #yooj {
  316. position: fixed;
  317. font-family: calibri;
  318. font-size: 9px;
  319. bottom: -5px;
  320. right: 5px;
  321. padding: 7px;
  322. height: 12px;
  323. text-transform: uppercase;
  324. background: white;
  325. border-top-right-radius: 10px;
  326. border-top-left-radius: 10px;
  327. border: 1px solid #f7f7f7;
  328. }
  329.  
  330. @font-face { font-family: "dixel"; src: url('http://static.tumblr.com/jdjsstr/8ovm78cbb/pf_arma_five_1_.ttf'); }
  331.  
  332. @font-face { font-family: "sunshine"; src: url('http://static.tumblr.com/5fd89aw/U3vli7rvs/sunshine_in_my_soul.ttf'); }
  333.  
  334. .title{
  335. font-family: "sunshine";
  336. font-size:25px;
  337. line-height: 27px;
  338. color:{color:Title};
  339. font-weight: normal;
  340. }
  341.  
  342.  
  343. .permalink{
  344. font-size:8px;
  345. line-height:15px;
  346. text-transform: normal;
  347. display: block;
  348. text-align: right;
  349. text-decoration: none;
  350. }
  351.  
  352.  
  353. #infscr-loading{
  354. bottom: -70px;
  355. position: absolute;
  356. left: 50%;
  357. margin-left:-8px;
  358. width:16px;
  359. height:11px;
  360. overflow:hidden;
  361. margin-bottom: 50px;
  362. }
  363.  
  364. #postnotes{
  365. text-align: justify;}
  366.  
  367. #postnotes blockquote{
  368. border: 0px;}
  369.  
  370. blockquote{
  371. padding:0px 0px 2px 5px;
  372. margin:0px 0px 2px 10px;
  373. border-left: 1px dotted #555555;
  374. }
  375.  
  376. blockquote p, ul{
  377. margin:0px;
  378. padding:0px;
  379. }
  380.  
  381. a img{border: 0px;}
  382.  
  383.  
  384. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  385.  
  386. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  387. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  388.  
  389. .notes img{width:10px; position:relative; top:3px;}
  390. <--ses-->
  391. small{font-size: 90%;}
  392.  
  393. {CustomCSS}
  394.  
  395. </style>
  396.  
  397. {block:IndexPage}
  398. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  399. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  400.  
  401. <script type="text/javascript">
  402. $(window).load(function(){
  403. var $wall = $('#posts');
  404. $wall.imagesLoaded(function(){
  405. $wall.masonry({
  406. itemSelector: '.entry, .entry_photo',
  407. isAnimated : false
  408. });
  409. });
  410.  
  411. $wall.infinitescroll({
  412. navSelector : '#pagination',
  413. nextSelector : '#pagination a',
  414. itemSelector : '.entry, .entry_photo',
  415. bufferPx : 2000,
  416. debug : false,
  417. errorCallback: function() {
  418. $('#infscr-loading').fadeOut('normal');
  419. }},
  420. function( newElements ) {
  421. var $newElems = $( newElements );
  422. $newElems.hide();
  423. $newElems.imagesLoaded(function(){
  424. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  425. });
  426. }); $('#posts').show(500);
  427. });
  428. </script>
  429.  
  430.  
  431. {/block:IndexPage}
  432.  
  433.  
  434. <title>{title}</title>
  435.  
  436. <link rel="shortcut icon" href="{Favicon}" />
  437. <meta name="viewport" content="width=820" />
  438. </head>
  439.  
  440. <body>
  441. <BODY onselectstart="return false;" ondragstart="return false;">
  442. <div class="wrapper">
  443. <div class="header">
  444. </div>
  445.  
  446. <div id="cage">
  447. <div id="center">
  448.  
  449.  
  450. <div id="sidebar">
  451. <center>
  452. <a href="/"><img src="{image:sidebar}" width=100%></a>
  453. </center>
  454. </div>
  455.  
  456. <div id="links">
  457. <div class="nav">
  458. <br><a href="{text:Link One}">{text:Link One Title}</a>
  459. <br><a href="{text:Link Two}">{text:Link Two Title}</a>
  460. <br><a href="{text:Link Three}">{text:Link Three Title}</a>
  461. <br><a href="{text:Link Four}">{text:Link Four Title}</a>
  462. <br><a href="{text:Link Five}">{text:Link Five Title}</a>
  463. </div></div>
  464.  
  465.  
  466. <div id="blogtitle"><div class="blogtitle">{text:Topbar Title}</div></div>
  467.  
  468. <div id="desc">
  469. <div class="desc">
  470. {description}
  471. </div></div>
  472.  
  473. <div id="yooj">
  474. theme by <a href="http://uphorical.tumblr.com">uphorical</a>
  475. </div>
  476. <!------------------------------------->
  477.  
  478.  
  479. <div class="left">
  480. <div id="posts">
  481. {block:Posts}
  482. <div class="entry">
  483.  
  484. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  485. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{notecountwithlabel}</a></a><br>{/block:HasTags}</span></align>
  486. {/block:Text}
  487.  
  488. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  489.  
  490. class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"></span></align>{block:Link}
  491.  
  492. {block:Photo}
  493. {block:IndexPage}
  494. <center>
  495. <div class="perma">
  496. ▶ reblog <a href="{ReblogURL}" target="_blank">this </a>
  497. <br />▶ {notecountwithlabel}
  498. <br />▶ <a href="{permalink}" target="_blank">permalink </a>
  499. </div>
  500.  
  501. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  502. {/block:IndexPage}
  503. {block:PermalinkPage}
  504. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  505.  
  506. {LinkCloseTag}
  507. {/block:PermalinkPage}
  508. {/block:Photo}
  509.  
  510. {block:Photoset}
  511. {block:IndexPage}
  512. <center>
  513.  
  514. <div class="perma">
  515. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  516.  
  517. {Photoset-250}</center>
  518. {/block:IndexPage}
  519. {block:PermalinkPage}
  520. <center>
  521. {Photoset-500}</center>
  522. {/block:PermalinkPage}
  523. {/block:Photoset}
  524.  
  525. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  526.  
  527. href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </span>{/block:Quote}
  528.  
  529. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  530. <ul class="chat">
  531. {block:Lines}
  532. <li class="user_{UserNumber}">
  533. {block:Label}
  534. <span class="label">{Label}</span>
  535. {/block:Label}
  536.  
  537. {Line}
  538. </li>
  539. {/block:Lines}
  540. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}">
  541. {/block:Chat}
  542.  
  543. {block:Audio}
  544. <div style="width:200px; height:30px;">
  545. {AudioPlayerBlack}
  546. </div>
  547. {block:IndexPage}<span class="permalink">
  548. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </a>
  549. </span>{/block:IndexPage}
  550. {/block:Audio}
  551.  
  552. {block:Video}
  553. {block:IndexPage}
  554. <center>
  555. <div class="perma">
  556. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  557. {Video-250}</center>
  558. {/block:IndexPage}
  559. {block:PermalinkPage}
  560. <center>
  561. {Video-400}</center>
  562. {/block:PermalinkPage}
  563. {block:Video}
  564.  
  565. {block:Answer}
  566. <div style="height:auto; background: #eee; padding-left: 5px; padding-top: 2px; padding-bottom: 7px; text-transform: normal; overflow: auto; padding-right: 5px; border-right: 1px solid #67b5d5; border-left: 1px solid #67b5d5;">
  567. <img src="{AskerPortraitURL-30}" width="35" align="left" style="margin-right:3.5px; margin-right:3.5px; margin-top:3.5px; border-radius:8px; border: 3px double #fff; opcaity:0.9;"/><askk>{Asker} says</askk> : <br>{Question}<br></div>
  568. <div style="font-family: calibri; font-size: 10px; text-align:right; margin-top:5px;">
  569. {Answer}
  570. </div>
  571. {block:IndexPage}
  572. <p align=right><span class="permalink"><a
  573. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{notecountwithlabel}</a></a>
  574. {/Block:IndexPage}
  575. {/block:Answer}
  576.  
  577. {block:PostNotes}<div align="middle">{caption}</div>
  578. <center>
  579.  
  580. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  581.  
  582. {block:HasTags}
  583. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  584. {block:RebloggedFrom}
  585. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  586. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  587.  
  588. {/block:RebloggedFrom}
  589. </center></span>
  590. <br>
  591. <div id="postnotes">{PostNotes}</div><br>
  592.  
  593. <center>{block:ContentSource}
  594. <br><a href="{SourceURL}">
  595. {lang:Source}:
  596. {block:SourceLogo}
  597. <img src="{BlackLogoURL}" width="{LogoWidth}"
  598. height="{LogoHeight}" alt="{SourceTitle}" />
  599. {/block:SourceLogo}
  600. {block:NoSourceLogo}
  601. {SourceLink}
  602. {/block:NoSourceLogo}
  603. </a>
  604. {/block:ContentSource}</center>
  605.  
  606. {/block:PostNotes}
  607. </div>
  608. {/block:Posts}
  609. </div></div>
  610.  
  611. {block:IndexPage}
  612. {block:Pagination}
  613. <div id="pagination">
  614. {block:NextPage}
  615. <a id="nextPage" href="{NextPage}"></a>
  616. {/block:NextPage}
  617. {block:PreviousPage}
  618. <a href="{PreviousPage}"></a>
  619. {/block:PreviousPage}
  620. </div>
  621. {/block:Pagination}
  622. {/block:IndexPage}
  623. </body>
  624.  
  625. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement