Advertisement
themesbyhaleigh

fanfic recs (page #9)

Jul 15th, 2014
857
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.98 KB | None | 0 0
  1. <!-- page #9 by nerdydean. don't remove the credit. -->
  2.  
  3.  
  4. <!DOCTYPE html>
  5. <head>
  6.  
  7. <title>{Title}</title>
  8.  
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11.  
  12.  
  13. <!-- jquery -->
  14. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  15.  
  16. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  17.  
  18. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  19.  
  20. <script>
  21. (function($){
  22. $(document).ready(function(){
  23. $("a[title]").style_my_tooltips({
  24. tip_follows_cursor:true,
  25. tip_delay_time:30,
  26. tip_fade_speed:300,
  27. attribute:"title"
  28. });
  29. });
  30. })(jQuery);
  31. </script>
  32.  
  33.  
  34. <style type="text/css">
  35.  
  36. #s-m-t-tooltip{
  37. font-size:9px;
  38. position:absolute;
  39. margin-top: 15px;
  40. letter-spacing:1px;
  41. z-index:9999;
  42. background:white;
  43. text-transform:uppercase;
  44. padding:2px 3px 2px 3px;
  45. }
  46.  
  47. ::-webkit-scrollbar {
  48. width: 3px;
  49. height:auto;
  50. background:#fff;
  51. }
  52.  
  53. ::-webkit-scrollbar-corner {
  54. padding:2px;
  55. background:#fff;
  56. }
  57.  
  58. ::-webkit-scrollbar-button:vertical {
  59. height:5px;
  60. display: block;
  61. background:#333;
  62. }
  63.  
  64. ::-webkit-scrollbar-button:horizontal {
  65. width: 3px;
  66. height: 5px;
  67. display: block;
  68. background:#333;
  69. }
  70.  
  71. ::-webkit-scrollbar-thumb:vertical {
  72. background:#333;
  73. }
  74.  
  75. ::-webkit-scrollbar-thumb:horizontal {
  76. background:#fff;
  77. }
  78.  
  79. ::-webkit-scrollbar-thumb {
  80. background:#333;
  81. }
  82.  
  83. blockquote {
  84. padding:5px 0 5px 30px;
  85. border-left:1px solid #eee;
  86. margin:10px 30px;
  87. }
  88.  
  89. body {
  90. color:#333;
  91. font-family:calibri;
  92. font-weight:100;
  93. font-size:11px;
  94. text-align:justify;
  95. margin:0;
  96. line-height:18px;
  97. background:#fff;
  98. }
  99.  
  100. a {
  101. color:#333;
  102. text-decoration:none;
  103. }
  104.  
  105. a:hover {
  106. text-decoration:underline;
  107. }
  108.  
  109. img{
  110. border:none;
  111. text-decoration:none;
  112. }
  113.  
  114. p {
  115. margin-top:5px;
  116. margin-bottom:5px;
  117. }
  118.  
  119. #con {
  120. left:50%;
  121. margin-left:-200px;
  122. position:absolute;
  123. }
  124.  
  125. .posts {
  126. width:400px;
  127. background:white;
  128. margin:50px 0;
  129. }
  130.  
  131. .info {
  132. margin-left:0px;
  133. width:400px;
  134. }
  135.  
  136. .tit {
  137. font-weight:bold;
  138. font-family:calibri;
  139. color:black;
  140. font-size:12px;
  141. letter-spacing:1px;
  142. text-transform:uppercase;
  143. }
  144.  
  145. .lank {
  146. border-bottom:1px solid #eee;
  147. margin-bottom:5px;
  148. padding-bottom:5px;
  149. }
  150.  
  151. .status {
  152. color:#d72121;
  153. text-transform:uppercase;
  154. text-decoration:underline;
  155. font-weight:bold;
  156. }
  157.  
  158. .about ul {
  159. margin-left:-10px;
  160. }
  161.  
  162. .l {
  163. background:#fff;
  164. margin-top:100px;
  165. width:400px;
  166. text-align:center;
  167. font-family:calibri;
  168. text-transform:uppercase;
  169. }
  170.  
  171. #title {
  172. font-size:14px;
  173. margin-bottom:12px;
  174. text-align:center;
  175. letter-spacing:1px;
  176. font-family:calibri;
  177. text-transform:uppercase;
  178. color:black;
  179. background:#fff;
  180. padding:15px;
  181. border-bottom:1px solid #eee;
  182. word-spacing:10px;
  183. }
  184.  
  185. .links {
  186. padding-bottom:10px;
  187. border-bottom:1px solid #eee;
  188. }
  189.  
  190. .links a {
  191. margin:0 5px;
  192. padding:2px 5px;
  193. border:none;
  194. }
  195.  
  196. .desc {
  197. text-transform:none;
  198. margin:10px 25px;
  199. font-family:calibri;
  200. }
  201.  
  202. .media {
  203. color: #a1a1a1;
  204. background: #ffffff;
  205. }
  206.  
  207. #filters {
  208. background: #ffffff;
  209. }
  210.  
  211. #filters a {
  212. margin: 5px;
  213. text-transform: uppercase;
  214. }
  215.  
  216.  
  217. </style>
  218. </head>
  219. <script>
  220. $(document).ready(function(){
  221. $(".filters").click(function(e) {
  222. e.preventDefault();
  223. $(".media").not("." + $(this).attr("rel")).hide(500);
  224. $("." + $(this).attr("rel")).show(500);
  225. });
  226. });
  227. </script>
  228. <body>
  229.  
  230. <!-- this is your container. it's what keeps everything where it is. -->
  231. <div id="con">
  232. <!-- this is your header. -->
  233. <div class="l">
  234. <!-- these are your links. you can add more if you want -->
  235. <div id="title">
  236. <a href="/">link1</a>
  237. <a href="/">link2</a>
  238. <a href="/">link3</a>
  239. </div>
  240. <!-- these are your categories. you can change the name of them in rel. ex: rel="YOUR CATEGORY HERE" (DO NOT CHANGE THE FIRST CATEGORY AT ALL. IT'LL MESS THINGS UP. YOU CAN CHANGE ALL TO SOME OTHER WORD I GUESS, BUT DON'T CHANGE THE REL). if you do that, you should also change the name of the actual link, which of course is where it always is, before </a>. you can add new categories by copying and pasting the whole link. -->
  241. <div class="links">
  242. <div id="filters">
  243. <a href="#" rel="media" class="filters">all</a>
  244. <a href="#" rel="reading" class="filters">reading</a>
  245. <a href="#" rel="completed" class="filters">completed</a>
  246. <a href="#" rel="fave" class="filters">favorites</a>
  247. </div>
  248. </div>
  249. <!-- this is your description. -->
  250. <div class="desc">write a description here if you want. if you don't want to, leave it blank and it will go away.
  251. </div>
  252. </div>
  253.  
  254.  
  255.  
  256. <!-- these are your fics. to add one, just copy and paste everything from entry to end entry.
  257.  
  258. HOW TO USE THE CATEGORIES:
  259. so, at the beginning of every 'entry', there's this: <div class="media someotherword">, right?
  260. well, the 'media' has to stay in every single one. this allows the entry to show up when you click 'all'.
  261. the words after that depend on you. if you'd like to add the fic to your 'reading' category, then you'd put 'reading' in there as well. same goes for any other category. make sense? if not, you can sort of look at the code and mess around with the theme to get it, or ask me.
  262.  
  263. i'll give directions throughout the code now. i just wanted a seperate spot for the categories -->
  264.  
  265.  
  266.  
  267.  
  268. <!--entry-->
  269. <!-- change the second word to whatever you want. leave 'media' there. you can have a fic in as many categories as you want. -->
  270. <div class="media reading">
  271. <div class="posts">
  272. <div class="info">
  273. <!-- this is your fic title. change the '/' to the link to your fic. if you don't want to link it, simply delete the <a href="/"> and </a>. -->
  274. <div class="tit"><a href="/">a fic title</a></div>
  275. <!-- this is your 'status'. are you readint the fic? is it completed? is it your favorite? you can leave this blank if you want since the categories pretty much tell you this -->
  276. <div class="status">reading</div>
  277. <!-- this is where you can say the author(s), the pairing, the rating, the word count, where the fic is located, whatever. leave this blank if you want -->
  278. <div class="lank">
  279. by <a href="/">author</a> — character1/character2 — rated MA — 3k words — on ff.net
  280. </div>
  281. <!-- this is where you put the fummary. you can copy and paste the one written by the author, write your own, whatever. -->
  282. <div class="about">
  283. This is a summary. Summarize the fic yourself or paste the one the author wrote. It can be as long or as short as you want. Feel free to fill up the space or not to.
  284. </ul>
  285. </div>
  286. </div>
  287. </div>
  288. </div>
  289. <!--end entry-->
  290.  
  291.  
  292.  
  293. <!--entry-->
  294. <!-- change the second word to whatever you want. leave 'media' there. you can have a fic in as many categories as you want. -->
  295. <div class="media completed">
  296. <div class="posts">
  297. <div class="info">
  298. <!-- this is your fic title. change the '/' to the link to your fic. if you don't want to link it, simply delete the <a href="/"> and </a>. -->
  299. <div class="tit"><a href="/">a fic title</a></div>
  300. <!-- this is your 'status'. are you readint the fic? is it completed? is it your favorite? you can leave this blank if you want since the categories pretty much tell you this -->
  301. <div class="status">reading</div>
  302. <!-- this is where you can say the author(s), the pairing, the rating, the word count, where the fic is located, whatever. leave this blank if you want -->
  303. <div class="lank">
  304. by <a href="/">author</a> — character1/character2 — rated MA — 3k words — on ff.net
  305. </div>
  306. <!-- this is where you put the fummary. you can copy and paste the one written by the author, write your own, whatever. -->
  307. <div class="about">
  308. This is a summary. Summarize the fic yourself or paste the one the author wrote. It can be as long or as short as you want. Feel free to fill up the space or not to.
  309. </ul>
  310. </div>
  311. </div>
  312. </div>
  313. </div>
  314. <!--end entry-->
  315.  
  316.  
  317. <!--entry-->
  318. <!-- change the second word to whatever you want. leave 'media' there. you can have a fic in as many categories as you want. -->
  319. <div class="media fave">
  320. <div class="posts">
  321. <div class="info">
  322. <!-- this is your fic title. change the '/' to the link to your fic. if you don't want to link it, simply delete the <a href="/"> and </a>. -->
  323. <div class="tit"><a href="/">a fic title</a></div>
  324. <!-- this is your 'status'. are you readint the fic? is it completed? is it your favorite? you can leave this blank if you want since the categories pretty much tell you this -->
  325. <div class="status">reading</div>
  326. <!-- this is where you can say the author(s), the pairing, the rating, the word count, where the fic is located, whatever. leave this blank if you want -->
  327. <div class="lank">
  328. by <a href="/">author</a> — character1/character2 — rated MA — 3k words — on ff.net
  329. </div>
  330. <!-- this is where you put the fummary. you can copy and paste the one written by the author, write your own, whatever. -->
  331. <div class="about">
  332. This is a summary. Summarize the fic yourself or paste the one the author wrote. It can be as long or as short as you want. Feel free to fill up the space or not to.
  333. </ul>
  334. </div>
  335. </div>
  336. </div>
  337. </div>
  338. <!--end entry-->
  339.  
  340.  
  341. <!--entry-->
  342. <!-- change the second word to whatever you want. leave 'media' there. you can have a fic in as many categories as you want. -->
  343. <div class="media completed fave">
  344. <div class="posts">
  345. <div class="info">
  346. <!-- this is your fic title. change the '/' to the link to your fic. if you don't want to link it, simply delete the <a href="/"> and </a>. -->
  347. <div class="tit"><a href="/">a fic title</a></div>
  348. <!-- this is your 'status'. are you readint the fic? is it completed? is it your favorite? you can leave this blank if you want since the categories pretty much tell you this -->
  349. <div class="status">reading</div>
  350. <!-- this is where you can say the author(s), the pairing, the rating, the word count, where the fic is located, whatever. leave this blank if you want -->
  351. <div class="lank">
  352. by <a href="/">author</a> — character1/character2 — rated MA — 3k words — on ff.net
  353. </div>
  354. <!-- this is where you put the fummary. you can copy and paste the one written by the author, write your own, whatever. -->
  355. <div class="about">
  356. This is a summary. Summarize the fic yourself or paste the one the author wrote. It can be as long or as short as you want. Feel free to fill up the space or not to.
  357. </ul>
  358. </div>
  359. </div>
  360. </div>
  361. </div>
  362. <!--end entry-->
  363.  
  364.  
  365. <!--entry-->
  366. <div class="media reading fave">
  367. <div class="posts">
  368. <div class="info">
  369. <!--theme title here--><div class="tit"><a href="/">a fic title</a></div>
  370. <div class="status">reading</div>
  371. <!--links here--><div class="lank">
  372. by <a href="/">author</a> — character1/character2 — rated MA — 3k words — on ff.net
  373. </div>
  374. <div class="about"><!--theme description goes here>-->
  375. This is a summary. Summarize the fic yourself or paste the one the author wrote. It can be as long or as short as you want. Feel free to fill up the space or not to.
  376. </ul>
  377. </div>
  378. </div>
  379. </div>
  380. </div>
  381. <!--end entry-->
  382.  
  383.  
  384.  
  385.  
  386.  
  387.  
  388.  
  389.  
  390.  
  391.  
  392.  
  393.  
  394.  
  395. </div>
  396.  
  397. <div style="position:fixed; bottom:5px; right:5px; padding:2px 2px;"><a title="theme by nerdydean" href="http://hellish.co.vu">theme</a></div>
  398.  
  399. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement