API tools faq
paste
saestrah

entity

saestrah
Jan 9th, 2021 (edited)
2,686
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.64 KB | None | 0 0
raw download clone embed print report
  1. <!----
  2.  
  3. entity · by saestrah · january 2021
  4.  
  5. · base code by sorrism
  6. · scroll to top by paul underwood
  7. · smoothscroll by balazs galambosi
  8. · flexible frames by nouvae
  9. · npf images readjustment by glenthemes
  10. · audio player, notecount script & search bar script by shythemes
  11. · photosets by annasthms and eggdesign
  12. · nightmode by eggdesign
  13. · icons by line-awesome
  14. · tooltips by malihu
  15.  
  16. || terms of use:
  17.  
  18. · don't remove credit
  19. · don't repost or redistribute
  20. · don't take parts of the code and use as your own
  21.  
  22. || notes:
  23.  
  24. · for customisation hints, search for "a note from saestrah"
  25.  
  26. ---->
  27.  
  28. <!DOCTYPE html>
  29. <head>
  30.  
  31. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  32.  
  33. <title>{block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  34.  
  35. <link rel="shortcut icon" href="{Favicon}">
  36.  
  37. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  38. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  39.  
  40. <!---- defaults ---->
  41.  
  42. <meta name="color:Background" content="#ffffff"/>
  43. <meta name="color:Night Background" content="#292f36"/>
  44. <meta name="color:Base" content="#f6f6f6"/>
  45. <meta name="color:Night Base" content="#21262c"/>
  46. <meta name="color:Text" content="#888888"/>
  47. <meta name="color:Night Text" content="#cccccc"/>
  48. <meta name="color:Link" content="#000000"/>
  49. <meta name="color:Night Link" content="#ffffff"/>
  50. <meta name="color:Accent" content="#ff1166"/>
  51. <meta name="color:Night Accent" content="#b3f02e"/>
  52. <meta name="color:Title"content="#000000"/>
  53. <meta name="color:Night Title" content="#ffffff"/>
  54. <meta name="color:Tooltip Text" content="#ffffff"/>
  55. <meta name="color:Night Tooltip Text" content="#000000"/>
  56. <meta name="color:Scrollbar" content="#cccccc"/>
  57.  
  58. <meta name="select:Title Font" content="Big Shoulders Inline Display"/>
  59. <meta name="select:Title Font" content="Bungee"/>
  60. <meta name="select:Title Font" content="Bungee Shade"/>
  61. <meta name="select:Title Font" content="Codystar"/>
  62. <meta name="select:Title Font" content="EB Garamond"/>
  63. <meta name="select:Title Font" content="Ewert"/>
  64. <meta name="select:Title Font" content="Fredericka the Great"/>
  65. <meta name="select:Title Font" content="Grenze Gotisch"/>
  66. <meta name="select:Title Font" content="Inria Sans"/>
  67. <meta name="select:Title Font" content="Inria Serif"/>
  68. <meta name="select:Title Font" content="Karla"/>
  69. <meta name="select:Title Font" content="Kumar One Outline"/>
  70. <meta name="select:Title Font" content="La Belle Aurore"/>
  71. <meta name="select:Title Font" content="Lato"/>
  72. <meta name="select:Title Font" content="Lora"/>
  73. <meta name="select:Title Font" content="Modak"/>
  74. <meta name="select:Title Font" content="Monoton"/>
  75. <meta name="select:Title Font" content="Montserrat Subrayada"/>
  76. <meta name="select:Title Font" content="Nerko One"/>
  77. <meta name="select:Title Font" content="Playfair Display"/>
  78. <meta name="select:Title Font" content="Roboto Condensed"/>
  79. <meta name="select:Title Font" content="Roboto Slab"/>
  80. <meta name="select:Title Font" content="Sarina"/>
  81. <meta name="select:Title Font" content="Staatliches"/>
  82. <meta name="select:Title Font" content="UnifrakturCook"/>
  83.  
  84. <meta name="select:Body Font" content="Big Shoulders Inline Display"/>
  85. <meta name="select:Body Font" content="Bungee"/>
  86. <meta name="select:Body Font" content="Bungee Shade"/>
  87. <meta name="select:Body Font" content="Codystar"/>
  88. <meta name="select:Body Font" content="EB Garamond"/>
  89. <meta name="select:Body Font" content="Ewert"/>
  90. <meta name="select:Body Font" content="Fredericka the Great"/>
  91. <meta name="select:Body Font" content="Grenze Gotisch"/>
  92. <meta name="select:Body Font" content="Inria Sans"/>
  93. <meta name="select:Body Font" content="Inria Serif"/>
  94. <meta name="select:Body Font" content="Karla"/>
  95. <meta name="select:Body Font" content="Kumar One Outline"/>
  96. <meta name="select:Body Font" content="La Belle Aurore"/>
  97. <meta name="select:Body Font" content="Lato"/>
  98. <meta name="select:Body Font" content="Lora"/>
  99. <meta name="select:Body Font" content="Modak"/>
  100. <meta name="select:Body Font" content="Monoton"/>
  101. <meta name="select:Body Font" content="Montserrat Subrayada"/>
  102. <meta name="select:Body Font" content="Nerko One"/>
  103. <meta name="select:Body Font" content="Playfair Display"/>
  104. <meta name="select:Body Font" content="Roboto Condensed"/>
  105. <meta name="select:Body Font" content="Roboto Slab"/>
  106. <meta name="select:Body Font" content="Sarina"/>
  107. <meta name="select:Body Font" content="Staatliches"/>
  108. <meta name="select:Body Font" content="UnifrakturCook"/>
  109.  
  110. <meta name="if:Hue Wash" content="1"/>
  111. <meta name="if:Fixed Title" content="1"/>
  112. <meta name="if:Search" content="1"/>
  113. <meta name="if:Updates" content="1"/>
  114. <meta name="if:Small Cursor" content="1"/>
  115. <meta name="if:Uppercase Accents" content="1"/>
  116. <meta name="if:Tags On Hover" content="1"/>
  117. <meta name="if:Invert Tumblr Controls" content="1"/>
  118.  
  119. <meta name="text:Body Font Size" content="13px"/>
  120. <meta name="text:Body Font Weight" content="400"/>
  121. <meta name="text:Title Font Size" content="28px"/>
  122. <meta name="text:Title Font Weight" content="400"/>
  123.  
  124. <meta name="text:Search Placeholder" content="search tags"/>
  125. <meta name="text:Title Tooltip" content=""/>
  126.  
  127. <meta name="text:Home Title" content="home"/>
  128. <meta name="text:Ask Title" content="ask"/>
  129. <meta name="text:Archive Title" content="archive"/>
  130. <meta name="text:Shuffle Title" content="shuffle"/>
  131.  
  132. <meta name="text:Link 1" content=""/>
  133. <meta name="text:Link 1 URL" content="/"/>
  134. <meta name="text:Link 1 Tooltip" content=""/>
  135.  
  136. <meta name="text:Link 2" content="link two"/>
  137. <meta name="text:Link 2 URL" content="/"/>
  138. <meta name="text:Link 2 Tooltip" content=""/>
  139.  
  140. <meta name="text:Link 3" content="link three"/>
  141. <meta name="text:Link 3 URL" content="/"/>
  142. <meta name="text:Link 3 Tooltip" content=""/>
  143.  
  144. <meta name="text:Link 4" content="link four"/>
  145. <meta name="text:Link 4 URL" content="/"/>
  146. <meta name="text:Link 4 Tooltip" content=""/>
  147.  
  148. <meta name="text:Link 5" content="link five"/>
  149. <meta name="text:Link 5 URL" content="/"/>
  150. <meta name="text:Link 5 Tooltip" content=""/>
  151.  
  152. <meta name="text:Update 1 Title" content=""/>
  153. <meta name="text:Update 1 Content" content=""/>
  154. <meta name="text:Update 2 Title" content=""/>
  155. <meta name="text:Update 2 Content" content=""/>
  156. <meta name="text:Update 3 Title" content=""/>
  157. <meta name="text:Update 3 Content" content=""/>
  158.  
  159. <!---- scripts ---->
  160.  
  161. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  162. <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  163. <script src="//code.jquery.com/jquery-1.7.2.min.js"></script>
  164. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  165. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  166. <script src="https://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  167. <script src="https://static.tumblr.com/0podkko/qWqq8va08/photosets.js"></script>
  168. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  169. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  170. <link href="https://maxst.icons8.com/vue-static/landings/line-awe
  171. some/line-awesome/1.3.0/css/line-awesome.min.css" rel="stylesheet">
  172. <script src="//saestrah.github.io/portfolio/entity/entity.js" type="text/javascript"></script>
  173. <link rel="stylesheet" type="text/css" href="//saestrah.github.io/portfolio/entity/entity.css"/>
  174.  
  175. <!---- fonts ---->
  176.  
  177. <link rel="preconnect" href="https://fonts.gstatic.com">
  178. <link href="https://fonts.googleapis.com/css2?family=Big+Shoulders+Inline+Display:wght@100;300;400;700;900&family=Bungee&family=Bungee+Shade&family=Codystar:wght@300;400&family=EB+Garamond:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&family=Ewert&family=Fredericka+the+Great&family=Grenze+Gotisch:wght@100;300;400;700&family=Inria+Sans:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Inria+Serif:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Karla:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Kumar+One+Outline&family=La+Belle+Aurore&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Modak&family=Monoton&family=Montserrat+Subrayada:wght@400;700&family=Nerko+One&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,800;1,400;1,600;1,700;1,800&family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&family=Sarina&family=Staatliches&family=UnifrakturCook:wght@700&display=swap" rel="stylesheet">
  179.  
  180. <style type="text/css">
  181.  
  182. /* root variables */
  183.  
  184. :root {
  185. --background:{color:Background};
  186. --nightbackground:{color:Night Background};
  187. --rgbbackground:{RGBcolor:Background};
  188. --rgbnightbackground:{RGBcolor:Night Background};
  189. --base:{color:Base};
  190. --nightbase:{color:Night Base};
  191. --text:{color:Text};
  192. --nighttext:{color:Night Text};
  193. --link:{color:Link};
  194. --nightlink:{color:Night Link};
  195. --accent:{color:Accent};
  196. --nightaccent:{color:Night Accent};
  197. --title:{color:Title};
  198. --nighttitle:{color:Night Title};
  199. --tooltiptext:{color:Tooltip Text};
  200. --nighttooltiptext:{color:Night Tooltip Text};
  201. --scrollbar:{color:Scrollbar};
  202.  
  203. --bodyfont:{select:Body Font};
  204. --bodyfontsize:{text:Body Font Size};
  205. --bodyfontweight:{text:Body Font Weight};
  206. --titlefont:{select:Title Font};
  207. --titlefontsize:{text:Title Font Size};
  208. --titlefontweight:{text:Title Font Weight};
  209. }
  210.  
  211. /* css */
  212.  
  213. {block:ifFixedTitle}
  214. maintitle { position:fixed; }
  215. {/block:ifFixedTitle}
  216.  
  217. {block:ifUppercaseAccents}
  218. #s-m-t-tooltip, h1, h2, h3, h4, #linkicons, .updatetitle, postinfo, .title, a.read_more, .label, .tags, a.more_notes_link { text-transform:uppercase; }
  219. {/block:ifUppercaseAccents}
  220.  
  221. {block:ifInvertTumblrControls}
  222. iframe.tmblr-iframe { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter:invert(100%); -o-filter:invert(100%); -ms-filter:invert(100%); filter:invert(100%); }
  223. {/block:ifInvertTumblrControls}
  224.  
  225. {block:PermalinkPage}
  226. .top { opacity:0; }
  227. section { padding-bottom:50px; }
  228. .posts { margin-bottom:50px; }
  229. .tags { opacity:1; }
  230. {/block:PermalinkPage}
  231.  
  232. {block:ifHueWash}
  233. .posts img, .video { filter: url(#hue-wash); }
  234. {/block:ifHueWash}
  235.  
  236. {block:ifTagsOnHover}
  237. .tags { opacity:0; }
  238. .posts:hover .tags {
  239. opacity:1;
  240. transition: all 0.5s ease-in-out;
  241. -webkit-transition: all 0.5s ease-in-out;
  242. -moz-transition: all 0.5s ease-in-out;
  243. -o-transition: all 0.5s ease-in-out;
  244. }
  245. {/block:ifTagsOnHover}
  246.  
  247. {block:ifSmallCursor}
  248. * { cursor:url(https://i.imgur.com/dHusUiR.png),auto }
  249. body { cursor:url(https://i.imgur.com/dHusUiR.png),auto }
  250. iframe.tmblr-iframe:hover, a, a:hover, .updates, .updatesicon, ul.linksmenu .linksbutton, .ph img { cursor:url(https://i.imgur.com/ZM41vky.png),progress!important; }
  251. [photoset-layout] div { cursor:url(https://i.imgur.com/ZM41vky.png),progress!important; }
  252. {/block:ifSmallCursor}
  253.  
  254. /* a note from saestrah:
  255.  
  256. to add or reduce the size of the gap between images or gifs in photosets, add the following to the css and change the pixel value to your liking:
  257.  
  258. [photoset-layout] { grid-gap:3px; }
  259.  
  260. */
  261.  
  262. </style>
  263. </head>
  264. <body>
  265.  
  266. <!-------------------------------- hue filter
  267.  
  268. a note from saestrah:
  269.  
  270. this is where you can change the colour of the image filters. if you have a colour in mind, convert the hexcode to rgba (i use "http://www.hex2rgba.devoth.com/", and visit "http://andresgalante.com/RGBAtoFeColorMatrix/" to get the matrix values. for example:
  271.  
  272. hex colour: #F16
  273. rgba value: rgba(255, 17, 102, 1)
  274. matrix: 1 0 0 0 0
  275. 0 0.07 0 0 0
  276. 0 0 0.4 0 0
  277. 0 0 0 1 0
  278.  
  279. ---->
  280.  
  281. {block:ifHueWash}
  282. <svg>
  283. <filter id="hue-wash">
  284.  
  285. <feColorMatrix type="matrix" values="1 0 0 0 0
  286. 0 0.07 0 0 0
  287. 0 0 0.4 0 0
  288. 0 0 0 1 0 "/>
  289. </filter>
  290. </svg>
  291. {/block:ifHueWash}
  292.  
  293. <!-------------------------------- header ---->
  294.  
  295. <maintitle>
  296. <a href="/" class="maintitle" {block:ifTitleTooltip}title="{text:Title Tooltip}"{/block:ifTitleTooltip}>{Title}</a>
  297. </maintitle>
  298.  
  299. <header>
  300.  
  301. <!---- mobile navigation ---->
  302.  
  303. <mobilenav>
  304. <ul id="linksmenu" class="linksmenu">
  305. <li><div class="linksbutton"><span class="las la-bars"></span></div>
  306. <ul class="mobilelinksbox">
  307. <li class="mobilelinks">
  308. <li><span><a href="https://tumblr.com/follow/{Name}">follow</a></span></li>
  309. <li><span><a href="/">home</a></span></li>
  310. <li><span><a href="/ask">ask</a></span></li>
  311. <li><span><a href="/archive">archive</a></span></li>
  312. {block:ifLink1}<li><span><a href="{text:Link 1 URL}">{text:Link 1}</a></span></li>{/block:ifLink1}
  313. {block:ifLink2}<li><span><a href="{text:Link 2 URL}">{text:Link 2}</a></span></li>{/block:ifLink2}
  314. {block:ifLink3}<li><span><a href="{text:Link 3 URL}">{text:Link 3}</a></span></li>{/block:ifLink3}
  315. {block:ifLink4}<li><span><a href="{text:Link 4 URL}">{text:Link 4}</a></span></li>{/block:ifLink4}
  316. {block:ifLink5}<li><span><a href="{text:Link 5 URL}">{text:Link 5}</a></span></li>{/block:ifLink5}
  317. </li>
  318. </ul>
  319. </li>
  320. </ul>
  321. </mobilenav>
  322.  
  323. <!---- search bar ---->
  324.  
  325. {block:ifSearch}
  326. <div class="search">
  327. <a class="searchbtn"><span class="las la-search"></span></a>
  328. <div class="search-wrapper"></span><form class="search" action="javascript:return false"><input type="text" class="query" placeholder="{text:Search Placeholder}"></form></div>
  329. </div>
  330. {/block:ifSearch}
  331.  
  332. </header>
  333.  
  334. <!---- description ---->
  335.  
  336. <div class="description">{Description}</div>
  337.  
  338. <!---- link icons
  339.  
  340. a note from saestrah:
  341.  
  342. to change the icons, visit https://icons8.com/line-awesome and change "las-la-[something]" to the code for the image you like. not all icons use the same format (e.g. the spotify icon is "lab-la-spotify"). to delete icon links, just delete the line of code you don't want from the html below
  343.  
  344. ---->
  345.  
  346. {block:ifHomeTitle}<a id="linkicons" class="homebtn" href="/" title="home"><span class="las la-home"></span>{text:Home Title}</a>{/block:ifHomeTitle}
  347. {block:ifAskTitle}<a id="linkicons" class="askbtn" href="/ask" title="ask"><span class="las la-envelope"></span>{text:Ask Title}</a>{/block:ifAskTitle}
  348. {block:ifArchiveTitle}<a id="linkicons" class="archivebtn" href="/archive" title="archive"><span class="las la-archive"></span>{text:Archive Title}</a>{/block:ifArchiveTitle}
  349. {block:ifShuffleTitle}<a id="linkicons" class="shufflebtn" href="/random" title="shuffle"><span class="las la-random"></span>{text:Shuffle Title}</a>{/block:ifShuffleTitle}
  350. {block:ifLink1}<a id="linkicons" class="link1btn" href="{text:Link 1 URL}" {block:ifLink1Tooltip}title="{text:Link 1 Tooltip}"{/block:ifLink1Tooltip}><span class="las la-eye"></span>{text:Link 1}</a>{/block:ifLink1}
  351. {block:ifLink2}<a id="linkicons" class="link2btn" href="{text:Link 2 URL}" {block:ifLink2Tooltip}title="{text:Link 2 Tooltip}"{/block:ifLink2Tooltip}><span class="las la-spider"></span>{text:Link 2}</a>{/block:ifLink2}
  352. {block:ifLink3}<a id="linkicons" class="link3btn" href="{text:Link 3 URL}" {block:ifLink3Tooltip}title="{text:Link 3 Tooltip}"{/block:ifLink3Tooltip}><span class="las la-fire-alt"></span>{text:Link 3}</a>{/block:ifLink3}
  353. {block:ifLink4}<a id="linkicons" class="link4btn" href="{text:Link 4 URL}" {block:ifLink4Tooltip}title="{text:Link 4 Tooltip}"{/block:ifLink4Tooltip}><span class="las la-cloud"></span>{text:Link 4}</a>{/block:ifLink4}
  354. {block:ifLink5}<a id="linkicons" class="link5btn" href="{text:Link 5 URL}" {block:ifLink5Tooltip}title="{text:Link 5 Tooltip}"{/block:ifLink5Tooltip}><span class="las la-skull-crossbones"></span>{text:Link 5}</a>{/block:ifLink5}
  355.  
  356. <!---- updates ---->
  357.  
  358. {block:ifUpdates}
  359. <div class="updates">
  360. <div class="updatesicon"><span class="las la-plus"></span></div>
  361. <div class="updatecontent">
  362. <span class="updatetitle">{text:Update 1 Title} </span>{text:Update 1 Content}</p>
  363. <span class="updatetitle">{text:Update 2 Title} </span>{text:Update 2 Content}</p>
  364. <span class="updatetitle">{text:Update 3 Title} </span>{text:Update 3 Content}
  365. </div></div>
  366. {/block:ifUpdates}
  367.  
  368. <!-------------------------------- posts ---->
  369.  
  370. <section id="entries">
  371. {block:Posts}
  372.  
  373. <!---- post info ---->
  374.  
  375. {block:Date}
  376. <postinfo>
  377.  
  378. <div class="when">
  379. <a href="{Permalink}"><span>{DayOfMonthWithZero}</br> — </br>
  380. {MonthNumberWithZero}</a> <!---- a note from saestrah: to put the month number before the day of month, just swap these variables ---->
  381. </div>
  382.  
  383. <div class="randl"><a class="reblog" href="{ReblogURL}" target="_blank">reblog</a><a class="like-b" href="#">{LikeButton}<span class="b">like</span></a></div>
  384.  
  385. </postinfo>
  386. {/block:Date}
  387.  
  388. <article class="posts {block:Caption}captioned{/block:Caption}" post-type="{PostType}">
  389.  
  390. <!---- textposts ---->
  391.  
  392. {block:Text}
  393. <div class="post text" id="{PostID}">
  394. {block:Title}<div class="title">{title}</div>{/block:Title}
  395. {block:RebloggedFrom}
  396. {block:Reblogs}
  397. {block:IsActive}
  398. <li class="comment">
  399. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Username}</a>
  400. <div class="tex">{Body}</div>
  401. </li>
  402. {/block:IsActive}
  403. {block:IsDeactivated}
  404. <li class="comment">
  405. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user deactivated" target="_blank">{Username}</a>
  406. <div class="tex">{Body}</div>
  407. </li>
  408. {/block:IsDeactivated}
  409. {/block:Reblogs}
  410. {/block:RebloggedFrom}
  411. {block:NotReblog}
  412. <li class="comment">
  413. <div class="tex">{Body}</div>
  414. </li>
  415. {/block:NotReblog}
  416. </div>
  417. {/block:Text}
  418.  
  419. <!---- quotes ---->
  420.  
  421. {block:Quote}
  422. <div class="post" id="{PostID}">
  423. <div class="quote">{Quote}</div>
  424. {block:Source}<div class="source">{Source}</div>{/block:Source}
  425. </div>
  426. {/block:Quote}
  427.  
  428. <!---- links ---->
  429.  
  430. {block:Link}
  431. <div class="post" id="{PostID}">
  432. <div class="title"><a href="{URL}">{Name}</a></div>
  433. {block:Description}
  434. {block:NotReblog}
  435. <li class="comment">
  436. <div class="tex">{Description}</div>
  437. </li>
  438. {/block:NotReblog}
  439. {/block:Description}
  440. {block:RebloggedFrom}
  441. {block:Reblogs}
  442. {block:IsActive}
  443. <li class="comment">
  444. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Username}</a>
  445. <div class="tex">{Body}</div>
  446. </li>
  447. {/block:IsActive}
  448. {block:IsDeactivated}
  449. <li class="comment">
  450. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user deactivated" target="_blank">{Username}</a>
  451. <div class="tex">{Body}</div>
  452. </li>
  453. {/block:IsDeactivated}
  454. {/block:Reblogs}
  455. {/block:RebloggedFrom}
  456. </div>
  457. {/block:Link}
  458.  
  459. <!---- asks ---->
  460.  
  461. {block:Answer}
  462. <div class="post" id="{PostID}">
  463. <div class="question"><span class="asker">{Asker} sent: </span><p>{Question}</div>
  464.  
  465. {block:NotReblog}
  466. <div class="answer">{Answer}</div>
  467. {/block:NotReblog}
  468.  
  469. {block:RebloggedFrom}
  470. {block:Answerer}
  471. <div class="answer">
  472. <span class="answerer">{Answerer} replied:</span><span class="tex">{Answer}</span>
  473. </div>
  474. {/block:Answerer}
  475. {block:Reblogs}
  476. {block:IsActive}
  477. <li class="comment">
  478. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Username}</a>
  479. <div class="tex">{Body}</div>
  480. </li>
  481. {/block:IsActive}
  482. {block:IsDeactivated}
  483. <li class="comment">
  484. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user deactivated" target="_blank">{Username}</a>
  485. <div class="tex">{Body}</div>
  486. </li>
  487. {/block:IsDeactivated}
  488. {/block:Reblogs}
  489. {/block:RebloggedFrom}
  490. </div>
  491. {/block:Answer}
  492.  
  493. <!---- chat ---->
  494.  
  495. {block:Chat}
  496. <div class="post" id="{PostID}">
  497. {block:Title}<div id="title">{Title}</div>{/block:Title}
  498. <ol class="chat">
  499. {block:Lines}
  500. <li class="l {Alt}">
  501. {block:Label}<span class="label">{Label}</span>{/block:Label} {Line}
  502. </li>
  503. {/block:Lines}
  504. </ol>
  505. </div>
  506. {/block:Chat}
  507.  
  508. <!---- photos and photosets ---->
  509.  
  510. <div class="post" id="{PostID}"><div class="ph">
  511.  
  512. {block:Photo}{linkopentag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}{/block:Photo}
  513.  
  514. {block:Photoset}
  515. <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 class="ph" src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div></div>
  516. {/block:Photoset}
  517.  
  518. <!---- video ---->
  519.  
  520. {block:Video}<div class="post video" id="{PostID}">{VideoEmbed-500}</div>{/block:Video}
  521.  
  522. <!---- audio ---->
  523.  
  524. {block:Audio}
  525. <div class="post" id="{PostID}">
  526. {block:AudioPlayer}
  527. <div class="hold">
  528. <div class="player"><div class="play">{AudioPlayerBlack}</div></div>
  529. <div class="audio_info">
  530. {block:TrackName}<span class="track">{TrackName}</span>{/block:TrackName}
  531. {block:Artist}<span class="artist">{Artist}</span>{/block:Artist}
  532. </div>
  533. </div>
  534. {/block:AudioPlayer}
  535. </div>
  536. {/block:Audio}
  537.  
  538. <!---- captions and reblogs ---->
  539.  
  540. {block:Caption}
  541. {block:Reblogs}
  542. {block:IsActive}
  543. <li class="comment">
  544. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Username}</a>
  545. <div class="tex">{Body}</div>
  546. </li>
  547. {/block:IsActive}
  548. {block:IsDeactivated}
  549. <li class="comment">
  550. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user deactivated" target="_blank">{Username}</a>
  551. <div class="tex">{Body}</div>
  552. </li>
  553. {/block:IsDeactivated}
  554. {/block:Reblogs}
  555. {block:NotReblog}
  556. <li class="comment">
  557. <a {block:HasPermalink}href="{Permalink}"{/block:HasPermalink} class="user" target="_blank">{Name}</a>
  558. <div class="tex">{Caption}</div>
  559. </li>
  560. {/block:NotReblog}
  561. {/block:Caption}
  562.  
  563. <!---- tags ---->
  564.  
  565. {block:HasTags}<div class="tags">{block:Tags}<a class="tag" href="{TagURL}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  566.  
  567. <!---- permalinks ---->
  568.  
  569. </article>
  570. {block:PostNotes}
  571. {block:RebloggedFrom}
  572.  
  573. <div class="permainfo">
  574. {block:NoteCount}<span class="nc"><a class="notecount" href="{Permalink}">{NoteCountWithLabel}</a></span>{/block:NoteCount}<span class="via">via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:ContentSource} &nbsp&mdash;&nbsp source: <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:ContentSource}</span>
  575. </div>
  576.  
  577. {/block:RebloggedFrom}
  578. <div class="postnotes">{PostNotes}</div>
  579. </article>
  580.  
  581. {/block:PostNotes}
  582. {/block:Posts}
  583.  
  584. <!---- pagination ---->
  585.  
  586. <footer>
  587. {block:PreviousPage}
  588. <span><a class="prev" href="{PreviousPage}" title="previous page"><span class="las la-arrow-left"></span></a></span>
  589. {/block:PreviousPage}
  590. {block:NextPage}
  591. <span><a class="next" href="{NextPage}" title="next page"><span class="las la-arrow-right"></span></a></span>
  592. {/block:NextPage}
  593. </footer>
  594.  
  595. </section>
  596.  
  597. <!---- buttons ---->
  598.  
  599. <a class="cc"><span class="las la-bars"></span></a>
  600. <a class="nightbtn" title="night mode"><span class="las la-moon"></span></a>
  601. <a class="daybtn" title="day mode" hidden="hidden"><span class="las la-sun"></span></a>
  602. <a class="bfontbtn" title="change font size">Aa</a>
  603. <a class="sfontbtn" title="change font size" hidden="hidden">Aa</a>
  604. <a class="top" href="/" title="back to top"><span class="las la-arrow-up"></span></a>
  605. <a class="credit" href="https://saestrah.tumblr.com" title="saestrah themes" target="_blank"><span class="las la-hat-cowboy"></span></a>
  606.  
  607. <!-------------------------------- scripts ---->
  608.  
  609. <!---- search bar by @shythemes ---->
  610.  
  611. <script>
  612. $(document).ready(function(){
  613. $('.search').submit(function(event){
  614. var value = $('input:first').val();
  615. location.replace('https://{Name}.tumblr.com/tagged/' + value);
  616. });
  617. });
  618. </script>
  619.  
  620. <!---- scroll to top by paul underwood ---->
  621.  
  622. <script>
  623. $(document).ready(function(){
  624. $(window).scroll(function(){
  625. if ($(this).scrollTop() > 100) {
  626. $('.top').fadeIn();
  627. } else {
  628. $('.top').fadeOut();
  629. }
  630. });
  631.  
  632. $('.top').click(function(){
  633. $('html, body').animate({scrollTop : 0},800);
  634. return false;
  635. });
  636.  
  637. });
  638. </script>
  639.  
  640. <!---- audio player by @shythemes ---->
  641.  
  642. <script>
  643. $(document).ready(function(){
  644. $('iframe.tumblr_audio_player').load( function() {
  645. $('iframe.tumblr_audio_player').contents().find("head").append($("<style type='text/css'> .audio-player{background:transparent;!important}</style>"));
  646. });
  647. });
  648. </script>
  649.  
  650. <!---- photosets by @annasthms and @eggdesign ---->
  651.  
  652. <script>
  653. function gatherData(images, arr) {
  654. for (let i = 0; i < images.length; i++) {
  655. let currentData = {
  656. "width": images[i].getAttribute('data-width'),
  657. "height": images[i].getAttribute('data-height'),
  658. "low_res": images[i].getAttribute('data-lowres'),
  659. "high_res": images[i].getAttribute('data-highres')
  660. };
  661. arr.push(currentData);
  662. }
  663. }
  664. function getIndex(elem) {
  665. let i = 0;
  666. while( (elem = elem.previousElementSibling) != null ) i++;
  667. return i;
  668. }
  669. function lightbox(elem) {
  670. let currentPhotoset = elem.parentNode;
  671. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  672. let data = [];
  673. gatherData(photosetPhotos, data);
  674. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  675. }
  676. $(document).ready(function(){
  677. undoPhotoset({
  678. 'posts':'.text',
  679. 'text class':'',
  680. 'photoset class':'ph'
  681. },false);
  682. });
  683. </script>
  684.  
  685. <!---- npf images readjustment by @glenthemes ---->
  686.  
  687. <link href="//dl.dropbox.com/s/bnoj86mka0bkplb/npf-override.css" rel="stylesheet">
  688. <script src="//dl.dropbox.com/s/vwrm94pcg4c9e71/npf-evenize.js"></script>
  689. <script src="//dl.dropbox.com/s/aqo7pinjzfub4tn/npf-legacy.js"></script>
  690.  
  691. <style type="text/css">
  692. :root {
  693. --NPF-Image-Spacing:4px;
  694. --NPF-Bottom-Gap-From-Captions:0;
  695. }
  696. </style>
  697.  
  698. <!---- flexible frames by @nouvae ---->
  699.  
  700. <script>
  701. $(document).ready(function(){
  702. function flexFrame() {
  703. $("entries").each(function() {
  704. $(this).find("iframe").wrap("<div class='iframe-flex'></div>");
  705. flexibleFrames($(".iframe-flex"));
  706. });
  707. flexibleFrames($(".video"));}
  708. $(document).ready(flexFrame);
  709. });
  710. </script>
  711.  
  712. <!---- notecount shortener by @shythemes ---->
  713.  
  714. <script>
  715. var $container = $('.nc');
  716. $container.find('.notecount').each(function(){
  717. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  718. if (n > 999) {
  719. n = Math.floor(n / 100) / 10;
  720. $(this).text(n + 'k notes');
  721. }
  722. });
  723. </script>
  724.  
  725. <!---- tooltips by malihu ---->
  726.  
  727. <script type="text/javascript">
  728. (function($){
  729. $(document).ready(function(){
  730. $("[title]").style_my_tooltips({
  731. tip_follows_cursor:true,
  732. tip_delay_time:200,
  733. tip_fade_speed:300
  734. });
  735. });
  736. })(jQuery);
  737. </script>
  738.  
  739. <!-------------------------------- end of scripts ---->
  740.  
  741. </body>
  742. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!