kthms

delta edit

Mar 6th, 2018 (edited)
1,858
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.08 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html xmlns="https://www.w3.org/1999/xhtml">
  3. <head>
  4. <!----------------------------------------------------------------------
  5.  
  6.  
  7.  
  8.  
  9.  
  10.  
  11.  
  12. delta @ shythemes
  13.  
  14.  
  15.  
  16.  
  17.  
  18.  
  19.  
  20. Please read this before sending me questions:
  21.  
  22. 1. You do not need to change anything in the code. Every option you see in the previews can be toggled in the theme options (update your preview, then click the arrow in the top left corner to view them).
  23.  
  24. 2. In order to make this theme work for all screen sizes, I inserted a breakpoint at 900px. This means that, as long as the screen width is less than 900px, the header will appear, regardless of whether you have the header option selected. If you do not have the header option selected, then the sidebars will show up only when the screen is wide enough.
  25.  
  26. Thanks for reading :)
  27.  
  28. ----------------------------------------------------------------------->
  29. <title>{Title}</title>
  30. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  31. <link rel="shortcut icon" href="{Favicon}">
  32. {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  33. <meta name="viewport" content="width=device-width, initial-scale=1">
  34.  
  35. <!-- meta tags -------------------------------------------------------->
  36.  
  37. <meta name="image:left sidebar" content="">
  38. <meta name="image:right sidebar" content="">
  39. <meta name="color:link hover" content="#f08dbd">
  40. <meta name="select:font size" content="9px" title="9px">
  41. <meta name="select:font size" content="10px" title="10px">
  42. <meta name="select:font size" content="11px" title="11px">
  43. <meta name="select:font size" content="12px" title="12px">
  44. <meta name="if:dark version" content="">
  45. <meta name="if:header" content="">
  46. <meta name="if:show avatar" content="">
  47. <meta name="if:show captions" content="">
  48. <meta name="if:show tags" content="">
  49. <meta name="if:infinite scroll" content="">
  50. <meta name="text:posts" content="500px">
  51. <meta name="text:home link" content="">
  52. <meta name="text:archive link" content="">
  53. <meta name="text:ask link" content="contact">
  54. <meta name="text:link 1" content="">
  55. <meta name="text:link 1 url" content="">
  56. <meta name="text:link 2" content="">
  57. <meta name="text:link 2 url" content="">
  58. <meta name="text:link 3" content="">
  59. <meta name="text:link 3 url" content="">
  60. <meta name="text:link 4" content="">
  61. <meta name="text:link 4 url" content="">
  62. <meta name="text:link 5" content="">
  63. <meta name="text:link 5 url" content="">
  64. <meta name="text:link 6" content="">
  65. <meta name="text:link 6 url" content="">
  66.  
  67. <link href="https://fonts.googleapis.com/css?family=ABeeZee:400,400italic|Lato:400,400italic,700,700italic" rel="stylesheet">
  68.  
  69. <!-- css -------------------------------------------------------------->
  70.  
  71. <style type="text/css">
  72.  
  73. /* typography ------------------------------------------------------- */
  74.  
  75. body {
  76. margin:0;
  77. font-size:{select:font size};
  78. font-family:ABeeZee, arial, sans-serif;
  79. letter-spacing:0.75px;
  80. word-spacing:1px;
  81. line-height:2em;
  82. word-break:break-word;
  83. -moz-osx-font-smoothing:grayscale;
  84. -webkit-font-smoothing:antialiased;
  85. font-smoothing:antialiased;
  86. color:#111111;
  87. background:#ffffff;
  88. }
  89. a {
  90. color:inherit;
  91. text-decoration:none;
  92. transition:all 0s ease-in-out;
  93. -webkit-transition:all 0s ease-in-out;
  94. }
  95. small, sub {
  96. font-size:1em;
  97. vertical-align:baseline;
  98. }
  99. b, strong {
  100.  
  101. }
  102. blockquote, ol, ul, p, pre, figure {
  103. margin:1em 0;
  104. }
  105. h1, h2, h3, h4, h5, h6 {
  106. margin:0 0 1em;
  107. font-size:1em;
  108. font-weight:inherit;
  109. }
  110. img {
  111. border:0;
  112. max-width:100%;
  113. height:auto;
  114. }
  115. pre {
  116. white-space:normal;
  117. }
  118. h1 {
  119. margin:0 0 1em;
  120. color:#000000;
  121. }
  122. ol {
  123. counter-reset:list;
  124. list-style:none;
  125. padding:0;
  126. }
  127. ol li {
  128. position:relative;
  129. padding-left:3em;
  130. counter-increment:list;
  131. }
  132. ol li:before {
  133. content:counter(list) '.';
  134. position:absolute;
  135. margin-left:-3em;
  136. }
  137. hr,
  138. .tumblr_parent:not(:first-of-type):before {
  139. content:'';
  140. display:block;
  141. margin:1.5em 0;
  142. border:0;
  143. height:1px;
  144. width:100%;
  145. -moz-box-sizing:border-box;
  146. box-sizing:border-box;
  147. background-color:#dfdfdf;
  148. }
  149. .tumblr_parent blockquote {
  150. padding:0 0 0 2em;
  151. background-image:linear-gradient(90deg, transparent, #000000 50%);
  152. background-size:1px 1px;
  153. background-repeat:repeat-y;
  154. background-position:left top;
  155. }
  156. .text a:not(.tumblr_blog), .desc a:hover {
  157. background-image:linear-gradient(transparent, #000000 50%);
  158. background-size:1px 1px;
  159. background-repeat:repeat-x;
  160. background-position:left bottom;
  161. }
  162. .text a:not(.tumblr_blog):hover, .desc a:hover {
  163. color:{color:link hover}!important;
  164. background-image:linear-gradient(transparent, {color:link hover} 50%);
  165. }
  166. .title {
  167. font-size:1.5em;
  168. line-height:1.7em;
  169. margin-bottom:.5em;
  170. }
  171. .accent, .baby, .tumblr_parent .tumblr_blog, nav a {
  172. color:#6f6f6f;
  173. }
  174. .baby, b, strong {
  175. font-size:.89em;
  176. font-family:lato, sans-serif;
  177. letter-spacing:2px;
  178. text-transform:uppercase;
  179. font-style:normal;
  180. }
  181. .baby {
  182. color:#666666;
  183. }
  184. .desc a {
  185. color:{color:link hover};
  186. }
  187.  
  188. {block:ifDarkVersion}
  189. /* dark colors ------------------------------------------------------ */
  190.  
  191. body, h1 {
  192. color:#d7d7d7;
  193. }
  194. body, html {
  195. background:#0a0a0a;
  196. }
  197. hr,
  198. .tumblr_parent:not(:first-of-type):before {
  199. background-color:#2a2a2a;
  200. }
  201. .tumblr_parent blockquote {
  202. background-image:linear-gradient(90deg, transparent, #d7d7d7 50%);
  203. }
  204. .text a:not(.tumblr_blog) {
  205. background-image:linear-gradient(transparent, #d7d7d7 50%);
  206. }
  207. .accent, .tumblr_parent .tumblr_blog {
  208. color:#8f8f8f!important;
  209. }
  210. .baby {
  211. color:#aaaaaa;
  212. }
  213. {/block:ifDarkVersion}
  214.  
  215. /* layout ----------------------------------------------------------- */
  216.  
  217. .main {
  218. margin:150px auto;
  219. width:500px;
  220. width:{text:posts};
  221. max-width:calc(100vw - 50px);
  222. }
  223. aside {
  224. text-align:center;
  225. }
  226. aside.r,
  227. aside section:not(:first-child) {
  228. margin-top:1.5em;
  229. }
  230. aside nav li {
  231. display:inline-block;
  232. margin:0 1em 1em;
  233. }
  234. aside h1.blog.title {
  235. font-style:normal;
  236. font-family:lato, sans-serif;
  237. text-transform:uppercase;
  238. letter-spacing:.25em;
  239. padding-left:.25em;
  240. margin-bottom:1em;
  241. }
  242. aside .avatar {
  243. display:block;
  244. margin:0 auto 2em;
  245. width:30px;
  246. border-radius:4px;
  247. overflow:hidden;
  248. }
  249. aside .avatar img {
  250. display:block;
  251. }
  252. aside .side {
  253. display:none;
  254. }
  255. .content {
  256. margin:150px 0 0;
  257. }
  258. .entry {
  259. position:relative;
  260. margin:0 0 150px;
  261. }
  262. .entry:last-child {
  263. margin-bottom:0;
  264. }
  265. .pagination {
  266. overflow:hidden;
  267. }
  268. .pagination .next {
  269. float:right;
  270. }
  271.  
  272. {block:ifNotHeader}
  273. /* sidebar version -------------------------------------------------- */
  274.  
  275. @media screen and (min-width:900px) {
  276. aside.l {
  277. position:fixed;
  278. width:200px;
  279. top:150px;
  280. left:25%;
  281. margin-left:-125px;
  282. margin-left:calc(-{text:posts} / 4);
  283. transform:translateX(-50%);
  284. text-align:center;
  285. }
  286. aside.r {
  287. position:fixed;
  288. width:200px;
  289. top:150px;
  290. left:75%;
  291. margin-left:125px;
  292. margin-left:calc({text:posts} / 4);
  293. margin-top:0;
  294. transform:translateX(-50%);
  295. }
  296. aside nav {
  297. margin:0;
  298. }
  299. aside nav li {
  300. display:block;
  301. margin:0 0 2em;
  302. }
  303. aside .side {
  304. display:block;
  305. margin:auto;
  306. }
  307. }
  308. {/block:ifNotHeader}
  309.  
  310. /* posts ------------------------------------------------------------ */
  311.  
  312. .post {
  313.  
  314. }
  315. .date {
  316. margin:1em 0 0;
  317. }
  318. .date > a {
  319. margin:0 .65em 0 0;
  320. }
  321. .date > a:last-of-type {
  322. margin:0 2.9em 0 0;
  323. }
  324. .like-b {
  325. position:relative;
  326. }
  327. .like-b .b {
  328. position:relative;
  329. }
  330. .like_button {
  331. position:absolute;
  332. top:0;
  333. left:0;
  334. width:100%;
  335. height:100%;
  336. overflow:hidden;
  337. }
  338. .like-b .like_button iframe {
  339. position:absolute;
  340. top:0;
  341. left:0;
  342. bottom:0;
  343. right:0;
  344. z-index:2;
  345. opacity:0;
  346. width:100%;
  347. }
  348. .like-b .liked + .b {
  349. color:inherit;
  350. }
  351. .like-b .liked + .b:after {
  352. content:'d';
  353. }
  354. .tags {
  355. {block:IndexPage}{block:ifNotShowTags}display:none;{/block:ifNotShowTags}{/block:IndexPage}
  356. }
  357. .tags .comma {
  358. margin:0 0 0 .6em;
  359. }
  360. .tags .comma:last-of-type {
  361. display:none;
  362. }
  363. .caption {
  364. {block:IndexPage}{block:ifNotShowCaptions}display:none;{/block:ifNotShowCaptions}{/block:IndexPage}
  365. }
  366. .chat, .chat li {
  367. padding:0;
  368. list-style-type:none;
  369. }
  370. .post .media {
  371. position:relative;
  372. }
  373. .sender {
  374. text-transform:lowercase;
  375. }
  376. .audiowrap {
  377. position:relative;
  378. height:27px;
  379. overflow:hidden;
  380. background-color:#f8f8f8;
  381. {block:ifDarkVersion}background-color:#000000;{/block:ifDarkVersion}
  382. padding:14px;
  383. margin-bottom:1.5em;
  384. }
  385. .audio {
  386. position:absolute;
  387. display:inline-block;
  388. left:14px;
  389. top:14px;
  390. right:14px;
  391. bottom:14px;
  392. text-align:left;
  393. line-height:27px;
  394. }
  395. .audio .player {
  396. width:27px;
  397. height:27px;
  398. left:0;
  399. top:0;
  400. opacity:.5;
  401. line-height:0;
  402. overflow:hidden;
  403. position:absolute;
  404. }
  405. .audio .track {
  406. overflow:hidden;
  407. line-height:15px;
  408. margin-left:41px;
  409. width:calc(100% - 41px);
  410. display:inline-block;
  411. vertical-align:middle;
  412. }
  413. .audio .track .h {
  414. display:block;
  415. max-height:15px;
  416. white-space:nowrap;
  417. overflow:hidden;
  418. text-overflow:ellipsis;
  419. margin-right:15px;
  420. }
  421.  
  422. /* svgs ------------------------------------------------------------- */
  423.  
  424. .permalink,
  425. .notecount,
  426. .like-b,
  427. .reblog-b,
  428. .tumblr_blog,
  429. .sender {
  430. position:relative;
  431. padding-left:2.25em;
  432. }
  433. .tags {
  434. position:relative;
  435. }
  436. .tags a:first-child {
  437. margin-left:2.25em;
  438. }
  439. .permalink:before,
  440. .notecount:before,
  441. .like-b:before,
  442. .reblog-b:before,
  443. .tags:before,
  444. .tumblr_blog:before,
  445. .sender:before {
  446. position:absolute;
  447. overflow:auto;
  448. display:block;
  449. opacity:.5;
  450. }
  451. .permalink:before {
  452. content:url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20216%20216%22%20enable-background%3D%22new%200%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M108%2C184.3c42.1%2C0%2C76.3-34.2%2C76.3-76.3S150.1%2C31.7%2C108%2C31.7S31.7%2C65.9%2C31.7%2C108S65.9%2C184.3%2C108%2C184.3z%20M108%2C43.7%0A%09c35.5%2C0%2C64.3%2C28.9%2C64.3%2C64.3s-28.9%2C64.3-64.3%2C64.3S43.7%2C143.5%2C43.7%2C108S72.5%2C43.7%2C108%2C43.7z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%0A%3Cpath%20d%3D%22M98.3%2C120.7l25.7%2C20c1.1%2C0.8%2C2.4%2C1.3%2C3.7%2C1.3c1.8%2C0%2C3.6-0.8%2C4.7-2.3c2-2.6%2C1.6-6.4-1.1-8.4L108%2C113.1V72c0-3.3-2.7-6-6-6%0A%09s-6%2C2.7-6%2C6v44C96%2C117.9%2C96.9%2C119.6%2C98.3%2C120.7z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%0A%3C%2Fsvg%3E);
  453. width:1.25em;
  454. left:0em;
  455. top:-.1em;
  456. }
  457. .notecount:before {
  458. content:url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20216%20216%22%20enable-background%3D%22new%200%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M198%2C106c0%2C3.3-2.7%2C6-6%2C6h-20.8c-2%2C0-3.9-1-5-2.7L153%2C88.9l-15.8%2C84.4c-0.5%2C2.8-3%2C4.7-5.8%2C4.7c0%2C0%2C0%2C0-0.1%2C0%0A%09c-2.8%2C0-5.3-1.8-5.9-4.6L101.8%2C60.2l-14.9%2C77.4c-0.5%2C2.7-2.7%2C4.7-5.4%2C4.9c-2.7%2C0.2-5.2-1.4-6.1-4L54.7%2C79.9l-10.2%2C28.1%0A%09c-0.9%2C2.4-3.1%2C3.9-5.6%2C3.9H18c-3.3%2C0-6-2.7-6-6s2.7-6%2C6-6h16.6l14.5-40c0.9-2.4%2C3.1-4%2C5.6-4c0%2C0%2C0%2C0%2C0%2C0c2.5%2C0%2C4.8%2C1.7%2C5.6%2C4.1%0A%09l18.9%2C53.6l16.4-84.9c0.5-2.8%2C3-4.7%2C5.8-4.7c0%2C0%2C0%2C0%2C0%2C0c2.8%2C0%2C5.3%2C1.9%2C5.9%2C4.6l23.5%2C112.8l13-69.6c0.5-2.4%2C2.3-4.3%2C4.7-4.8%0A%09c2.4-0.5%2C4.9%2C0.6%2C6.2%2C2.6l19.6%2C30.3H192C195.3%2C100%2C198%2C102.7%2C198%2C106z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%0A%3C%2Fsvg%3E);
  459. width:1.2em;
  460. left:0em;
  461. top:-.1em;
  462. opacity:.4;
  463. }
  464. .like-b:before {
  465. content:url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20216%20216%22%20enable-background%3D%22new%200%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M148%2C37.8c-3.9%2C0-7.5%2C0.6-10.8%2C1.9c-15.1%2C5.7-24.6%2C17.8-29.8%2C26.7c-6-8.6-16.1-20.5-27.6-24.4c-3.8-1.3-8.1-2-12.3-2%0A%09c-10.7%2C0-20.3%2C4.1-27%2C11.5c-5.7%2C6.2-12%2C18-10%2C38.8c4.1%2C42.6%2C71.5%2C87.1%2C74.3%2C88.9c1%2C0.7%2C2.1%2C1%2C3.3%2C1c1.1%2C0%2C2.3-0.3%2C3.3-1%0A%09c2.7-1.8%2C66.5-43.6%2C73.7-86.1c3.7-21.8-2.7-34.9-8.8-42.1C169.2%2C42.7%2C158.6%2C37.8%2C148%2C37.8z%20M173.1%2C91c-2.6%2C15.2-15.1%2C33.4-36.1%2C52.7%0A%09c-11.9%2C10.9-23.5%2C19.4-29%2C23.2c-5.7-4-17.9-12.9-30.3-24.3C56%2C122.5%2C43.8%2C104%2C42.3%2C89c-1.3-13%2C1.1-23.2%2C6.9-29.6%0A%09c6-6.6%2C13.9-7.6%2C18.1-7.6c3%2C0%2C5.9%2C0.5%2C8.5%2C1.3c11.4%2C3.9%2C23.3%2C21.7%2C26.9%2C28.3c1.1%2C2.1%2C3.4%2C3.3%2C5.7%2C3.1c2.4-0.2%2C4.4-1.7%2C5.2-4%0A%09c0.1-0.2%2C8.2-22.4%2C27.7-29.7c1.9-0.7%2C4.2-1.1%2C6.6-1.1c7.2%2C0%2C14.3%2C3.3%2C19%2C9C173.3%2C66.2%2C175.5%2C77.4%2C173.1%2C91z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%0A%3C%2Fsvg%3E);
  466. width:1.3em;
  467. left:0em;
  468. top:-.1em;
  469. }
  470. .reblog-b:before {
  471. content:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%20id%3D%22Capa_1%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20361.095%20361.095%22%20style%3D%22enable-background%3Anew%200%200%20361.095%20361.095%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cg%3E%3Cpath%20d%3D%22M182.595%2C325.678c-63.183%2C0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333%20%20%20%20c-9.067%2C2.833-14.167%2C12.183-11.333%2C21.25c22.95%2C75.933%2C91.517%2C126.65%2C170.85%2C126.65c98.317%2C0%2C178.5-80.183%2C178.5-178.5%20%20%20%20s-80.183-178.5-178.5-178.5c-55.817%2C0-108.233%2C26.633-141.667%2C69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733%20%20%20%20C5.511%2C2.678-1.005%2C11.178%2C0.128%2C20.528l13.317%2C103.7c1.133%2C8.5%2C8.5%2C14.733%2C16.717%2C14.733c0.567%2C0%2C1.417%2C0%2C1.983%2C0l102.567-11.617%20%20%20%20c9.35-1.133%2C16.15-9.35%2C15.017-18.7s-9.35-16.15-18.7-15.017l-68.85%2C7.65c26.633-39.95%2C71.683-64.6%2C120.417-64.6%20%20%20%20c79.617%2C0%2C144.5%2C64.883%2C144.5%2C144.5S262.211%2C325.678%2C182.595%2C325.678z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E);
  472. width:.85em;
  473. left:.2em;
  474. top:-.3em;
  475. }
  476. .tags:before {
  477. content:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%20id%3D%22Capa_1%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20524.237%20524.237%22%20style%3D%22enable-background%3Anew%200%200%20524.237%20524.237%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cg%3E%3Cpath%20d%3D%22M209.95%2C465.552c3.117%2C3.117%2C7.367%2C4.533%2C11.9%2C4.533h0.283c4.533%2C0%2C8.783-1.7%2C11.9-4.817l183.6-188.983%20c6.517-6.8%2C6.517-17.283-0.283-23.8L220.15%2C55.569c-3.117-3.117-7.65-4.817-11.9-4.817l0%2C0L18.133%2C51.035%20c-9.35%2C0-17%2C7.367-17%2C16.717L0%2C254.469c0%2C4.533%2C1.7%2C9.067%2C5.1%2C12.183L209.95%2C465.552z%20M35.133%2C84.752l166.033-0.567l180.2%2C180.2%20l-160.083%2C164.9L34%2C247.385L35.133%2C84.752z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3Cpath%20d%3D%22M321.017%2C77.669c-6.8%2C6.517-6.8%2C17.283-0.283%2C24.083l162.633%2C165.467L311.383%2C444.585%20c-6.517%2C6.8-6.233%2C17.567%2C0.283%2C24.083c3.4%2C3.117%2C7.65%2C4.817%2C11.9%2C4.817c4.533%2C0%2C8.783-1.7%2C12.183-5.1l183.6-189.267%20c6.517-6.517%2C6.517-17.283%2C0-23.8L345.1%2C77.952C338.3%2C71.435%2C327.533%2C71.152%2C321.017%2C77.669z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3Ccircle%20cx%3D%22118.15%22%20cy%3D%22163.235%22%20r%3D%226.233%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3Cpath%20d%3D%22M118.15%2C140.002c-12.75%2C0-23.233%2C10.483-23.233%2C23.233s10.483%2C23.233%2C23.233%2C23.233s23.233-10.483%2C23.233-23.233%20C141.1%2C150.485%2C130.9%2C140.002%2C118.15%2C140.002z%20M118.15%2C174.002c-5.95%2C0-10.767-4.817-10.767-10.767%20c0-5.95%2C4.817-10.767%2C10.767-10.767c5.95%2C0%2C10.767%2C4.817%2C10.767%2C10.767C128.917%2C169.185%2C124.1%2C174.002%2C118.15%2C174.002z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A);
  478. width:1em;
  479. left:.2em;
  480. top:.3em;
  481. }
  482. .tumblr_blog:before {
  483. content:url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20version%3D%221.1%22%20id%3D%22Capa_1%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20419.617%20419.617%22%20style%3D%22enable-background%3Anew%200%200%20419.617%20419.617%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cg%3E%3Cpath%20d%3D%22M48.592%2C402.617c0%2C9.35%2C7.65%2C17%2C17%2C17h288.433c9.35%2C0%2C17-7.65%2C17-17c0-94.067-42.5-174.817-102.283-207.117%20c28.9-18.983%2C47.883-51.85%2C47.883-88.967C316.625%2C47.883%2C268.742%2C0%2C210.092%2C0S103.275%2C47.6%2C103.275%2C106.533%20c0%2C37.117%2C18.983%2C69.7%2C47.883%2C88.967C91.092%2C227.8%2C48.592%2C308.55%2C48.592%2C402.617z%20M209.808%2C34%20c39.95%2C0%2C72.533%2C32.583%2C72.533%2C72.533s-32.583%2C72.533-72.533%2C72.533s-72.533-32.583-72.533-72.533S169.858%2C34%2C209.808%2C34z%20M209.808%2C213.917c66.3%2C0%2C120.7%2C75.65%2C126.65%2C171.7h-253.3C89.108%2C289.567%2C143.508%2C213.917%2C209.808%2C213.917z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A);
  484. width:.9em;
  485. left:0;
  486. top:-.3em;
  487. }
  488. .sender:before {
  489. content:url(data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20viewBox%3D%220%200%20216%20216%22%20enable-background%3D%22new%200%200%20216%20216%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M37.1%2C171h141.9c3.3%2C0%2C6-2.7%2C6-6V74.7c0%2C0%2C0-0.1%2C0-0.1V50.7c0-3.3-2.7-6-6-6H37.1c-3.3%2C0-6%2C2.7-6%2C6v25.1c0%2C0%2C0%2C0%2C0%2C0.1V165%0A%09C31.1%2C168.3%2C33.8%2C171%2C37.1%2C171z%20M43.1%2C56.7h129.9v15.2l-65.5%2C55.5L43.1%2C73V56.7z%20M43.1%2C88.7l60.5%2C51.1c2.2%2C1.9%2C5.5%2C1.9%2C7.7%2C0%0A%09l61.6-52.2V159H43.1V88.7z%22{block:ifDarkVersion}%20fill%3D%22%23FFFFFF%22{/block:ifDarkVersion}%2F%3E%0A%3C%2Fsvg%3E);
  490. top:.4em;
  491. left:-.1em;
  492. width:1.2em;
  493. }
  494.  
  495. /* other ------------------------------------------------------------ */
  496.  
  497. .notes img {
  498. display:none;
  499. }
  500. #tumblr_controls,
  501. .tmblr-iframe.tmblr-iframe--desktop-logged-in-controls {
  502. position:fixed!important;
  503. top:0!important;
  504. right:0!important;
  505. opacity:.4!important;
  506. {block:ifNotDarkVersion}
  507. -webkit-filter:invert(100%);
  508. {/block:ifNotDarkVersion}
  509. -webkit-backface-visibility:hidden;
  510. padding:17px;
  511. }
  512. #theme {
  513. position:fixed;
  514. display:block;
  515. bottom:10px;
  516. right:10px;
  517. z-index:999;
  518. padding:5px;
  519. line-height:1em;
  520. }
  521. #tumblr_lightbox img, .lightbox-image {
  522. max-width:none;
  523. }
  524. {block:ifInfiniteScroll}
  525. .pagination,
  526. #infscr-loading {
  527. display:none!important;
  528. }
  529. {/block:ifInfiniteScroll}
  530.  
  531. /* cr: agustd/gukthemes & sughyun/caulfielld; do not take w/o credit. */
  532.  
  533. .photo-slideshow .count-1 {
  534. margin-bottom:4px!important;
  535. }
  536.  
  537. .photo-slideshow .count-2 {
  538. margin-left:4px!important;
  539. margin-bottom:4px!important;
  540. width:calc(50% - 2px)!important;
  541. }
  542.  
  543. .photo-slideshow .count-2:first-child {
  544. margin-left:0!important;
  545. }
  546.  
  547. .photo-slideshow .count-3 {
  548. margin-left:4px!important;
  549. margin-bottom:4px!important;
  550. width:calc(33.33% - 3px)!important;
  551. }
  552.  
  553. .photo-slideshow .count-3:first-child {
  554. margin-left:0!important;
  555. }
  556.  
  557. .photo-slideshow .count-3:nth-child(2) {
  558. width:calc(33.33% - 3px)!important;
  559. }
  560.  
  561. .photo-slideshow {
  562. display:inline-block!important;
  563. margin-bottom:-4px;
  564. position:relative;
  565. width:100%;
  566. }
  567. </style>
  568. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css">
  569. </head>
  570. <body class="{select:font}">
  571.  
  572. <div class="main">
  573.  
  574. <!-- left sidebar ----------------------------------------------------->
  575.  
  576. <aside class="l">
  577. {block:ifNotHeader}
  578. {block:ifLeftSidebarImage}
  579. <section>
  580. <a href="/"><img class="side" src="{image:left sidebar}"></a>
  581. </section>
  582. {/block:ifLeftSidebarImage}
  583. {/block:ifNotHeader}
  584. <section>
  585. {block:ifShowAvatar}<a href="/"><img src="{PortraitURL-128}" class="avatar"></a>{/block:ifShowAvatar}
  586. <h1 class="blog title"><a href="/">{Title}</a></h1>
  587. <div class="desc accent">{Description}</div>
  588. </section>
  589. </aside>
  590.  
  591. <!-- right sidebar ---------------------------------------------------->
  592.  
  593. <aside class="r">
  594. {block:ifNotHeader}
  595. {block:ifRightSidebarImage}
  596. <section>
  597. <a href="/"><img class="side" src="{image:right sidebar}"></a>
  598. </section>
  599. {/block:ifRightSidebarImage}
  600. {/block:ifNotHeader}
  601. <section>
  602. <nav class="baby">
  603. {block:ifHomeLink}<li><a href="/">{text:home link}</a></li>{/block:ifHomeLink}
  604. {block:ifArchiveLink}<li><a href="/archive">{text:archive link}</a></li>{/block:ifArchiveLink}
  605. {block:ifAskLink}<li><a href="/ask">{text:ask link}</a></li>{/block:ifAskLink}
  606. {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li> {/block:Pages}{/block:HasPages}
  607. {block:ifLink1}<li><a href="{text:link 1 url}">{text:link 1}</a></li>{/block:ifLink1}
  608. {block:ifLink2}<li><a href="{text:link 2 url}">{text:link 2}</a></li>{/block:ifLink2}
  609. {block:ifLink3}<li><a href="{text:link 3 url}">{text:link 3}</a></li>{/block:ifLink3}
  610. {block:ifLink4}<li><a href="{text:link 4 url}">{text:link 4}</a></li>{/block:ifLink4}
  611. {block:ifLink5}<li><a href="{text:link 5 url}">{text:link 5}</a></li>{/block:ifLink5}
  612. {block:ifLink6}<li><a href="{text:link 6 url}">{text:link 6}</a></li>{/block:ifLink6}
  613. </nav>
  614. </section>
  615.  
  616. </aside>
  617.  
  618. <!-- posts ------------------------------------------------------------>
  619.  
  620. <div class="content">
  621.  
  622. {block:Posts}
  623. <article class="entry {block:Photo}ph{/block:Photo}{block:Photoset}ph{/block:Photoset}" id="{PostID}">
  624. <section class="post">
  625. {block:Audio}
  626. <!-- audio ------------------------------------------------------------>
  627. <div class="audiowrap">
  628. <div class="audio">
  629. {block:AudioPlayer}
  630. <div class="player">{block:AudioPlayer}{block:ifNotDarkVersion}{AudioPlayerWhite}{/block:ifNotDarkVersion}{block:ifDarkVersion}{AudioPlayerBlack}{/block:ifDarkVersion}{/block:AudioPlayer}
  631. </div>
  632. {/block:AudioPlayer}
  633. <div class="track"><div class="h">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<span class="accent"> by {Artist}</span>{/block:Artist}</div></div>
  634. </div>
  635. </div>
  636. {/block:Audio}
  637. {block:Photo}
  638. <!-- photo ------------------------------------------------------------>
  639. <div class="media">
  640. {LinkOpenTag}
  641. <img src="{PhotoURL-HighRes}">
  642. {LinkCloseTag}
  643. </div>
  644. {/block:Photo}
  645. {block:Photoset}
  646. <!-- photoset --------------------------------------------------------->
  647. <div class="media photoset">
  648. <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>
  649. </div>
  650. {/block:Photoset}
  651. {block:Video}
  652. <!-- video ------------------------------------------------------------>
  653. <div class="media video">{Video-500}</div>
  654. {/block:Video}
  655. {block:Answer}
  656. <!-- answer ----------------------------------------------------------->
  657. <div class="question">
  658. <div class="sender accent">{Asker}</div>
  659. <div class="inquiry text">{Question}</div>
  660. </div>
  661. <div class="answer text">
  662. <a class="tumblr_blog" href="{Permalink}">{Name}</a>{Answer}</div>
  663. {/block:Answer}
  664. {block:Chat}
  665. <!-- chat ------------------------------------------------------------->
  666. {block:Title}<h1 class="title">{Title}</h1>{/block:Title}
  667. <ul class="chat text">
  668. {block:Lines}
  669. <li class="line">
  670. {block:Label}
  671. <b class="label">{Label}&nbsp; </b>
  672. {/block:Label}
  673. {Line}
  674. </li>
  675. {/block:Lines}
  676. </ul>
  677. {/block:Chat}
  678. {block:Link}
  679. <!-- link ------------------------------------------------------------->
  680. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  681. {block:Description}<div class="text">{Description}</div>{/block:Description}
  682. {/block:Link}
  683. {block:Quote}
  684. <!-- quote ------------------------------------------------------------>
  685. <div class="quote title">{Quote}</div>
  686. {block:Source}
  687. <div class="source text">{Source}</div>
  688. {/block:Source}
  689. {/block:Quote}
  690. {block:Text}
  691. <!-- text ------------------------------------------------------------->
  692. {block:Title}<h1 class="title">{Title}</h1>{/block:Title}
  693. <div class="text">{Body}</div>
  694. {/block:Text}
  695. {block:Caption}
  696. <!-- caption ---------------------------------------------------------->
  697. <div class="caption text">{Caption}</div>
  698. {/block:Caption}
  699. {block:Date}
  700. <div class="date accent">
  701. <!-- date ------------------------------------------------------------->
  702. <a class="permalink" href="{Permalink}">{TimeAgo}</a> {block:NoteCount}<a class="notecount" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount}<a class="like-b" href="#">{LikeButton size="100"}<span class="b">like</span></a> <a class="reblog-b" href="{ReblogURL}" target="_blank">reblog</a>
  703. {block:HasTags}
  704. <!-- tags ------------------------------------------------------------->
  705. <div class="tags">{block:Tags}<a href="{TagURL}">{Tag}</a><i class="comma"> </i>{/block:Tags}</div>
  706. {/block:HasTags}
  707. </div>
  708. {/block:Date}
  709. </section>
  710. </article>
  711. {/block:Posts}
  712. <!-- {block:ContentSource}{SourceURL}{/block:ContentSource}{block:RebloggedFrom}{ReblogRootURL}{ReblogParentURL}{/block:RebloggedFrom} -->
  713.  
  714. {block:PostNotes}
  715. <!-- notes ------------------------------------------------------------>
  716.  
  717. <article class="entry">
  718. <section class="post">
  719. {PostNotes}
  720. </section>
  721. </article>
  722.  
  723. {/block:PostNotes}
  724.  
  725. <!-- pagination ------------------------------------------------------->
  726.  
  727. {block:Pagination}<div class="pagination baby">{block:PreviousPage}<a class="prev accent" href="{PreviousPage}">{lang:Previous}</a>{/block:PreviousPage} {block:NextPage}<a class="next" href="{NextPage}">{lang:Next Page}</a>{/block:NextPage}</div>{/block:Pagination}
  728. </div>
  729.  
  730. </div>
  731.  
  732. <a href="https://shythemes.tumblr.com" id="theme" class="baby" title="theme">k.</a>
  733.  
  734. <!-- scripts ---------------------------------------------------------->
  735.  
  736. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  737. <script src="//static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  738. <script src="//static.tumblr.com/wgg6svp/ohGobvaye/unnest.min.js"></script>
  739. <script src="//static.tumblr.com/fwgzvyf/FRIojd56w/shythemes.fn.js"></script>
  740. {block:IndexPage}
  741. {block:ifInfiniteScroll}
  742. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  743. {/block:ifInfiniteScroll}
  744. {/block:IndexPage}
  745. <script>
  746. $(document).ready(function(){
  747. var $container = $('.content');
  748. $container.resizevideos();
  749. {block:ifNotDarkVersion}
  750. $container.audioplayers('{color:link hover}');
  751. {/block:ifNotDarkVersion}
  752. $('.photo-slideshow').pxuPhotoset({
  753. lightbox: true,
  754. rounded: false,
  755. gutter: '0',
  756. photoset: '.photo-slideshow',
  757. photoWrap: '.photo-data',
  758. photo: '.pxu-photo'
  759. });
  760. $('.entry').unnest({
  761. yourCaption: ".text",
  762. wrapName: ".tumblr_parent",
  763. newCaptionUsername: false,
  764. originalPostCaptionUsername: false,
  765. tumblrAvatars: false,
  766. tumblrAvatarClass: ".tumblr_avatar",
  767. usernameColon: false
  768. });
  769. {block:ifInfiniteScroll}
  770. $container.infinitescroll({
  771. itemSelector: '.entry',
  772. navSelector: '.pagination',
  773. nextSelector: '.next',
  774. loadingImg: '',
  775. loadingText: '<em></em>',
  776. bufferPx: 2000
  777. },
  778. function( newElements ) {
  779. var $newElems = $( newElements );
  780. var $newElemsIDs = $newElems.map(function(){
  781. return this.id;
  782. }).get();
  783. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  784. $newElems.resizevideos();
  785. {block:ifNotDarkVersion}
  786. $newElems.audioplayers('{color:link hover}');
  787. {/block:ifNotDarkVersion}
  788. $newElems.find('.photo-slideshow').pxuPhotoset({
  789. lightbox: true,
  790. rounded: false,
  791. gutter: '0',
  792. photoset: '.photo-slideshow',
  793. photoWrap: '.photo-data',
  794. photo: '.pxu-photo'
  795. });
  796. $newElems.unnest({
  797. yourCaption: ".text",
  798. wrapName: ".tumblr_parent",
  799. newCaptionUsername: false,
  800. originalPostCaptionUsername: false,
  801. tumblrAvatars: false,
  802. tumblrAvatarClass: ".tumblr_avatar",
  803. usernameColon: false
  804. });
  805. });
  806. {/block:ifInfiniteScroll}
  807. });
  808. </script>
  809.  
  810. </body>
  811. </html>
Add Comment
Please, Sign In to add comment