API tools faq
paste
keciasthemes

asschlinthemes: fanfiction page

keciasthemes
Aug 27th, 2014
3,665
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.68 KB | None | 0 0
raw download clone embed print report
  1. <html>
  2. <head>
  3.  
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6.  
  7. <!--------------------------------------------
  8. ASSCHLIN THEMES FICREC PAGE 01
  9.  
  10. SIDE MENU (http://tympanus.net/Blueprints/SlidePushMenus/)
  11. FILTER SCRIPT (http://septembre.co.vu/post/95934292090/)
  12.  
  13.  
  14.  
  15. --------------------------------------------->
  16.  
  17. <title>{Title}</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  20. <meta name="description" content="" />
  21. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  22.  
  23.  
  24.  
  25.  
  26. <script type="text/javascript">
  27. function unhide(divID) {
  28. var item = document.getElementById(divID);
  29. if (item) {
  30. item.className=(item.className=='hidden')?'unhidden':'hidden';}}
  31. </script>
  32.  
  33. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/rowev4i/Y0Anaifs0/default.css" />
  34.  
  35. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/rowev4i/Xj5naifrn/component.css" />
  36.  
  37. <script src="http://static.tumblr.com/rowev4i/cfxnaifpl/modernizr.custom.js"></script>
  38.  
  39.  
  40. <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  41.  
  42. <style type="text/css">
  43. ::-webkit-scrollbar {background-color:#fff; height:4px; width:1px}
  44. ::-webkit-scrollbar-thumb:vertical {background-color:#fff; height:50px;}::-webkit-scrollbar-thumb:horizontal {background-color:#fff;; height:8px!important}
  45.  
  46.  
  47. h1 {
  48. font-weight:normal;
  49. font-size:10px;
  50. text-align:left;
  51. font-style:italic;
  52. line-height:50%;
  53. letter-spacing:0px;
  54. font-family:calibri;
  55. text-transform:none;
  56. color:#333;}
  57.  
  58. h2 {
  59. font-size:10px;
  60. font-family:calibri;
  61. letter-spacing:0px;
  62. margin-bottom:12px;
  63. padding-bottom:10px;
  64. font-weight:normal;
  65. line-height:90%;
  66. text-transform:lowercase;
  67. color:#333;
  68. margin: 0px;}
  69.  
  70. body {
  71. color: #333;
  72. background-color:#fff;}
  73.  
  74. a {
  75. color:#333;
  76. text-decoration: none;
  77. -moz-transition-duration: 0.5s;
  78. -o-transition-duration: 0.5s;
  79. -webkit-transition-duration: 0.5s;
  80. transition-duration: 0.5s;}
  81.  
  82. a:hover {
  83. color:#333;
  84. text-decoration:none;
  85. -moz-transition-duration: 0.5s;
  86. -o-transition-duration: 0.5s;
  87. -webkit-transition-duration: 0.5s;
  88. transition-duration: 0.5s;}
  89.  
  90. .sidebar {
  91. width:250px;
  92. height:100%;
  93. position: fixed;
  94. margin-top:60px;
  95. background:#F5F5F5;
  96. padding:10px;
  97. border-right:1px solid #eee;
  98. margin-left:0px;}
  99.  
  100. .sidebar h3 {
  101. color: #333;
  102. text-align:right;
  103. font-family: 'Montserrat', sans-serif;
  104. text-transform:uppercase;
  105. font-size:17px;
  106. letter-spacing:1px;
  107. padding: 20px;
  108. width:250px;
  109. margin-top:-10px;
  110. margin-left:-10px;
  111. margin-bottom:0px;
  112. font-weight: 300;
  113. background: #ffb700;}
  114.  
  115. .sidebarimage {
  116. position: fixed;
  117. width:90px;
  118. margin:60px 0px 0px 70px;
  119. padding:4px;
  120. border:5px solid #fff;
  121. border-radius:100%;}
  122.  
  123. .description {
  124. padding:10px;
  125. width:240px;
  126. margin-top:160px;
  127. padding-bottom:4px;
  128. line-height:100%;
  129. text-align:justify;
  130. font-size:9px;
  131. font-family: 'Montserrat', sans-serif;
  132. color:#333;}
  133.  
  134. .description a {
  135. color: #333;
  136. background: #f1f1f1;
  137. font-family: 'Montserrat', sans-serif;
  138. font-size:8px;
  139. font-weight:300;
  140. margin-top:3px;
  141. letter-spacing:1px;
  142. padding:4px;
  143. text-align:center;
  144. text-transform:uppercase;
  145. display: block;
  146. width:250px;
  147. margin-left:-20px;
  148. -moz-transition-duration:0.5s;
  149. -webkit-transition-duration:0.5s;
  150. -o-transition-duration:0.5s;
  151. }
  152. .description a:hover {color:#ffb700;}
  153.  
  154.  
  155. #sort li {
  156. display:block;
  157. text-align:center;
  158. list-style: none;
  159. margin-left:-40px;}
  160.  
  161. #sort ul {list-style: none;}
  162.  
  163. #sort a {
  164. color:white;
  165. border:1px solid transparent;
  166. display:block;
  167. padding:5px;
  168. margin-bottom:5px;}
  169.  
  170. #sort a:hover {
  171. color:black;
  172. background:white;}
  173.  
  174. #sort li a.selected {
  175. color:black;
  176. background:#ffb700;
  177. border:1px solid #ffb700;}
  178.  
  179. #container{
  180. position:fixed;
  181. left:auto;
  182. top:70px;
  183. width:800px;}
  184.  
  185.  
  186. .story{
  187. width:200px;
  188. margin:10px;
  189. padding:10px;
  190. font-family: 'Montserrat', sans-serif;
  191. font-size:7px;
  192. letter-spacing:1px;
  193. text-transform:uppercase;}
  194.  
  195. .ficname {
  196. width:180px;
  197. height:auto;
  198. text-align:center;
  199. font-size:8px;
  200. text-transform:uppercase;
  201. background-color:#e6e6e6;
  202. color:#444444;
  203. padding:5px;
  204. overflow:hidden;
  205. font-family: 'Montserrat', sans-serif;
  206. letter-spacing:1px;
  207. transition: all 0.3s ease-out;
  208. -o-transition: all 0.3s ease-out;
  209. -webkit-transition: all 0.3s ease-out;
  210. -moz-transition: all 0.3s ease-out;}
  211.  
  212. .ficname a {
  213. color:#444444;
  214. text-decoration:none;}
  215.  
  216. .ficname:hover{
  217. color:#444444;
  218. background:#F0F0F0;
  219. transition: all 0.3s ease-out;
  220. -o-transition: all 0.3s ease-out;
  221. -webkit-transition: all 0.3s ease-out;
  222. -moz-transition: all 0.3s ease-out;}
  223.  
  224.  
  225.  
  226.  
  227. .ficdesc {
  228. height:115px;
  229. font-family:arial;
  230. font-size:9px;
  231. text-transform:none;
  232. text-align:justify;
  233. padding:10px;
  234. overflow:auto;
  235. margin-top:-2px;
  236. color:#444444;
  237. border-top:1px solid #F0F0F0;
  238. border-bottom:1px solid #F0F0F0;
  239. background-color:#ffffff;}
  240.  
  241. #fic li{
  242. display:inline-block;
  243. list-style:none;
  244. text-align:center;
  245. width:32%;
  246. line-height:15px;
  247. overflow:hidden;
  248. margin:5px 0;
  249. -webkit-transition: all .4s ease-out;
  250. -moz-transition: all .4s ease-out;
  251. transition: all .4s ease-out;}
  252.  
  253.  
  254. .fictags {
  255. width: 180px;
  256. padding:2 5px;
  257. background-color:#fff;
  258. margin-top:5px;
  259. color:#E6E4E4;
  260. font-family: 'Montserrat', sans-serif;
  261. font-size: 7px;
  262. text-transform:uppercase;
  263. letter-spacing:5px;
  264. height: 12px;
  265. overflow: hidden;
  266. transition: all 0.3s ease-out;
  267. -o-transition: all 0.3s ease-out;
  268. -webkit-transition: all 0.3s ease-out;
  269. -moz-transition: all 0.3s ease-out;}
  270.  
  271.  
  272. .fictags:hover {
  273. color:#ffffff;
  274. background-color:#ffffff;
  275. height: 35px;
  276. transition: all 0.3s ease-out;
  277. -o-transition: all 0.3s ease-out;
  278. -webkit-transition: all 0.3s ease-out;
  279. -moz-transition: all 0.3s ease-out;}
  280.  
  281. .tags {
  282. color:#777777;
  283. font-family: 'Montserrat', sans-serif;
  284. font-size: 7px;
  285. text-transform:uppercase;
  286. letter-spacing:1px;}
  287.  
  288. .postscontainer {
  289. max-width:800px;
  290. margin: auto;
  291. margin-top:-60px;
  292. margin-left:350px;}
  293.  
  294.  
  295. #cred {
  296. position:fixed;
  297. font-family:'Calibri';
  298. text-transform:uppercase;
  299. font-size:8px;
  300. right:9px;
  301. bottom:9px;
  302. padding:4px;
  303. letter-spacing:1px;
  304. }
  305.  
  306.  
  307. /* THIS IF FOR THE BUTTON TO MAKE THE MENU SLIDE OUT, YOU CAN EDIT THIS AS MUCH AS YOU'D LIKE. */
  308.  
  309. .main > section button {
  310. border: none;
  311. color: #333;
  312. background: #eee;
  313. font-family: 'Montserrat', sans-serif;
  314. font-size:8px;
  315. font-weight:300;
  316. letter-spacing:1px;
  317. padding:4px;
  318. text-transform:uppercase;
  319. display: block;
  320. width:250px;
  321. margin-left:-60px;
  322. -moz-transition-duration:0.5s;
  323. -webkit-transition-duration:0.5s;
  324. -o-transition-duration:0.5s; }
  325.  
  326. .main > section button:hover {background: #ffb700;}
  327. .main > section button.active {background: #ffb700;}
  328. .main > section button.disabled {background: #eee;}
  329.  
  330.  
  331.  
  332. /* THIS IS THE ACUTAL MENU, YOU CAN EDIT THIS, JUST LEAVE THE POSITION THE SAME. */
  333.  
  334.  
  335. .cbp-spmenu {
  336. background: #333;
  337. font-family: 'Montserrat', sans-serif;
  338. overflow:auto;
  339. position: fixed;}
  340.  
  341.  
  342.  
  343.  
  344. /* THIS IS THE HEADER , YOU CAN EDIT THIS AS MUCH AS YOU'D LIKE. */
  345.  
  346. .cbp-spmenu h3 {
  347. color: #333;
  348. font-family: 'Montserrat', sans-serif;
  349. text-transform:uppercase;
  350. font-size:17px;
  351. letter-spacing:1px;
  352. padding:5px;
  353. margin: 0;
  354. margin-bottom:5px;
  355. font-weight: 300;
  356. background: #ffb700;}
  357.  
  358.  
  359. /* THIS IS THE LINKS INSIDE THE MENU, YOU CAN EDIT THIS AS MUCH AS YOU'D LIKE */
  360.  
  361. .cbp-spmenu a {
  362. display: block;
  363. text-align:left;
  364. color: #333;
  365. text-transform:uppercase;
  366. font-size:7px;
  367. border:0px solid;
  368. letter-spacing:1px;
  369. -webkit-transition: all 0.4s ease;
  370. -moz-transition: all 0.4s ease;
  371. transition: all 0.4s ease;}
  372.  
  373.  
  374. .cbp-spmenu a:hover {
  375. background: #ffb700;
  376. -webkit-transition: all 0.4s ease;
  377. -moz-transition: all 0.4s ease;
  378. transition: all 0.4s ease; }
  379.  
  380. .cbp-spmenu a:active {
  381. background: #ffb700;
  382. color: #4d4d4d;
  383. -webkit-transition: all 0.4s ease;
  384. -moz-transition: all 0.4s ease;
  385. transition: all 0.4s ease;}
  386.  
  387. /* DO NOT EDIT THIS. */
  388.  
  389. .hidden {display: none;}
  390. .unhidden {display: block;}
  391.  
  392.  
  393. /* THIS IS THE DROP DOWN LINKS, YOU CAN EDIT THIS AS MUCH AS YOU'D LIKE */
  394. .links {
  395. text-transform:uppercase;
  396. margin-left:1px;
  397. text-align:center;
  398. letter-spacing:2px;
  399. display:block;
  400. color:#333;
  401. padding:7px;
  402. background-color:#eee;
  403. font-size:8px;
  404. letter-spacing:2px;}
  405.  
  406. /* DO NOT EDIT ANY OF THIS. */
  407.  
  408. .cbp-spmenu-push {
  409. overflow-x: hidden;
  410. position: relative;
  411. left: 0;}
  412.  
  413. .cbp-spmenu-push-toright {left: 240px;}
  414. .cbp-spmenu-push-toleft {left: -240px;}
  415.  
  416. /* Transitions, you can edit this to make the menu slide out faster, or slower. */
  417.  
  418. .cbp-spmenu,
  419. .cbp-spmenu-push {
  420. -webkit-transition: all 0.4s ease;
  421. -moz-transition: all 0.4s ease;
  422. transition: all 0.4s ease;}
  423.  
  424. /* DO NOT EDIT ANY OF THIS. */
  425.  
  426. @media screen and (max-height: 500PX){
  427. .cbp-spmenu-left,
  428. .cbp-spmenu-push-toleft {left: -190px;}
  429. }
  430.  
  431. </style>
  432. <div class="sidebar">
  433. <h3>fanfiction recs</h3>
  434. <img src="icon must be less than 100px in width" class="sidebarimage">
  435. <div class="description">
  436.  
  437. description goes here
  438.  
  439. <BR><BR></BR></BR>
  440.  
  441. <!-- ur links -->
  442.  
  443. <a href="/">dashboard</a>
  444. <a href="/">message</a>
  445. <a href="/">link</a>
  446. <a href="/">link</a>
  447. </div>
  448.  
  449.  
  450. <!-- DO NOT TOUCH ANYTHING BELOW THIS -->
  451. <div class="main">
  452. <section class="buttonset">
  453. <button id="showLeftPush">click for filters</button></section></div>
  454. <!-- DO NOT TOUCH ANYTHING ABOVE THIS -->
  455. </div>
  456.  
  457.  
  458.  
  459.  
  460. <div class="postscontainer">
  461. <div id="container" class="clearfix">
  462.  
  463.  
  464. <!--
  465.  
  466. TEMPLATE TO ADD MORE FIC RECS
  467.  
  468.  
  469.  
  470. <div id="fic" class="story (leave that one) and then add more here">
  471. <div class="ficname"><a href="fic link">fic title</a></div>
  472.  
  473. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  474. (change the number according to your personal rating)
  475.  
  476. <div class="ficdesc">
  477.  
  478. paste the summary here.
  479.  
  480. </div>
  481. <div class="fictags"><center>KEYWORDS</center>
  482. <div class="tags">type up some tags here</div></div>
  483. </div>
  484.  
  485.  
  486. -->
  487.  
  488. <div id="fic" class="story (leave that one) and then add more here">
  489. <div class="ficname"><a href="fic link">fic title</a></div>
  490.  
  491. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  492.  
  493. <div class="ficdesc">
  494.  
  495. paste the summary here.
  496.  
  497. </div>
  498. <div class="fictags"><center>KEYWORDS</center>
  499. <div class="tags">type up some tags here</div></div>
  500. </div>
  501.  
  502.  
  503.  
  504. <div id="fic" class="story (leave that one) and then add more here">
  505. <div class="ficname"><a href="fic link">fic title</a></div>
  506.  
  507. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  508.  
  509. <div class="ficdesc">
  510.  
  511. paste the summary here.
  512.  
  513. </div>
  514. <div class="fictags"><center>KEYWORDS</center>
  515. <div class="tags">type up some tags here</div></div>
  516. </div>
  517.  
  518.  
  519.  
  520. <div id="fic" class="story (leave that one) and then add more here">
  521. <div class="ficname"><a href="fic link">fic title</a></div>
  522.  
  523. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  524.  
  525. <div class="ficdesc">
  526.  
  527. paste the summary here.
  528.  
  529. </div>
  530. <div class="fictags"><center>KEYWORDS</center>
  531. <div class="tags">type up some tags here</div></div>
  532. </div>
  533.  
  534.  
  535.  
  536. <div id="fic" class="story (leave that one) and then add more here">
  537. <div class="ficname"><a href="fic link">fic title</a></div>
  538.  
  539. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  540.  
  541. <div class="ficdesc">
  542.  
  543. paste the summary here.
  544.  
  545. </div>
  546. <div class="fictags"><center>KEYWORDS</center>
  547. <div class="tags">type up some tags here</div></div>
  548. </div>
  549.  
  550. <div id="fic" class="story (leave that one) and then add more here">
  551. <div class="ficname"><a href="fic link">fic title</a></div>
  552.  
  553. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  554.  
  555. <div class="ficdesc">
  556.  
  557. paste the summary here.
  558.  
  559. </div>
  560. <div class="fictags"><center>KEYWORDS</center>
  561. <div class="tags">type up some tags here</div></div>
  562. </div>
  563.  
  564. <div id="fic" class="story (leave that one) and then add more here">
  565. <div class="ficname"><a href="fic link">fic title</a></div>
  566.  
  567. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  568.  
  569. <div class="ficdesc">
  570.  
  571. paste the summary here.
  572.  
  573. </div>
  574. <div class="fictags"><center>KEYWORDS</center>
  575. <div class="tags">type up some tags here</div></div>
  576. </div>
  577.  
  578. <div id="fic" class="story (leave that one) and then add more here">
  579. <div class="ficname"><a href="fic link">fic title</a></div>
  580.  
  581. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  582.  
  583. <div class="ficdesc">
  584.  
  585. paste the summary here.
  586.  
  587. </div>
  588. <div class="fictags"><center>KEYWORDS</center>
  589. <div class="tags">type up some tags here</div></div>
  590. </div>
  591.  
  592. <div id="fic" class="story (leave that one) and then add more here">
  593. <div class="ficname"><a href="fic link">fic title</a></div>
  594.  
  595. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  596.  
  597. <div class="ficdesc">
  598.  
  599. paste the summary here.
  600.  
  601. </div>
  602. <div class="fictags"><center>KEYWORDS</center>
  603. <div class="tags">type up some tags here</div></div>
  604. </div>
  605.  
  606. <div id="fic" class="story (leave that one) and then add more here">
  607. <div class="ficname"><a href="fic link">fic title</a></div>
  608.  
  609. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  610.  
  611. <div class="ficdesc">
  612.  
  613. paste the summary here.
  614.  
  615. </div>
  616. <div class="fictags"><center>KEYWORDS</center>
  617. <div class="tags">type up some tags here</div></div>
  618. </div>
  619.  
  620. <div id="fic" class="story (leave that one) and then add more here">
  621. <div class="ficname"><a href="fic link">fic title</a></div>
  622.  
  623. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  624.  
  625. <div class="ficdesc">
  626.  
  627. paste the summary here.
  628.  
  629. </div>
  630. <div class="fictags"><center>KEYWORDS</center>
  631. <div class="tags">type up some tags here</div></div>
  632. </div>
  633.  
  634. <div id="fic" class="story (leave that one) and then add more here">
  635. <div class="ficname"><a href="fic link">fic title</a></div>
  636.  
  637. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  638.  
  639. <div class="ficdesc">
  640.  
  641. paste the summary here.
  642.  
  643. </div>
  644. <div class="fictags"><center>KEYWORDS</center>
  645. <div class="tags">type up some tags here</div></div>
  646. </div>
  647.  
  648. <div id="fic" class="story (leave that one) and then add more here">
  649. <div class="ficname"><a href="fic link">fic title</a></div>
  650.  
  651. <li>words</li> <li>author</li> <li style="color:#ffb700">★★★★★</li>
  652.  
  653. <div class="ficdesc">
  654.  
  655. paste the summary here.
  656.  
  657. </div>
  658. <div class="fictags"><center>KEYWORDS</center>
  659. <div class="tags">type up some tags here</div></div>
  660. </div>
  661.  
  662. </div>
  663.  
  664.  
  665. </div> <!-- end of fic rec containter -->
  666.  
  667. <body class="cbp-spmenu-push">
  668. <nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left" id="cbp-spmenu-s1">
  669. <div id="sort">
  670.  
  671. <ul id="filters" class="option-set clearfix" data-option-key="filter">
  672.  
  673.  
  674.  
  675. <!-- if you want to add more filters, here is a template:
  676.  
  677. <li><a href="#filter" data-option-filter=".filtername">filtername</a></li>
  678.  
  679. -->
  680.  
  681.  
  682.  
  683.  
  684. <h3>basic filters</h3>
  685. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  686. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  687. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  688. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  689. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  690. <h3>filters by length</h3>
  691. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  692. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  693. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  694. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  695. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  696. <h3>filters by rating</h3>
  697. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  698. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  699. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  700. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  701. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  702. <h3>filters by pairing</h3>
  703. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  704. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  705. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  706. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  707. <li><a href="#filter" data-option-filter=".filter">filter name</a></li>
  708. </ul>
  709. </div>
  710.  
  711. </nav>
  712.  
  713.  
  714. <div id="cred">
  715. <a href="http://asschlinthemes.tumblr.com/">AZZ</a>
  716. </div>
  717.  
  718. <!-- dont touch this stuff, it's all your scripts. -->
  719. <script src="http://static.tumblr.com/rowev4i/KOBnaiftj/classie.js"></script>
  720.  
  721. <script>
  722. var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
  723. showLeftPush = document.getElementById( 'showLeftPush' ),
  724. body = document.body;
  725.  
  726.  
  727. showLeftPush.onclick = function() {
  728. classie.toggle( this, 'active' );
  729. classie.toggle( body, 'cbp-spmenu-push-toright' );
  730. classie.toggle( menuLeft, 'cbp-spmenu-open' );
  731. disableOther( 'showLeftPush' );};
  732.  
  733. function disableOther( button ) {
  734. if( button !== 'showLeftPush' ) {
  735. classie.toggle( showLeftPush, 'disabled' );}
  736. if( button !== 'showRightPush' ) {
  737. classie.toggle( showRightPush, 'disabled' );}}
  738. </script>
  739. </body>
  740. <!------- filter scripts -------->
  741. <script src="http://static.tumblr.com/fuu6t9w/kh8ml0pl9/jquery-1.7.1.min.js"></script>
  742. <script src="http://static.tumblr.com/fuu6t9w/eubml0pm0/jquery.isotope.min.js"></script>
  743. <script>
  744. $(function(){
  745.  
  746. var $container = $('#container');
  747.  
  748. $container.isotope({
  749. itemSelector : '.story'
  750. });
  751.  
  752.  
  753. var $optionSets = $('#sort .option-set'),
  754. $optionLinks = $optionSets.find('a');
  755.  
  756. $optionLinks.click(function(){
  757. var $this = $(this);
  758. // don't proceed if already selected
  759. if ( $this.hasClass('selected') ) {
  760. return false;
  761. }
  762. var $optionSet = $this.parents('.option-set');
  763. $optionSet.find('.selected').removeClass('selected');
  764. $this.addClass('selected');
  765.  
  766. // make option object dynamically, i.e. { filter: '.my-filter-class' }
  767. var options = {},
  768. key = $optionSet.attr('data-option-key'),
  769. value = $this.attr('data-option-filter');
  770. // parse 'false' as false boolean
  771. value = value === 'false' ? false : value;
  772. options[ key ] = value;
  773. if ( key === 'layoutMode' && typeof changeLayoutMode === 'function' ) {
  774. // changes in layout modes need extra logic
  775. changeLayoutMode( $this, options )
  776. } else {
  777. // otherwise, apply new options
  778. $container.isotope( options );
  779. }
  780.  
  781. return false;
  782. });
  783.  
  784.  
  785. });
  786. </script>
  787.  
  788. <!-----end filter scripts------>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!