API tools faq
paste
Advertisement
quiddittch

about page 02

quiddittch
Jul 24th, 2015
4,612
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 5.56 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5. <!------------------------------------------------------------------
  6.  
  7. ABOUT PAGE #2 BY JAEBIUM
  8.  
  9. -dont steal
  10. -dont remove credit
  11. -edit as much as you want
  12.  
  13. -------------------------------------------------------------------->
  14.  
  15. <title>About Me - {Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}" />
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  18. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  19.  
  20. <!----jquery--->
  21.  
  22. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  23.  
  24. <!---tooltip--->
  25.  
  26. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  27.  
  28. <script>
  29.  
  30. (function($){
  31.  
  32. $(document).ready(function(){
  33.  
  34. $("a[title]").style_my_tooltips({
  35.  
  36. tip_follows_cursor:true,
  37.  
  38. tip_delay_time:0,
  39.  
  40. tip_fade_speed:300,
  41.  
  42. attribute:"title"
  43.  
  44. });
  45.  
  46. });
  47.  
  48. })(jQuery);
  49.  
  50. </script>
  51.  
  52. <!-----google fonts---->
  53.  
  54. <link href='http://fonts.googleapis.com/css?family=Open+Sans:700,600' rel='stylesheet' type='text/css'>
  55.  
  56. <link href='http://fonts.googleapis.com/css?family=Lato:900' rel='stylesheet' type='text/css'>
  57.  
  58. <style type="text/css">
  59.  
  60. /*----tooltip----*/
  61.  
  62. #s-m-t-tooltip {
  63. font-size:8px;
  64. position:absolute;
  65. color:#787878;
  66. background-color:rgba(255,255,255,.9);
  67. margin-top:20px;
  68. margin-left:10px;
  69. max-width:300px;
  70. z-index:9;
  71. font-size:7px;
  72. padding:2px 5px;
  73. text-transform:lowercase;
  74. }
  75.  
  76. /*------scrollbar------*/
  77.  
  78. ::-webkit-scrollbar {
  79. width: 6px; height: 3px; background: {color:background};
  80. }
  81.  
  82. ::-webkit-scrollbar-thumb {
  83. border:2px solid white;
  84. background-color:#e8e8e8;
  85. }
  86.  
  87. /*------selection---*/
  88.  
  89. ::selection {color: #787878; background: #f9f9f9;}
  90. ::-moz-selection {color: #787878; background: #f9f9f9;}
  91. ::-webkit-selection {color: #787878; background: #f9f9f9;}
  92.  
  93. /*---body--*/
  94.  
  95. body {
  96. margin:0;
  97. line-height:17px;
  98. background:#f8f8f8;
  99. color:#9f9f9f;
  100. font-size:9px;
  101. font-family:'open sans', sans-serif, arial, trebuchet ms, calibri;
  102. font-weight:600;
  103. }
  104.  
  105. a {
  106. text-decoration:none;
  107. color:#606060;
  108. -webkit-transition:0.6s all;
  109. -moz-transition:0.6s all;
  110. -o-transition:0.6s all;
  111. transition:0.6s all;
  112. }
  113.  
  114. a:hover {
  115. color:#000000;
  116. }
  117.  
  118. pre {
  119. white-space: pre-wrap;
  120. white-space: -moz-pre-wrap;
  121. white-space: -pre-wrap;
  122. white-space: -o-pre-wrap;
  123. word-wrap: break-word;
  124. }
  125.  
  126. blockquote {
  127. border-left:2px solid #e0e0e0;
  128. margin-left:0px;
  129. padding-left:20px;
  130. max-width: 100%;
  131. }
  132.  
  133. /*----content----*/
  134.  
  135. #wrap {
  136. position:absolute;
  137. width:604px;
  138. left:50%;
  139. top:50%;
  140. margin-left:-302px;
  141. margin-top:-180px;
  142. }
  143.  
  144. #left img {
  145. width:300px;
  146. height:300px;
  147. background:white;
  148. opacity:.9;
  149. }
  150.  
  151. #right {
  152. float:right;
  153. }
  154.  
  155. #title {
  156. width:260px;
  157. padding:12px 20px;
  158. text-align:left;
  159. color:#ffffff;
  160. background:#A6bcd0;
  161. font-weight:bold;
  162. text-transform:uppercase;
  163. letter-spacing:1px;
  164. font-family:'Lato', sans-serif;
  165. font-weight:900;
  166. font-size:9px;
  167. }
  168.  
  169. #description {
  170. height:289px;
  171. width:258px;
  172. padding:5px 20px;
  173. text-align:left;
  174. background:white;
  175. margin-top:5px;
  176. word-wrap: break-word;
  177. overflow-y:auto;
  178. border:1px solid #f0f0f0;
  179. }
  180.  
  181. .links {
  182. margin-top:5px;
  183. width:260px;
  184. padding:12px 20px;
  185. text-transform:uppercase;
  186. letter-spacing:1px;
  187. font-size:6px;
  188. font-weight:bold;
  189. font-family:'Lato', sans-serif;
  190. background:#505050;
  191. text-align:left;
  192. word-spacing:5px;
  193. }
  194.  
  195. .links a {
  196. color:#fff;
  197. margin-right:5px;
  198. }
  199.  
  200. .links a:hover {
  201. color:#d0d0d0;
  202. }
  203.  
  204. {CustomCSS}</style></head><body>
  205.  
  206. <div id="wrap">
  207.  
  208. <div id="right">
  209. <div id="title">About Me</div>
  210. <div id="description">
  211.  
  212. <p><b>Fill this in with stuff about yourself!</b> Theres so much space for it. This is a very simple page and easy to customize if you have basic knowledge on html/css.</p>
  213.  
  214. <p>Etiam convallis a quam ac consequat. Nulla ut orci id elit sollicitudin dapibus. Aenean commodo ex ipsum, a interdum quam gravida in. Curabitur sit amet mi non dolor molestie ornare.</p>
  215.  
  216. <p><a href="/">Vestibulum</a> consectetur lacus non risus vestibulum, ut volutpat nisl tincidunt. Integer commodo sit amet nulla sit amet efficitur. </p>
  217.  
  218. <p>Nullam facilisis turpis eu neque tempus lobortis. Phasellus vitae turpis at est vestibulum vulputate. Sed sapien ex, vehicula blandit blandit a, efficitur venenatis lectus. Donec rutrum sagittis tellus.</p>
  219.  
  220. </div>
  221. </div>
  222.  
  223. <div id="left">
  224. <!---put the image link here---->
  225. <img src="http://40.media.tumblr.com/0935a4230fd9dcfd920b9ac57f076042/tumblr_npjifbErIf1r3ssjeo2_r1_540.png">
  226.  
  227. <div class="links">
  228. <a href="/">Home</a>
  229. <a href="/ask">Ask</a>
  230. <a href="http://tumblr.com/dashboard">Dashboard</a>
  231. <!---credit--->
  232. <a href="http://jaebium.tumblr.com" title="theme credit" target="_blank">@</a>
  233. </div>
  234. </div>
  235.  
  236. </div>
  237.  
  238.  
  239. </body>
  240. </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!