Advertisement
sebastianslan

Blogroll 02 (Matches Theme 02)

Jul 20th, 2014
606
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.96 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-----------------------------------------------------------------------
  4.  
  5. * BLOGROLL #02 by saaraa @ cyantists.tumblr.com
  6.  
  7. - terms of use: http://cyantists.tumblr.com/terms
  8.  
  9. - I am no longer offering support for this theme
  10.  
  11. - enjoy!
  12.  
  13. ------------------------------------------------------------------------>
  14.  
  15. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  16. <head>
  17.  
  18. <title>Blogroll</title>
  19. <link rel="shortcut icon" href="{Favicon}">
  20.  
  21. <!--- COLOURS
  22. - to change the blue colour find and replace #2db4f7
  23. - to change the pink colour find and replace #f72d99
  24. - to change the tooltip background find and replace #b3b3b3
  25. --->
  26.  
  27. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script><script>
  28. (function($){
  29. $(document).ready(function(){
  30. $("[title]").style_my_tooltips({
  31. tip_follows_cursor:true,
  32. tip_delay_time:100,
  33. tip_fade_speed:200
  34. }
  35. );
  36. });
  37. })(jQuery);
  38. </script>
  39.  
  40. <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Rosario:400,700' rel='stylesheet' type='text/css'>
  41.  
  42. </head>
  43.  
  44. <style type="text/css">
  45.  
  46. ::-webkit-scrollbar {height:auto; width:6px; background:#ededed; }
  47.  
  48. ::-webkit-scrollbar-thumb:vertical {height:auto; background:#2db4f7; }
  49.  
  50. ::-webkit-scrollbar-thumb:vertical:hover {background:#f72d99; }
  51.  
  52. ::-webkit-scrollbar-thumb:hotizontal {height:1px; width:auto; background:#ededed; }
  53.  
  54. ::selection {background:#f72d99; color:#fff;}
  55. ::-webkit-selection {background:#f72d99; color:#fff;}
  56. ::-moz-selection {background:#f72d99; color:#fff;}
  57. ::-o-selection {background:#f72d99; color:#fff;}
  58.  
  59. body {background-color:#fff; padding:0px; height:100%;
  60. background-image: url('{image:Background}'); color:#969393;
  61. font-family: 'Rosario', sans-serif; font-size:11px; margin:0px;}
  62.  
  63. a:link, a:active, a:visited {text-decoration:none; color:#2db4f7;}
  64.  
  65. a:hover {text-decoration:none; color:#f72d99;}
  66.  
  67. i, em, .em {color:#2db4f7; padding-right:1px;}
  68.  
  69. b, strong, .strong {color:#777777;}
  70.  
  71. small {font-size:10px;}
  72.  
  73. big {font-size:12px;}
  74.  
  75. sup, sub {font-size:10px;}
  76.  
  77. pre {font-variant:small-caps; text-transform:lowercase;
  78. padding:5px 0px 5px 5px;}
  79.  
  80. blockquote {border-left:solid 2px #ddd; margin-left:10px;
  81. padding-left:10px; }
  82.  
  83. iframe#tumblr_controls {
  84. right:3px !important; position:fixed !important; opacity:0.5;
  85. filter:invert(1); -webkit-filter:invert(1); -o-filter:invert(1);
  86. -moz-filter:invert(1); -ms-filter:invert(1);
  87. }
  88.  
  89. iframe#tumblr_controls:hover {opacity:1;}
  90.  
  91. #sidebar {position:fixed; margin:120px 0px; width:160px; overflow:hidden;}
  92.  
  93. #idp {width:120px; padding:12px; background:#ededed;
  94. float:right; margin-top:-50px; margin-bottom:5px;}
  95.  
  96. #s-image {width:120px; overflow:hidden;}
  97. #s-image img {width:120px;}
  98.  
  99. #s-links-s {width:10px; height:50px; margin-top:6px;}
  100.  
  101. #s-links-b {height:10px; margin-top:0px; width:50px; margin-left:16px;}
  102.  
  103. a.vsr-link:link, a.vsr-link:active, a.vsr-link:visited,
  104. a.dc-link:link, a.dc-link:active, a.dc-link:visited,
  105. a.sldc-link:link, a.sldc-link:active, a.sldc-link:visited,
  106. a.sls-link:link, a.sls-link:active, a.sls-link:visited {
  107. display:inline-block; width:8px; height:8px; margin:6px 1px 0px 1px;
  108. background:#2db4f7; border-radius:1em;
  109. -webkit-border-radius:1em; -o-border-radius:1em;
  110. -moz-border-radius:1em;}
  111.  
  112. a.vsr-link:link, a.vsr-link:active, a.vsr-link:visited {
  113. margin:0px 1px 6px 1px;}
  114.  
  115. a.dc-link:link, a.dc-link:active, a.dc-link:visited {
  116. margin:1px 6px 1px 0px; background:#f72d99;}
  117.  
  118. a.sls-link:link, a.sls-link:active, a.sls-link:visited {
  119. background:#f72d99;}
  120.  
  121. a.sldc-link:link, a.sldc-link:active, a.sldc-link:visited {
  122. margin:1px 6px 1px 0px;}
  123.  
  124. #description { width:110px; padding:5px; margin-top:5px; margin-top:4px;
  125. background:#fff; color:#969393;
  126. text-transform:lowercase; font-size:10px; letter-spacing:1px;
  127. font-variant:small-caps; text-align:justify;}
  128.  
  129. #page-container {position:absolute; width:790px; margin:auto; bottom:0;
  130. left:0; top:0; right:0;}
  131.  
  132. #entries {width:560px; float:right; margin-top:0px; margin-bottom:60px;
  133. z-index:8888;}
  134.  
  135. #post {width:520px; background:#ededed; padding:20px 10px;
  136. margin-top:50px;}
  137.  
  138. #t-l-q {cursor:default; width:510px; padding:0px 5px 20px 5px;
  139. text-align:center; font-size:28px;
  140. color:#2db4f7; opacity:0.6;
  141. font-family: 'Lobster', cursive;}
  142.  
  143. #post:hover #t-l-q {color:#f72d99;}
  144.  
  145. #post img {width:61px; margin:4px;
  146. border-radius:0em; -webkit-border-radius:0em;
  147. -o-border-radius:0em; -moz-border-radius:0em;}
  148.  
  149. #post img:hover {border-radius:5em; -webkit-border-radius:5em;
  150. -o-border-radius:5em; -moz-border-radius:5em;}
  151.  
  152. #s-m-t-tooltip { margin-top:20px; margin-left:10px;
  153. padding:2px 6px 4px 6px; display:inline-block; font-size:10px;
  154. text-transform:lowercase; letter-spacing:1px; font-variant:small-caps;
  155. text-align:center; position:absolute; z-index:999999; color:#fff;
  156. background:#b3b3b3; }
  157.  
  158. /*** PLEASE DO NOT REMOVE ***/
  159. #credit {position:fixed; bottom:10px; right:10px; z-index:9999; width:10px;} #credit a:link, #credit a:active, #credit a:visited {display:inline-block; width:8px; height:8px; background:#2db4f7; border-radius:1em; -webkit-border-radius:1em; -o-border-radius:1em; -moz-border-radius:1em;} #credit:hover a:link, #credit:hover a:active, #credit:hover a:visited {background:#f72d99;}
  160. /*** THANK YOU ***/
  161.  
  162. a:link, a:active, a:visited, a:hover,
  163. iframe#tumblr_controls, iframe#tumblr_controls:hover,
  164. a.sldc-link:link, a.sldc-link:active, a.sldc-link:visited, a.sldc-link:hover,
  165. a.sls-link:link, a.sls-link:active, a.sls-link:visited, a.sls-link:hover,
  166. #t-l-q, #post:hover #t-l-q,
  167. #post img, #post img:hover
  168. #credit:hover a:link, #credit:hover a:active, #credit:hover a:visited,
  169. #credit:hover a:hover {
  170. transition:all 0.4s ease-in-out;
  171. -webkit-transition-duration:all 0.4s ease-in-out;
  172. -o-transition-transition:all 0.4s ease-in-out;
  173. -moz-transition-durartion:all 0.4s ease-in-out;
  174. -ms-transition-durartion:all 0.4s ease-in-out;
  175. }
  176.  
  177. {CustomCSS}</style>
  178.  
  179. <body>
  180.  
  181. <div id="page-container">
  182.  
  183. <div id="sidebar">
  184.  
  185. <div id="s-links-b">
  186. <a href="/" class="sldc-link" title="home"></a>
  187. <a href="/ask" class="sldc-link" title="ask"></a>
  188. <a href="/archive" class="sldc-link" title="archive"></a>
  189. </div>
  190.  
  191. <div id="s-links-s">
  192. <a href="/" class="sls-link" title="Link 4"></a>
  193. <a href="/" class="sls-link" title="Link 5"></a>
  194. <a href="/" class="sls-link" title="Link 6"></a>
  195. </div>
  196.  
  197. <div id="idp">
  198.  
  199. <div id="s-image">
  200. <a href="/"><img src="SIDEBAR IMAGE URL HERE" /></a>
  201. </div>
  202.  
  203. <div id="description">your description goes here&nbsp;&nbsp;&nbsp;<b>bold</b> <em>italic</em>&nbsp;&nbsp;<a href="/">link</a></div>
  204.  
  205. </div>
  206.  
  207. </div>
  208.  
  209. <!------------------------------------------------------------------------------------------------------------------------------------------------->
  210.  
  211. <div id="entries">
  212.  
  213.  
  214. <div id="post">
  215.  
  216. <div id="t-l-q">Blogroll</div>
  217.  
  218. <center>
  219. {block:Following}
  220. {block:Followed}
  221. <a target='_blank' href='{FollowedURL}' title='{FollowedName}'>
  222. <img src='{FollowedPortraitURL-96}' />
  223. </a>
  224. {/block:Followed}
  225. {/block:Following}
  226. </center>
  227.  
  228.  
  229. </div>
  230.  
  231. </div>
  232.  
  233. </div>
  234.  
  235. <!--- PLEASE DO NOT ALTER OR REMOVE --->
  236. <div id="credit"><a href="http://cyantits.tumblr.com/" title="c. cyantists"></a></div>
  237. <!--- THANK YOU --->
  238.  
  239. </body>
  240. </html><!--
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement