API tools faq
paste
Advertisement
rasperries

linear nav

rasperries
Apr 10th, 2015
264
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.20 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <!DOCTYPE html>
  3. <script>var __pbpa = true;</script><script>var translated_warning_string = 'Warning: Never enter your Tumblr password unless \u201chttps://www.tumblr.com/login\u201d\x0ais the address in your web browser.\x0a\x0aYou should also see a green \u201cTumblr, Inc.\u201d identification in the address bar.\x0a\x0aSpammers and other bad guys use fake forms to steal passwords.\x0a\x0aTumblr will never ask you to log in from a user\u2019s blog.\x0a\x0aAre you absolutely sure you want to continue?';</script><script type="text/javascript" language="javascript" src="http://assets.tumblr.com/assets/scripts/pre_tumblelog.js?_v=75ff60d174af47d7ea271d82d4fe1151"></script>
  4. <!DOCTYPE html>
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# blog: http://ogp.me/ns/blog#">
  7. <!--
  8.  
  9.  
  10.  
  11.  
  12.  
  13. linear theme by eoxk
  14. http://eoxk.tumblr.com
  15.  
  16.  
  17.  
  18.  
  19. -->
  20. <title>cool</title>
  21. <style type="text/css">figure {margin: 0;}</style>
  22. <link rel="alternate" type="application/rss+xml" href="http://20stitches.tumblr.com/rss"/>
  23. <link rel="shortcut icon" href="http://38.media.tumblr.com/avatar_42b7a2ca03f1_128.png"/>
  24.  
  25. <meta name="description" content="Profile Trish: USA Gemini. Dog lover. Perpetually sleep-deprived. In short, I&rsquo;m a hopeless romantic who likes literature, indian food, cold coffee and dark, wintry weather. &bull; bae #1: harry styles &bull;..." />
  26.  
  27. <meta name="image:background" content=""/>
  28. <meta name="color:background" content="#f9f9f9"/>
  29. <meta name="color:text" content="#7f7f7f"/>
  30. <meta name="color:border" content="#ededed"/>
  31. <meta name="color:content bg" content="#ffffff"/>
  32. <meta name="color:accent" content="#adadad"/>
  33. <meta name="color:accent bg" content="#fafafa"/>
  34. <meta name="color:accent border" content="#ededed"/>
  35. <meta name="color:bold" content="#6a6a6a"/>
  36. <meta name="color:link" content="#adadad"/>
  37. <meta name="color:link hover" content="#6a6a6a"/>
  38. <meta name="color:post info" content="#adadad"/>
  39. <meta name="color:scrollbar" content="#dcdcdc"/>
  40. <meta name="select:post width" content="300" title="300px"/>
  41. <meta name="select:post width" content="350" title="350px"/>
  42. <meta name="select:post width" content="400" title="400px"/>
  43. <meta name="select:post width" content="450" title="450px"/>
  44. <meta name="select:post width" content="490" title="500px"/>
  45. <meta name="select:body font" content="lato" title="lato"/>
  46. <meta name="select:body font" content="open-sans" title="open sans"/>
  47. <meta name="select:body font" content="droid-sans" title="droid sans"/>
  48. <meta name="select:body font" content="pt-sans" title="pt sans"/>
  49. <meta name="select:body font" content="pt-serif" title="pt serif"/>
  50. <meta name="select:body font" content="lora" title="lora"/>
  51. <meta name="if:show avatar" content="1"/>
  52. <meta name="if:show title" content="1"/>
  53. <meta name="if:show description" content="1"/>
  54. <meta name="if:show captions" content="1"/>
  55. <meta name="if:show reblog" content="1"/>
  56. <meta name="if:show tags" content="1"/>
  57. <meta name="if:tile background" content="1"/>
  58. <meta name="if:letter spacing" content="0"/>
  59. <meta name="if:infinite scroll" content="1"/>
  60. <meta name="text:home link" content="home"/>
  61. <meta name="text:archive link" content="archive"/>
  62. <meta name="text:ask link" content="ask"/>
  63. <meta name="text:link 1" content=""/>
  64. <meta name="text:link 1 url" content=""/>
  65. <meta name="text:link 2" content=""/>
  66. <meta name="text:link 2 url" content=""/>
  67. <meta name="text:link 3" content=""/>
  68. <meta name="text:link 3 url" content=""/>
  69. <meta name="text:link 4" content=""/>
  70. <meta name="text:link 4 url" content=""/>
  71. <meta name="text:link 5" content=""/>
  72. <meta name="text:link 5 url" content=""/>
  73. <meta name="text:link 6" content=""/>
  74. <meta name="text:link 6 url" content=""/>
  75.  
  76. <script src="//use.edgefonts.net/droid-sans:n4,i4;inconsolata:n5.js"></script>
  77. <link href="http://static.tumblr.com/qudkd6d/X0unm3xuk/k.css" rel="stylesheet" type="text/css"/>
  78.  
  79. <style type="text/css">
  80.  
  81. /* basic styles */
  82.  
  83. ::-webkit-scrollbar {
  84. width:4px;
  85. height:4px;
  86. }
  87. ::-webkit-scrollbar,
  88. ::-webkit-scrollbar-track {
  89. background-color:#ffffff;
  90. }
  91. ::-webkit-scrollbar-thumb {
  92. background-color:#dddddd;
  93. }
  94. body {
  95. font-size:9px;
  96. font-family:droid-sans, 'trebuchet ms', sans-serif;
  97. line-height:15px;
  98.  
  99. color:#aaaaaa;
  100. background-color:#fafafa;
  101.  
  102. }
  103. a {
  104. -webkit-transition:all .3s ease-in-out;
  105. transition:all .3s ease-in-out;
  106. }
  107. blockquote {
  108. padding:0 1.5em;
  109. margin:0 0 0 1.5em;
  110. border-left:1px solid #dddddd;
  111. }
  112. pre {
  113. font-family:consolas, inconsolata, monospace;
  114. }
  115. ol, ul {
  116. padding-left:3em;
  117. }
  118. b, strong {
  119. font-weight:400;
  120. color:#000000;
  121. }
  122. a b, a strong {
  123. color:inherit;
  124. }
  125. blockquote, ol, ul, p, pre {
  126. margin-top:1em;
  127. margin-bottom:1em;
  128. }
  129.  
  130. /* accents */
  131.  
  132. .accent {
  133. font-size:7px;
  134. font-family:'trebuchet ms';
  135. letter-spacing:1px;
  136. text-transform:uppercase;
  137. color:#bfbfbf;
  138. }
  139. .block {
  140. padding:1em 1.25em;
  141. border-right:1px solid #dddddd;
  142. border-bottom:1px solid #dddddd;
  143. background-color:#fafafa;
  144. color:#bfbfbf;
  145. }
  146. .title {
  147. font-size:1.2em;
  148. font-family:droid-sans, 'trebuchet ms', sans-serif;
  149. line-height:inherit;
  150. text-transform:uppercase;
  151. letter-spacing:1px;
  152. margin-bottom:.83em;
  153. color:#000000;
  154. }
  155. ul {
  156. position:relative;
  157. font-size:7px;
  158. font-family:'trebuchet ms';
  159. letter-spacing:1px;
  160. text-transform:uppercase;
  161. border:0!important;
  162. color:#bfbfbf;
  163. }
  164. ul, .notes {
  165. list-style-type:none;
  166. }
  167. ul li, .notes li {
  168. position:relative;
  169. }
  170. ul li::before, .notes li::before, .asker::before {
  171. content:" ";
  172. display:inline-block;
  173. position:absolute;
  174. left:-2em;
  175. top:1em;
  176. width:1em;
  177. height:1px;
  178. background-color:#eeeeee;
  179. }
  180.  
  181. /* container */
  182.  
  183. #main {
  184. margin:0 auto;
  185. padding:150px;
  186. min-height:calc(100% - 300px);
  187. text-align:center;
  188. width:350px;
  189. background-color:#ffffff;
  190. }
  191.  
  192. /* header/sidebar */
  193.  
  194. aside {
  195. margin:0 auto;
  196. width:133px;
  197. }
  198. aside .avatar {
  199. display:block;
  200. width:32px;
  201. height:32px;
  202. margin:0 auto 1.75em;
  203. border-radius:3px;
  204. overflow:hidden;
  205. }
  206. aside .avatar.circle {
  207. border-radius:16px;
  208. }
  209. aside .desc {
  210. margin-bottom:1em;
  211. }
  212. aside hr {
  213. margin:1em 0;
  214. height:1px;
  215. background-color:#eeeeee;
  216. }
  217. aside nav a {
  218. padding:0 .25em;
  219. display:inline-block;
  220. }
  221. aside nav a::after {
  222. content:"";
  223. display:inline-block;
  224. width:.25em;
  225. }
  226. aside nav a:last-child::after {
  227. width:0;
  228. }
  229.  
  230. /* posts */
  231.  
  232. #content {
  233. text-align:left;
  234. }
  235. .entry {
  236. position:relative;
  237. margin:150px 0;
  238. }
  239. .entry:last-of-type {
  240. margin-bottom:0;
  241. }
  242. .post {
  243. position:relative;
  244. }
  245.  
  246. /* info */
  247.  
  248. .info {
  249. position:absolute;
  250. top:0;
  251. bottom:0;
  252. left:100%;
  253. width:calc(150px - 3.5em);
  254. margin:0 0 0 1.75em;
  255. color:#bfbfbf;
  256. background-color:transparent;
  257. border-right:0 solid #eeeeee;
  258. -webkit-transition:opacity .5s ease-in-out;
  259. transition:opacity .5s ease-in-out;
  260.  
  261. }
  262. .entry:hover .info {
  263. opacity:1;
  264. }
  265. .info hr {
  266. margin:1em 1px;
  267. height:1px;
  268. border-left:3em solid #eeeeee;
  269. }
  270. .tags {
  271.  
  272. }
  273. .entry:hover .tags {
  274. -webkit-transition-delay:.25s;
  275. transition-delay:.25s;
  276. opacity:1;
  277. }
  278. .tags .comma {
  279. font-style:inherit;
  280. }
  281. .tags .comma:last-of-type {
  282. display:none;
  283. }
  284.  
  285. /* post titles */
  286.  
  287. .quote, .question {
  288. position:relative;
  289. top:-1em;
  290. }
  291. .question {
  292. overflow:auto;
  293. }
  294. .question .asker {
  295. margin-left:4em;
  296. position:relative;
  297. font-style:inherit;
  298. float:right;
  299. }
  300. .question .asker::before {
  301. width:2em;
  302. left:-3em;
  303. background-color:#dddddd;
  304. }
  305.  
  306. /* text and captions */
  307.  
  308. .text a {
  309. position:relative;
  310. line-height:initial;
  311. display:inline-block;
  312. vertical-align:baseline;
  313. color:#999999;
  314. border-bottom:1px solid #eeeeee;
  315. }
  316. .text a::before {
  317. content:"";
  318. position:absolute;
  319. bottom:-1px;
  320. left:50%;
  321. right:50%;
  322. height:1px;
  323. z-index:1;
  324. opacity:.75;
  325. background-color:#000000;
  326. -webkit-transition:all .3s ease-in-out;
  327. transition:all .3s ease-in-out;
  328. }
  329. .text a:hover {
  330. color:#000000;
  331. border-color:transparent;
  332. }
  333. .text a:hover::before {
  334. left:0;
  335. right:0;
  336. }
  337. .text a:hover::after {
  338. opacity:0;
  339. }
  340. .answer, .source {
  341. padding:.75em 1.75em 0;
  342. }
  343. .caption {
  344. padding:1.75em 1.75em 0;
  345.  
  346. }
  347.  
  348. /* chat posts */
  349.  
  350. .chat .label {
  351. margin-right:.5em;
  352. }
  353.  
  354. /* audio posts */
  355.  
  356. .audiowrap {
  357. position:relative;
  358. padding:5px;
  359. height:27px;
  360. overflow:hidden;
  361. line-height:0;
  362. text-align:left;
  363. background-color:#fafafa;
  364. }
  365. .albumart {
  366. position:relative;
  367. z-index:1;
  368. display:inline-block;
  369. width:27px;
  370. height:27px;
  371. opacity:.9;
  372. background-size:cover;
  373. }
  374. .audio {
  375. position:absolute;
  376. display:inline-block;
  377. left:0px;
  378. top:0px;
  379. right:0px;
  380. bottom:0px;
  381. text-align:left;
  382. }
  383. .audio .player {
  384. width:27px;
  385. height:27px;
  386. left:37px;
  387. top:5px;
  388. opacity:.9;
  389. overflow:hidden;
  390. position:absolute;
  391. }
  392. .audio .track {
  393. overflow:hidden;
  394. position:absolute;
  395. top:0;
  396. left:67px;
  397. right:0;
  398. bottom:0;
  399. padding:5px;
  400. line-height:27px!important;
  401. background-color:;
  402. }
  403.  
  404. /* photos and videos */
  405.  
  406. .media {
  407. overflow:hidden;
  408. }
  409. .video iframe,
  410. .tumblr_video_container {
  411. display:block;
  412. max-width:100%;
  413. max-height:350px;
  414. }
  415. .video #youtube_iframe {
  416. max-height:calc(350px * 0.67);
  417. }
  418.  
  419. /* pagination */
  420.  
  421. .pagination {
  422. margin-top:150px;
  423.  
  424. }
  425. .pagination hr {
  426. display:inline-block;
  427. vertical-align:middle;
  428. margin:0 .75em;
  429. width:1em;
  430. height:1px;
  431. background-color:#eeeeee;
  432. }
  433.  
  434. /* post notes */
  435.  
  436. .notes {
  437. margin:0;
  438. list-style-type:none;
  439. }
  440. .notes a {
  441. border:0;
  442. text-decoration:none;
  443. color:inherit;
  444. }
  445. .notes img {
  446. display:none;
  447. }
  448. .notes li blockquote {
  449. margin:.75em;
  450. }
  451.  
  452. /* etc */
  453.  
  454. #stt {
  455. text-align:center;
  456. display:block;
  457. position:fixed;
  458. left:calc(50% - 350px/2 - 150px);
  459. bottom:50px;
  460. opacity:0;
  461. width:150px;
  462. }
  463. #stt.s {
  464. opacity:1;
  465. }
  466. #theme {
  467. background-color:#ffffff;
  468. color:#bfbfbf;
  469. }
  470. #tumblr_lightbox > div:nth-child(2) {
  471. opacity:.9;
  472. background-color:#fafafa;
  473. }
  474.  
  475. .sss {
  476. position:relative;
  477. width:calc(350px + 0px);
  478. display:block;
  479. margin-bottom:20px;
  480. font-weight:normal;
  481. }
  482.  
  483. .sss a, .sss span {
  484. width:calc(50% - 5px);
  485. display:inline-block;
  486. margin-right:5px;
  487. text-transform:uppercase;
  488. letter-spacing:1px;
  489. font-style:normal;
  490. font-size:7px;
  491. border-bottom:1px solid #f5f5f5;
  492. padding:5px 0;
  493. font-weight:normal;
  494. }
  495.  
  496. .sss span {
  497. font-weight:normal;
  498. color:#000000;
  499. font-style:italic;
  500. }
  501.  
  502. </style>
  503.  
  504. </head>
  505. <body>
  506. <div id="main">
  507. <aside class="accent"><!-- sidebar -->
  508. <a href="/" class="avatar circle"><img src="http://38.media.tumblr.com/avatar_42b7a2ca03f1_64.png"/></a>
  509.  
  510. <div class="desc">trish / gemini</div>
  511. <hr/><nav><!-- navigation --><a href="/">home</a> <a href="/archive">archive</a> <a href="/ask">message</a> <a href="/info">about</a> <a href="/tagged/!"target="_blank">edits</a> <a href="/icons">icons</a> <a href="/n">navigation</a> </ol></nav>
  512. </aside>
  513. <div id="content"><!-- posts -->
  514.  
  515.  
  516. <article class="entry">
  517. <div class="post">
  518.  
  519.  
  520. <h1 class="title">Navigation</h1>
  521.  
  522. <div class="pad">
  523.  
  524. <div class="sss"><span>Personal</span><a href="/info">Profile</a><a href="/books">Books 2015</a><a href="/ficrec">fic rec</a><a href="/tv">television</a><a href="http://amzn.com/w/1XTT2GK7DNNM">wishlist</a><a href="/saved">saved urls</a><a href="/blogroll">blogroll</a></div>
  525.  
  526. <div class="sss"><span>Photoshop</span><a href="/tagged/!">Edits</a><a href="/tagged/typo">Typography</a><a href="/tagged/*">graphics</a><a href="/tagged/**">gifs</a><a href="/icons">icons</a><a href="http://photoswift.tumblr.com/tagged/trish"target="_blank">photoswift</a><a href="/tagged/1k">1k+ Notes</a></div>
  527.  
  528. <div class="sss"><span>Tags: Basics</span><a href="/tagged/tunes">music</a><a href="/tagged/text">text posts</a><a href="/tagged/quote">quotes</a><a href="/tagged/words">words</a><a href="/tagged/important">important</a><a href="/tagged/ask">asks</a><a href="/tagged/reference">reference</a></div>
  529.  
  530. <div class="sss"><span>Tags: Aesthetic</span><a href="/tagged/ph">photography</a><a href="/tagged/art">art</a><a href="/tagged/sculpture">sculpture</a><a href="/tagged/architecture">architecture</a><a href="/tagged/interiors">interiors</a><a href="/tagged/fashion">fashion</a><a href="/tagged/makeup">makeup</a><a href="/tagged/anatomy">anatomy</a><a href="/tagged/hands">hands</a><a href="/tagged/homme">men</a><a href="/tagged/girls">women</a><a href="/tagged/space">space</a><a href="/tagged/plants">plants</a></div>
  531.  
  532. <div class="sss"><span>Tags: People</span><a href="/tagged/hs">harry styles</a><a href="/tagged/zm">zayn malik</a><a href="/tagged/alex turner">alex turner</a><a href="/tagged/ts">taylor swift</a><a href="/tagged/cara+delevingne">cara delevingne</a><a href="/tagged/phoebe+tonkin">phoebe tonkin</a><a href="/tagged/lorde">lorde</a><a href="/tagged/alexa+chung">alexa chung</a><a href="/tagged/lana+del+rey">lana del rey</a></div>
  533.  
  534. <div class="sss"><span>Tags: Literature</span><a href="/tagged/hp">harry potter</a><a href="/tagged/gone girl">gone girl</a><a href="/tagged/the raven cycle">the raven cycle</a><a href="/tagged/tsoa">the song of achilles</a><a href="/tagged/deathless">deathless</a><a href="/tagged/the secret history">the secret history</a><a href="/tagged/the grisha series">the grisha trilogy</a></div>
  535.  
  536. <div class="sss"><span>Tags: Television</span><a href="/tagged/the 100">the 100</a><a href="/tagged/game of thrones">game of thrones</a><a href="/tagged/htgawm">htgawm</a><a href="/tagged/grey's anatomy">grey's anatomy</a><a href="/tagged/gilmore girls">gilmore girls</a><a href="/tagged/the mindy project">the mindy project</a><a href="/tagged/mmfd">my mad fat diary</a><a href="/tagged/friends">friends</a><a href="/tagged/fnl">friday night lights</a></div>
  537.  
  538. <div class="sss"><span>Tags: Film</span><a href="/tagged/hp">harry potter</a><a href="/tagged/thg">the hunger games</a><a href="/tagged/gone girl">gone girl</a><a href="/tagged/pride and prejudice">pride and prejudice</a><a href="/tagged/divergent">divergent</a><a href="/tagged/atonement">atonement</a><a href="/tagged/marie antoinette">marie antoinette</a> <a href="/tagged/titanic">titanic</a><a href="/tagged/inception">inception</a></div>
  539.  
  540.  
  541. <div class="sss"><span>Page Design by</span><a href="http://sorrism.tumblr.com"target="_blank">sorrism</a>
  542.  
  543.  
  544.  
  545.  
  546.  
  547.  
  548.  
  549.  
  550.  
  551.  
  552.  
  553.  
  554.  
  555.  
  556.  
  557.  
  558.  
  559.  
  560.  
  561.  
  562.  
  563.  
  564.  
  565. </div>
  566.  
  567.  
  568.  
  569.  
  570.  
  571.  
  572.  
  573.  
  574.  
  575.  
  576. </div>
  577.  
  578. <div id="theme"><a href="http://eoxk.tumblr.com">K.</a></div>
  579. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="http://static.tumblr.com/qudkd6d/QGdnk057h/jquery.style-my-tooltips.js"></script><script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  580. <script>
  581. $(document).ready(function(){
  582. $('.photo-slideshow').pxuPhotoset({
  583. lightbox: true,
  584. rounded: 'corners',
  585. borderRadius: '3px',
  586. gutter: '3px',
  587. photoset: '.photo-slideshow',
  588. photoWrap: '.photo-data',
  589. photo: '.pxu-photo'
  590. });
  591. $('#button, .bg').click(function(){
  592. $('body').toggleClass('open');
  593. return false
  594. });
  595. $('[title]').style_my_tooltips({
  596. tip_follows_cursor: false,
  597. tip_delay_time: 150,
  598. tip_fade_speed: 150,
  599. attribute: "title"
  600. });
  601. });
  602. </script>
  603.  
  604.  
  605. <script>
  606. $(document).ready(function(){
  607. var $container = $('#content');
  608.  
  609.  
  610. });
  611. </script>
  612.  
  613.  
  614.  
  615. </body></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!