API tools faq
paste
kthms

rosé theme

kthms
Dec 14th, 2016
13,206
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.77 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html xmlns="https://www.w3.org/1999/xhtml">
  3. <head>
  4. <!--
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11. rosé @ shythemes
  12.  
  13.  
  14.  
  15.  
  16.  
  17. -->
  18. <title>{Title}</title>
  19. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  20. <link rel="shortcut icon" href="{Favicon}">
  21. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  22. <meta name="viewport" content="width=device-width, initial-scale=1">
  23. <meta name="if:show description" content="">
  24. <meta name="if:show avatar" content="">
  25. <meta name="if:show tags" content="">
  26. <meta name="if:infinite scroll" content="">
  27. <meta name="text:home link" content="">
  28. <meta name="text:archive link" content="archive">
  29. <meta name="text:ask link" content="ask">
  30. <meta name="text:link 1" content="">
  31. <meta name="text:link 1 url" content="">
  32. <meta name="text:link 2" content="">
  33. <meta name="text:link 2 url" content="">
  34. <meta name="text:link 3" content="">
  35. <meta name="text:link 3 url" content="">
  36. <meta name="text:link 4" content="">
  37. <meta name="text:link 4 url" content="">
  38. <meta name="text:link 5" content="">
  39. <meta name="text:link 5 url" content="">
  40. <meta name="text:link 6" content="">
  41. <meta name="text:link 6 url" content="">
  42. <link href='//fonts.googleapis.com/css?family=Lato:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  43. <style type="text/css">
  44. .video iframe {min-width:0!important;}
  45. html, body {
  46. width:100%;
  47. }
  48. body {
  49. margin:0;
  50. font-size:9px;
  51. letter-spacing:0.5px;
  52. font-family:lato, helvetica, sans-serif;
  53. line-height:16px;
  54. -moz-osx-font-smoothing:grayscale;
  55. -webkit-font-smoothing:antialiased;
  56. font-smoothing:antialiased;
  57. -ms-text-size-adjust:100%;
  58. -moz-text-size-adjust:100%;
  59. -webkit-text-size-adjust:100%;
  60. overflow-x:hidden;
  61. color:#2f2f2f;
  62. background:#f6f6f6;
  63. }
  64. a {
  65. color:inherit;
  66. text-decoration:none;
  67. -webkit-transition:opacity .4s ease-in-out;
  68. transition:opacity .4s ease-in-out;
  69. }
  70. small, sub {
  71. font-size:1em;
  72. vertical-align:baseline;
  73. }
  74. blockquote, ol, ul, p, pre {
  75. margin:0 0 10px;
  76. }
  77. h1, h2, h3, h4, h5, h6 {
  78. margin:0 0 10px;
  79. font-size:1em;
  80. font-weight:inherit;
  81. }
  82. ul, ol {
  83. padding-left:20px;
  84. }
  85. ol li {
  86. padding-left:6px;
  87. }
  88. pre {
  89. white-space:normal;
  90. font-size:9px;
  91. font-family:'roboto mono', monospace;
  92. }
  93. iframe {
  94. display:block;
  95. }
  96. img {
  97. border:0;
  98. max-width:100%;
  99. height:auto;
  100. display:block;
  101. }
  102. hr {
  103. margin:1em 0;
  104. border:0;
  105. height:1px;
  106. -moz-box-sizing:border-box;
  107. box-sizing:border-box;
  108. background-color:#dddddd;
  109. }
  110. svg {
  111. width:10px;
  112. height:auto;
  113. opacity:.5;
  114. padding:1px;
  115. display:block;
  116. overflow:visible;
  117. }
  118.  
  119. /* accents */
  120.  
  121. .accent, .title {
  122. font-size:7px;
  123. font-weight:bold;
  124. font-family:lato, sans-serif;
  125. letter-spacing:1.5px;
  126. text-transform:uppercase;
  127. }
  128. .text a {
  129. font-style:italic;
  130. }
  131. .text a:hover {
  132. background-image:linear-gradient(rgb(120,120,120), rgb(120,120,120));
  133. background-size:1px 1px;
  134. background-repeat:repeat-x;
  135. background-position:left bottom;
  136. }
  137. blockquote:after,
  138. blockquote > p:first-child > .tumblr_blog:first-child:before {
  139. content:'';
  140. display:block;
  141. }
  142. hr,
  143. blockquote:after,
  144. blockquote > p:first-child > .tumblr_blog:first-child:before {
  145. margin:13px 0 14px;
  146. width:25px;
  147. height:1px;
  148. background-color:#d9d9d9;
  149. }
  150. blockquote:last-child:after {
  151. display:none;
  152. }
  153.  
  154. /* container */
  155.  
  156. .main {
  157. margin:76px 20px 20px;
  158. }
  159.  
  160. /* header */
  161.  
  162. header {
  163. position:fixed;
  164. margin-top:-76px;
  165. left:0;
  166. right:0;
  167. z-index:5;
  168. padding:20px;
  169. overflow:hidden;
  170. text-align:center;
  171. background-color:#ffffff;
  172. }
  173. header .title {
  174. margin:0;
  175. font-size:8px;
  176. line-height:inherit;
  177. padding-left:0;
  178. display:block;
  179. }
  180. header .links {
  181. opacity:.6;
  182.  
  183. }
  184. nav li {
  185. font-style:italic;
  186. display:inline-block;
  187. }
  188. nav li a {
  189. opacity:.63;
  190. }
  191. nav li a:hover {
  192. opacity:.33;
  193. }
  194. nav li:after {
  195. content:'';
  196. margin:0 5px;
  197. }
  198. nav li:last-child:after {
  199. content:'';
  200. margin:0;
  201. }
  202.  
  203. /* aside */
  204.  
  205. aside {
  206. margin:75px auto 0;
  207. padding:150px 75px 0;
  208. text-align:center;
  209. max-width:400px;
  210. {block:ifNotShowDescription}
  211. {block:ifNotShowAvatar}
  212. display:none;
  213. {/block:ifNotShowAvatar}
  214. {/block:ifNotShowDescription}
  215. }
  216. aside:empty {
  217. display:none;
  218. }
  219. aside .desc {
  220. opacity:.6;
  221. font-style:italic;
  222. }
  223. aside .icon {
  224. margin:0 auto 16px;
  225. width:32px;
  226. border-radius:2px;
  227. }
  228. aside .circle.icon {
  229. border-radius:16px;
  230. }
  231.  
  232. /* posts */
  233.  
  234. .content {
  235. margin:0;
  236. padding-top:75px;
  237. font-size:0;
  238. text-align:center;
  239. min-height:calc(100vh - 152px);
  240. }
  241. .entry {
  242. position:relative;
  243. display:inline-block;
  244. font-size:9px;
  245. padding:75px;
  246. -moz-box-sizing:border-box;
  247. box-sizing:border-box;
  248. text-align:left;
  249. width:450px;
  250. {block:PermalinkPage}
  251. width:450px;
  252. max-width:calc(100vw - 100px);
  253. display:block;
  254. margin:0 auto;
  255. {/block:PermalinkPage}
  256. }
  257. .post {
  258. padding:15px 18px;
  259. overflow:hidden;
  260. }
  261. .post, .media {
  262. background-color:#ffffff;
  263. }
  264.  
  265. /* post info */
  266.  
  267. .date, .tags {
  268. position:relative;
  269. }
  270. .permalink {
  271. float:right;
  272. }
  273. .tags {
  274. font-style:italic;
  275. display:inline;
  276. }
  277. .tags a {
  278. opacity:.63;
  279. }
  280. .tags a:hover {
  281. opacity:.33;
  282. }
  283. .tags .comma {
  284. margin:0 4px;
  285. }
  286. .rf {
  287. margin:0 0 10px;
  288. }
  289.  
  290. /* media */
  291.  
  292. .media {
  293. position:relative;
  294. overflow:hidden;
  295. display:none;
  296. }
  297. .a .media,
  298. .m .media {
  299. display:block;
  300. }
  301. .video {
  302. width:300px;
  303. }
  304.  
  305. /* post text */
  306.  
  307. .text:not(:last-child) {
  308. margin-bottom:10px;
  309. }
  310. .text img {
  311. padding:2px 0;
  312. }
  313. .chat {
  314. padding:0;
  315. list-style-type:none;
  316. }
  317. .question, .quote {
  318. margin:0 -20px 18px;
  319. padding:0 20px 18px;
  320. border-bottom:1px solid #e6e6e6;
  321. overflow:hidden;
  322. }
  323. .quote {
  324. font-size:12px;
  325. font-style:italic;
  326. letter-spacing:0.25px;
  327. }
  328. .sender {
  329. opacity:.6;
  330. font-style:italic;
  331. text-transform:lowercase;
  332. float:right;
  333. padding-left:14px;
  334. }
  335.  
  336. /* audio posts */
  337.  
  338. .audiowrap {
  339. position:relative;
  340. height:60px;
  341. overflow:hidden;
  342. background-color:#ffffff;
  343. border-bottom:1px solid #e6e6e6;
  344. }
  345. .audio {
  346. position:absolute;
  347. display:inline-block;
  348. left:0;
  349. top:0;
  350. right:0;
  351. bottom:0;
  352. text-align:left;
  353. line-height:60px;
  354. }
  355. .audio .player {
  356. width:27px;
  357. height:27px;
  358. left:16px;
  359. top:16px;
  360. opacity:.4;
  361. line-height:0;
  362. overflow:hidden;
  363. position:absolute;
  364. }
  365. .audio .track {
  366. overflow:hidden;
  367. line-height:15px;
  368. margin-left:60px;
  369. width: calc(100% - 60px);
  370. display:inline-block;
  371. vertical-align:middle;
  372. }
  373. .audio .track span {
  374. display:block;
  375. max-height:15px;
  376. white-space:nowrap;
  377. overflow:hidden;
  378. text-overflow:ellipsis;
  379. margin-right:15px;
  380. }
  381. .audio .track span:last-child {
  382. opacity:.6;
  383. }
  384.  
  385. /* pagination */
  386.  
  387. .page {
  388. text-align:center;
  389. margin:0 75px 75px;
  390. }
  391. .page a {
  392. display:inline-block;
  393. margin:0 20px;
  394. }
  395. .page .prev,
  396. .page .comma {
  397. opacity:.33;
  398. }
  399. .page .next {
  400. opacity:.6;
  401. }
  402.  
  403. /* post notes */
  404.  
  405. #notes .title {
  406. margin:0;
  407. }
  408. .notes {
  409. margin:18px 0 0;
  410. padding:0;
  411. }
  412. .note {
  413. display:block;
  414. padding:0;
  415. opacity:.6;
  416. }
  417. .note img {
  418. display:none;
  419. }
  420. .note blockquote {
  421. margin:0;
  422. }
  423. .more_notes_link_container {
  424. text-align:left!important;
  425. margin-top:18px;
  426. }
  427.  
  428. #tumblr_controls,
  429. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls {
  430. position:fixed!important;
  431. top:0!important;
  432. right:0!important;
  433. opacity:.4!important;
  434. -webkit-filter:invert(100%);
  435. -webkit-backface-visibility:hidden;
  436. padding:17px;
  437. }
  438. #tumblr_lightbox, .tmblr-lightbox {
  439. background-color:#f6f6f6!important;
  440. }
  441. #vignette, .vignette {
  442. opacity:0;
  443. }
  444. #tumblr_lightbox img, .lightbox-image {
  445. box-shadow:none!important;
  446. border-radius:0!important;
  447. -moz-box-sizing:border-box;
  448. box-sizing:border-box;
  449. max-width:none;
  450. }
  451. #tumblr_lightbox_caption, .lightbox-caption {
  452. visibility:hidden;
  453. }
  454. #theme {
  455. position:fixed;
  456. display:block;
  457. bottom:10px;
  458. right:10px;
  459. z-index:999;
  460. padding:5px;
  461. line-height:1em;
  462. opacity:.6;
  463. }
  464. #infscr-loading {
  465. display:none!important;
  466. }
  467.  
  468. {block:IndexPage}
  469. /* index */
  470.  
  471. .entry.m {
  472. width:auto;
  473. }
  474. .entry.m .post {
  475. position:absolute;
  476. opacity:0;
  477. bottom:75px;
  478. left:75px;
  479. right:75px;
  480. background-color:#ffffff;
  481. -webkit-transition:opacity .4s ease-in-out;
  482. transition:opacity .4s ease-in-out;
  483. }
  484. .entry.m:hover .post {
  485. opacity:1;
  486. }
  487. .entry.m .caption {
  488. display:none;
  489. }
  490. .media img {
  491. max-width:300px;
  492. max-height:300px;
  493. }
  494. {block:ifNotShowTags}
  495. .tags {
  496. display:none;
  497. }
  498. {/block:ifNotShowTags}
  499. {block:ifInfiniteScroll}
  500. .pagination {
  501. display:none;
  502. }
  503. {/block:ifInfiniteScroll}
  504. {/block:IndexPage}
  505. </style>
  506. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css">
  507. </head>
  508. <body class="{select:font}">
  509. <div class="main">
  510. <header><h1 class="title"><a href="/">{Title}</a></h1>
  511. <nav>
  512. {block:ifHomeLink}<li><a href="/">{text:home link}</a></li>{/block:ifHomeLink}
  513. {block:ifArchiveLink}<li><a href="/archive">{text:archive link}</a></li>{/block:ifArchiveLink}
  514. {block:ifAskLink}<li><a href="/ask">{text:ask link}</a></li>{/block:ifAskLink}
  515. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li> {/block:Pages}{/block:HasPages}
  516. {block:ifLink1}<li><a href="{text:link 1 url}">{text:link 1}</a></li>{/block:ifLink1}
  517. {block:ifLink2}<li><a href="{text:link 2 url}">{text:link 2}</a></li>{/block:ifLink2}
  518. {block:ifLink3}<li><a href="{text:link 3 url}">{text:link 3}</a></li>{/block:ifLink3}
  519. {block:ifLink4}<li><a href="{text:link 4 url}">{text:link 4}</a></li>{/block:ifLink4}
  520. {block:ifLink5}<li><a href="{text:link 5 url}">{text:link 5}</a></li>{/block:ifLink5}
  521. {block:ifLink6}<li><a href="{text:link 6 url}">{text:link 6}</a></li>{/block:ifLink6}
  522. </nav>
  523. </header>
  524. <aside>
  525. {block:ifShowAvatar}<img class="{AvatarShape} icon" src="{PortraitURL-64}">{/block:ifShowAvatar}
  526. {block:ifShowDescription}<div class="desc">{Description}</div>{/block:ifShowDescription}
  527. </aside>
  528. <div class="content">
  529. {block:Posts}
  530. <article id="{PostID}" class="entry {block:Photo}m{/block:Photo}{block:Photoset}m{/block:Photoset}{block:Video}m{/block:Video}{block:Audio}a{/block:Audio}">
  531. <section class="media">
  532. {block:Audio}
  533. <div class="audiowrap">
  534. <div class="audio">
  535. {block:AudioPlayer}
  536. <div class="player">{AudioPlayerWhite}</div>
  537. {/block:AudioPlayer}
  538. <div class="track">{block:TrackName}<span class="h">{TrackName}</span>{/block:TrackName}{block:Artist}<span>{Artist}</span>{/block:Artist}</div>
  539. </div>
  540. </div>
  541. {/block:Audio}
  542. {block:Photo}
  543. {block:PermalinkPage}
  544. {LinkOpenTag}
  545. <img src="{PhotoURL-HighRes}">
  546. {LinkCloseTag}
  547. {/block:PermalinkPage}
  548. {block:IndexPage}
  549. <a class="lb h" href="#" onclick="Tumblr.Lightbox.init([{ width: '{PhotoWidth-HighRes}', height: '{PhotoHeight-HighRes}', low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]);$('body').toggleClass('tumblr_lightbox_active');return false">
  550. <img src="{PhotoURL-HighRes}">
  551. </a>
  552. {/block:IndexPage}
  553. {/block:Photo}
  554. {block:Photoset}
  555. {block:PermalinkPage}
  556. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  557. {/block:PermalinkPage}
  558. {block:IndexPage}
  559. <a class="lb" href="#" onclick="Tumblr.Lightbox.init([/*{block:Photos}, /**/ { width: '{PhotoWidth-HighRes}', height: '{PhotoHeight-HighRes}', low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }{/block:Photos}]);$('body').toggleClass('tumblr_lightbox_active');return false">
  560. {block:Photos}<img src="{PhotoURL-500}"><!--{/block:Photos}-->
  561. </a>
  562. {/block:IndexPage}
  563. {/block:Photoset}
  564. {block:Video}
  565. <div class="video">{Video-500}</div>
  566. {/block:Video}
  567. </section>
  568. <section class="post">
  569. {block:Answer}
  570. <div class="question">
  571. <span class="inquiry h">{Question}</span>
  572. <span class="sender">{Asker}</span>
  573. </div>
  574. <div class="answer text h">{Answer}</div>
  575. {/block:Answer}
  576. {block:Chat}
  577. {block:Title}<h1 class="title h">{Title}</h1>{/block:Title}
  578. <div class="chat text h">
  579. {block:Lines}
  580. <p class="line">
  581. {block:Label}
  582. <span class="label">{Label}&nbsp; </span>
  583. {/block:Label}
  584. {Line}
  585. </p>
  586. {/block:Lines}
  587. </div>
  588. {/block:Chat}
  589. {block:Link}
  590. <h1 class="title h"><a href="{URL}">{Name}</a></h1>
  591. {block:Description}<div class="text h">{Description}</div>{/block:Description}
  592. {/block:Link}
  593. {block:Quote}
  594. <div class="quote"><div class="text h">{Quote}</div></div>
  595. {block:Source}
  596. <div class="source text h">{Source}</div>
  597. {/block:Source}
  598. {/block:Quote}
  599. {block:Text}
  600. {block:Title}<h1 class="title h">{Title}</h1>{/block:Title}
  601. <div class="text h">{Body}</div>
  602. {/block:Text}
  603. {block:Caption}
  604. <div class="caption text h">{Caption}</div>
  605. {/block:Caption}
  606. {block:Date}
  607. <div class="date">
  608. {block:PermalinkPage}
  609. {block:RebloggedFrom}
  610. <div class="rf text">
  611. Reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a>
  612. {block:ContentSource}
  613. &nbsp;/&nbsp; Source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  614. {/block:ContentSource}
  615. </div>
  616. {/block:RebloggedFrom}
  617. {/block:PermalinkPage}
  618. {block:HasTags}
  619. <div class="tags">
  620. {block:Tags}<a href="{TagURL}">{Tag}</a><i class="comma"></i> {/block:Tags}
  621. </div>
  622. {/block:HasTags}
  623. <a href="{Permalink}" class="permalink accent">{DayOfWeek}</a>
  624. </div>
  625. {/block:Date}
  626. </section>
  627. </article>
  628. {block:PostNotes}
  629. <article id="notes" class="entry">
  630. <section class="post">
  631. <h1 class="title accent">{NoteCountWithLabel}</h1>
  632. {PostNotes}
  633. </section>
  634. </article>
  635. {/block:PostNotes}
  636. {/block:Posts}
  637. <!-- {block:ContentSource}{SourceURL}{/block:ContentSource}{block:RebloggedFrom}{ReblogRootURL}{ReblogParentURL}{/block:RebloggedFrom} -->
  638. </div>
  639. </div>
  640. {block:Pagination}
  641. <div class="page title">
  642. <div class="pagination">{block:PreviousPage}<a class="prev" href="{PreviousPage}">{lang:Previous}</a>{block:NextPage}<i class="comma">/</i>{/block:NextPage}{/block:PreviousPage}{block:NextPage}<a class="next" href="{NextPage}">{lang:Next page}</a>{/block:NextPage}</div>
  643. </div>
  644. {/block:Pagination}
  645. <a href="https://shythemes.tumblr.com" id="theme" class="accent" title="theme">k.</a>
  646. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  647. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  648. <script src="https://static.tumblr.com/fwgzvyf/2nno5ubpt/shythemes.fn.js"></script>
  649. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  650. {block:IndexPage}
  651. {block:ifInfiniteScroll}
  652. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  653. {/block:ifInfiniteScroll}
  654. {/block:IndexPage}
  655. <script>
  656. $(document).ready(function(){
  657. var $container = $('.content');
  658. $('.photo-slideshow').pxuPhotoset({
  659. lightbox: true,
  660. rounded: false,
  661. gutter: '1px',
  662. photoset: '.photo-slideshow',
  663. photoWrap: '.photo-data',
  664. photo: '.pxu-photo'
  665. });
  666. $container.audioplayers('{color:accents}');
  667. $container.resizevideos();
  668. {block:IndexPage}
  669. {block:ifInfiniteScroll}
  670. $container.infinitescroll({
  671. itemSelector: '.entry',
  672. navSelector: '.pagination',
  673. nextSelector: '.next',
  674. loadingImg: '',
  675. loadingText: '<em></em>',
  676. bufferPx: 2000
  677. },
  678. function( newElements ) {
  679. var $newElems = $(newElements);
  680. var $newElemsIDs = $newElems.map(function(){
  681. return this.id;
  682. }).get();
  683. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  684. $newElems.find('.photo-slideshow').pxuPhotoset({
  685. lightbox: true,
  686. rounded: false,
  687. gutter: '1px',
  688. photoset: '.photo-slideshow',
  689. photoWrap: '.photo-data',
  690. photo: '.pxu-photo'
  691. });
  692. $newElems.audioplayers('{color:accents}');
  693. $newElems.resizevideos();
  694. });
  695. {block:ifInfiniteScroll}
  696. {/block:IndexPage}
  697. });
  698. </script>
  699. </body>
  700. </html>
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!