the49thname

Blogroll 01

Jul 12th, 2016
1,578
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.67 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. <head>
  4.  
  5. <!-- blogroll page 01
  6.  
  7. themes by ro (the49thname) / the49ththeme.tumblr.com
  8. don't remove the credit, use as a base code, or claim as your own work.
  9. edit as much as you want, and feel free to send me any queries/problems.
  10.  
  11. -->
  12.  
  13. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  14.  
  15. <title>{Title}</title>
  16.  
  17. <link rel="shortcut icon" href="{Favicon}">
  18.  
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20.  
  21. <meta name="description" content="{MetaDescription}" />
  22.  
  23. <!-- fonts -->
  24.  
  25. <link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
  26.  
  27. <!-- jquery scripts -->
  28.  
  29. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  30.  
  31. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  32.  
  33. <!-- font awesome script -->
  34.  
  35. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  36.  
  37. <!-- tooltip scripts -->
  38.  
  39. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  40.  
  41. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  42.  
  43. <script>
  44. (function($){
  45. $(document).ready(function(){
  46. $("a[title]").style_my_tooltips({
  47. tip_follows_cursor:true,
  48. tip_delay_time:90,
  49. tip_fade_speed:600,
  50. attribute:"title"
  51. });
  52. });
  53. })(jQuery);
  54. </script>
  55.  
  56. <style type="text/css">
  57.  
  58. #tumblr_controls, .tmblr-iframe {display:none;!important;}
  59.  
  60. ::-webkit-scrollbar-thumb {
  61. z-index:9999999;
  62. position:relative;
  63. height:auto;
  64. background-color:#ccc; /* change scrollbar thumb colour */
  65. }
  66.  
  67. ::-webkit-scrollbar {
  68. height:5px;
  69. width:5px;
  70. background-color:#f6f6f6; /* change scrollbar background colour */
  71. }
  72.  
  73. /* basics */
  74.  
  75. body {
  76. color:#888; /* change text colour */
  77. background-color:#f6f6f6; /* change background colour */
  78. font-family:'Roboto', sans-serif;
  79. font-size:10px; /* change font size */
  80. margin:0;
  81. line-height:14px;
  82. letter-spacing:1px;
  83. text-align:justify;
  84. word-wrap:break-word;
  85. background-image:url('URL GOES HERE'); /* add background image */
  86. background-position:left top;
  87. background-attachment:fixed;
  88. background-repeat:repeat;
  89. }
  90.  
  91. b, strong {color:#000;} /* change bold text colour */
  92.  
  93. i, em {color:#ccc;} /* change italic text colour */
  94.  
  95. u {color:#888;text-transform:none;} /* change underline text colour */
  96.  
  97. a {
  98. color:#ffb3b3; /* change link colour */
  99. text-transform:uppercase;
  100. text-decoration:none;
  101. -moz-transition-duration:1s;
  102. -webkit-transition-duration:1s;
  103. -o-transition-duration:1s;
  104. }
  105.  
  106. a:hover {
  107. color:#888; /* change link hover colour */
  108. -moz-transition-duration:1s;
  109. -webkit-transition-duration:1s;
  110. -o-transition-duration:1s;
  111. }
  112.  
  113. p {margin:10px;}
  114.  
  115. /* header */
  116.  
  117. #themecontainer {
  118. top:0;
  119. width:900px;
  120. height:100%;
  121. margin-left:auto;
  122. margin-right:auto;
  123. }
  124.  
  125. #hdr {
  126. width:900px;
  127. height:200px;
  128. position:absolute;
  129. top:0;
  130. background:url('https://68.media.tumblr.com/e9b9c7eadecb014733a4434714cf756e/tumblr_o6q1oxxgiE1uptww3o3_r1_1280.png') top center; /* add/change header image */
  131. -webkit-background-size:cover;
  132. -moz-background-size:cover;
  133. -o-background-size:cover;
  134. background-size:cover;
  135. }
  136.  
  137. .nav {
  138. position:absolute;
  139. top:200px;
  140. width:900px;
  141. height:35px;
  142. background-color:#ffb3b3; /* change navigation background colour */
  143. text-align:center;
  144. z-index:9999;
  145. }
  146.  
  147. .nav-fixed {position:fixed;top:0;}
  148.  
  149. .nav a {
  150. font-family:'Roboto Condensed', sans-serif;
  151. font-size:14px;
  152. text-transform:uppercase;
  153. color:#fff; /* change navigation link colour */
  154. display:inline-block;
  155. padding:12px 8px;
  156. -moz-transition-duration:1s;
  157. -webkit-transition-duration:1s;
  158. -o-transition-duration:1s;
  159. }
  160.  
  161. .nav a:hover {
  162. color:#888; /* change navigation link hover colour */
  163. -moz-transition-duration:1s;
  164. -webkit-transition-duration:1s;
  165. -o-transition-duration:1s;
  166. }
  167.  
  168. /* posts */
  169.  
  170. #postcontainer {
  171. position:relative;
  172. top:235px;
  173. width:100%;
  174. overflow:hidden;
  175. text-align:justify;
  176. background-color:#fff; /* change container background colour */
  177. }
  178.  
  179. #container {
  180. width:750px;
  181. height:100%;
  182. margin:50px auto;
  183. text-align:center;
  184. }
  185.  
  186. #blogroll {display:inline-block;margin:10px;}
  187.  
  188. #blogroll img {
  189. opacity:1;
  190. -moz-transition-duration:1s;
  191. -webkit-transition-duration:1s;
  192. -o-transition-duration:1s;
  193. }
  194.  
  195. #blogroll:hover img {
  196. opacity:0.4;
  197. -moz-transition-duration:1s;
  198. -webkit-transition-duration:1s;
  199. -o-transition-duration:1s;
  200. }
  201.  
  202. /* extras */
  203.  
  204. #s-m-t-tooltip {
  205. z-index:9999999999;
  206. color:#fff; /* change tooltip text colour */
  207. background:#bad8eb; /* change tooltip background colour */
  208. font-size:9px;
  209. line-height:11px;
  210. font-family:'Roboto Condensed', sans-serif;
  211. text-align:left;
  212. text-transform:uppercase;
  213. max-width:150px;
  214. word-wrap:break-word;
  215. padding:2px 5px 2px 5px;
  216. display:block;
  217. margin:24px 14px 7px 12px;
  218. }
  219.  
  220. ::selection {
  221. color:#fff; /* change selection text colour */
  222. background:#ffb3b3; /* change selection background colour */
  223. }
  224.  
  225. /* credit - do not remove, alter, or move to another page */
  226.  
  227. #credit {
  228. position:fixed;
  229. bottom:14px;
  230. right:10px;
  231. text-align:center;
  232. z-index:9999999;
  233. }
  234.  
  235. #credit a {
  236. font-size:10px;
  237. color:#f6f6f6;
  238. background-color:#ccc;
  239. padding:4px;
  240. -moz-transition-duration:1s;
  241. -webkit-transition-duration:1s;
  242. -o-transition-duration:1s;
  243. }
  244.  
  245. #credit a:hover {
  246. color:#ccc;
  247. background-color:#f6f6f6;
  248. -moz-transition-duration:1s;
  249. -webkit-transition-duration:1s;
  250. -o-transition-duration:1s;
  251. }
  252.  
  253. </style>
  254. </head>
  255. <body>
  256.  
  257. <div id="themecontainer">
  258.  
  259. <div id="hdr"></div>
  260.  
  261. <div class="nav">
  262. <a href="/">Home</a>
  263. <a href="/ask">Ask</a>
  264. <a href="/archive">Archive</a>
  265. <!-- you can edit your custom links here. just change LINK NO. URL to whatever your link url is, and change Link no. to whatever you want your link to be called. -->
  266. <a href="/LINK 1 URL">Link 1</a>
  267. <a href="/LINK 2 URL">Link 2</a>
  268. <a href="/LINK 3 URL">Link 3</a>
  269. </div>
  270.  
  271. <div id="postcontainer">
  272. <div id="container">
  273. {block:Following}{block:Followed}
  274. <div id="blogroll" class="following"><a target="_blank" href="{FollowedURL}" title="{FollowedName}"><img src="{FollowedPortraitURL-96}"/></a></div>
  275. {/block:Followed}{/block:Following}
  276. </div>
  277. </div>
  278.  
  279. </div>
  280.  
  281. <!-- sticky navbar jquery -->
  282.  
  283. <script>
  284. $(document).ready(function(){
  285. $(window).bind('scroll', function(){
  286. if($(window).scrollTop() > 200){
  287. $('.nav').addClass('nav-fixed');
  288. }
  289.  
  290. else{
  291. $('.nav').removeClass('nav-fixed');
  292. }
  293. });
  294. });
  295. </script>
  296.  
  297. <div id="credit"><a href="http://the49thname.tumblr.com/" title="made by the49thname">49</a>
  298. </div>
  299.  
  300. </body>
  301. </html>
Advertisement
Add Comment
Please, Sign In to add comment