darianella

"The Guardian" tumblr terms page HTML code

Jul 3rd, 2013
1,067
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.31 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <link href='http://fonts.googleapis.com/css?family=Give+You+Glory' rel='stylesheet' type='text/css'>
  5.  
  6. <link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'>
  7.  
  8. <head>
  9. <title>Terms of Use</title>
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  13.  
  14. <!-- I know it's taken forever, but I'm finally, FINALLY uploading my old Terms of Use page for y'all. I'm really sorry for the delay! -->
  15.  
  16. <style type="text/css">
  17.  
  18. /*basics*/
  19.  
  20. iframe#tumblr_controls {display:none;}
  21.  
  22. body{
  23.     margin:0px;
  24.     /*this is where you can change the font, size, color, etc. of the main text*/
  25.     font-family:helvetica;
  26.     color:#888888;
  27.     font-size:10px;
  28.     line-height:100%;
  29.     /*this is where you put the url of the image you want to use for your background*/
  30.     background-image:url('https://lh6.googleusercontent.com/-VX3jWtgVzus/UEgH29wGmMI/AAAAAAAAA7w/tHNYsV6O3iU/s60-no/subtlenet2.png');
  31.     background-attachment: fixed;
  32.     background-repeat: repeat;
  33.     background-color: white;
  34. }
  35.  
  36. a{
  37.     text-decoration:none;
  38.     outline:none;
  39.     -moz-outline-style:none;
  40.     -webkit-transition: all 0.5s linear;
  41.     -moz-transition: all 0.5s linear;
  42.     -o-transition: all 0.5s linear;
  43. }
  44.  
  45. a:hover{
  46.     font-weight:bold;
  47.    
  48. }
  49.  
  50.  
  51. img{
  52.     border:none;
  53. }
  54.  
  55. blockquote{
  56.     padding-left:5px;
  57.     border-left:1px dashed #C7C7C7;
  58. }
  59.  
  60. blockquote blockquote{
  61.     padding-left:5px;
  62.     border-left:1px dashed #C7C7C7;
  63. }
  64.  
  65. /*content*/
  66.  
  67. #termsbox{
  68.     position:fixed;
  69.     /*the margin top and left values here will control where your main text box is placed on the page. a larger margin-top will move it down, a larger margin-left will move it right, vice-versa. make sure you keep the ratios consistant with the margin-top and left values of #main, below, or your title will be weirdly placed*/
  70.     margin-top:200px;
  71.     margin-left:70px;
  72.     width:500px;
  73.     height:300px;
  74.     /*here's where you put the url of the image you want ot have for the background of your textbox border. if you just want a solid color, delete the url below. remember to keep the apostrophes when adding in a new url, though.*/
  75.     background-image:url('https://lh6.googleusercontent.com/-hDgZUy2xLhM/UHmhBgl_tgI/AAAAAAAACa0/kGtl1v8LvLw/s70-no/office.png');
  76.     background-attachment: fixed;
  77.     background-repeat: repeat;
  78.     /*if you're using a dark border image on a dark background, I recommend changing the color of this border to a lighter color, so there is separation between the two.*/
  79.     border:1px solid #454544;
  80.     box-shadow:0px 0px 5px #888888;
  81.     /*if you're using a transparent texture or no image at all, here's the color of your border*/
  82.     background-color:#a7c8dc;
  83. }
  84.  
  85. #terms{
  86.     position:fixed;
  87.     margin:20px;
  88.     width:420px;
  89.     height:220px;
  90.     box-shadow:0px 0px 5px #c7c7c7;
  91.     /*change the color of your textbox background here*/
  92.     background-color:#ffffff;
  93.     padding-left:10px;
  94.     padding-top:20px;
  95.     padding-bottom:20px;
  96.     padding-right:30px;
  97.     text-align:justify;
  98.     line-height:10px;
  99. }
  100.  
  101. #please{
  102.     font-size:14px;
  103.     letter-spacing:3px;
  104.     /* to change the color/font of the "please read before continuing"*/
  105.     color:#232323;
  106.     font-family:monospace;
  107.     margin-left:60px;
  108.     margin-top:11px;
  109. }
  110.  
  111. #onwards a{
  112.     margin-left:145px;
  113.     /*to change the color/font of the "continue onwards"*/
  114.     color:#59b2b6;
  115.     font-family:monospace;
  116.     font-size:12px;
  117.     letter-spacing:3px;
  118. }
  119.  
  120. #onwards a:hover{
  121.     /*to change the color the "continue onwards" turns on hover*/
  122.     color:#323130;
  123.     text-shadow: 0px 0px 5px gray;
  124. }
  125.  
  126. #main{
  127.     position:fixed;
  128.     /*position your title here. Keep the margin-left the same as #termsbox, and the margin-top 60px less than the margin-top value of #termsbox*/
  129.     margin-left:70px;
  130.     margin-top:140px;
  131.     width:500px;
  132.     text-align:center;
  133.     /*change the size, font, color, shadow color, etc. for the title here*/
  134.     font-family: 'Amatic SC', cursive;
  135.     font-size:50px;
  136.     color:#232323;
  137.     text-shadow:0px 0px 5px #888888;
  138. }
  139.  
  140. #sideimage{
  141.     position:fixed;
  142.     bottom:0;
  143.     /*you can position your render image here the same way you did #termsbox, and define its size if the image is huge*/
  144.     margin-left:620px;
  145.     max-width:500px;
  146.  
  147. }
  148.  
  149. #credit{
  150.     position:fixed;
  151.     bottom:10px;
  152.     right:10px;
  153.     z-index:1;
  154.     -webkit-transition: all 0.3s linear;
  155.     -moz-transition: all 0.3s linear;
  156.     -o-transition: all 0.3s linear;
  157.     -ms-transition: all 0.3s linear;
  158.         -webkit-filter: grayscale(100%);
  159.       -moz-filter: grayscale(100%);
  160.       -ms-filter: grayscale(100%);
  161.       -o-filter: grayscale(100%);
  162. }
  163.  
  164. #credit:hover{
  165.    -webkit-filter: grayscale(0%);
  166.   -moz-filter: grayscale(0%);
  167.   -ms-filter: grayscale(0%);
  168.   -o-filter: grayscale(0%);
  169. }
  170.  
  171.  
  172.  
  173. {CustomCSS}
  174.    
  175. body {cursor: url(http://www.dolliehost.com/dolliecrave/cursors/cursors-arrow/arrow38.gif), progress !important;}
  176.    
  177. a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important;}
  178.    
  179. </style>
  180.    
  181.    
  182. </head>
  183.  
  184. <body>
  185.  
  186. <a href="http://redfox-themes.tumblr.com"><img src="https://lh5.googleusercontent.com/-jDb8l0m6g2s/ULvHPyFukjI/AAAAAAAACoA/FRBmvQsxRkc/s22/fox.gif" id="credit" title="redfox themes"></a>
  187.  
  188. <div id="main">
  189.     <!-- your title goes here-->
  190.     Terms of Use
  191.    
  192. </div>
  193.  
  194. <div id="termsbox">
  195.     <div id="terms">
  196.         <div id="please">PLEASE READ BEFORE CONTINUING:</div>
  197.         <br>
  198.        
  199.     <ul><li>
  200.         My themes are <b>not to be used as a base code</b>! There are plenty of base codes available, at varying degrees of simplicity. There is no excuse for utilizing this page as such, when I, myself, have posted a base code version on my blog.  
  201.     </li>
  202.         <br>
  203.     <li>
  204.         <b>Minor edits are allowed</b> and encouraged, so long as you <b>do not remove the credit</b> or internal-watermark! Those define the theme as rightfully mine, and I'd ask that you please respect that!
  205.     </li>
  206.         <br>
  207.     <li>
  208.         <b>Do not redistribute</b> this theme, or claim it as your own! While this is public code, it is my work, and something that I have worked hard to make as brilliant as possible for you all! It's basic common sense that other's things are not to be taken, or passed around without their permission. Let's keep what we all learned in kindergarden around here on tumblr!
  209.     </li></ul>
  210.         <br><br>
  211.        
  212.         <div id="onwards">
  213.     <!--type the url you want the "continue onwards" to send your viewer to in place of the slash, between the quotes after the href= below-->    
  214.         <b><a href="/">
  215.             CONTINUE ONWARDS
  216.         </a></b>
  217.         </div>
  218.        
  219.     </div>
  220. </div>
  221.  
  222.     <!--add the url of the render image you want to use in place of the one below-->
  223.  
  224. <img src="https://lh6.googleusercontent.com/-WArENauoKiA/UdTBF7GsoQI/AAAAAAAAFO4/Zk0i-CbRJhQ/w586-h765-no/Yamamoto_Takeshi+copy.png" id="sideimage" />
  225.  
  226. </body></html>
Add Comment
Please, Sign In to add comment