jaesoonie

Blogroll #2

Sep 2nd, 2013
7,042
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.97 KB | None | 0 0
  1. <!---------------------------------------------------------------------
  2. ᴘᴀɢᴇ ᴍᴀᴅᴇ ʙʏ >SOONJUN<. [ʏᴏɴɢ.ᴄᴏ.ᴠᴜ]
  3. sᴏᴏɴᴊᴜɴᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  4. ᴘʟᴇᴀsᴇ ʟᴇᴀᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛ.
  5. ᴀɴʏ ǫᴜᴇsᴛɪᴏɴs ᴀᴛ ᴀʟʟ ᴄᴏᴍᴇ ᴀsᴋ.
  6. ----------------------------------------------------------------------->
  7.  
  8. <html>
  9. <head>
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  13. <meta name="description" content="" />
  14. <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
  15. <script type="text/javascript" src="http://static.tumblr.com/whx9ghv/1eGm9d17y/isotope.js"></script>
  16. <script>
  17. $(function(){
  18. var $container = $('#icon');
  19. $container.isotope({
  20. itemSelector: '.icons'
  21. });
  22. });
  23. </script>
  24.  
  25. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  26. <script>
  27. (function($){
  28. $(document).ready(function(){
  29. $("[title]").style_my_tooltips();
  30. });
  31. })(jQuery);
  32. </script>
  33.  
  34. <style type="text/css">
  35.  
  36. #s-m-t-tooltip {
  37. display: block;
  38. background: #444;
  39. font-size: 8px;
  40. font-family: calibri;
  41. letter-spacing: 1px;
  42. text-transform: uppercase;
  43. line-height:100%;
  44. color: #fff;
  45. text-align: center;
  46. margin-left: 18px;
  47. padding:7px;
  48. min-width: 40px;
  49. max-width: 200px;
  50. z-index: 99;}
  51.  
  52. ::-webkit-scrollbar-thumb:vertical{background-color: #f6f6f6;}
  53. ::-webkit-scrollbar {width: 7px; background-color:#fff;}
  54.  
  55. body {background-color: #fff;margin: 0px;}
  56.  
  57. a:link, a:visited, a:active {
  58. text-decoration: none;
  59. -webkit-transition: all 0.7s ease-in-out;
  60. -moz-transition: all 0.7s ease-in-out;
  61. -o-transition: all 0.7s ease-in-out;
  62. -ms-transition: all 0.7s ease-in-out;
  63. transition: all 0.7s ease-in-out;}
  64.  
  65. a:hover {-webkit-transition: all 0.7s ease-in-out;
  66. -moz-transition: all 0.7s ease-in-out;
  67. -o-transition: all 0.7s ease-in-out;
  68. -ms-transition: all 0.7s ease-in-out;
  69. transition: all 0.7s ease-in-out;}
  70.  
  71. #head {
  72. position: fixed;
  73. height: 170px;
  74. width: 100%;
  75. background:url('http://static.tumblr.com/camqjbz/uOimsvhsl/binding_dark.png');
  76. text-align: center;
  77. top: 0px;
  78. z-index:99;}
  79.  
  80. .head {margin:auto;margin-top:50px;}
  81.  
  82. @font-face {
  83. font-family: 'intro';
  84. src: url('intro.ttf');
  85. src: local('intro'),
  86. local('intro'),
  87. url('http://dl.dropbox.com/s/n5x8hvhnxuaurzz/Intro.otf');}
  88.  
  89. #title {
  90. margin:auto;
  91. font-family:intro;
  92. text-transform:uppercase;
  93. color: #888;
  94. margin-bottom: 10px;
  95. letter-spacing: 2px;
  96. font-size:30px;
  97. background:#fff;
  98. padding:8px;
  99. width:340px;
  100. -webkit-transition: all 0.7s ease-in-out;
  101. -moz-transition: all 0.7s ease-in-out;
  102. -o-transition: all 0.7s ease-in-out;
  103. -ms-transition: all 0.7s ease-in-out;
  104. transition: all 0.7s ease-in-out;}
  105.  
  106. #head:hover #title {color: #ddd;text-shadow: -1px -1px 2px #222;}
  107.  
  108. #head a {
  109. font-family:calibri;
  110. width: 65px;
  111. display: inline-block;
  112. padding: 7px 2px 7px 2px;
  113. color: #bbb;
  114. letter-spacing: 1px;
  115. min-height: 10px;
  116. font-size: 8px;
  117. background-color: #333;
  118. text-transform:uppercase;}
  119.  
  120. #head a:hover {background-color: #fff; color: #000;text-shadow: 1px 1px 0px #eee;}
  121.  
  122. #box {margin:auto; width: 760px;background:#fff; margin-top: 180px;border-right: 1px solid #f3f3f3;border-left: 1px solid #f3f3f3;}
  123. #icon {margin-top: 0px;}
  124. .icons {margin: 10px;position: relative;}
  125.  
  126. .pics {
  127. display: table-cell;
  128. background-color: #fff;
  129. margin: 5px;
  130. height: 64px;
  131. padding: 10px;
  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. .pics img {
  139. display: inline-block;
  140. padding: 10px;
  141. border: 1px solid #f9f9f9;
  142. background-color: #fff;
  143. height: 64px;
  144. -webkit-filter: grayscale(75%);}
  145.  
  146. .info {
  147. margin-top:5px;
  148. word-wrap: break-word;
  149. background:#f8f8f8;
  150. text-align:center;
  151. width:86;
  152. padding:5px 0px 5px 0px;
  153. -webkit-transition: all 0.7s ease-in-out;
  154. -moz-transition: all 0.7s ease-in-out;
  155. -o-transition: all 0.7s ease-in-out;
  156. -ms-transition: all 0.7s ease-in-out;
  157. transition: all 0.7s ease-in-out;}
  158.  
  159. .name {
  160. text-align: center;
  161. color: #aaa;
  162. font-style: normal;
  163. text-transform: uppercase;
  164. font-size: 9px;
  165. letter-spacing: 1px;
  166. font-family:calibri;}
  167.  
  168. .pics:hover {background-color: #333;}
  169. .pics img:hover {-webkit-filter: grayscale(0%);}
  170. .pics:hover .name {background-color: #fff;}
  171. .pics:hover .info {color: #fff;background-color: #333;}
  172.  
  173.  
  174. #cr{font-size:10px;right:15px;bottom:15px;position:fixed;font-family:calibri;letter-spacing:1px;background:#f5f5f5;padding: 2px 5px 3px 5px;border-radius:3px;z-index:99;}
  175. a.cr {color:#aaa;}
  176.  
  177. </style>
  178. </head>
  179.  
  180. <body>
  181. <div id="head">
  182. <div class="head">
  183. <div id="title">blogroll</div>
  184. <a href="/">go back</a>
  185. <a href="/ask">message</a>
  186. <a href="URL">link</a>
  187. </div></div>
  188.  
  189. {block:Following}
  190. <div id="box">
  191. <div id="icon">
  192. {block:Followed}
  193. <div class="icons">
  194. <a href="{FollowedURL}" title="{FollowedTitle}" target=”_blank”>
  195. <div class="pics">
  196. <img src="{FollowedPortraitURL-64}">
  197. <div class="name">
  198. <div class="info">
  199. {FollowedName}
  200. </div></div></div></a>
  201. </div>
  202. {/block:Followed}
  203. </div></div>
  204. {/block:Following}
  205.  
  206.  
  207. </body>
  208. <div id="cr"><a href="http://soonjunthemes.tumblr.com/" class="cr" title="page created by soonjun"> page. </a></div>
  209. </html>
Advertisement
Add Comment
Please, Sign In to add comment