API tools faq
paste
enchantingly

Tags Page 03

enchantingly
Jul 20th, 2014
1,625
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.01 KB | None | 0 0
raw download clone embed print report
  1. <html lang="en">
  2.  
  3. <!--
  4. Tags Page 03 by Elowen (theghostoflove.tumblr.com)
  5.  
  6. Credit stays intact, please. If you get stuck, feel free to message me! Comments and suggestions are welcome.
  7. -->
  8.  
  9. <head>
  10.  
  11. <title>{Title} | Tags</title>
  12. <link rel="shortcut icon" href="{Favicon}">
  13. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  14.  
  15. <style type="text/css">
  16.  
  17. h3 /**TITLE OF TAGS PAGE**/ {
  18. font-family: 'Clicker Script'; /**font of title**/
  19. font-size:36px; /**font size of title**/
  20. color:#384ED1; /**colour of title **/
  21. text-align:center;
  22. font-weight:normal;
  23. padding-top:27px;
  24. padding-bottom:25px;
  25. width:900px;
  26. }
  27.  
  28. ::-webkit-scrollbar /**BACKGROUND OF SCROLLBAR**/ {width:6px; height:auto; background-color:transparent}
  29. ::-webkit-scrollbar-corner {background:#A7B3FA;}
  30. ::-webkit-scrollbar-thumb:vertical /**COLOUR OF SCROLL**/ {background:#A7B3FA;}
  31. ::-webkit-scrollbar-thumb:horizontal {background:#A7B3FA;}
  32.  
  33. a {text-decoration:none;-moz-transition-duration:0.5s;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;}
  34.  
  35. body {
  36. font-family:'Lora'; /**font of links**/
  37. font-size:11px; /**font size of links**/
  38. color:#29388F; /**colour of link separators**/
  39. background:#fff /**background colour of everything**/ url('https://i.imgur.com/GvlNDOR.png?1') /**replace with a url to your image if wanted**/;
  40. background-repeat:repeat;
  41. background-attachment:fixed;
  42. }
  43.  
  44. #container {width:100%;margin: 0 auto;text-align:center;}
  45.  
  46. #container #entries {
  47. background-color:#636fb5; /**background colour of tags container**/
  48. padding:20px 10px 30px 10px;
  49. width:700px;
  50. margin-top:200px;
  51. margin-bottom:20px;
  52. text-align:center;
  53. }
  54.  
  55. #hcont {width:100%;top:-45px;margin: 0 auto; text-align:center;position:fixed;}
  56.  
  57. #hcont #header {
  58. border-bottom:1px solid #636fb5; /**colour of header border**/
  59. border-right:1px solid #636fb5;
  60. border-left:1px solid #636fb5;
  61. background-color:#808bce; /**header background colour**/
  62. text-align:center;
  63. margin-top:0px;
  64. width:900px;
  65. height:110px;
  66. }
  67.  
  68. #links {z-index:10000;margin-top:-50px;}
  69. #links a {color:#182CA8; /**colour of header links**/}
  70. #links a:hover {color:#fff; /**colour of header links on hover**/}
  71.  
  72. #tagcup1 /**COLUMN NUMERO UNO**/ {
  73. vertical-align:top;
  74. margin-left:-20px;
  75. width:160px;
  76. display:inline-block;
  77. margin-top:10px;
  78. }
  79.  
  80. #tagcup2 /**COLUMN NUMERO DOS**/ {
  81. margin-left:60px;
  82. vertical-align:top;
  83. width:160px;
  84. display:inline-block;
  85. margin-top:8px;
  86. }
  87.  
  88. #tagcup3 /**COLUMN NUMERO TRES**/ {
  89. vertical-align:top;
  90. margin-left:60px;
  91. margin-right:15px;
  92. width:160px;
  93. display:inline-block;
  94. margin-top:8px;
  95. }
  96.  
  97. #title /**TITLE OF THE TAG CATEGORIES**/ {
  98. font-family:'Cambria'; /**font of tag titles**/
  99. font-size:14px; /**font size of tag titles**/
  100. background-color:#9ca9f6; /**background colour of tag titles**/
  101. color:#3C4DB5; /**colour of tag titles**/
  102. width:165px;
  103. text-align:center;
  104. padding:15px;
  105. margin:5px;
  106. }
  107.  
  108. .sub {width:182px;}
  109.  
  110. #tags {margin:0px 0px 10px 22px;width:165px;max-height:240px;overflow-y:scroll;}
  111. #tags a {
  112. background-color:#8696F7; /**background colour of individual tags**/
  113. color:#29388F; /**colour of tag links**/
  114. font-family:'Lora'; /**tag fonts**/
  115. border-left:1px solid #3C4DB5; /**colour of tag borders**/
  116. border-right:1px solid #3C4DB5;
  117. border-bottom:1px solid #3C4DB5;
  118. width:155px;
  119. text-align:center;
  120. font-size:12px;
  121. display:block;
  122. padding:5px 1px 5px 1px;
  123. }
  124. #tags a:first-child {border-top:1px solid #3C4DB5;} /**colour of tag border**/
  125. #tags a:hover {
  126. color:#384ED1; /**colour of tag links on hover**/
  127. background-color:#CCD3FC; /**background colour of tags on hover**/
  128. }
  129.  
  130. #s-m-t-tooltip /**the label thing that comes up when you hover links with titles**/ {
  131. border:1px solid #3C4DB5;
  132. background-color:#9ca9f6;
  133. color:#3C4DB5;
  134. padding:5px 10px 5px 10px;
  135. margin:20px 14px 7px 10px;
  136. font-family:georgia;
  137. font-style: normal;
  138. font-size:9px;
  139. letter-spacing:1px;
  140. z-index:99999999;
  141. }
  142.  
  143. #credit /**the little E in the corner: please don't remove the credit**/ {
  144. z-index:99999999999;
  145. font-weight:bold;
  146. text-align:center;
  147. font-size:14px;
  148. font-family:'Montez';
  149. position:fixed;
  150. bottom:5px;
  151. right:5px;
  152. }
  153. #credit a {
  154. display:inline-block;
  155. height:20px;
  156. width:20px;
  157. background-color:#3C4DB5; /**background colour of credit**/
  158. color:#9ca9f6; /**colour of link credit**/
  159. }
  160. #credit a:hover {
  161. background-color:#9ca9f6; /**background colour of credit hover**/
  162. color:#3C4DB5; /**colour of link credit hover**/
  163. }
  164. {CustomCSS}</style>
  165.  
  166. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  167.  
  168. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  169.  
  170. <script>
  171. (function($){
  172. $(document).ready(function(){
  173. $("a[title]").style_my_tooltips({
  174. tip_follows_cursor:true,
  175. tip_delay_time:0,
  176. tip_fade_speed:0,
  177. attribute:"title"
  178. });
  179. });
  180. })(jQuery);
  181. </script>
  182.  
  183. <script src="https://static.tumblr.com/ougxdjo/7cPmrvjid/lora.js" type="text/javascript"></script>
  184.  
  185. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  186. <script type="text/javascript">
  187. jQuery(document).ready(function() {
  188. jQuery(".sub").hide();
  189. //toggle the componenet with class msg_body
  190. jQuery(".cthrough").click(function()
  191. {
  192. jQuery(this).next(".sub").slideToggle(500);
  193. });});
  194. </script>
  195.  
  196. <link href='https://fonts.googleapis.com/css?family=Clicker+Script|Montez' rel='stylesheet' type='text/css'>
  197.  
  198. </head>
  199. <body>
  200. <div id="hcont"><center><div id="header"><h3>Tags Page</h3>
  201. <div id="links"> <!--copy and paste a line to add more links-->
  202. <a href="/">home</a> /
  203. <a href="/ask">message</a> /
  204. <a href="/link1">link 1</a> /
  205. <a href="/link2">link 2</a> /
  206. <a href="/link3">link 3</a>
  207. </div> <!--links-->
  208. </div></center></div>
  209.  
  210. <div id="container"><center><div id="entries">
  211.  
  212. <div id="tagcup1"> <!--column numero uno-->
  213.  
  214. <a href="#" class="cthrough"><div id="title">Category #1</div></a>
  215. <div class="sub"><div id="tags">
  216. <a href="/tagged/">tag</a>
  217. <a href="/tagged/">tag</a>
  218. <a href="/tagged/">tag</a>
  219. <a href="/tagged/">tag</a>
  220. <a href="/tagged/">tag</a>
  221. <a href="/tagged/">tag</a>
  222. <a href="/tagged/">tag</a>
  223. <a href="/tagged/">tag</a>
  224. <a href="/tagged/">tag</a>
  225. <a href="/tagged/">tag</a>
  226. </div>
  227. </div>
  228.  
  229. <!--copy and paste a whole section to add another row-->
  230.  
  231. <a href="#" class="cthrough"><div id="title">Category #4</div></a>
  232. <div class="sub"><div id="tags">
  233. <a href="/tagged/">tag</a>
  234. <a href="/tagged/">tag</a>
  235. <a href="/tagged/">tag</a>
  236. </div>
  237. </div>
  238.  
  239. <a href="#" class="cthrough"><div id="title">Category #7</div></a>
  240. <div class="sub"><div id="tags">
  241. <a href="/tagged/">tag</a>
  242. <a href="/tagged/">tag</a>
  243. <a href="/tagged/">tag</a>
  244. <a href="/tagged/">tag</a>
  245. <a href="/tagged/">tag</a>
  246. <a href="/tagged/">tag</a>
  247. <a href="/tagged/">tag</a>
  248. <a href="/tagged/">tag</a>
  249. <a href="/tagged/">tag</a>
  250. <a href="/tagged/">tag</a>
  251. <a href="/tagged/">tag</a>
  252. <a href="/tagged/">tag</a>
  253. <a href="/tagged/">tag</a>
  254. </div>
  255. </div>
  256. </div>
  257.  
  258. <div id="tagcup2">
  259. <a href="#" class="cthrough"><div id="title">Category #2</div></a>
  260. <div class="sub"><div id="tags">
  261. <a href="/tagged/">tag</a>
  262. <a href="/tagged/">tag</a>
  263. <a href="/tagged/">tag</a>
  264. <a href="/tagged/">tag</a>
  265. </div>
  266. </div>
  267.  
  268. <a href="#" class="cthrough"><div id="title">Category #5</div></a>
  269. <div class="sub"><div id="tags">
  270. <a href="/tagged/">tag</a>
  271. <a href="/tagged/">tag</a>
  272. <a href="/tagged/">tag</a>
  273. <a href="/tagged/">tag</a>
  274. <a href="/tagged/">tag</a>
  275. </div>
  276. </div>
  277.  
  278. <a href="#" class="cthrough"><div id="title">Category #8</div></a>
  279. <div class="sub"><div id="tags">
  280. <a href="/tagged/">tag</a>
  281. <a href="/tagged/">tag</a>
  282. <a href="/tagged/">tag</a>
  283. <a href="/tagged/">tag</a>
  284. <a href="/tagged/">tag</a>
  285. </div>
  286. </div>
  287. </div>
  288.  
  289. <div id="tagcup3">
  290. <a href="#" class="cthrough"><div id="title">Category #3</div></a>
  291. <div class="sub"><div id="tags">
  292. <a href="/tagged/">tag</a>
  293. <a href="/tagged/">tag</a>
  294. <a href="/tagged/">tag</a>
  295. <a href="/tagged/">tag</a>
  296. <a href="/tagged/">tag</a>
  297. </div>
  298. </div>
  299.  
  300. <a href="#" class="cthrough"><div id="title">Category #6</div></a>
  301. <div class="sub"><div id="tags">
  302. <a href="/tagged/">tag</a>
  303. <a href="/tagged/">tag</a>
  304. <a href="/tagged/">tag</a>
  305. <a href="/tagged/">tag</a>
  306. <a href="/tagged/">tag</a>
  307. </div>
  308. </div>
  309.  
  310. <a href="#" class="cthrough"><div id="title">Category #9</div></a>
  311. <div class="sub"><div id="tags">
  312. <a href="/tagged/">tag</a>
  313. <a href="/tagged/">tag</a>
  314. <a href="/tagged/">tag</a>
  315. <a href="/tagged/">tag</a>
  316. <a href="/tagged/">tag</a>
  317. </div>
  318. </div>
  319. </div></center>
  320. </div>
  321.  
  322. </div>
  323.  
  324. <div id="credit"><a href="https://theghostoflove.tumblr.com/" target="_blank" title="enchantingly">E</a></div>
  325.  
  326. </div>
  327. </body>
  328. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!