API tools faq
paste
Advertisement
str-wrs

All: Ares

str-wrs
Mar 30th, 2014
2,832
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.08 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. ALL-IN-ONE PAGE: ARES
  4. by str-wrs
  5.  
  6. - this is a companion to the "Aphrodite" theme ok
  7. - don't steal this pls
  8. - pages included: about, ask, tags & blogroll
  9.  
  10. -->
  11.  
  12. <!DOCTYPE html>
  13. <html>
  14. <head>
  15.  
  16. <title>Navigation</title>
  17. <link rel="shortcut icon" href="{Favicon}" />
  18.  
  19. <script src="http://code.jquery.com/jquery-1.10.0.min.js">
  20. </script>
  21. <script>
  22. $(document).ready(function(){
  23.  
  24. $(".one").click(function(){
  25. $(".1").toggle();
  26. $(".2,.3,.4").hide();
  27. });
  28.  
  29. $(".two").click(function(){
  30. $(".2").toggle();
  31. $(".1,.3,.4").hide();
  32. });
  33. $(".three").click(function(){
  34. $(".3").toggle();
  35. $(".1,.2,.4").hide();
  36. });
  37. $(".four").click(function(){
  38. $(".4").toggle();
  39. $(".1,.2,.3").hide();
  40. });
  41.  
  42. });
  43. </script>
  44.  
  45. <style type="text/css">
  46.  
  47. ::-webkit-scrollbar {height:2px;width:2px;background:#fff;}
  48. ::-webkit-scrollbar-thumb {background:#eee;}
  49.  
  50. .1, .2, .3, .4 {display:none;}
  51.  
  52. body {
  53. font-family:Arial;
  54. font-size:10px;
  55. color:#555;
  56. background:#fff;
  57. }
  58.  
  59. a {
  60. color:#999;
  61. text-decoration:none;
  62. transition: 0.5s ease;
  63. -o-transition: 0.5s ease;
  64. -moz-transition: 0.5s ease;
  65. -webkit-transition: 0.5s ease;
  66. }
  67.  
  68. #c{
  69. position:fixed;
  70. bottom:30px;
  71. right:30px;
  72. font-size:7px;
  73. letter-spacing:1px;
  74. text-transform:uppercase;
  75. }
  76.  
  77. /* Containers */
  78.  
  79. #center {
  80. position:relative;
  81. width:605px;
  82. margin:80px auto;
  83. }
  84.  
  85. #content {
  86. position:fixed;
  87. width:525px;
  88. padding:40px;
  89. }
  90.  
  91. /* Headers */
  92.  
  93. #nav {
  94. margin:5px -5px 0px;
  95. font-size:7px;
  96. letter-spacing:0.5px;
  97. text-transform:uppercase;
  98. font-family:Arial;
  99. }
  100.  
  101. #nav a {margin:0px 5px;}
  102.  
  103. .gb {
  104. background:#f8f8f8;
  105. padding:15px;
  106. margin:0px 0px 30px;
  107. }
  108.  
  109. h1 {
  110. margin:0px;
  111. padding:0px;
  112. font-size:15px;
  113. font-style:italic;
  114. font-family:Helvetica;
  115. }
  116.  
  117. /* About */
  118.  
  119. .image img{height:100%;}
  120. .image{
  121. height:150px;
  122. float:left;
  123. background:#f8f8f8;
  124. padding:15px;
  125. }
  126.  
  127. .desc {
  128. padding:10px;
  129. height:160px;
  130. overflow:auto;
  131. font-size:9px;
  132. font-style:italic;
  133. line-height:13.5px;
  134. text-align:justify;
  135. }
  136.  
  137. .links {
  138. padding:5px 0px;
  139. border-top:1px solid #eee;
  140. line-height:10px;
  141. text-align:right;
  142. font-size:7px;
  143. letter-spacing:0.5px;
  144. text-transform:uppercase;
  145. }
  146.  
  147. .links a {padding:0px 5px;}
  148.  
  149. /* Tags */
  150.  
  151. #tagged {background:;height:370px;}
  152. .tags_box {float:left;margin:10px;width:155px;}
  153. .tags {
  154. max-height:50px;
  155. padding:10px;
  156. overflow-y:auto;
  157. line-height:10px;
  158. text-align:justify;
  159. font-size:7px;
  160. letter-spacing:0.3px;
  161. text-transform:uppercase;
  162. }
  163.  
  164. h2 {
  165. margin:0px;
  166. padding:5px;
  167. font-size:10px;
  168. font-style:italic;
  169. font-family:Helvetica;
  170. border-bottom:1px solid #eee;
  171. }
  172.  
  173. /* Blogroll */
  174.  
  175. #blogroll {overflow:auto;height:370px;}
  176. #box img{
  177. width:100%;
  178. transition:0.5s ease;
  179. -o-transition:0.5s ease;
  180. -moz-transition:0.5s ease;
  181. -webkit-transition:0.5s ease;
  182. -webkit-filter: grayscale(0);
  183. }
  184.  
  185. #box:hover img{-webkit-filter: grayscale(1);}
  186. #box {
  187. float:left;
  188. margin:2.5px;
  189. padding:15px;
  190. height:30px;
  191. width:30px;
  192. background:#f8f8f8;
  193. }
  194.  
  195. /* Etc */
  196.  
  197. .faq {
  198. color:#999;
  199. text-align:right;
  200. margin-top:15px;
  201. padding:5px;
  202. border-top:1px solid #eee;
  203. font-size:7px;
  204. letter-spacing:0.5px;
  205. text-transform:uppercase;
  206. }
  207.  
  208. #s-m-t-tooltip{
  209. max-width:300px;
  210. margin:15px 0px;
  211. z-index:9999;
  212. color:#FFF;
  213. font-size:10px;
  214. text-transform:lowercase;
  215. background:#555;
  216. padding:5px 10px;
  217. }
  218.  
  219. </style>
  220.  
  221. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  222. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  223. <script>
  224. (function($){
  225. $(document).ready(function(){
  226. $("a[title]").style_my_tooltips({
  227. tip_follows_cursor:true,
  228. tip_delay_time:20,
  229. tip_fade_speed:400,
  230. attribute:"title"
  231. });
  232. });
  233. })(jQuery);
  234. </script>
  235.  
  236. </head>
  237. <body>
  238.  
  239. <div id="center">
  240.  
  241. <!-- ABOUT STARTS HERE -->
  242.  
  243. <div class="1">
  244. <div id="content">
  245. <div class="gb">
  246. <h1>about the blogger</h1>
  247.  
  248. <div id="nav">
  249. <a class="none">about</a> /
  250. <a class="two" href="#">message</a> /
  251. <a class="three" href="#">tags</a> /
  252. <a class="four" href="#">blogroll</a>
  253. </div>
  254. </div>
  255.  
  256. <!-- This is your picture, you can delete the entire thing if u like -->
  257. <div class="image"><img src="http://i.imgur.com/vkNhjhi.png"/></div>
  258.  
  259. <!-- Here is your description part -->
  260. <div class="desc">
  261. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum lacus erat, placerat mattis semper vel, pharetra eget nisl. Vestibulum cursus vestibulum porttitor. Aliquam accumsan libero in mauris varius convallis. Sed ultricies augue quis sollicitudin mollis. Sed iaculis mi eu fermentum pharetra. Etiam dignissim varius massa, at aliquet neque congue vel. Proin ut varius magna.
  262. <br><br>
  263. Cras laoreet pharetra sodales. Proin varius, felis sit amet auctor consectetur, eros quam vehicula turpis, sit amet ornare ligula est a diam. Aenean mauris ante, hendrerit at nulla vitae, ultricies tristique tortor. Fusce ac viverra enim, quis iaculis ante. Phasellus ultricies risus in diam tincidunt faucibus. Ut eget urna sed purus cursus consequat vel vitae lectus. Nulla in imperdiet libero. Aliquam sed adipiscing nisl, in blandit mauris.
  264. </div>
  265.  
  266.  
  267. <!-- you can use this section for links to other accounts or s/t
  268. if you have no links feel free to delete the whole lot -->
  269. <div class="links">
  270. <a href="/">return to blog</a> /
  271. <a href="http://instagram.com/">instagram</a> /
  272. <a href="http://twitter.com/">twitter</a> /
  273. <a href="http://8tracks.com/">8tracks</a>
  274. </div>
  275.  
  276.  
  277. </div>
  278. </div>
  279.  
  280. <!-- ABOUT ENDS HERE -->
  281.  
  282.  
  283.  
  284.  
  285.  
  286.  
  287.  
  288.  
  289.  
  290.  
  291.  
  292.  
  293.  
  294.  
  295.  
  296.  
  297.  
  298. <!-- ASK STARTS HERE (do not edit!!) -->
  299.  
  300. <div class="2" style="display:none;">
  301. <div id="content">
  302. <div class="gb">
  303. <h1>ask me anything</h1>
  304.  
  305. <div id="nav">
  306. <a class="one" href="#">about</a> /
  307. <a class="none">message</a> /
  308. <a class="three" href="#">tags</a> /
  309. <a class="four" href="#">blogroll</a>
  310. </div>
  311. </div>
  312.  
  313. <iframe frameborder="0" height="200" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" width="100%"></iframe>
  314.  
  315. <!-- you can use this section for a disclaimer or delete the whole line -->
  316. <div class="faq">do not ask me to follow back / promo / blog rate</div>
  317. </div>
  318. </div>
  319.  
  320. <!-- ASK STARTS HERE -->
  321.  
  322.  
  323.  
  324.  
  325.  
  326.  
  327.  
  328.  
  329.  
  330.  
  331.  
  332.  
  333.  
  334.  
  335.  
  336.  
  337.  
  338. <!-- TAGS STARTS HERE -->
  339.  
  340. <div class="3" style="display:none;">
  341. <div id="content">
  342. <div class="gb">
  343. <h1>tagged pages</h1>
  344.  
  345. <div id="nav">
  346. <a class="one" href="#">about</a> /
  347. <a class="two" href="#">message</a> /
  348. <a class="none">tags</a> /
  349. <a class="four" href="#">blogroll</a>
  350. </div>
  351. </div>
  352.  
  353.  
  354. <!-- If you don't know how to edit tags u probably shouldn't be using this theme tbh -->
  355.  
  356. <div id="tagged">
  357.  
  358. <div class="tags_box">
  359. <h2>one direction</h2>
  360. <div class="tags">
  361. <a href="/tagged/louis-tomlinson">Louis Tomlinson</a> &middot;
  362. <a href="/tagged/liam-payne">Liam Payne</a> &middot;
  363. <a href="/tagged/zayn-malik">Zayn Malik</a> &middot;
  364. <a href="/tagged/niall-horan">Niall Horan</a> &middot;
  365. <a href="/tagged/harry-styles">Harry Styles</a>
  366. //
  367. <a href="/tagged/lilo">Lilo</a> &middot;
  368. <a href="/tagged/zouis">Zouis</a>
  369. </div>
  370. </div>
  371.  
  372. <div class="tags_box">
  373. <h2>supernatural cast</h2>
  374. <div class="tags">
  375. <a href="/tagged/jensen-ackles">Jensen Ackles</a> &middot;
  376. <a href="/tagged/misha-collins">Misha Collins</a> &middot;
  377. <a href="/tagged/jared-padalecki">Jared Padalecki</a>
  378. //
  379. <a href="/tagged/j2">J2</a> &middot;
  380. <a href="/tagged/j2m">J2M</a> &middot;
  381. <a href="/tagged/cockles">Cockles</a>
  382. </div>
  383. </div>
  384.  
  385. <div class="tags_box">
  386. <h2>supernatural</h2>
  387. <div class="tags">
  388. <a href="/tagged/dean-winchester">Dean Winchester</a> &middot;
  389. <a href="/tagged/castiel">Castiel</a> &middot;
  390. <a href="/tagged/sam-winchester">Sam Winchester</a>
  391. //
  392. <a href="/tagged/wincest">Wincest</a> &middot;
  393. <a href="/tagged/team-free-will">Team Free Will</a> &middot;
  394. <a href="/tagged/destiel">Destiel</a>
  395. </div>
  396. </div>
  397.  
  398.  
  399. <div class="tags_box">
  400. <h2>teen wolf cast</h2>
  401. <div class="tags">
  402. <a href="/tagged/dylan-o'brien">Dylan O'Brien</a> &middot;
  403. <a href="/tagged/tyler-hoechlin">Tyler Hoechlin</a> &middot;
  404. <a href="/tagged/holland-roden">Holland Roden</a> &middot;
  405. <a href="/tagged/tyler-posey">Tyler Posey</a> &middot;
  406. <a href="/tagged/crystal-reed">Crystal Reed</a> &middot;
  407. <a href="/tagged/daniel-sharman">Daniel Sharman</a> &middot;
  408. <a href="/tagged/colton-haynes">Colton Haynes</a>
  409. //
  410. <a href="/tagged/teen-wolf-cast">Group</a> &middot;
  411. <a href="/tagged/hobrien">Hobrien</a> &middot;
  412. <a href="/tagged/o'brosey">O'Brosey</a>
  413. </div>
  414. </div>
  415.  
  416. <div class="tags_box">
  417. <h2>teen wolf</h2>
  418. <div class="tags">
  419. <a href="/tagged/stiles-stilinski">Stiles Stilinski</a> &middot;
  420. <a href="/tagged/derek-hale">Derek Hale</a> &middot;
  421. <a href="/tagged/lydia-martin">Lydia Martin</a> &middot;
  422. <a href="/tagged/scott-mccall">Scott McCall</a> &middot;
  423. <a href="/tagged/allison-argent">Allison Argent</a> &middot;
  424. <a href="/tagged/isaac-lahey">Isaac Lahey</a> &middot;
  425. <a href="/tagged/jackson-whittemore">Jackson Whittemore</a>
  426. //
  427. <a href="/tagged/team-human">Team Human</a> &middot;
  428. <a href="/tagged/sterek">Sterek</a> &middot;
  429. <a href="/tagged/skittles">Skittles</a>
  430. </div>
  431. </div>
  432.  
  433. <div class="tags_box">
  434. <h2>films</h2>
  435. <div class="tags">
  436. <a href="/tagged/anchorman">Anchorman</a> &middot;
  437. <a href="/tagged/donnie-darko">Donnie Darko</a> &middot;
  438. <a href="/tagged/the-great-gatsby">The Great Gatsby</a> &middot;
  439. <a href="/tagged/harry-potter">Harry Potter</a> &middot;
  440. <a href="/tagged/the-hobbit">The Hobbit</a> &middot;
  441. <a href="/tagged/the-hunger-games">The Hunger Games</a> &middot;
  442. <a href="/tagged/lord-of-the-rings">Lord of the Rings</a> &middot;
  443. <a href="/tagged/marvel">Marvel</a> &middot;
  444. <a href="/tagged/now-you-see-me">Now You See Me</a> &middot;
  445. <a href="/tagged/star-trek">Star Trek</a> &middot;
  446. </div>
  447. </div>
  448.  
  449. <div class="tags_box">
  450. <h2>television</h2>
  451. <div class="tags">
  452. <a href="/tagged/american-horror-story">American Horror Story</a> &middot;
  453. <a href="/tagged/breaking-bad">Breaking Bad</a> &middot;
  454. <a href="/tagged/community">Community</a> &middot;
  455. <a href="/tagged/game-of-thrones">Game of Thrones</a> &middot;
  456. <a href="/tagged/friends">Friends</a> &middot;
  457. <a href="/tagged/gossip-girl">Gossip Girl</a> &middot;
  458. <a href="/tagged/himym">HIMYM</a> &middot;
  459. <a href="/tagged/kardashians">KUWTK</a> &middot;
  460. <a href="/tagged/new-girl">New Girl</a> &middot;
  461. <a href="/tagged/the-oc">The OC</a> &middot;
  462. <a href="/tagged/the-office">The Office</a> &middot;
  463. <a href="/tagged/parks-and-rec">Parks and Rec</a> &middot;
  464. <a href="/tagged/shameless">Shameless</a> &middot;
  465. <a href="/tagged/the-vampire-diaries">The Vampire Diaries</a> &middot;
  466. <a href="/tagged/the-walking-dead">The Walking Dead</a> &middot;
  467. <a href="/tagged/workaholics">Workaholics</a>
  468. </div>
  469. </div>
  470.  
  471.  
  472. </div>
  473. </div>
  474. </div>
  475.  
  476. <!-- TAGS END HERE -->
  477.  
  478.  
  479.  
  480.  
  481.  
  482.  
  483.  
  484.  
  485.  
  486.  
  487.  
  488. <!-- BLOGROLL STARTS HERE (do not edit) -->
  489.  
  490. <div class="4" style="display:none;">
  491. <div id="content">
  492. <div class="gb">
  493. <h1>following</h1>
  494.  
  495. <div id="nav">
  496. <a class="one" href="#">about</a> /
  497. <a class="two" href="#">message</a> /
  498. <a class="three" href="#">tags</a> /
  499. <a class="none">blogroll</a>
  500. </div>
  501. </div>
  502.  
  503. <div id="blogroll">{block:Following}{block:Followed}<div id="box"><a title="{FollowedName}" href="{FollowedURL}"><img src="{FollowedPortraitURL-40}" align="left"></a></div>{/block:Followed}{/block:Following}</div>
  504.  
  505. </div>
  506. </div>
  507.  
  508. <!-- BLOGROLL ENDS HERE -->
  509.  
  510.  
  511. </div>
  512.  
  513. <!-- please don't delete my credit it's small u can hardly notice it anyway and i work really hard to make themes for u cuties :) -->
  514.  
  515. <div id="c">&copy; <a href="http://str-wrs.tumblr.com">str-wrs</a></div>
  516. </body>
  517. </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!