API tools faq
paste
Advertisement
themekid

faves page #1

themekid
Jul 13th, 2016
671
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.67 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <!------------------------------------------
  4.  
  5. (◍•ᴗ•◍)♡ ✧*。
  6.  
  7. Faves Page #1 by ThemeKid Chloë | @redivide | @themekid
  8.  
  9. > Do not delete/alter any credit.
  10. > Do not claim as your own.
  11. > Do not copy any code.
  12. > Do not redistribute.
  13.  
  14. ------------------------------------------->
  15. <meta charset="UTF-8" />
  16. <title>Faves Page</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"> </script>
  19. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  20. <script>
  21. (function($){ $(document).ready(function(){ $("[title],a[title],img[title]").style_my_tooltips({ tip_follows_cursor:true, tip_delay_time:100, tip_fade_speed:300, attribute:"title" }); }); })(jQuery);
  22. </script>
  23. <script language="JavaScript">var fhs = document.createElement('script');var fhs_id = "5335300";var ref = (''+document.referrer+'');var pn = window.location;var w_h = window.screen.width + " x " + window.screen.height;fhs.src = "//s1.freehostedscripts.net/ocounter.php?site="+fhs_id+"&e1=&e2=&r="+ref+"&wh="+w_h+"&a=1&pn="+pn+"";document.head.appendChild(fhs);document.write("<span style='display:none;' id='o_"+fhs_id+"'></span>");</script>
  24. <link rel="stylesheet" href="http://static.tumblr.com/8pnyeus/29To2og0o/styles.css">
  25. <script src="https://dl.dropboxusercontent.com/s/7ke33tjjl8rty02/scripts.js"></script>
  26. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  27. <link href='https://fonts.googleapis.com/css?family=Lora:400,700,400italic|Roboto+Condensed|Courgette|Nixie+One' rel='stylesheet' type='text/css'>
  28. <style type="text/css">
  29. #tumblr_controls, .tmblr-iframe {top:10px!important;right:10px!important;-webkit-filter: invert(90%);filter: invert(90%);position:fixed!important;-webkit-transform:scale(.8, .8);-moz-transform:scale(.8, .8);transform:scale(.8, .8);-webkit-transform-origin: right top;-moz-transform-origin: right top;-ms-transform-origin: right top;-o-transform-origin: right top;transform-origin: right top;z-index:999999999999999999!important}
  30. ::-webkit-scrollbar {background-color:#ddd;height: 11px;width: 11px;border:5px solid #fff;}
  31. ::-webkit-scrollbar-thumb {background-color:#000;border:5px solid #fff;}
  32. * {margin:0;padding:0;}
  33. img {max-width:100%;height:auto;vertical-align:middle;}
  34. body:before {width:100%;height:5px;position:fixed;top:0;left:0;content:'';z-index:999999;}
  35. body:after {width:100%;height:5px;position:fixed;bottom:0;left:0;content:'';z-index:999999;}
  36. html:before {height:100%;width:5px;position:fixed;top:0;left:0;content:'';z-index:999999;}
  37. html:after {height:100%;width:5px;position:fixed;top:0;right:0;content:'';z-index:999999;}
  38. a {text-decoration:none;}
  39. #title {font-weight:normal;text-align:center;margin:20px;font-size:1.8em;}
  40. #promo {position:fixed;right:20px;bottom:70px;width:200px;text-align:right;}
  41. #promo h2 {margin-bottom:7px;}
  42. #content {text-align:center;width:calc(100% - 460px);max-width:1140px;margin:40px auto;}
  43. article {width:128px;height:128px;margin:20px;display:inline-block;position:relative;overflow:hidden;}
  44. article img {position:relative;top:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  45. article:hover img {top:-13px;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  46. .info {background:#ceb3af;padding:5px;position:absolute;bottom:-25px;width:calc(100% - 10px);height:15px;line-height:15px;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  47. article:hover .info {bottom:0;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
  48. .info a {color:#fff;}
  49. hr {border:none;height:3px;width:150px;margin:30px auto;background:#ceb3af;}
  50.  
  51.  
  52. /******AVOID EDITING ABOVE HERE UNLESS YOU'RE EXPERIENCED******/
  53.  
  54. /* change the font of the page! */
  55. body {
  56. font-size:11px;
  57. font-family:'Lora', serif;
  58. }
  59.  
  60. /* change the accent! */
  61. body:before, body:after, html:before, html:after, hr, .info {
  62. background:#ceb3af;
  63. }
  64.  
  65. /* change the link colour! */
  66. a {
  67. color:#ceb3af;
  68. }
  69.  
  70. /* change the page title font */
  71. #title {
  72. font-family:'Nixie One', serif;
  73. }
  74.  
  75. /* change the blog name font! */
  76. .info {
  77. font-family:'Roboto Condensed', sans-serif;
  78. }
  79. /* change the size of the icons! */
  80. article {
  81. width:128px;
  82. height:128px;
  83. }
  84.  
  85. /* change the promo title colour and font! */
  86. #promo h2 {
  87. font-family: 'Courgette', sans-serif;
  88. color:#ceb3af;
  89. }
  90.  
  91. /* change the style of tooltips! */
  92. #s-m-t-tooltip {
  93. max-width:300px;
  94. padding:3px 6px;
  95. margin:20px 10px;
  96. background: #000;
  97. color:#fff;
  98. z-index:999999999999999!important;
  99. font-size:9px;
  100. text-transform:uppercase;
  101. font-family:'Roboto Condensed',sans-serif;
  102. }
  103. </style>
  104. </head>
  105. <body>
  106. <a style="position:fixed; top:13px; left:13px;" title="home" href="/"><i class="fa fa-arrow-left fa-2x"></i></a>
  107.  
  108.  
  109.  
  110. <div id="title">
  111.  
  112.  
  113. <!--change the header image here!-->
  114. <img src="http://s9.favim.com/orig/130919/angel-angel-wings-overlay-transparent-Favim.com-935848.png" style="height:200px">
  115.  
  116.  
  117.  
  118. <!--delete this if you change the image!!!-->
  119. <div style="margin-top:-35px"></div>
  120. <!--//////////////////////////////////////-->
  121.  
  122.  
  123. <!--change the title here!-->
  124. <h2>My First Ever Faves</h2>
  125. <hr>
  126.  
  127. </div>
  128.  
  129.  
  130.  
  131. <!--add your promo stuff here!-->
  132. <div id="promo">
  133.  
  134.  
  135. <!--title of promo info!-->
  136. <h2>want a promo?</h2>
  137.  
  138. <!--promo guidelines!-->
  139. for a promo to ?k follow 3+ of my faves and then message me for a fbr + ba.
  140. </div>
  141.  
  142.  
  143.  
  144.  
  145. <div id="content">
  146.  
  147. <!--this is the start of one person!-->
  148. <article>
  149.  
  150. <!--icon goes here! make sure it's square!-->
  151. <img src="http://67.media.tumblr.com/d2cff7fdf896567d4f88b495042ccf2c/tumblr_o4qz4ht1tJ1r3knzko1_400.jpg">
  152.  
  153. <div class="info">
  154.  
  155. <!--URL goes here!-->
  156. <a href="http://username.tumblr.com">BLOGNAME</a>
  157.  
  158. </div>
  159. </article>
  160. <!--this is the end of one person!-->
  161.  
  162.  
  163. <!--this is the start of one person!-->
  164. <article>
  165.  
  166. <!--icon goes here! make sure it's square!-->
  167. <img src="http://67.media.tumblr.com/ad02159be07faa1262292a59cac284f7/tumblr_nqysvvqjew1qb7fcqo1_400.jpg">
  168.  
  169. <div class="info">
  170.  
  171. <!--URL goes here!-->
  172. <a href="http://username.tumblr.com">BLOGNAME</a>
  173.  
  174. </div>
  175. </article>
  176. <!--this is the end of one person!-->
  177.  
  178.  
  179. <!--this is the start of one person!-->
  180. <article>
  181.  
  182. <!--icon goes here! make sure it's square!-->
  183. <img src="http://67.media.tumblr.com/b1f002486f6c336fde195e066d414619/tumblr_nqmfgzsPFo1tn6jt3o1_400.jpg">
  184.  
  185. <div class="info">
  186.  
  187. <!--URL goes here!-->
  188. <a href="http://username.tumblr.com">BLOGNAME</a>
  189.  
  190. </div>
  191. </article>
  192. <!--this is the end of one person!-->
  193.  
  194.  
  195. <!--this is the start of one person!-->
  196. <article>
  197.  
  198. <!--icon goes here! make sure it's square!-->
  199. <img src="http://65.media.tumblr.com/910eb271a93bd1852596af04756ce78c/tumblr_ny2uscMnAD1tpgo9eo1_400.jpg">
  200.  
  201. <div class="info">
  202.  
  203. <!--URL goes here!-->
  204. <a href="http://username.tumblr.com">BLOGNAME</a>
  205.  
  206. </div>
  207. </article>
  208. <!--this is the end of one person!-->
  209.  
  210.  
  211. <!--this is the start of one person!-->
  212. <article>
  213.  
  214. <!--icon goes here! make sure it's square!-->
  215. <img src="http://67.media.tumblr.com/645d36f1d96794c985077da37f6465af/tumblr_o5diwpZ52f1r9hsjmo1_400.jpg">
  216.  
  217. <div class="info">
  218.  
  219. <!--URL goes here!-->
  220. <a href="http://username.tumblr.com">BLOGNAME</a>
  221.  
  222. </div>
  223. </article>
  224. <!--this is the end of one person!-->
  225.  
  226.  
  227. <!--this is the start of one person!-->
  228. <article>
  229.  
  230. <!--icon goes here! make sure it's square!-->
  231. <img src="http://65.media.tumblr.com/d74d72c8483f7dfb9b9895b5670f5104/tumblr_nw4tz1Fmya1uguo7go1_400.jpg">
  232.  
  233. <div class="info">
  234.  
  235. <!--URL goes here!-->
  236. <a href="http://username.tumblr.com">BLOGNAME</a>
  237.  
  238. </div>
  239. </article>
  240. <!--this is the end of one person!-->
  241.  
  242.  
  243. <!--this is the start of one person!-->
  244. <article>
  245.  
  246. <!--icon goes here! make sure it's square!-->
  247. <img src="http://67.media.tumblr.com/cdb6126132639a4f986f4b8556d08895/tumblr_o6uab4Qjx91v8yaeco1_400.jpg">
  248.  
  249. <div class="info">
  250.  
  251. <!--URL goes here!-->
  252. <a href="http://username.tumblr.com">BLOGNAME</a>
  253.  
  254. </div>
  255. </article>
  256. <!--this is the end of one person!-->
  257.  
  258.  
  259. <!--this is the start of one person!-->
  260. <article>
  261.  
  262. <!--icon goes here! make sure it's square!-->
  263. <img src="http://66.media.tumblr.com/3daf06d65fc8900bfd102bde828951ee/tumblr_nho41gNchu1tn6jt3o1_400.jpg">
  264.  
  265. <div class="info">
  266.  
  267. <!--URL goes here!-->
  268. <a href="http://username.tumblr.com">BLOGNAME</a>
  269.  
  270. </div>
  271. </article>
  272. <!--this is the end of one person!-->
  273.  
  274.  
  275. <!--this is the start of one person!-->
  276. <article>
  277.  
  278. <!--icon goes here! make sure it's square!-->
  279. <img src="http://66.media.tumblr.com/d6db3a67c353aad60d62fe7a1f63e9f8/tumblr_o3fkwjqwiM1qb80pho1_400.jpg">
  280.  
  281. <div class="info">
  282.  
  283. <!--URL goes here!-->
  284. <a href="http://username.tumblr.com">BLOGNAME</a>
  285.  
  286. </div>
  287. </article>
  288. <!--this is the end of one person!-->
  289.  
  290.  
  291. <!--this is the start of one person!-->
  292. <article>
  293.  
  294. <!--icon goes here! make sure it's square!-->
  295. <img src="http://66.media.tumblr.com/f04308082320e1ef857468984f926787/tumblr_o516juyeqT1skpo5ko1_400.jpg">
  296.  
  297. <div class="info">
  298.  
  299. <!--URL goes here!-->
  300. <a href="http://username.tumblr.com">BLOGNAME</a>
  301.  
  302. </div>
  303. </article>
  304. <!--this is the end of one person!-->
  305.  
  306.  
  307. <!--this is the start of one person!-->
  308. <article>
  309.  
  310. <!--icon goes here! make sure it's square!-->
  311. <img src="http://65.media.tumblr.com/738f32908ff40f88db5aa12cb0e17764/tumblr_nz8ccdAA5d1uqdir0o1_400.jpg">
  312.  
  313. <div class="info">
  314.  
  315. <!--URL goes here!-->
  316. <a href="http://username.tumblr.com">BLOGNAME</a>
  317.  
  318. </div>
  319. </article>
  320. <!--this is the end of one person!-->
  321.  
  322.  
  323. <!--this is the start of one person!-->
  324. <article>
  325.  
  326. <!--icon goes here! make sure it's square!-->
  327. <img src="http://67.media.tumblr.com/b0a23d966b0332578532eb2dc97bea4c/tumblr_nzs8unuxbw1sodd3to1_400.jpg">
  328.  
  329. <div class="info">
  330.  
  331. <!--URL goes here!-->
  332. <a href="http://username.tumblr.com">BLOGNAME</a>
  333.  
  334. </div>
  335. </article>
  336. <!--this is the end of one person!-->
  337.  
  338.  
  339.  
  340.  
  341. <!--if you want more people paste it ABOVE this!-->
  342. </div>
  343.  
  344. </body>
  345. </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!