Advertisement
silvyshi

Pesterlog Style Relationships Page - Light

Sep 20th, 2012
613
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.94 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <head>
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8.  
  9. <style type="text/css">
  10. body
  11. {font-family:courier new;
  12. font-size:11px;
  13. text:#626262;
  14. background:url("http://media.tumblr.com/tumblr_mao5ucdBdg1rr6cbp.png");
  15. background-color:#ffffff;}
  16.  
  17. img
  18. {
  19. border-color: black;
  20. }
  21.  
  22. h1
  23. {color: #626262;
  24. font-size: 12px;
  25. letter-spacing:-1px;
  26. border-bottom: 2px dotted #626262;
  27. border-top: 2px dotted #626262;
  28. text-align: left;
  29. font-family: arial;
  30. line-height:15px;
  31. padding:1px;
  32. margin:5px; }
  33.  
  34. h2
  35. {color: #e00707;
  36. font-size: 12px;
  37. letter-spacing:-1px;
  38. border-bottom: 2px dotted #626262;
  39. border-top: 2px dotted #626262;
  40. text-align: right;
  41. font-family: arial;
  42. line-height:15px;
  43. padding:1px;
  44. margin:5px; }
  45.  
  46. a
  47. {text-decoration:none;
  48. color:#333;}
  49.  
  50.  
  51. #all
  52. {margin:0 auto;
  53. margin-top:20px;
  54. padding:5px;
  55. border:1px solid #626262;
  56. background-color:#ddd;}
  57.  
  58.  
  59. #links
  60. {width:550px;
  61. padding:15px;
  62. background-color:#333;
  63. position:absolute;
  64. margin:310px 30px 30px 30px;
  65. text-transform:uppercase;
  66. font-size:8px;}
  67.  
  68. #relationships
  69. {overflow:auto;
  70. width:450px;
  71. height:570px;}
  72.  
  73. #picture
  74. {}
  75.  
  76. #navigation
  77. {font-style:italic;
  78. letter-spacing:1px;
  79. text-align:center;
  80. margin:10px 10px 5px 10px;
  81. color:#555;
  82. padding-bottom:3px;
  83. border-bottom:#e5e5e5 1px dashed;}
  84.  
  85. .title
  86. {color:#6cc4db;
  87. font-weight:800;
  88. margin-bottom:3px;
  89. border-left:11px solid;
  90. padding-left:5px;
  91. letter-spacing:1px;}
  92.  
  93. #color
  94. {color:#a2e367;}
  95. </style>
  96. </head>
  97.  
  98. <body>
  99. <table id="all" cellspacing="0" cellpadding="0">
  100. <tr>
  101. <td>
  102. <div id="relationships">
  103. <div id="picture"><center><img src="http://media.tumblr.com/tumblr_mao99tsifu1rr6cbp.png" width="420"></center></div>
  104. <div id="navigation">/+/ <a href="/">home</a> /+/ <a href="/ask">message</a> /+/ <a href="/archive">history</a> /+/ <a href="http://silvyshi.tumblr.com/">credit</a> /+/</div>
  105.  
  106. <!-- Quadrants Start -->
  107. <center><div style="border: 1px dashed gray; width: 420px; padding: 1px; background: #f0f0f0;"><div><button type="button" class="button" onmouseover="this.sv=this.style.backgroundColor; this.style.backgroundColor='#777777';" onmouseout="if(this.sv)this.style.backgroundColor=this.sv; else this.style.backgroundColor='';" onclick="this.parentNode.parentNode.childNodes[1].style.display = ''; this.parentNode.style.display = 'none'; return false;" title="Click to show Quadrants.">Show Quadrants</button></div><div class="spoiler" style="display: none;"><div><button type="button" class="button" onclick="this.parentNode.parentNode.parentNode.childNodes[0].style.display = ''; this.parentNode.parentNode.style.display = 'none'; return false;" title="Click to hide Quadrants.">Hide Quadrants</button></div>
  108. <table width="98%" border="0" cellpadding="3" cellspacing="0">
  109. <tr>
  110. <td width="100%" valign="top">
  111. <p style=" font-weight: bold; font-family: courier, monospace;color:#ffffff">
  112. <font face="courier" color="#626262"><b></center><p align="left">
  113. <!-- Matesprit Start -->
  114. <center><a href="http://MatespritUrlHere" title="What you write here will show up when you hover over the icons."><img src="http://media.tumblr.com/tumblr_lwu3opzRnS1qflg4k.gif" /><img src="http://imageoneurl" height="100" width="100"/><img src="http://imagetwourl" height="100" width="100" /><img src="http://imagethreeurl" height="100" width="100" /><img src="http://media.tumblr.com/tumblr_lwu3opzRnS1qflg4k.gif" /></a></center> This is your matesprit and you should probably replace this with something really sappy and sweet and whatever so you aren't stuck with this dumb preview text because the person who wrote this has pretty much no idea what she's doing.
  115. <!-- Matesprit End -->
  116. <br>
  117. <!-- Moirail Start -->
  118. <center><a href="http://MoirailUrlHere" title="What you write here will show up when you hover over the icons."><img src="http://media.tumblr.com/tumblr_lwu3swjrQr1qflg4k.gif" /><img src="http://imageoneurl" height="100" width="100"/><img src="http://imagetwourl" height="100" width="100" /><img src="http://imagethreeurl" height="100" width="100" /><img src="http://media.tumblr.com/tumblr_lwu3swjrQr1qflg4k.gif" /></a></center> This is your moirail and you should probably replace this with something sweet and endearing so you don't have the dumb preview text here when you actually use this page or whatever.
  119. <!-- Moirail End -->
  120. <br>
  121. <!-- Kismesis Start -->
  122. <center><a href="http://KismesisUrlHere" title="What you write here will show up when you hover over the icons."><img src="http://media.tumblr.com/tumblr_lwu3qp6jRi1qflg4k.gif" /><img src="http://imageoneurl" height="100" width="100"/><img src="http://imagetwourl" height="100" width="100" /><img src="http://imagethreeurl" height="100" width="100" /><img src="http://media.tumblr.com/tumblr_lwu3qp6jRi1qflg4k.gif" /></a></center> This is your matesprit and you should probably replace this with something really sappy and sweet and whatever so you aren't stuck with this dumb preview text because the person who wrote this has pretty much no idea what she's doing.
  123. <!-- Kismesis End -->
  124. <br>
  125. <!-- Auspistice Start -->
  126. <center><img src="http://media.tumblr.com/tumblr_lwu3maM4Xk1qflg4k.gif" /><a href="http://IdkUrlOfTheFirstPersonWhosFightingAndWhosNotTheAuspiticeGoesHereOrWhatever"><img src="http://OkAndTheirPictureGoesHere" height="100" width="100"/></a><a href="http://OkAndNowTheAuspiticeUrl"><img src="http://AndTheirPicture" height="100" width="100" /></a><a href="http://UrlOfTheOtherPersonWhosFightingHere"><img src="http://AaaandTheirPicture" height="100" width="100" /></a><img src="http://media.tumblr.com/tumblr_lwu3maM4Xk1qflg4k.gif" /></a></center> More dumb preview text.
  127. <!-- Auspistice End -->
  128. </font>
  129. <br />
  130. <br /></table></div></center>
  131. <!-- Quadrants End -->
  132.  
  133. <!-- Timeline Start -->
  134. <center><div style="border: 1px dashed gray; width: 420px; padding: 1px; background: #f0f0f0;"><div><button type="button" class="button" onmouseover="this.sv=this.style.backgroundColor; this.style.backgroundColor='#777777';" onmouseout="if(this.sv)this.style.backgroundColor=this.sv; else this.style.backgroundColor='';" onclick="this.parentNode.parentNode.childNodes[1].style.display = ''; this.parentNode.style.display = 'none'; return false;" title="Click to show timeline.">Show Timeline</button></div><div class="spoiler" style="display: none;"><div><button type="button" class="button" onclick="this.parentNode.parentNode.parentNode.childNodes[0].style.display = ''; this.parentNode.parentNode.style.display = 'none'; return false;" title="Click to hide timeline.">Hide Timeline</button></div>
  135. <table width="98%" border="0" cellpadding="3" cellspacing="0">
  136. <tr>
  137. <td width="100%" valign="top">
  138. <p style=" font-weight: bold; font-family: courier, monospace;color:#ffffff">
  139. <font face="courier" color="#626262"><b></center><p align="left">
  140. <!-- 01 Start -->
  141. <a href="http://usernamehere.tumblr.com/" title="What you write here will show up when you hover over the displayed picture."><img src="http://IconSpriteOrOtherImageHere.gif" align="left"></a> This is someone from your timeline and due to that fact, you have decided that they are a person you should display on your shiny new relationships page. This is also some lame-ass preview text that you should get rid of as soon as possible because how LAME do you even need to BE.<br><br>
  142. <!-- 01 End -->
  143. <!-- 02 Start -->
  144. <br><br><a href="http://usernamehere.tumblr.com/" title="What you write here will show up when you hover over the displayed picture."><img src="http://IconSpriteOrOtherImageHere.gif" align="left"></a> This is some more preview text because I don't know why, actually. This is incredibly stupid.
  145. <!-- 02 End -->
  146. </p></b></font>
  147. </table></div></center>
  148. <!-- Timeline End -->
  149.  
  150. <!-- Other Relations Start -->
  151. <center><div style="border: 1px dashed gray; width: 420px; padding: 1px; background: #f0f0f0;"><div><button type="button" class="button" onmouseover="this.sv=this.style.backgroundColor; this.style.backgroundColor='#777777';" onmouseout="if(this.sv)this.style.backgroundColor=this.sv; else this.style.backgroundColor='';" onclick="this.parentNode.parentNode.childNodes[1].style.display = ''; this.parentNode.style.display = 'none'; return false;" title="Click to show other relations.">Show Other Relations</button></div><div class="spoiler" style="display: none;"><div><button type="button" class="button" onclick="this.parentNode.parentNode.parentNode.childNodes[0].style.display = ''; this.parentNode.parentNode.style.display = 'none'; return false;" title="Click to hide other relations.">Hide Other Relations</button></div>
  152. <table width="98%" border="0" cellpadding="3" cellspacing="0">
  153. <tr>
  154. <td width="100%" valign="top">
  155. <p style=" font-weight: bold; font-family: courier, monospace;color:#ffffff">
  156. <font face="courier" color="#626262"><b></center><p align="left">
  157. <!-- 01 Start -->
  158. <a href="http://usernamehere.tumblr.com/" title="What you write here will show up when you hover over the displayed picture."><img src="http://IconSpriteOrOtherImageHere.gif" align="left"></a> This is someone you know and due to that fact, you have decided that they are a person you should display on your shiny new relationships page. This is also some lame-ass preview text that you should get rid of as soon as possible because how LAME do you even need to BE.<br><br>
  159. <!-- 01 End -->
  160. <!-- 02 Start -->
  161. <br><br><a href="http://usernamehere.tumblr.com/" title="What you write here will show up when you hover over the displayed picture."><img src="http://IconSpriteOrOtherImageHere.gif" align="left"></a> This is some more preview text because I don't know why, actually. This is incredibly stupid.
  162. <!-- 02 End -->
  163. </p></b></font>
  164. </table></div></center>
  165. <!-- Other Relations End -->
  166.  
  167. </div><!--relationships-->
  168. </td>
  169. </tr>
  170. </table>
  171. </body>
  172. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement