Advertisement
booksinvolved

asoue about

Jun 26th, 2014
907
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 7.61 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.  
  5. <head>
  6. <!---- theme by jasnahdavar
  7. ------ PLEASE do not steal/redistribute/remove credit
  8. ------ ASK ME if you want to use as a base code i promise i'm nice
  9. ------ the left sidebar image automatically resizes to width 250px. the dimensions of the image i'm using are roughly 250px x 350px and i wouldn't recommend having your image any taller. you can replace it of course or remove it completely!
  10. ------ please don't edit/remove the bird unless you're good at css/html. the coding is designed for that specific image
  11. ------ honestly i tried to make the code simple but feel free to ask me any questions!!!! have fun
  12. ------>
  13. <title>{Title}</title>
  14.  
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  17. <link href='http://fonts.googleapis.com/css?family=Fenix' rel='stylesheet' type='text/css'>
  18.  
  19. <link href='http://fonts.googleapis.com/css?family=Fondamento' rel='stylesheet' type='text/css'>
  20.  
  21. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
  22. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js" type="text/javascript"></script>
  23. <script type="text/javascript">// <![CDATA[
  24. (function($){
  25.  
  26. $(document).ready(function(){
  27.  
  28. $("a[title]").style_my_tooltips({
  29.  
  30. tip_follows_cursor:true,
  31.  
  32. tip_delay_time:30,
  33.  
  34. tip_fade_speed:300,
  35.  
  36. attribute:"title"
  37.  
  38. });
  39.  
  40. });
  41.  
  42. })(jQuery);
  43. // ]]></script>
  44.  
  45.  
  46. <style type="text/css">
  47. @font-face { font-family: "anunedw"; src: url('http://static.tumblr.com/tcdwxsl/HSCn5rj02/anunedw_.ttf'); }
  48. @font-face { font-family: "lobster"; src: url('http://themes.googleusercontent.com/static/fonts/lobster/v3/MWVf-Rwh4GLQVBEwbyI61Q.woff'); }
  49.  
  50. ::-webkit-scrollbar-thumb:vertical {
  51. background-color:#cfcfcf; /*scrollbar color*/
  52. height:100px;
  53. }
  54.  
  55. ::-webkit-scrollbar-thumb:horizontal {
  56. background-color:#cfcfcf; /*scrollbar color*/
  57. height:100px !important;
  58. }
  59.  
  60. ::-webkit-scrollbar {
  61. height:10px;
  62. width:5px;
  63. background-color:#eee; /*scrollbar bg color*/
  64. }
  65.  
  66. body {
  67. background: #FFFFFF;
  68. font-size: 11px;
  69. color: #000000; /* text color */
  70. font-family:helvetica;
  71.  
  72. }
  73.  
  74. a:link, a:active, a:visited {
  75. color: #ff0036;
  76. text-decoration: none;
  77. -webkit-transition: all 0.3s ease-out;
  78. -moz-transition: all 0.3s ease-out;
  79. transition: all 0.3s ease-out;
  80. }
  81.  
  82. a:hover {
  83. color: #ffccff;
  84. text-decoration: none;
  85. -webkit-transition: all 0.3s ease-out;
  86. -moz-transition: all 0.3s ease-out;
  87. transition: all 0.3s ease-out;
  88.  
  89. }
  90.  
  91.  
  92. #s-m-t-tooltip{
  93. font-size:10px;
  94. position:absolute;
  95. margin-top: 15px;
  96. margin-left:15px;
  97. letter-spacing:1px;
  98. z-index:9999;
  99. background:white;
  100. color:#000;
  101. text-transform:lowercase;
  102. padding:2px 3px 2px 3px;
  103. -webkit-transition:all 0.3s;
  104. -moz-transition:all 0.3s;
  105. -ms-transition:all 0.3s;
  106. -o-transition:all 0.3s;
  107. transition:all 0.3s;
  108. border:2px solid #ff0066;
  109. }
  110.  
  111. /* ------------ sidebar ---------------*/
  112.  
  113. #sidebar {
  114. left:40px;
  115. top:0px;
  116. height:100%;
  117. width:250px;
  118. position:fixed;
  119. }
  120.  
  121. #sidebar img {
  122. bottom:50px;
  123. border-top-left-radius:100px;
  124. border-top-right-radius:100px;
  125. position:fixed;
  126. width:250px;
  127. }
  128. .title {
  129. top:100px;
  130. position:fixed;
  131. text-align:center;
  132. font-family:"lobster";
  133. letter-spacing:1px;
  134. font-size:16px;
  135. padding:5px;
  136. line-height:125%;
  137. color:#a21b1b; /*-- first title color --*/
  138.  
  139. }
  140.  
  141. /*--------- bird (please dont edit) ---------*/
  142. #bird {
  143. right:100px;
  144. top:100px;
  145. width:300px;
  146. position:fixed;
  147. -webkit-transition:all 1s;
  148. -moz-transition:all 1s;
  149. -ms-transition:all 1s;
  150. -o-transition:all 1s;
  151. transition:all 1s;
  152.  
  153. }
  154.  
  155. #bird:hover .image {
  156. margin-left:100px;
  157. margin-top:-100px;
  158. -webkit-transition:all 1s;
  159. -moz-transition:all 1s;
  160. -ms-transition:all 1s;
  161. -o-transition:all 1s;
  162. transition:all 1s;
  163. }
  164.  
  165. .image img {
  166. width:300px;
  167. -webkit-transition:all 1s;
  168. -moz-transition:all 1s;
  169. -ms-transition:all 1s;
  170. -o-transition:all 1s;
  171. transition:all 1s;
  172. }
  173.  
  174. .escape {
  175. font-size:10px;
  176. text-align:center;
  177. position:fixed;
  178. margin-top:-150px;
  179. text-transform:uppercase;
  180. font-family:cambria;
  181. width:200px;
  182. margin-left:50px;
  183. letter-spacing:2px;
  184.  
  185. }
  186.  
  187. #bird:hover .escape {
  188. opacity:0;
  189. }
  190.  
  191.  
  192. #bird:hover .navlinks {
  193. opacity:1;
  194. }
  195.  
  196.  
  197. /*----- navlinks -----*/
  198. .navlinks {
  199. opacity:0;
  200. z-index:1000;
  201. width:200px;
  202. height:100px;
  203. padding:10px;
  204. margin-left:150px;
  205. margin-top:-200px;
  206. position:fixed;
  207. text-align:right;
  208. }
  209.  
  210. .navlinks a {
  211. padding-right:5px;
  212. font-style:italic;
  213. color:#ffa366; /**-- navlinks color --*/
  214. }
  215.  
  216. .navlinks a:hover {
  217. color:#de5959; /*-- navlinks hover color --*/
  218. }
  219.  
  220.  
  221. /*------------ about container ------------------*/
  222. #container {
  223. left:350px;
  224. bottom:100px;
  225. position:fixed;
  226.  
  227. width:350px;
  228. height:300px;
  229. border:1px solid #ffa366; /*-- about box border --*/
  230. box-shadow:1px 1px 1px #de5959;
  231. padding:10px;
  232. overflow:auto;
  233. }
  234.  
  235. .boxtitle {
  236. position:fixed;
  237. margin-top:-40px;
  238. font-size:16px;
  239. font-family:anunedw;
  240. text-transform:uppercase;
  241. letter-spacing:2px;
  242. color:#dc6606; /*-- about box title color --*/
  243. }
  244.  
  245. .boxtext {
  246. font-size:11px;
  247. }
  248.  
  249.  
  250. /*------ credit do not edit!! --------*/
  251. #credit {
  252. bottom:0px;
  253. right:0px;
  254. font-size:30px;
  255. position:fixed;
  256. z-index:100000;
  257.  
  258. }
  259.  
  260. .cr {
  261. background:transparent;}
  262.  
  263. #credit a {
  264. color:#292929;
  265. }
  266.  
  267. #credit a:hover {
  268. color:#de5959;
  269. }
  270.  
  271. .theme {
  272. width:0px;
  273. background:#292929;
  274. color:#fff;
  275. height:18px;
  276. font-size:10px;
  277. margin-top:-30px;
  278. padding-top:2px;
  279. visibility:hidden; position:fixed;
  280. text-align:center;
  281. text-transform:uppercase;
  282.  
  283. }
  284.  
  285. .cr:hover .theme {
  286. visibility:visible;
  287. width:200px;
  288. margin-left:-200px;
  289.  
  290. transition:0.6s;
  291. }
  292.  
  293. </style>
  294. </head>
  295. <body>
  296.  
  297. <div id="sidebar">
  298. <div class="title">
  299. write your title here
  300. </div>
  301. <!--- sidebar image automatically resizes to width 250px (you can remove it too if you like)---->
  302. <img src="https://31.media.tumblr.com/1050ab95ed93e75c41c8522257017f72/tumblr_inline_n5rk04A0Gm1s9tfpw.jpg">
  303.  
  304. </div>
  305.  
  306.  
  307. <div id ="bird"><div class="image"><img src="http://static.tumblr.com/tcdwxsl/bwgn7sfi8/escape.jpg"></div>
  308. <div class="escape">escape</div>
  309.  
  310. <!------- navlinks -------->
  311. <div class="navlinks">
  312. <a href="/">home</a>
  313. <a href="/ask">ask</a>
  314. <!--- to add more links just copy the code but pls keep it to like 4 links max --->
  315. <a href="/">link</a>
  316.  
  317. </div>
  318. </div>
  319.  
  320. <!-------- about container ---------->
  321. <div id="container">
  322. <div class="boxtitle">
  323. about <!-- about title --->
  324. </div>
  325. <div class="boxtext">
  326. <!------------- write your about in the space below ----------------->
  327.  
  328.  
  329.  
  330. <!------------- write your about in the space above ----------------->
  331. </div>
  332. </div>
  333.  
  334. <!--- END CODING
  335. PLEASE DO NOT REMOVE CREDIT --->
  336.  
  337. <div id="credit"><div class="cr"><a href="http://jasnahdavar.tumblr.com">©</a>
  338. <div class="theme">theme by jasnahdavar</div></div></div>
  339. </body>
  340. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement