API tools faq
paste
Advertisement
cloverfield

e#1b blogroll

cloverfield
Oct 23rd, 2014
1,660
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.99 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html><!--
  2.  
  3.  
  4. > extra#1b blogroll by 01kido
  5. > thanks for using!
  6.  
  7.  
  8. --><html> <head>
  9.  
  10. <link rel="shortcut icon" href="{Favicon}">
  11.  
  12. <title>
  13. Blogroll
  14. </title>
  15.  
  16. <style type="text/css">
  17.  
  18. /*selected text*/
  19. ::selection { color:#00ffff; }
  20. ::-moz-selection { color:#00ffff; }
  21.  
  22. body {
  23. background: #fff;
  24. color:#aaa; /* text color */
  25. background-attachment:fixed;
  26. background-image:url(''); /* tiled bg img */
  27. font-family:arial;
  28. font-size:11px;
  29. line-height:11px;
  30. letter-spacing:1px;
  31. word-wrap:break-word;
  32. }
  33.  
  34. #content {
  35. margin:auto;
  36. width:450px;
  37. }
  38.  
  39. /*links*/
  40. a {
  41. color:#f7a4e5;
  42. text-decoration:none;
  43. -webkit-transition: all 0.4s ease;
  44. -o-transition: all 0.4s ease;
  45. -moz-transition: all 0.4s ease;
  46. transition: all 0.4s ease;
  47. padding:0px 3px 0px 3px;
  48.  
  49. }
  50.  
  51. a:hover {
  52. color:#8d8ee4;
  53. -webkit-border-radius:3px;
  54. -moz-border-radius:3px;
  55. border-radius:3px;
  56. background:rgba(125,235,255,0.3);
  57. }
  58.  
  59. #fish {
  60. width:70px;
  61. height:70px;
  62. margin:0px;
  63. display:inline-block!important;
  64. }
  65.  
  66. #fish a, #fish a:hover {
  67. border:none;
  68. padding:0px;
  69. }
  70.  
  71. /*individual icons*/
  72. #fish img {
  73. /* delete this part if you dont want rounded icons */
  74. -webkit-border-radius:33px;
  75. -moz-border-radius:33px;
  76. border-radius:33px;
  77. /****************/
  78. border:1px solid #e1e1e1;
  79. padding:5px;
  80. background:#fff;
  81. overflow:hidden;
  82. opacity:0.8;
  83. }
  84.  
  85. #fish img:hover {
  86. opacity:0;
  87. /*delete this part if you dont want icons to spin*/
  88. -webkit-transform:rotate(-360deg);
  89. -moz-transform:rotate(-360deg);
  90. -o-transform:rotate(-360deg);
  91. transform:rotate(-360deg);
  92. /***********************/
  93. }
  94.  
  95. /*header*/
  96. #p {
  97. border:1px solid #e5e5e5;
  98. margin-top:50px;
  99. -webkit-border-radius:5px;
  100. -moz-border-radius:5px;
  101. border-radius:5px;
  102. overflow:hidden;
  103. }
  104.  
  105. /*header picture*/
  106. #island {
  107. max-height:100px;
  108. overflow:hidden;
  109. }
  110.  
  111. #island img {
  112. width:100%;
  113. pointer-events:none;
  114. }
  115.  
  116. /*header links*/
  117. #tree {
  118. padding:10px;
  119. background:#f9f9f9;
  120. text-align:center;
  121. }
  122.  
  123. /*container*/
  124. #sea {
  125. width:450px;
  126. height:450px;
  127. margin-top:10px;
  128. overflow:scroll;
  129. }
  130.  
  131. /*tooltip*/
  132. .tooltip { display:inline; position:relative; }
  133.  
  134. #s-m-t-tooltip {
  135. max-width:300px;
  136. padding:1px 3px 1px 3px;
  137. margin:20px 0px 20px 0px;
  138. background:rgba(255,255,255,0.8);
  139. border:1px solid #eee;
  140. letter-spacing:2px;
  141. color:#aaa;
  142. text-shadow:1px 1px #fff;
  143. z-index:999999;
  144. word-wrap:break-word;
  145. font-style:italic;
  146. font-size:9px;
  147. -webkit-border-radius:5px;
  148. -moz-border-radius:5px;
  149. border-radius:5px;
  150. }
  151.  
  152. /*scrollbar*/
  153. ::-webkit-scrollbar { width:5px; height:0px; }
  154. ::-webkit-scrollbar-track { border:2px solid #fff; background:#000; }
  155. ::-webkit-scrollbar-thumb { background: #000; border:1px solid #fff; }
  156.  
  157. #fish img, #fish img:hover { -webkit-transition: all 1s ease; -o-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; }
  158.  
  159. </style>
  160.  
  161. </head>
  162.  
  163. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:90,tip_fade_speed:0,attribute:"title"});});})(jQuery);</script>
  164.  
  165. <body>
  166.  
  167. <div id="content">
  168. <div id="p">
  169. <div id="island">
  170.  
  171. <!--header image, if it is too large it will crop automatically -->
  172.  
  173. <img src="http://i.imgur.com/vT2DnVD.jpg">
  174.  
  175. <!---------------------------------------------------------------->
  176.  
  177. </div>
  178.  
  179. <div id="tree">
  180. <a href="/">home</a>
  181. <a href="/ask">inbox</a>
  182. <a href="http://01kido.tumblr.com/" target="_blank">theme</a>
  183. </div>
  184. </div>
  185.  
  186. <div id="sea">
  187.  
  188. {block:Following}
  189. {block:Followed}
  190. <div id="fish">
  191. <a href="{FollowedURL}" title="{FollowedName}" target="_blank">
  192. <center><img src="{FollowedPortraitURL-48}"></center>
  193. </a>
  194. </div>
  195. {/block:Followed}
  196. {/block:Following}
  197.  
  198.  
  199. </div>
  200.  
  201. </div>
  202.  
  203. </body>
  204.  
  205. </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!