API tools faq
paste
glenthemes

Theme [18]: Calamity

glenthemes
Jun 11th, 2016 (edited)
16,948
1
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 63.60 KB | None | 1 0
raw download clone embed print report
  1. <!----------------------------------------------------
  2. Theme [18]: Calamity
  3. Made by glenthemes
  4.  
  5. Initial release: 2016/06/11
  6. Remake date: 2021/01/28
  7. Last updated: 2025/06/10
  8.  
  9. What's new:
  10. ✱ fixed missing styling on quotes
  11. ✱ minor fixes for npf chats and quotes
  12.  
  13. TERMS OF USE:
  14. 1) Do not remove the credit.
  15. 2) Do not remove parts of the code without my permission.
  16. 3) Do not claim my codes as your own.
  17. 4) Do not use my works as base codes.
  18. 5) You may add widgets to my themes and pages.
  19. ----------------------------------------------------->
  20. <!DOCTYPE html>
  21. <html post-width="{select:post width}" lang="en">
  22.  
  23. <head>
  24.  
  25. <title>{Title}</title>
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <!------------------------------------->
  28. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  29. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  30. <script>
  31. (function($){
  32. $(document).ready(function(){
  33. $("a[title]").style_my_tooltips({
  34. tip_follows_cursor:true,
  35. tip_delay_time:0,
  36. tip_fade_speed:69,
  37. attribute:"title"
  38. });
  39. });
  40. })(jQuery);
  41. </script>
  42.  
  43. <!------ FONTS ------->
  44. <link href="//fonts.googleapis.com/css?family=Karla|Sora|Chakra+Petch|Cousine|Space+Grotesk|K2D" rel="stylesheet">
  45.  
  46. <link rel="stylesheet" href="//static.tumblr.com/2pnwama/IUZoyg6qw/specialfonts.css">
  47.  
  48. <!------ ICON FONTS ------->
  49. <link href="//fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  50.  
  51. <script src="//static.tumblr.com/2pnwama/DLppehqvd/feathericons.js"></script>
  52.  
  53. <link rel="preload" href="//cdn.jsdelivr.net/npm/ionicons@latest/dist/ionicons.js" as="script">
  54.  
  55. <script src="//cdn.jsdelivr.net/npm/ionicons@latest/dist/ionicons/ionicons.js" crossorigin="anonymous"></script>
  56.  
  57. <!------ THEME SCRIPTS ------->
  58. <link href="//static.tumblr.com/0podkko/xIbplezmo/modified_photosets.css" rel="stylesheet">
  59.  
  60. <script src="//glen-themes.gitlab.io/thms/18/fkn-audio.js"></script>
  61.  
  62. <script src="//npf-images-v3.github.io/script.js"></script>
  63. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
  64.  
  65. {block:ifshowmusicplayer}
  66. <script src="//glenthemes.github.io/-music-/glenplayer06.js"></script>
  67. {/block:ifshowmusicplayer}
  68.  
  69. <script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
  70. <script src="//glen-themes.gitlab.io/thms/18/vergil-needs-milk-2025.js"></script>
  71. <script src="//glen-themes.gitlab.io/thms/18/wheres-the-milk.js"></script>
  72.  
  73. <script>
  74. // minimal soundcloud player @ shythemes.tumblr
  75. // shythemes.tumblr.com/post/114792480648
  76. $(document).ready(function(){
  77. var soundcloud_btn = '{color:post}';
  78. $('.soundcloud_audio_player').each(function(){
  79. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + soundcloud_btn.split('#')[1], height: 116, width: '100%' });
  80. });
  81. });
  82. </script>
  83.  
  84. <!-- unblue polls -->
  85. <!-- glenthemes.tumblr.com/post/708014819571302400 -->
  86. <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
  87. <style unblue-polls>
  88. .poll-post {
  89. --Poll-Question-Font-Size: {select:post font size};
  90.  
  91. --Poll-Option-Background-Color: transparent;
  92. --Poll-Option-Corner-Rounding: 4px;
  93. --Poll-Option-Border-Size: 1px;
  94. --Poll-Option-Border-Color: rgba({RGBcolor:text},0.25);
  95. --Poll-Option-Padding: 9px;
  96. --Poll-Option-Font-Size: {select:post font size};
  97. --Poll-Option-Spacing: 10px;
  98. --Poll-Option-Text-Color: {color:text};
  99.  
  100. --Poll-Option-HOVER-Border-Color: rgba({RGBcolor:text},0.25);
  101. --Poll-Option-HOVER-Background-Color: transparent;
  102. --Poll-Option-HOVER-Text-Color: {color:link};
  103. --Poll-Option-HOVER-Speed: 0.4s;
  104. }
  105.  
  106. .poll-see-results {
  107. padding-bottom:0!important;
  108. border-bottom:none!important;
  109. font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
  110. text-transform:uppercase;
  111. letter-spacing:0.5px;
  112. }
  113. </style>
  114.  
  115. <!-- npf audio player -->
  116. <!-- glenthemes.tumblr.com/post/722160746171072512 -->
  117. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  118. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  119. <script>
  120. tumblr_npf_audio({
  121. emptyTitleText: "Untitled track",
  122. emptyArtistText: "Untitled artist",
  123. emptyAlbumText: "Untitled album",
  124.  
  125. titleLabel: "",
  126. artistLabel: "",
  127. albumLabel: ""
  128. });
  129. </script>
  130. <style edit-npf-audio-player>
  131. .npf-audio-wrapper {
  132. --NPF-Audio-Buttons-Size: calc(var(--Audio-Post-PlayButton-Size) * 0.6);
  133. --NPF-Audio-Buttons-Color: {color:text};
  134. --NPF-Audio-Buttons-Padding: calc(var(--Audio-Post-PlayButton-Padding) + (var(--Audio-Post-PlayButton-Size) * (1 - 0.6)) - 3px);
  135. --NPF-Audio-Buttons-Spacing: calc(var(--p) + 14px);
  136. --NPF-Audio-Image-Size: var(--Audio-Post-Album-Image-Size);
  137. --NPF-Audio-Image-Spacing: 0px;
  138.  
  139. --t:calc((var(--NPF-Audio-Buttons-Padding) * 2) + var(--NPF-Audio-Buttons-Size));
  140. --p:calc(var(--NPF-Audio-Buttons-Padding) + ((var(--NPF-Audio-Image-Size) - var(--t)) / 2));
  141. }
  142.  
  143. .npf-audio-wrapper {
  144. position:relative;
  145. z-index:0;
  146. }
  147.  
  148. .npf-audio-background {
  149. margin-left:var(--p);
  150. }
  151.  
  152. .npf-audio-play, .npf-audio-pause {
  153. position:relative;
  154. z-index:0;
  155. }
  156.  
  157. .npf-audio-play:after, .npf-audio-pause:after {
  158. content:"";
  159. position:absolute;
  160. top:0;left:0;
  161. margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding) - 1px);
  162. margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding) - 1px);
  163. width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  164. height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
  165. background:{color:post};
  166. border:1px solid rgba({RGBcolor:text},0.420);
  167. border-radius:100%;
  168. z-index:-1;
  169. }
  170.  
  171. .npf-audio-play svg { margin-left:1px; }
  172. .npf-audio-pause svg { margin-left:0; }
  173.  
  174. figcaption.audio-caption,
  175. figcaption.audio-caption ~ audio[controls],
  176. .npf-audio-album {
  177. display:none;
  178. }
  179.  
  180. .npf-audio-image {
  181. position:absolute;
  182. top:0;left:0;
  183. z-index:-1;
  184. }
  185.  
  186. .npf-audio-details {
  187. line-height:calc({select:post text line height} * 0.9);
  188. }
  189. </style>
  190.  
  191. <script src="//glen-npf.gitlab.io/other/neue.js"></script>
  192. <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
  193.  
  194. <!------------ THEME OPTIONS ------------>
  195. <meta name="image:sidebar icon" content="//64.media.tumblr.com/aad331187686d5c359dc71cb729022a9/c8e873a39e533599-82/s2048x3072/4c700a3af68858b06f22cead586e9366232e7503.png">
  196. <meta name="image:sidebar image" content="//64.media.tumblr.com/85d74581f1237978faff9da1b6f9c4bb/44e2b3171eb8c527-a9/s540x810/c08aca1c1b153a21093bb6fffa85edb3eb62ef50.gif">
  197.  
  198. <meta name="color:background" content="#040405">
  199. <meta name="color:sidebar background" content="#040405">
  200.  
  201. <meta name="color:textbox title" content="#aaa">
  202. <meta name="color:textbox divider" content="#888">
  203. <meta name="color:textbox text" content="#888">
  204. <meta name="color:textbox hyperlinks" content="#aaa">
  205.  
  206. <meta name="color:sidebar title" content="#ccc">
  207. <meta name="color:sidebar username" content="#aaa">
  208.  
  209. <meta name="color:sidebar icon border inner" content="#040405">
  210. <meta name="color:sidebar icon border outer" content="#666">
  211.  
  212. <meta name="color:navlinks border" content="#444">
  213. <meta name="color:navlinks icon" content="#b5b5b5">
  214.  
  215. <meta name="color:description box border" content="#444">
  216. <meta name="color:description text" content="#959595">
  217. <meta name="color:description hyperlinks" content="#ccc">
  218.  
  219. <meta name="color:customlinks border" content="#444">
  220. <meta name="color:customlinks text" content="#b5b5b5">
  221.  
  222. <meta name="color:post" content="#040405">
  223. <meta name="color:text" content="#959595">
  224. <meta name="color:link" content="#aaa">
  225. <meta name="color:reblogger" content="#aaa">
  226. <meta name="color:reblog separators" content="#262626"/>
  227. <meta name="color:tags" content="#757575">
  228. <meta name="color:permalink" content="#aaa">
  229. <meta name="color:post buttons" content="#999">
  230. <meta name="color:post dividers" content="#777">
  231.  
  232. <meta name="color:scrollbar thumb" content="#666">
  233. <meta name="color:scrollbar track" content="#333">
  234.  
  235. <meta name="select:textbox width" title="180px" content="180px">
  236. <meta name="select:textbox width" title="160px" content="160px">
  237. <meta name="select:textbox width" title="200px" content="200px">
  238. <meta name="select:textbox width" title="220px" content="220px">
  239. <meta name="select:textbox width" title="240px" content="240px">
  240.  
  241. <meta name="select:textbox title size" title="12px" content="12px">
  242. <meta name="select:textbox title size" title="10px" content="10px">
  243. <meta name="select:textbox title size" title="11px" content="11px">
  244. <meta name="select:textbox title size" title="13px" content="13px">
  245. <meta name="select:textbox title size" title="14px" content="14px">
  246.  
  247. <meta name="select:textbox divider spacing" title="12px" content="12px">
  248. <meta name="select:textbox divider spacing" title="8px" content="8px">
  249. <meta name="select:textbox divider spacing" title="16px" content="16px">
  250. <meta name="select:textbox divider spacing" title="20px" content="20px">
  251.  
  252. <meta name="select:textbox font size" title="12px" content="12px">
  253. <meta name="select:textbox font size" title="11px" content="11px">
  254. <meta name="select:textbox font size" title="13px" content="13px">
  255. <meta name="select:textbox font size" title="14px" content="14px">
  256.  
  257. <meta name="select:textbox line height" title="100%" content="1.5">
  258. <meta name="select:textbox line height" title="80%" content="1.3">
  259. <meta name="select:textbox line height" title="90%" content="1.4">
  260. <meta name="select:textbox line height" title="110%" content="1.6">
  261. <meta name="select:textbox line height" title="120%" content="1.7">
  262. <meta name="select:textbox line height" title="130%" content="1.8">
  263. <meta name="select:textbox line height" title="140%" content="1.9">
  264. <meta name="select:textbox line height" title="150%" content="2">
  265.  
  266. <meta name="select:textbox text align" title="center" content="center">
  267. <meta name="select:textbox text align" title="justify" content="justify">
  268. <meta name="select:textbox text align" title="left" content="left">
  269. <meta name="select:textbox text align" title="right" content="right">
  270.  
  271. <meta name="select:textbox spacing" title="32px" content="32px">
  272. <meta name="select:textbox spacing" title="24px" content="24px">
  273. <meta name="select:textbox spacing" title="28px" content="28px">
  274. <meta name="select:textbox spacing" title="36px" content="36px">
  275. <meta name="select:textbox spacing" title="40px" content="40px">
  276.  
  277. <meta name="select:sidebar width" title="250px" content="250px">
  278. <meta name="select:sidebar width" title="200px" content="200px">
  279. <meta name="select:sidebar width" title="225px" content="225px">
  280. <meta name="select:sidebar width" title="275px" content="275px">
  281. <meta name="select:sidebar width" title="300px" content="300px">
  282.  
  283. <meta name="select:sidebar margins" title="32px" content="32px">
  284. <meta name="select:sidebar margins" title="24px" content="24px">
  285. <meta name="select:sidebar margins" title="28px" content="28px">
  286. <meta name="select:sidebar margins" title="36px" content="36px">
  287. <meta name="select:sidebar margins" title="40px" content="40px">
  288.  
  289. <meta name="select:sidebar title size" title="14px" content="14px">
  290. <meta name="select:sidebar title size" title="12px" content="12px">
  291. <meta name="select:sidebar title size" title="16px" content="16px">
  292. <meta name="select:sidebar title size" title="18px" content="18px">
  293. <meta name="select:sidebar title size" title="20px" content="20px">
  294.  
  295. <meta name="select:sidebar title line height" title="70%" content="1.7">
  296. <meta name="select:sidebar title line height" title="50%" content="1.5">
  297. <meta name="select:sidebar title line height" title="60%" content="1.6">
  298. <meta name="select:sidebar title line height" title="70%" content="1.7">
  299. <meta name="select:sidebar title line height" title="80%" content="1.8">
  300. <meta name="select:sidebar title line height" title="90%" content="1.9">
  301. <meta name="select:sidebar title line height" title="100%" content="2">
  302.  
  303. <meta name="select:sidebar title text align" title="center" content="center">
  304. <meta name="select:sidebar title text align" title="justify" content="justify">
  305. <meta name="select:sidebar title text align" title="left" content="left">
  306. <meta name="select:sidebar title text align" title="right" content="right">
  307.  
  308. <meta name="select:sidebar items spacing" title="36px" content="36px">
  309. <meta name="select:sidebar items spacing" title="24px" content="24px">
  310. <meta name="select:sidebar items spacing" title="28px" content="28px">
  311. <meta name="select:sidebar items spacing" title="32px" content="32px">
  312. <meta name="select:sidebar items spacing" title="40px" content="40px">
  313. <meta name="select:sidebar items spacing" title="44px" content="44px">
  314.  
  315. <meta name="select:sidebar icon size" title="30px" content="30px">
  316. <meta name="select:sidebar icon size" title="25px" content="25px">
  317. <meta name="select:sidebar icon size" title="35px" content="35px">
  318. <meta name="select:sidebar icon size" title="40px" content="40px">
  319. <meta name="select:sidebar icon size" title="45px" content="45px">
  320. <meta name="select:sidebar icon size" title="50px" content="50px">
  321.  
  322. <meta name="select:sidebar icon padding" title="none" content="0px">
  323. <meta name="select:sidebar icon padding" title="2px" content="2px">
  324. <meta name="select:sidebar icon padding" title="4px" content="4px">
  325. <meta name="select:sidebar icon padding" title="6px" content="6px">
  326. <meta name="select:sidebar icon padding" title="8px" content="8px">
  327. <meta name="select:sidebar icon padding" title="10px" content="10px">
  328. <meta name="select:sidebar icon padding" title="12px" content="12px">
  329. <meta name="select:sidebar icon padding" title="14px" content="14px">
  330.  
  331. <meta name="select:sidebar username size" title="11px" content="11px">
  332. <meta name="select:sidebar username size" title="9px" content="9px">
  333. <meta name="select:sidebar username size" title="10px" content="10px">
  334. <meta name="select:sidebar username size" title="12px" content="12px">
  335. <meta name="select:sidebar username size" title="13px" content="13px">
  336. <meta name="select:sidebar username size" title="14px" content="14px">
  337.  
  338. <meta name="select:navlinks spacing" title="8px" content="8px">
  339. <meta name="select:navlinks spacing" title="2px" content="2px">
  340. <meta name="select:navlinks spacing" title="4px" content="4px">
  341. <meta name="select:navlinks spacing" title="6px" content="6px">
  342. <meta name="select:navlinks spacing" title="10px" content="10px">
  343.  
  344. <meta name="select:navlinks padding" title="6px" content="6px">
  345. <meta name="select:navlinks padding" title="2px" content="2px">
  346. <meta name="select:navlinks padding" title="4px" content="4px">
  347. <meta name="select:navlinks padding" title="8px" content="8px">
  348. <meta name="select:navlinks padding" title="10px" content="10px">
  349.  
  350. <meta name="select:navlinks icon size" title="12px" content="12px">
  351. <meta name="select:navlinks icon size" title="10px" content="10px">
  352. <meta name="select:navlinks icon size" title="11px" content="11px">
  353. <meta name="select:navlinks icon size" title="13px" content="13px">
  354. <meta name="select:navlinks icon size" title="14px" content="14px">
  355. <meta name="select:navlinks icon size" title="15px" content="15px">
  356. <meta name="select:navlinks icon size" title="16px" content="16px">
  357.  
  358. <meta name="select:description box padding" title="13px" content="13px">
  359. <meta name="select:description box padding" title="11px" content="11px">
  360. <meta name="select:description box padding" title="15px" content="15px">
  361. <meta name="select:description box padding" title="17px" content="17px">
  362.  
  363. <meta name="select:description font size" title="12px" content="12px">
  364. <meta name="select:description font size" title="10px" content="10px">
  365. <meta name="select:description font size" title="11px" content="11px">
  366. <meta name="select:description font size" title="13px" content="13px">
  367. <meta name="select:description font size" title="14px" content="14px">
  368.  
  369. <meta name="select:description text align" title="justify" content="justify">
  370. <meta name="select:description text align" title="left" content="left">
  371. <meta name="select:description text align" title="right" content="right">
  372. <meta name="select:description text align" title="center" content="center">
  373.  
  374. <meta name="select:description line height" title="90%" content="1.4">
  375. <meta name="select:description line height" title="70%" content="1.2">
  376. <meta name="select:description line height" title="80%" content="1.3">
  377. <meta name="select:description line height" title="100%" content="1.5">
  378. <meta name="select:description line height" title="110%" content="1.6">
  379. <meta name="select:description line height" title="120%" content="1.7">
  380.  
  381. <meta name="select:customlinks per row" title="2" content="2">
  382. <meta name="select:customlinks per row" title="1" content="1">
  383. <meta name="select:customlinks per row" title="3" content="3">
  384. <meta name="select:customlinks per row" title="4" content="4">
  385.  
  386. <meta name="select:customlinks padding" title="6px" content="6px">
  387. <meta name="select:customlinks padding" title="2px" content="2px">
  388. <meta name="select:customlinks padding" title="4px" content="4px">
  389. <meta name="select:customlinks padding" title="8px" content="8px">
  390. <meta name="select:customlinks padding" title="10px" content="10px">
  391.  
  392. <meta name="select:customlinks font size" title="9px" content="9px">
  393. <meta name="select:customlinks font size" title="8px" content="8px">
  394. <meta name="select:customlinks font size" title="10px" content="10px">
  395. <meta name="select:customlinks font size" title="11px" content="11px">
  396. <meta name="select:customlinks font size" title="12px" content="12px">
  397.  
  398. <meta name="select:customlinks spacing" title="8px" content="8px">
  399. <meta name="select:customlinks spacing" title="2px" content="2px">
  400. <meta name="select:customlinks spacing" title="4px" content="4px">
  401. <meta name="select:customlinks spacing" title="6px" content="6px">
  402. <meta name="select:customlinks spacing" title="8px" content="8px">
  403. <meta name="select:customlinks spacing" title="10px" content="10px">
  404.  
  405. <meta name="select:window margin" title="70px" content="70px">
  406. <meta name="select:window margin" title="50px" content="50px">
  407. <meta name="select:window margin" title="60px" content="60px">
  408. <meta name="select:window margin" title="80px" content="80px">
  409. <meta name="select:window margin" title="90px" content="90px">
  410.  
  411. <meta name="select:photoset spacing" title="4px" content="4px">
  412. <meta name="select:photoset spacing" title="2px" content="2px">
  413. <meta name="select:photoset spacing" title="6px" content="6px">
  414. <meta name="select:photoset spacing" title="10px" content="10px">
  415.  
  416. <meta name="select:post width" title="500px" content="500px">
  417. <meta name="select:post width" title="400px" content="400px">
  418. <meta name="select:post width" title="450px" content="450px">
  419. <meta name="select:post width" title="540px" content="540px">
  420. <meta name="select:post width" title="fit to screen" content="fit">
  421.  
  422. <meta name="select:post padding" title="none" content="0px">
  423. <meta name="select:post padding" title="8px" content="8px">
  424. <meta name="select:post padding" title="10px" content="10px">
  425. <meta name="select:post padding" title="12px" content="12px">
  426. <meta name="select:post padding" title="15px" content="15px">
  427. <meta name="select:post padding" title="20px" content="20px">
  428.  
  429. <meta name="select:post font size" title="13px" content="13px">
  430. <meta name="select:post font size" title="11px" content="11px">
  431. <meta name="select:post font size" title="12px" content="12px">
  432. <meta name="select:post font size" title="14px" content="14px">
  433. <meta name="select:post font size" title="15px" content="15px">
  434. <meta name="select:post font size" title="16px" content="16px">
  435.  
  436. <meta name="select:post buttons size" title="13px" content="13px">
  437. <meta name="select:post buttons size" title="11px" content="11px">
  438. <meta name="select:post buttons size" title="15px" content="15px">
  439.  
  440. <meta name="select:post buttons spacing" title="6px" content="6px">
  441. <meta name="select:post buttons spacing" title="4px" content="4px">
  442. <meta name="select:post buttons spacing" title="8px" content="8px">
  443.  
  444. <meta name="select:post spacing" title="50px" content="50px">
  445. <meta name="select:post spacing" title="30px" content="30px">
  446. <meta name="select:post spacing" title="40px" content="40px">
  447. <meta name="select:post spacing" title="60px" content="60px">
  448. <meta name="select:post spacing" title="70px" content="70px">
  449.  
  450. <meta name="select:post text line height" title="1.7" content="1.7">
  451. <meta name="select:post text line height" title="1.5" content="1.5">
  452. <meta name="select:post text line height" title="1.9" content="1.9">
  453.  
  454. <meta name="if:hide textboxes" content="0">
  455. <meta name="if:show music player" content="1">
  456. <meta name="if:reblog separators" content="1">
  457. <meta name="if:full width reblog separators" content="0">
  458. <meta name="if:black tumblr controls" content="0">
  459.  
  460. <meta name="text:textbox 1 title" content="welcome">
  461. <meta name="text:textbox 1 text" content="Some text here">
  462. <meta name="text:textbox 2 title" content="about">
  463. <meta name="text:textbox 2 text" content="*stat name: stat detail&NewLine;*stat name: stat detail&NewLine;*stat name: stat detail">
  464. <meta name="text:textbox 3 title" content="to-do list">
  465. <meta name="text:textbox 3 text" content="&lt;li&gt;bullet points">
  466.  
  467. <meta name="text:how to link music" content="linktr.ee/direct_file_links">
  468. <meta name="text:music player song name" content="BURY THE LIGHT">
  469. <meta name="text:music player song mp3 url" content="https://rhizo.gitlab.io/m/Bury_the_Light.mp3">
  470.  
  471. <meta name="text:sidebar title" content="I am the storm&lt;br&gt;that is approaching —">
  472.  
  473. <meta name="text:customlink 1 name" content="dashboard">
  474. <meta name="text:customlink 1 URL" content="//tumblr.com">
  475. <meta name="text:customlink 2 name" content="">
  476. <meta name="text:customlink 2 URL" content="">
  477. <meta name="text:customlink 3 name" content="">
  478. <meta name="text:customlink 3 URL" content="">
  479. <meta name="text:customlink 4 name" content="">
  480. <meta name="text:customlink 4 URL" content="">
  481. <meta name="text:customlink 5 name" content="">
  482. <meta name="text:customlink 5 URL" content="">
  483. <meta name="text:customlink 6 name" content="">
  484. <meta name="text:customlink 6 URL" content="">
  485.  
  486. <!-------------------------------------->
  487. <style type="text/css">
  488.  
  489. @font-face { font-family: "canela"; src: url('//glen-assets.github.io/fonts/Canela-Regular-Web.ttf'); }
  490.  
  491. /*------------ TOOLTIPS ------------*/
  492. #s-m-t-tooltip {
  493. margin:16px;
  494. max-width:var(--Post-Width);
  495. padding:7px 9px;
  496. background:{color:sidebar background};
  497. border:.5px solid rgba({RGBcolor:customlinks border},0.8);
  498. border-radius:2px;
  499. font-family:space grotesk;
  500. font-size:calc({select:post font size} - 4px);
  501. letter-spacing:1px;
  502. text-transform:uppercase;
  503. color:{color:customlinks text};
  504. z-index:99;
  505. }
  506.  
  507. /*------------ TUMBLR CONTROLS ------------*/
  508. iframe#tumblr_controls, .iframe-controls--desktop {
  509. top:5px!important;
  510. right:5px!important;
  511. position:fixed!important;
  512.  
  513. {block:ifblacktumblrcontrols}
  514. filter:invert(100%) hue-rotate(180deg);
  515. -webkit-filter:invert(100%) hue-rotate(180deg);
  516. {/block:ifblacktumblrcontrols}
  517.  
  518. transform:scale(0.7,0.7);
  519. -webkit-transform:scale(0.7,0.7);
  520.  
  521. transform-origin:100% 0;
  522. z-index:999999!important;
  523. }
  524.  
  525. /*------------ BASICS ------------*/
  526. * {
  527. position:relative;
  528. margin:0;
  529. padding:0;
  530. }
  531.  
  532. body {
  533. background:{color:background};
  534. font-family:k2d;
  535. color:{color:text};
  536. }
  537.  
  538. img {
  539. vertical-align:middle;
  540. }
  541.  
  542. a, a:visited {
  543. color:{color:link};
  544. text-decoration:none;
  545. }
  546.  
  547. h1, h2, h3, h4, h5, h6 {
  548. margin:var(--Heading-Margins) 0;
  549. font-family:chakra petch;
  550. text-transform:uppercase;
  551. letter-spacing:1px;
  552. font-size:calc({select:post font size} + 2px);
  553. }
  554.  
  555. h1.title, a.linkpath {
  556. display:block;
  557. margin-bottom:calc(var(--Heading-Margins) * 2);
  558. font-family:canela;
  559. font-weight:normal;
  560. font-size:{select:post font size};
  561. text-transform:uppercase;
  562. letter-spacing:2px;
  563. text-align:center;
  564. }
  565.  
  566. a.linkpath {
  567. border:.5px solid {color:reblog separators};
  568. padding:var(--Captions-Gap);
  569. }
  570.  
  571. a.linkpath span {
  572. display:inline-block;
  573. vertical-align:middle;
  574. margin-left:3px;
  575. font-family:karla;
  576. font-size:calc({select:post font size} - 2px);
  577. }
  578.  
  579. .link-description {
  580. margin-top:calc(var(--Heading-Margins) / 2);
  581. }
  582.  
  583. p:first-child {
  584. margin-top:0;
  585. }
  586.  
  587. p:last-child {
  588. margin-bottom:0;
  589. }
  590.  
  591. p {
  592. margin:var(--Paragraph-Margins) 0;
  593. }
  594.  
  595. ul, ol {
  596. margin-left:1.69em;
  597. }
  598.  
  599. ol li {
  600. padding-left:0.420em;
  601. }
  602.  
  603. ul li {
  604. position:relative;
  605. padding-left:0.25em;
  606. margin-left:calc(({select:post font size} * 1.420) - 3px);
  607. list-style:none;
  608. }
  609.  
  610. ul li:before {
  611. content:"";
  612. position:absolute;
  613. top:0;
  614. margin-top:calc(({select:post font size} * {select:post text line height}) / 2);
  615. transform:scale(1.069);
  616. left:0;margin-left:calc(({select:post font size} * -1.420) - 3px);
  617. width:{select:post font size};
  618. height:.7px;
  619. background:rgba({RGBcolor:text},0.8);
  620. }
  621.  
  622. .flex {
  623. display:flex;
  624. align-items:center;
  625. }
  626.  
  627. .flex.space-between {
  628. justify-content:space-between;
  629. }
  630.  
  631. ion-icon:before {
  632. content:"";
  633. position:absolute;
  634. top:0;left:0;
  635. width:100%;
  636. height:100%;
  637. }
  638.  
  639. pre {
  640. display:block;
  641. white-space:break-spaces;
  642. padding:var(--Captions-Gap);
  643. border:1px solid rgba({RGBcolor:post dividers},0.420);
  644. border-radius:3px;
  645. margin:1em 0;
  646. }
  647.  
  648. pre, code {
  649. font-family:cousine;
  650. font-size:calc({select:post font size} - 1.5px);
  651. }
  652.  
  653. hr {
  654. display:block;
  655. border:none;
  656. margin-left:calc((100% - 40%) / 2);
  657. width:40%;
  658. height:.7px;
  659. background:linear-gradient(to right, transparent, rgba({RGBcolor:post dividers},0.69), transparent);
  660. }
  661.  
  662. :root {
  663. --Scrollbar-Width:13px;
  664.  
  665. --Music-Player-Vinyl:{color:textbox text};
  666. --Vinyl-Icon-Size:calc({select:textbox font size} * 1.25);
  667. --Vinyl-Spin-Speed:3.5s;
  668. --Music-Controls-Size:{select:textbox font size};
  669.  
  670. --Post-Width:{select:post width};
  671.  
  672. --Photos-Spacing:{select:photoset spacing};
  673.  
  674. --Posts-Avatar-Size:24px;
  675. --Captions-Gap:12px;
  676.  
  677. --Blockquote-Border-Color:rgba({RGBcolor:text},0.7);
  678.  
  679. --Paragraph-Margins:0.69em;
  680. --Heading-Margins:0.5em;
  681.  
  682. --NPF-Image-Spacing:{select:photoset spacing};
  683. /*--NPF-Caption-Spacing:calc((var(--Captions-Gap) + 1.69em) / 2);*/
  684. --NPF-Caption-Spacing:var(--Captions-Gap);
  685.  
  686. --Audio-Post-Album-Image-Size:64px;
  687. --Audio-Post-PlayButton-Size:18px;
  688. --Audio-Post-PlayButton-Padding:8px;
  689. --Audio-Post-Download-Size:calc({select:post font size} + 4px);
  690. --Audio-Post-Download-Color:{color:link};
  691.  
  692. --Like-Button-Liked:#f75c64;
  693.  
  694. --Sidebar-Background:{color:sidebar background};
  695. }
  696.  
  697. html[post-width="fit"]:root {
  698. {block:ifhidetextboxes}
  699. --Post-Width:calc(100vw - {select:sidebar width} - ({select:sidebar margins} * 4) - 5vw);
  700. {/block:ifhidetextboxes}
  701.  
  702. {block:ifnothidetextboxes}
  703. --Post-Width:calc(100vw - {select:sidebar width} - ({select:sidebar margins} * 6) - {select:textbox width} - 5vw);
  704. {/block:ifnothidetextboxes}
  705. }
  706.  
  707. a.post_media_photo_anchor, a.post_media_photo_anchor:hover {
  708. padding-bottom:0!important;
  709. border-bottom:none!important;
  710. }
  711.  
  712. .spotify_audio_player {
  713. height:80px!important;
  714. }
  715.  
  716. /*--------------------SCROLLBAR--------------------*/
  717. ::-webkit-scrollbar {
  718. width:var(--Scrollbar-Width);
  719. height:var(--Scrollbar-Width);
  720. background:{color:sidebar background};
  721. }
  722.  
  723. ::-webkit-scrollbar-thumb {
  724. border:calc((var(--Scrollbar-Width) - 1px) / 2) solid {color:sidebar background};
  725. background:{color:scrollbar thumb};
  726. }
  727.  
  728. ::-webkit-scrollbar-track {
  729. border:calc((var(--Scrollbar-Width) - 1px) / 2) solid {color:sidebar background};
  730. background:{color:scrollbar track};
  731. }
  732.  
  733. ::-webkit-scrollbar-button {
  734. width:5px;
  735. height:5px;
  736. }
  737.  
  738. ::-webkit-scrollbar-corner {
  739. background:{color:sidebar background};
  740. }
  741.  
  742. /*------------ RIGHT SIDEBAR ------------*/
  743. .rightside {
  744. position:fixed;
  745. top:0;right:0;
  746. width:calc({select:sidebar width} + ({select:sidebar margins} * 2));
  747. background:{color:sidebar background};
  748. height:100vh;
  749. z-index:6;
  750. }
  751.  
  752. .succ {
  753. position:relative;
  754. margin-top:{select:sidebar margins};
  755. margin-left:{select:sidebar margins};
  756. width:calc(100% - ({select:sidebar margins} * 2));
  757. height:calc(100% - ({select:sidebar margins} * 2));
  758. display:table;
  759. }
  760.  
  761. .oat {
  762. display:table-cell;
  763. vertical-align:middle;
  764. }
  765.  
  766. .oat > * {
  767. padding:calc({select:sidebar items spacing} / 4) 0;
  768. }
  769.  
  770. .bigsidetiddy {
  771. margin:calc((({select:sidebar title size} * {select:sidebar title line height}) - {select:sidebar title size}) / -2.69);
  772. font-family:canela;
  773. font-size:{select:sidebar title size};
  774. text-transform:uppercase;
  775. letter-spacing:2px;
  776. color:{color:sidebar title};
  777. line-height:{select:sidebar title line height};
  778. text-align:{select:sidebar title text align};
  779. }
  780.  
  781. .ministuff {
  782. display:flex;
  783. align-items:center;
  784. line-height:1em;
  785. z-index:2;
  786. }
  787.  
  788. .ministuff img {
  789. width:{select:sidebar icon size};
  790. height:{select:sidebar icon size};
  791. padding:{select:sidebar icon padding};
  792. background:{select:sidebar icon border inner};
  793. border:.5px solid {color:sidebar icon border outer};
  794. border-radius:100%;
  795. }
  796.  
  797. .ministuff span {
  798. display:block;
  799. margin-left:9px;
  800. }
  801.  
  802. .ministuff span[blog-title] {
  803. padding-left:1px;
  804. margin-bottom:-1px;
  805. font-family:chakra petch;
  806. font-size:{select:sidebar username size};
  807. text-transform:uppercase;
  808. letter-spacing:1px;
  809. color:{color:sidebar username};
  810. }
  811.  
  812. .ministuff span[username]:before {
  813. content:"@";
  814. margin-right:1.5px;
  815. }
  816.  
  817. .ministuff span[username] {
  818. font-family:karla;
  819. font-size:calc({select:sidebar username size} - 2px);
  820. text-transform:uppercase;
  821. letter-spacing:1px;
  822. color:rgba({RGBcolor:sidebar username},0.8);
  823. }
  824.  
  825. .ministuff span[username]:only-child {
  826. font-size:{select:sidebar username size};
  827. }
  828.  
  829. .vergin {
  830. width:100%;
  831. }
  832.  
  833. /*------------ DEFAULT NAVLINKS ------------*/
  834. .cheese {
  835. display:flex;
  836. align-items:stretch;
  837. }
  838.  
  839. .custard {
  840. margin:-{select:navlinks spacing} 0;
  841. padding-right:{select:navlinks spacing};
  842. }
  843.  
  844. .custard a {
  845. display:block;
  846. margin:{select:navlinks spacing} 0;
  847. width:calc({select:navlinks icon size} + ({select:navlinks padding} * 2) + 1px);
  848. font-size:0; /* kill whitespace */
  849. }
  850.  
  851. .custard a > * {
  852. pointer-events:none;
  853. }
  854.  
  855. .custard ion-icon, .glenjamin {
  856. padding:{select:navlinks padding};
  857. border:.5px solid {color:navlinks border};
  858. border-radius:3px;
  859. font-size:{select:navlinks icon size};
  860. color:{color:navlinks icon};
  861. line-height:1em;
  862. }
  863.  
  864. .glenjamin {
  865. width:{select:navlinks icon size};
  866. height:{select:navlinks icon size};
  867. }
  868.  
  869. .glenjamin svg {
  870. display:block;
  871. margin-left:.5px;
  872. width:100%;
  873. height:100%;
  874. fill:{color:navlinks icon};
  875. }
  876.  
  877. /*------------ DESCRIPTION BOX ------------*/
  878. .ouai {
  879. width:100%;
  880. border:.5px solid {color:description box border};
  881. border-radius:3px;
  882. box-sizing:border-box;
  883. }
  884.  
  885. .desc {
  886. position:absolute;
  887. top:0;left:0;
  888. margin-top:{select:description box padding};
  889. margin-left:calc({select:description box padding} * 1.2);
  890. width:calc(100% - (({select:description box padding} * 1.2) * 2) + ((var(--Scrollbar-Width) - 1px) / 2));
  891. height:calc(100% - ({select:description box padding} * 2));
  892. padding-right:calc((var(--Scrollbar-Width) - 1px) / 2);
  893. font-family:k2d;
  894. letter-spacing:.1px;
  895. font-size:{select:description font size};
  896. text-align:{select:description text align};
  897. line-height:{select:description line height};
  898. overflow:auto;
  899. color:{color:description text};
  900. box-sizing:border-box;
  901. }
  902.  
  903. .desc a {
  904. color:{color:description hyperlinks};
  905. }
  906.  
  907. .desc::-webkit-scrollbar-thumb {
  908. border-top:none;
  909. border-bottom:none;
  910. background:{color:description box border};
  911. }
  912.  
  913. .desc::-webkit-scrollbar-track {
  914. border-color:{color:sidebar background};
  915. background:{color:sidebar background};
  916. }
  917.  
  918. .desc::-webkit-scrollbar-button {
  919. width:2px;
  920. height:2px;
  921. }
  922.  
  923. /*------------ CUSTOM LINKS ------------*/
  924. .pasta {
  925. display:flex;
  926. flex-wrap:wrap;
  927. justify-content:center;
  928. margin:calc({select:customlinks spacing} / -2);
  929. }
  930.  
  931. .beurre {
  932. display:block;
  933. margin:calc({select:customlinks spacing} / 2);
  934. width:calc((100% - ({select:customlinks spacing} * {select:customlinks per row})) / {select:customlinks per row});
  935. font-size:0; /* kill whitespace */
  936. }
  937.  
  938. .miel {
  939. padding:{select:customlinks padding} 0;
  940. border:.5px solid {color:customlinks border};
  941. border-radius:2px;
  942. }
  943.  
  944. .miel span {
  945. display:block;
  946. margin-left:calc({select:customlinks padding} * 1.2);
  947. width:calc(100% - ({select:customlinks padding} * 1.2 * 2));
  948. font-family:space grotesk;
  949. font-size:{select:customlinks font size};
  950. text-transform:uppercase;
  951. letter-spacing:1px;
  952. color:{color:customlinks text};
  953. overflow:hidden;
  954. text-align:center;
  955. }
  956.  
  957. /*------------ TEXTBOXES COLUMN ------------*/
  958. .howmanyyears {
  959. position:fixed;
  960. top:0;
  961. right:0;margin-right:calc({select:sidebar width} + ({select:sidebar margins} * 2));
  962. width:calc({select:textbox width} + ({select:sidebar margins} * 2));
  963. height:100vh;
  964. z-index:6;
  965. {block:ifhidetextboxes}display:none;{/block:ifhidetextboxes}
  966. }
  967.  
  968. .twohondred {
  969. position:relative;
  970. margin-top:{select:sidebar margins};
  971. margin-left:{select:sidebar margins};
  972. width:calc(100% - ({select:sidebar margins} * 2));
  973. height:calc(100% - ({select:sidebar margins} * 2));
  974. display:table;
  975. }
  976.  
  977. .dirk {
  978. display:table-cell;
  979. vertical-align:middle;
  980. }
  981.  
  982. .dirk > * {
  983. margin:{select:textbox spacing} 0;
  984. }
  985.  
  986. .onebox {
  987. }
  988.  
  989. .boxtitle {
  990. text-align:center;
  991. font-size:0; /* kill whitespace */
  992. }
  993.  
  994. .boxtitle span {
  995. margin:auto;
  996. padding-bottom:{select:textbox divider spacing};
  997. font-family:canela;
  998. font-size:{select:textbox title size};
  999. text-transform:uppercase;
  1000. letter-spacing:1.5px;
  1001. color:{color:textbox title};
  1002. }
  1003.  
  1004. .boxtitle span:after {
  1005. content:"";
  1006. position:absolute;
  1007. bottom:0;
  1008. left:0;margin-left:calc(69% / -2);
  1009. width:calc(100% + 69%);
  1010. height:1px;
  1011. background:linear-gradient(to right, transparent, {color:textbox divider}, transparent);
  1012. }
  1013.  
  1014. .boxtext {
  1015. margin-top:calc(({select:textbox divider spacing} * 2) - 1px);
  1016. font-family:k2d;
  1017. font-size:{select:textbox font size};
  1018. letter-spacing:.1px;
  1019. color:{color:textbox text};
  1020. line-height:{select:textbox line height};
  1021. text-align:{select:textbox text align};
  1022. }
  1023.  
  1024. .boxtext a {
  1025. color:{color:textbox hyperlinks};
  1026. }
  1027.  
  1028. .boxtext .dot {
  1029. width:0;
  1030. font-size:0;
  1031. }
  1032.  
  1033. .l-row {
  1034. display:flex;
  1035. align-items:baseline;
  1036. justify-content:space-between;
  1037. margin-bottom:2px;
  1038. letter-spacing:0px;
  1039. }
  1040.  
  1041. .l-row:last-of-type {margin-bottom:0}
  1042.  
  1043. .holly {
  1044. font-family:chakra petch;
  1045. font-size:calc({select:textbox font size} - 2px);
  1046. text-transform:uppercase;
  1047. letter-spacing:1px;
  1048. text-align:left;
  1049. }
  1050.  
  1051. .wood {
  1052. font-family:karla;
  1053. font-size:calc({select:textbox font size} - 1.5px);
  1054. text-transform:uppercase;
  1055. letter-spacing:1px;
  1056. text-align:right;
  1057. }
  1058.  
  1059. .boxtext ul, .boxtext ol, .boxtext li {
  1060. margin:0;
  1061. padding:0;
  1062. text-align:left;
  1063. }
  1064.  
  1065. .boxtext ul {
  1066. margin-left:calc(({select:textbox font size} * 1.69) + 6px);
  1067. }
  1068.  
  1069. .boxtext li:before {
  1070. margin-top:calc(({select:textbox font size} * {select:textbox line height}) / 2);
  1071. margin-left:calc(({select:textbox font size} * -1.69) - 6px);
  1072. width:calc({select:textbox font size} * 1.69);
  1073. background:linear-gradient(to right, transparent, {color:textbox divider}, transparent);
  1074. }
  1075.  
  1076. /*------------ MUSIC PLAYER ------------*/
  1077. .pates {
  1078. position:relative;
  1079. display:flex;
  1080. align-items:center;
  1081. margin-left:3px;
  1082. padding-top:{select:textbox spacing};
  1083. }
  1084.  
  1085. .pates > * {
  1086. line-height:1em;
  1087. }
  1088.  
  1089. .pates:before {
  1090. content:"";
  1091. position:absolute;
  1092. top:0;
  1093. left:0;margin-left:calc((100% - 69%) / 2);
  1094. width:69%;
  1095. height:1px;
  1096. background:linear-gradient(to right, transparent, {color:textbox divider}, transparent);
  1097. }
  1098.  
  1099. .vinyl-spin {
  1100. animation:recordspin var(--Vinyl-Spin-Speed) linear infinite;
  1101. -webkit-animation:recordspin var(--Vinyl-Spin-Speed) linear infinite;
  1102. -moz-animation:recordspin var(--Vinyl-Spin-Speed) linear infinite;
  1103. -o-animation:recordspin var(--Vinyl-Spin-Speed) linear infinite;
  1104. }
  1105.  
  1106. .vinyl-pause {
  1107. animation-play-state:paused;
  1108. -webkit-animation-play-state:paused;
  1109. -moz-animation-play-state:paused;
  1110. -o-animation-play-state:paused;
  1111. }
  1112.  
  1113. @-webkit-keyframes recordspin {
  1114. from {
  1115. -webkit-transform:rotate(0deg);
  1116. -o-transform:rotate(0deg);
  1117. transform:rotate(0deg);
  1118. }
  1119. to {
  1120. -webkit-transform:rotate(360deg);
  1121. -o-transform:rotate(360deg);
  1122. transform:rotate(360deg);
  1123. }
  1124. }
  1125.  
  1126. @keyframes recordspin {
  1127. from {
  1128. -ms-transform:rotate(0deg);
  1129. -moz-transform:rotate(0deg);
  1130. -webkit-transform:rotate(0deg);
  1131. -o-transform:rotate(0deg);
  1132. transform:rotate(0deg);
  1133. }
  1134. to {
  1135. -ms-transform:rotate(360deg);
  1136. -moz-transform:rotate(360deg);
  1137. -webkit-transform:rotate(360deg);
  1138. -o-transform:rotate(360deg);
  1139. transform:rotate(360deg);
  1140. }
  1141. }
  1142.  
  1143. .vinyl {margin-top:.5px}
  1144.  
  1145. .vinyl, .vinyl svg {
  1146. width:var(--Vinyl-Icon-Size);
  1147. height:var(--Vinyl-Icon-Size);
  1148. }
  1149.  
  1150. .music-controls {
  1151. margin-left:8px;
  1152. width:var(--Music-Controls-Size);
  1153. overflow:hidden;
  1154. cursor:pointer;
  1155. }
  1156.  
  1157. .music-controls svg {
  1158. width:var(--Music-Controls-Size);
  1159. height:var(--Music-Controls-Size);
  1160. color:{color:textbox text};
  1161. stroke-width:1.5px;
  1162. }
  1163.  
  1164. .pausee {display:none;}
  1165.  
  1166. .beff {display:none;}
  1167. .aff {display:block;}
  1168.  
  1169. .music-title {
  1170. margin-top:.5px;
  1171. margin-left:7px;
  1172. font-family:space grotesk;
  1173. font-size:calc({select:textbox font size} - 2.5px);
  1174. text-transform:uppercase;
  1175. letter-spacing:1px;
  1176. color:{color:textbox text};
  1177. }
  1178.  
  1179. /*------------ MAIN POSTS ------------*/
  1180. .postscont {
  1181. position:absolute;
  1182. top:0;margin-top:{select:window margin};
  1183. right:0;
  1184.  
  1185. {block:ifhidetextboxes}
  1186. margin-right:calc({select:sidebar width} + ({select:sidebar margins} * 3));
  1187. {/block:ifhidetextboxes}
  1188.  
  1189. {block:ifnothidetextboxes}
  1190. margin-right:calc({select:sidebar width} + ({select:sidebar margins} * 5) + {select:textbox width});
  1191. {/block:ifnothidetextboxes}
  1192.  
  1193. min-width:calc(var(--Post-Width) + ({select:post padding} * 2));
  1194. font-size:{select:post font size};
  1195. color:{color:text};
  1196. line-height:{select:post text line height};
  1197. }
  1198.  
  1199. .posts {
  1200. position:relative;
  1201. margin-bottom:calc({select:post spacing} * 2);
  1202. padding:{select:post padding};
  1203. background:{color:post};
  1204. width:var(--Post-Width);
  1205. }
  1206.  
  1207. .posts:after {
  1208. content:"";
  1209. position:absolute;
  1210. bottom:0;margin-bottom:-{select:post spacing};
  1211. left:0;
  1212. width:100%;
  1213. height:1px;
  1214. background:linear-gradient(to right, transparent, {color:post dividers}, transparent);
  1215. }
  1216.  
  1217. .posts blockquote {
  1218. margin:calc(var(--Posts-Avatar-Size) / 2);
  1219. padding-left:calc(var(--Posts-Avatar-Size) / 2);
  1220. border-left:1px solid var(--Blockquote-Border-Color);
  1221. }
  1222.  
  1223. /*------------ REBLOG STYLING ------------*/
  1224. .caption {
  1225. margin-top:var(--NPF-Caption-Spacing);
  1226. }
  1227.  
  1228. .caption a, .body a, .answer_text a, .reply a {
  1229. padding-bottom:1px;
  1230. border-bottom:0.5px solid rgba({RGBcolor:link},0.420);
  1231. }
  1232.  
  1233. .comment_container {
  1234. {block:ifreblogseparators}
  1235. padding:calc(var(--Captions-Gap) / 2) 0;
  1236. border-bottom:1px solid {color:reblog separators};
  1237. {block:iffullwidthreblogseparators}
  1238. margin:0 -{select:post padding};
  1239. padding-left:{select:post padding};
  1240. padding-right:{select:post padding};
  1241. {/block:iffullwidthreblogseparators}
  1242. {/block:ifreblogseparators}
  1243.  
  1244. {block:ifnotreblogseparators}
  1245. padding:calc(var(--Captions-Gap) / 2.5) 0;
  1246. {/block:ifnotreblogseparators}
  1247. }
  1248.  
  1249. .comment_container:first-of-type, .ccfirst {
  1250. padding-top:0px;
  1251. border-top:0px solid transparent;
  1252. }
  1253.  
  1254. .comment_container:last-of-type, .cclast {
  1255. padding-bottom:0px;
  1256. border-bottom:0px solid transparent;
  1257. }
  1258.  
  1259. .commenter {
  1260. margin:0.69em 0;
  1261. display:flex;
  1262. align-items:center;
  1263. }
  1264.  
  1265. .commenter img {
  1266. width:var(--Posts-Avatar-Size);
  1267. height:var(--Posts-Avatar-Size);
  1268. border-radius:100%;
  1269. }
  1270.  
  1271. .commenter a {
  1272. padding-left:7px;
  1273. padding-bottom:0;
  1274. border-bottom:none;
  1275. font-family:sora;
  1276. font-size:calc({select:post font size} - 4.5px);
  1277. text-transform:uppercase;
  1278. letter-spacing:1px;
  1279. color:{color:reblogger};
  1280. }
  1281.  
  1282. .nosrc {
  1283. display:none;
  1284. margin-top:0;
  1285. }
  1286.  
  1287. /*----- PHOTO POSTS -----*/
  1288. .photopic {
  1289. width:100%;
  1290. cursor:help;
  1291. }
  1292.  
  1293. .npf_inst img {
  1294. cursor:help;
  1295. }
  1296.  
  1297. /*----- PHOTOSETS -----*/
  1298. [photoset-layout] {
  1299. grid-gap:{select:photoset spacing};
  1300. }
  1301.  
  1302. [photoset-layout] div {
  1303. cursor:help;
  1304. }
  1305.  
  1306. /*----- QUOTE POSTS -----*/
  1307. .quote-words {
  1308. font-family:canela;
  1309. font-weight:normal;
  1310. font-size:{select:post font size};
  1311. text-transform:uppercase;
  1312. letter-spacing:2px;
  1313. text-align:center;
  1314. }
  1315.  
  1316. .quote-source {
  1317. text-align:center;
  1318. }
  1319.  
  1320. /*----- CHAT POSTS -----*/
  1321. .chatholder {
  1322. margin:0;
  1323. margin-bottom:-.5px;
  1324. border:.5px solid {color:reblog separators};
  1325. }
  1326.  
  1327. .chat_row {
  1328. padding:calc(var(--Captions-Gap) * 0.8) calc(var(--Captions-Gap) * 1);
  1329. border-bottom:.5px solid {color:reblog separators};
  1330. }
  1331.  
  1332. .chat_row:last-child { border-bottom:none }
  1333.  
  1334. .chat_label {
  1335. margin-right:4px;
  1336. font-family:space grotesk;
  1337. text-transform:uppercase;
  1338. font-size:calc({select:post font size} - 3px);
  1339. letter-spacing:1px;
  1340. font-weight:bold;
  1341. }
  1342.  
  1343. .chat_content {
  1344. }
  1345.  
  1346. /*----- ASK POSTS -----*/
  1347. .asker_ {
  1348. display:block;
  1349. text-align:center;
  1350. }
  1351.  
  1352. .asker_, .asker_ a {
  1353. font-family:sora;
  1354. font-size:calc({select:post font size} - 2.5px);
  1355. text-transform:uppercase;
  1356. letter-spacing:1px;
  1357. }
  1358.  
  1359. .asker_ a {padding:0}
  1360.  
  1361. .question_text {
  1362. margin-bottom:calc(var(--Paragraph-Margins) / 2);
  1363. padding:0 var(--Captions-Gap);
  1364. text-align:center;
  1365. }
  1366.  
  1367. .answerer_, .answerer_ a {
  1368. font-family:sora;
  1369. font-size:calc({select:post font size} - 3.5px);
  1370. text-transform:uppercase;
  1371. letter-spacing:1px;
  1372. }
  1373.  
  1374. .answerer_ a {margin-right:5px}
  1375.  
  1376. /*----- AUDIO -----*/
  1377. .tumblr_audio_player[width] {
  1378. width:100%!important;
  1379. height:0!important;
  1380. }
  1381.  
  1382. .audiocont {
  1383. position:absolute;
  1384. display:none;
  1385. overflow:hidden;
  1386. width:0!important;
  1387. height:0!important;
  1388. opacity:0;
  1389. }
  1390.  
  1391. .alcove {
  1392. position:relative;
  1393. width:var(--Audio-Post-Album-Image-Size);
  1394. height:var(--Audio-Post-Album-Image-Size);
  1395. }
  1396.  
  1397. .strawberries {
  1398. position:absolute;
  1399. top:0;margin-top:calc((100% - (var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px)) / 2);
  1400. left:0;margin-left:calc((100% - (var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px)) / 2);
  1401. width:calc(var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px);
  1402. height:calc(var(--Audio-Post-PlayButton-Size) + (var(--Audio-Post-PlayButton-Padding) * 2) + 2px);
  1403. }
  1404.  
  1405. .summer {
  1406. border:1px solid rgba({RGBcolor:text},0.420);
  1407. width:100%;
  1408. height:100%;
  1409. background:{color:post};
  1410. box-sizing:border-box;
  1411. border-radius:100%;
  1412. display:flex;
  1413. align-items:center;
  1414. justify-content:center;
  1415. line-height:1em;
  1416. cursor:pointer;
  1417. user-select:none;
  1418. }
  1419.  
  1420. .splay {
  1421. margin-top:2px;
  1422. }
  1423.  
  1424. .splay i, .spause i {
  1425. font-size:var(--Audio-Post-PlayButton-Size);
  1426. color:{color:text};
  1427. }
  1428.  
  1429. .spause {
  1430. display:none;
  1431. margin-top:2px;
  1432. }
  1433.  
  1434. .spause i {
  1435. font-size:calc(var(--Audio-Post-PlayButton-Size) - 1px);
  1436. }
  1437.  
  1438. .a-lbum-img {
  1439. width:100%;
  1440. height:100%;
  1441. border-radius:3px;
  1442. visibility:hidden;
  1443. }
  1444.  
  1445. .tin {
  1446. width:calc(100% - var(--Audio-Post-Album-Image-Size));
  1447. height:var(--Audio-Post-Album-Image-Size);
  1448. }
  1449.  
  1450. .trackinfo {
  1451. margin-left:14px;
  1452. line-height:calc({select:post text line height} * 0.9);
  1453. }
  1454.  
  1455. .t-name, .npf-audio-title {
  1456. font-weight:bold;
  1457. font-family:chakra petch;
  1458. font-size:calc({select:post font size} - 1px);
  1459. text-transform:uppercase;
  1460. letter-spacing:1px;
  1461. }
  1462.  
  1463. .t-artist, .npf-audio-artist {
  1464. color:rgba({RGBcolor:text},0.85);
  1465. }
  1466.  
  1467. .dongload {
  1468. text-transform:initial!important;
  1469. padding:5px 0 5px 5px;
  1470. border-bottom:none!important;
  1471. }
  1472.  
  1473. .dongload svg {
  1474. width:var(--Audio-Post-Download-Size);
  1475. height:var(--Audio-Post-Download-Size);
  1476. stroke:var(--Audio-Post-Download-Color);
  1477. stroke-width:1.5px;
  1478. pointer-events:none;
  1479. }
  1480.  
  1481. /*----- VIDEOS -----*/
  1482. video {
  1483. display:block;
  1484. outline:none;
  1485. cursor:default;
  1486. width:100%;
  1487. }
  1488.  
  1489. /*----- TAGS -----*/
  1490. .tagholder {
  1491. display:flex;
  1492. flex-wrap:wrap;
  1493. justify-content:flex-end;
  1494. text-align:right;
  1495. margin:0 -4px;
  1496. margin-top:var(--Captions-Gap);
  1497. font-family:space grotesk;
  1498. font-size:calc({select:post font size} - 3px);
  1499. text-transform:uppercase;
  1500. letter-spacing:1px;
  1501. line-height:1.5em;
  1502. }
  1503.  
  1504. .tagholder a {
  1505. display:block;
  1506. margin:0 4px;
  1507. color:{color:tags};
  1508. }
  1509.  
  1510. /*------------ PERMALINK ------------*/
  1511. .permarow {
  1512. display:flex;
  1513. align-items:center;
  1514. justify-content:space-between;
  1515. margin-top:calc(var(--Captions-Gap) * 1.25);
  1516. font-family:chakra petch;
  1517. text-transform:uppercase;
  1518. font-size:calc({select:post font size} - 3px);
  1519. letter-spacing:1px;
  1520. }
  1521.  
  1522. .permarow a {
  1523. color:{color:permalink};
  1524. }
  1525.  
  1526. .permaleft {
  1527. flex:1;
  1528. }
  1529.  
  1530. .permaleft ion-icon {
  1531. margin-top:-1px;
  1532. margin-right:7px;
  1533. font-size:calc({select:post font size} - 1px);
  1534. color:{color:permalink};
  1535. }
  1536.  
  1537. .permaleft span {
  1538. margin-left:2px;
  1539. }
  1540.  
  1541. .lineage {
  1542. margin:0 6px;
  1543. width:30px;
  1544. height:.7px;
  1545. background:linear-gradient(to right, transparent, rgba({RGBcolor:permalink},0.69), transparent);
  1546. }
  1547.  
  1548. .permaright, .les-controls {
  1549. display:flex;
  1550. align-items:center;
  1551. }
  1552.  
  1553. .les-controls > a {
  1554. display:block;
  1555. margin-right:{select:post buttons spacing};
  1556. width:{select:post buttons size};
  1557. height:{select:post buttons size};
  1558. }
  1559.  
  1560. .les-controls svg {
  1561. display:block;
  1562. width:100%;
  1563. height:100%;
  1564. fill:{color:post buttons};
  1565. }
  1566.  
  1567. .permaright a {margin-right:{select:post buttons spacing};}
  1568. .permaright a:last-of-type {margin-right:0;}
  1569.  
  1570. .retweet svg {
  1571. transform:scaleX(-1);
  1572. }
  1573.  
  1574. .likecont {
  1575. position:relative;
  1576. }
  1577.  
  1578. .like_button {
  1579. position:absolute;
  1580. width:100%;
  1581. height:100%;
  1582. }
  1583.  
  1584. .like_button iframe {
  1585. position:absolute;
  1586. top:0;left:0;
  1587. width:100%;
  1588. height:100%;
  1589. opacity:0;
  1590. z-index:2;
  1591. }
  1592.  
  1593. .like_button.liked + .heart svg {
  1594. fill:var(--Like-Button-Liked)!important;
  1595. }
  1596.  
  1597. /*----- POST NOTES -----*/
  1598. .notescont {
  1599. margin-bottom:calc({select:window margin} - 1.25em);
  1600. width:calc(var(--Post-Width) + ({select:post padding} * 2));
  1601. }
  1602.  
  1603. ol.notes {
  1604. margin:0;
  1605. padding:0 {select:post padding};
  1606. list-style:none;
  1607. }
  1608.  
  1609. ol.notes .avatar {
  1610. display:none;
  1611. }
  1612.  
  1613. ol.notes a {
  1614. font-family:chakra petch;
  1615. font-size:calc({select:post font size} - 3px);
  1616. text-transform:uppercase;
  1617. letter-spacing:1px;
  1618. }
  1619.  
  1620. ol.notes li {
  1621. margin-bottom:1.25em;
  1622. padding:0;
  1623. }
  1624.  
  1625. ol.notes blockquote {
  1626. margin:1em;
  1627. padding-left:1em;
  1628. border-left:var(--Blockquote-Border-Color);
  1629. }
  1630.  
  1631. .more_notes_link_container {
  1632. margin-top:{select:post padding};
  1633. }
  1634.  
  1635. /*------- PAGINATION -------*/
  1636. .botpagi {
  1637. margin-bottom:{select:window margin};
  1638. width:100%;
  1639. }
  1640.  
  1641. .botpagi span {
  1642. padding:0 4px;
  1643. font-family:canela;
  1644. font-size:calc({select:post font size} - 3.5px);
  1645. text-transform:uppercase;
  1646. letter-spacing:1.5px;
  1647. color:{color:link};
  1648. }
  1649.  
  1650. .botpagi svg {
  1651. width:calc({select:post font size} + 1px);
  1652. height:calc({select:post font size} + 1px);
  1653. color:{color:link};
  1654. }
  1655.  
  1656. .pn {
  1657. margin-left:auto;
  1658. }
  1659.  
  1660. a.read_more {
  1661. display:block;
  1662. padding:0;
  1663. border:none;
  1664. margin-top:calc(var(--Paragraph-Margins) * 1.69);
  1665. font-family:chakra petch;
  1666. font-size:calc({select:post font size} - 2px);
  1667. text-transform:uppercase;
  1668. letter-spacing:1.3px;
  1669. text-align:center;
  1670. }
  1671.  
  1672. a.read_more:before {
  1673. content:"[";
  1674. margin-right:5px;
  1675. opacity:0.8;
  1676. }
  1677.  
  1678. a.read_more:after {
  1679. content:"]";
  1680. margin-left:5px;
  1681. opacity:0.8;
  1682. }
  1683.  
  1684. {CustomCSS}
  1685. </style>
  1686.  
  1687. </head>
  1688.  
  1689. <body>
  1690.  
  1691. <!------ RIGHT SIDEBAR ------>
  1692. <div class="rightside">
  1693. <div class="succ">
  1694. <div class="oat">
  1695. {block:ifsidebartitle}
  1696. <div class="bigsidetiddy">{text:sidebar title}</div>
  1697. {/block:ifsidebartitle}
  1698.  
  1699. <a class="ministuff" href="//{Name}.tumblr.com">
  1700. <img src="{image:sidebar icon}">
  1701.  
  1702. <div>
  1703. <span blog-title>{Title}</span>
  1704. <span username>{Name}</span>
  1705. </div>
  1706. </a>
  1707.  
  1708. <img class="vergin" src="{image:sidebar image}">
  1709.  
  1710. <div class="cheese">
  1711. <div class="custard">
  1712. <a href="/" title="home">
  1713. <ion-icon name="home-outline"></ion-icon>
  1714. </a>
  1715.  
  1716. <a href="/ask" title="ask">
  1717. <ion-icon name="mail-open-outline"></ion-icon>
  1718. </a>
  1719.  
  1720. <a href="/archive" title="archive">
  1721. <ion-icon name="calendar-outline"></ion-icon>
  1722. </a>
  1723.  
  1724. <a href="//glenthemes.tumblr.com" title="theme by glenthemes">
  1725. <div class="glenjamin"></div>
  1726. </a>
  1727. </div><!--custard-->
  1728.  
  1729. <div class="ouai">
  1730. <div class="desc">{Description}</div>
  1731. </div>
  1732. </div><!--cheese-->
  1733.  
  1734. <div class="pasta">
  1735. {block:ifcustomlink1name}
  1736. <a class="beurre" href="{text:customlink 1 URL}">
  1737. <div class="miel">
  1738. <span>{text:customlink 1 name}</span>
  1739. </div>
  1740. </a>
  1741. {/block:ifcustomlink1name}
  1742.  
  1743.  
  1744. {block:ifcustomlink2name}
  1745. <a class="beurre" href="{text:customlink 2 URL}">
  1746. <div class="miel">
  1747. <span>{text:customlink 2 name}</span>
  1748. </div>
  1749. </a>
  1750. {/block:ifcustomlink2name}
  1751.  
  1752.  
  1753. {block:ifcustomlink3name}
  1754. <a class="beurre" href="{text:customlink 3 URL}">
  1755. <div class="miel">
  1756. <span>{text:customlink 3 name}</span>
  1757. </div>
  1758. </a>
  1759. {/block:ifcustomlink3name}
  1760.  
  1761.  
  1762. {block:ifcustomlink4name}
  1763. <a class="beurre" href="{text:customlink 4 URL}">
  1764. <div class="miel">
  1765. <span>{text:customlink 4 name}</span>
  1766. </div>
  1767. </a>
  1768. {/block:ifcustomlink4name}
  1769.  
  1770.  
  1771. {block:ifcustomlink5name}
  1772. <a class="beurre" href="{text:customlink 5 URL}">
  1773. <div class="miel">
  1774. <span>{text:customlink 5 name}</span>
  1775. </div>
  1776. </a>
  1777. {/block:ifcustomlink5name}
  1778.  
  1779.  
  1780. {block:ifcustomlink6name}
  1781. <a class="beurre" href="{text:customlink 6 URL}">
  1782. <div class="miel">
  1783. <span>{text:customlink 6 name}</span>
  1784. </div>
  1785. </a>
  1786. {/block:ifcustomlink6name}
  1787. </div><!--pasta-->
  1788. </div><!--oat-->
  1789. </div><!--succ-->
  1790. </div><!--rightside-->
  1791.  
  1792.  
  1793. <!------ TEXTBOXES ------>
  1794. <div class="howmanyyears">
  1795. <div class="twohondred">
  1796. <div class="dirk">
  1797. {block:iftextbox1text}
  1798. <div class="onebox">
  1799. <div class="boxtitle"><span>{text:textbox 1 title}</span></div>
  1800. <div class="boxtext">{text:textbox 1 text}</div>
  1801. </div>
  1802. {/block:iftextbox1text}
  1803.  
  1804. {block:iftextbox2text}
  1805. <div class="onebox">
  1806. <div class="boxtitle"><span>{text:textbox 2 title}</span></div>
  1807. <div class="boxtext">{text:textbox 2 text}</div>
  1808. </div>
  1809. {/block:iftextbox2text}
  1810.  
  1811. {block:iftextbox3text}
  1812. <div class="onebox">
  1813. <div class="boxtitle"><span>{text:textbox 3 title}</span></div>
  1814. <div class="boxtext">{text:textbox 3 text}</div>
  1815. </div>
  1816. {/block:iftextbox3text}
  1817.  
  1818.  
  1819. {block:ifshowmusicplayer}
  1820. <div class="yamato">
  1821. <div class="pates">
  1822. <div class="vinyl"></div>
  1823. <div class="music-controls">
  1824. <div class="playy"><i data-feather="play"></i></div>
  1825. <div class="pausee"><i data-feather="pause"></i></div>
  1826. </div>
  1827. <div class="music-title">{text:music player song name}</div>
  1828.  
  1829. <audio id="audio" src="{text:music player song mp3 url}" type="audio"></audio>
  1830. </div><!--pates-->
  1831. </div>
  1832. {/block:ifshowmusicplayer}
  1833. </div><!--dirk-->
  1834. </div><!--twohondred-->
  1835. </div><!--howmanyyears-->
  1836.  
  1837.  
  1838.  
  1839. <div class="postscont">
  1840.  
  1841. {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
  1842. <div class="posts {block:ifreblogseparators}oui{/block:ifreblogseparators}" id="{PostID}" post-type="{PostType}">
  1843.  
  1844. <!------ POST TITLE ------>
  1845. {block:Title}
  1846. <h1 href="{Permalink}" class="title">{Title}</h1>
  1847. {/block:Title}
  1848. <!------ END POST TITLE ------>
  1849.  
  1850.  
  1851. {block:RebloggedFrom}
  1852. <div class="commenter nosrc">
  1853. <img src="{ReblogRootPortraitURL-64}">
  1854. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1855. </div>
  1856. {/block:RebloggedFrom}
  1857.  
  1858.  
  1859. <!------ TEXT POSTS ------>
  1860. {block:Text}
  1861. <div class="body">
  1862. {block:NotReblog}{Body}{/block:NotReblog}
  1863. {block:RebloggedFrom}
  1864. {block:Reblogs}
  1865. <div class="comment_container">
  1866. <div class="commenter source-head">
  1867. <img src="{PortraitURL-64}">
  1868. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  1869. </div>
  1870. <div class="comment">{Body}</div>
  1871. </div>
  1872. {/block:Reblogs}
  1873. {/block:RebloggedFrom}
  1874. </div>
  1875. {/block:Text}
  1876. <!------ END TEXT POSTS ------>
  1877.  
  1878.  
  1879. <!------ SINGLE PHOTO ------>
  1880. {block:Photo}
  1881. <a class="single" 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"><img class="photopic" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>
  1882. {/block:Photo}
  1883. <!------ END SINGLE PHOTO ------>
  1884.  
  1885.  
  1886.  
  1887.  
  1888. <!------ PHOTOSETS ------>
  1889. {block:Photoset}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}"></div>{/block:Photos}</div>{/block:Photoset}
  1890. <!------ END PHOTOSETS ------>
  1891.  
  1892.  
  1893.  
  1894. <!------ QUOTE POSTS ------>
  1895. {block:Quote}
  1896. <div class="quote-words">{Quote}</div>
  1897. {block:Source}<div class="quote-source">{Source}</div>{/block:Source}
  1898. {/block:Quote}
  1899. <!------ END QUOTE POSTS ------>
  1900.  
  1901.  
  1902. <!------ LINK POSTS ------>
  1903. {block:Link}
  1904. <a href="{URL}" class="linkpath{block:Description} has-desc{/block:Description}" {Target}>{Name} <span>&gt;</span></a>
  1905. {block:Description}
  1906. <div class="link-description body">
  1907. {block:NotReblog}{Description}{/block:NotReblog}
  1908. {block:RebloggedFrom}
  1909. {block:Reblogs}
  1910. <div class="comment_container">
  1911. <div class="commenter">
  1912. <img src="{PortraitURL-64}">
  1913. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  1914. </div>
  1915. <div class="comment">{Body}</div>
  1916. </div>
  1917. {/block:Reblogs}
  1918. {/block:RebloggedFrom}
  1919. </div>
  1920. {/block:Description}
  1921. {/block:Link}
  1922. <!------ END LINK POSTS ------>
  1923.  
  1924.  
  1925. <!------ CHAT POSTS ------>
  1926. {block:Chat}
  1927. <div class="chatholder">
  1928. {block:Lines}
  1929. <div class="chat_row">
  1930. {block:Label}
  1931. <span class="chat_label">{Label}</span>
  1932. {/block:Label}
  1933.  
  1934. <span class="chat_content">{Line}</span>
  1935. </div>
  1936. {/block:Lines}
  1937. </div>
  1938. {/block:Chat}
  1939. <!------ END CHAT ------>
  1940.  
  1941.  
  1942.  
  1943. <!------ AUDIO POSTS ------>
  1944. {block:Audio}
  1945. <div class="flex">
  1946. <div class="audiocont">
  1947. {AudioEmbed}
  1948. </div>
  1949.  
  1950. <div class="alcove">
  1951. <img class="a-lbum-img">
  1952.  
  1953. <div class="strawberries">
  1954. <div class="summer">
  1955. <div class="splay">
  1956. <i class="material-icons">play_arrow</i>
  1957. </div>
  1958. <div class="spause">
  1959. <i class="material-icons">pause</i>
  1960. </div>
  1961. </div><!--summer-->
  1962. </div>
  1963. </div>
  1964.  
  1965. <div class="tin flex space-between">
  1966. <div class="trackinfo">
  1967. {block:TrackName}
  1968. <div class="t-name">{TrackName}</div>
  1969. {/block:TrackName}
  1970.  
  1971. {block:Artist}
  1972. <div class="t-artist">{Artist}</div>
  1973. {/block:Artist}
  1974. </div><!--trackinfo-->
  1975.  
  1976. <a class="dongload" title="download">
  1977. <i data-feather="download"></i>
  1978. </a>
  1979. </div><!--flex-->
  1980. </div><!--oofy-->
  1981. {/block:Audio}
  1982. <!------ END AUDIO ------>
  1983.  
  1984.  
  1985.  
  1986. <!------ VIDEO POSTS ------>
  1987. {block:Video}<div class="video">{Video-500}</div>{/block:Video}
  1988. <!------ END VIDEOS ------>
  1989.  
  1990.  
  1991.  
  1992. <!------ ANSWER POSTS ------>
  1993. {block:Answer}
  1994. <div class="comment_container">
  1995. <div class="asker_ commenter">
  1996. {Asker} asked:
  1997. </div>
  1998. <div class="question_text">{Question}</div>
  1999. </div>
  2000. {block:Answerer}
  2001. <div class="comment_container">
  2002. <div class="answerer_ commenter">
  2003. <img src="{AnswererPortraitURL-48}"/>
  2004. {Answerer} answered:
  2005. </div>
  2006. <div class="answer_text">{Answer}</div>
  2007. </div>
  2008. {block:Reblogs}
  2009. <div class="comment_container">
  2010. <div class="replier commenter">
  2011. <img src="{PortraitURL-64}">
  2012. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2013. </div>
  2014. <div class="reply">{Body}</div>
  2015. </div>
  2016. {/block:Reblogs}
  2017. {/block:Answerer}
  2018. {block:NotReblog}
  2019. <div class="comment_container">
  2020. <div class="answerer commenter">
  2021. <img src="{PortraitURL-48}">
  2022. <a href="{Permalink}">{Name}</a>
  2023. </div><!--answerer-->
  2024. <div class="answer_text">{Answer}</div>
  2025. </div><!--answer-container-->
  2026. {/block:NotReblog}
  2027. {/block:Answer}
  2028. <!------ END ANSWER ------>
  2029.  
  2030. {block:Caption}
  2031. <div class="caption">
  2032. {block:NotReblog}{Caption}{/block:NotReblog}
  2033. {block:RebloggedFrom}
  2034. {block:Reblogs}
  2035. <div class="comment_container">
  2036. <div class="commenter">
  2037. <img src="{PortraitURL-64}">
  2038. <a href="{block:HasPermalink}{Permalink}{/block:HasPermalink}">{Username}</a>
  2039. </div><!--commenter-->
  2040. <div class="comment">{Body}</div>
  2041. </div><!--comment-container-->
  2042. {/block:Reblogs}
  2043. {/block:RebloggedFrom}
  2044. </div><!--caption-->
  2045. {/block:Caption}
  2046.  
  2047.  
  2048.  
  2049. {block:HasTags}
  2050. <div class="tagholder">
  2051. {block:Tags}
  2052. <a href="{TagURL}">#{Tag}</a>
  2053. {/block:Tags}
  2054. </div>
  2055. {/block:HasTags}
  2056.  
  2057.  
  2058.  
  2059. {block:Date}
  2060. <div class="permarow">
  2061. <div class="permaleft">
  2062. {block:IndexPage}
  2063. <a href="{Permalink}" class="flex">
  2064. <ion-icon name="bookmarks-outline"></ion-icon>
  2065.  
  2066. {NoteCountWithLabel}
  2067.  
  2068. <div class="lineage"></div>
  2069.  
  2070. {DayOfMonthWithZero} {Month}
  2071. {12HourWithZero}:{Minutes}<span>{AMPM}</span>
  2072. </a>
  2073. {/block:IndexPage}
  2074.  
  2075. <div class="flex">
  2076. {block:PermalinkPage}
  2077. {block:NotReblog}Posted{/block:NotReblog}
  2078. {block:RebloggedFrom}Reblogged{/block:RebloggedFrom}
  2079. on {Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}
  2080. <div class="lineage"></div>
  2081. {NoteCountWithLabel}
  2082. {/block:PermalinkPage}
  2083. </div>
  2084. </div>
  2085.  
  2086. <div class="permaright">
  2087. {block:IndexPage}
  2088. <div class="les-controls flex">
  2089. <a href="{ReblogURL}" target="_blank">
  2090. <span class="retweet"></span>
  2091. </a>
  2092.  
  2093. <a class="likecont like">
  2094. {LikeButton}
  2095. <span class="heart"></span>
  2096. </a>
  2097. </div>
  2098. {/block:IndexPage}
  2099.  
  2100.  
  2101. {block:PermalinkPage}
  2102. {block:RebloggedFrom}
  2103. <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
  2104. <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
  2105. {/block:RebloggedFrom}
  2106. {/block:PermalinkPage}
  2107. </div>
  2108. </div><!--permarow-->
  2109. {/block:Date}
  2110.  
  2111. </div><!--posts-->
  2112.  
  2113. {block:PostNotes}
  2114. <div class="notescont">
  2115. {PostNotes}
  2116. </div>
  2117. {/block:PostNotes}
  2118. {/block:Posts}
  2119.  
  2120.  
  2121. <!------- PAGINATION ------->
  2122. {block:Pagination}
  2123. <div class="botpagi flex space-between">
  2124. {block:PreviousPage}
  2125. <a class="flex" href="{PreviousPage}">
  2126. <i data-feather="chevron-left"></i>
  2127. <span>previous</span>
  2128. </a>
  2129. {/block:PreviousPage}
  2130.  
  2131. {block:NextPage}
  2132. <a class="flex pn" href="{NextPage}">
  2133. <span>next</span>
  2134. <i data-feather="chevron-right"></i>
  2135. </a>
  2136. {/block:NextPage}
  2137. </div><!--botpagi-->
  2138. {/block:Pagination}
  2139.  
  2140. </div><!--postscont-->
  2141.  
  2142. <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
  2143. <script>
  2144. initPhotosets();
  2145. feather.replace();
  2146. </script>
  2147.  
  2148. <script>
  2149. $(document).ready(function(){
  2150. $('img[src*="media.tumblr.com"]').each(function(){
  2151. var newsrc = $(this).attr('src').replace('gifv','gif');
  2152. $(this).attr('src', newsrc);
  2153. });
  2154.  
  2155. $('a[href*="media.tumblr.com"]').each(function(){
  2156. var newhref = $(this).attr('href').replace('gifv','gif');
  2157. $(this).attr('href', newhref);
  2158. });
  2159.  
  2160. $('div[data-lowres*="media.tumblr.com').each(function(){
  2161. var newdata = $(this).attr('data-lowres').replace('gifv','gif');
  2162. $(this).attr('data-lowres', newdata);
  2163. });
  2164.  
  2165. $('div[data-highres*="media.tumblr.com').each(function(){
  2166. var newdata = $(this).attr('data-highres').replace('gifv','gif');
  2167. $(this).attr('data-highres', newdata);
  2168. });
  2169. });
  2170. </script>
  2171.  
  2172. </body>
  2173. </html>
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!