Advertisement
sexycullen

theme 222

Sep 12th, 2021 (edited)
3,825
1
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 113.67 KB | None | 1 0
  1. <!--
  2.  
  3. maziekeen's theme #222
  4. https://maziekeen.tumblr.com/
  5.  
  6.  
  7. PLEASE DO NOT:
  8. remove the credits; claim as your own; use as a base, take parts
  9. of the theme, repost as your own
  10. YOU CAN:
  11. edit as much as you want for your own personal use only.
  12.  
  13.  
  14. CREDITS,
  15.  
  16. captions and audio style by seyche
  17. css photosets by annasthms
  18. tumblr controls by cyantists
  19. smooth scroll by michael herf and balazs galambosi
  20. saturn, honeybee, cappuccicons icons by suiomi.com
  21. feathericons by github.com/feathericons/feather
  22. normalize reest html by necolas.github.io
  23. tippyjs tooltips by silbrigthemes
  24. short notecount, like and reblog, video resize by shythemes
  25. npf images readjustment v.02 by glenthemes
  26. dark mode by twan mulder at blog.prototypr.io/8b461864644b
  27. & ananya neogi at dev.to/ananyaneogi/create-a-dark-light-mode-switch-with-css-variables-34l8
  28.  
  29. -->
  30.  
  31. <!doctype html>
  32. <html>
  33.  
  34. <head>
  35. <meta charset="utf-8">
  36. <title>{block:TagPage}{Tag} | {/block:TagPage} {block:SearchPage}{lang:Search results for SearchQuery} | {/block:SearchPage}{block:PostSummary}{PostSummary} | {/block:PostSummary}{Title}</title>
  37. {block:Description}
  38. <meta name="description" content="{MetaDescription}" />
  39. {/block:Description}
  40.  
  41. {block:Hidden}
  42. <!-- image options -->
  43.  
  44. <meta name="image:Sidebar Image" content="" />
  45. <meta name="image:Background Image" content="" />
  46.  
  47. <!-- light color options -->
  48. <meta name="color:Background Theme Color" content="#ffffff" />
  49. <meta name="color:Body Text Color" content="#262626" />
  50. <meta name="color:Body Link Color" content="#000000" />
  51. <meta name="color:Body Link Hover Color" content="#262626" />
  52. <meta name="color:Bold Color" content="#262626">
  53. <meta name="color:Italic Color" content="#525252">
  54. <meta name="color:Sidebar Title Color" content="#1a1a1a">
  55. <meta name="color:Sidebar Text Color" content="#262626">
  56. <meta name="color:Sidebar Links Color" content="#757575">
  57. <meta name="color:Sidebar Background Color" content="#ffffff">
  58. <meta name="color:Hover Text Background Color" content="#1a1a1a" />
  59. <meta name="color:Hover Text Color" content="#ffffff" />
  60. <meta name="color:Date Link Color" content="#262626">
  61. <meta name="color:Tags Link Color" content="#757575">
  62. <meta name="color:Liked Link Color" content="#757575">
  63. <meta name="color:Posts Background Color" content="#ffffff" />
  64. <meta name="color:Background Ask Color" content="#fbfbfb" />
  65. <meta name="color:Ask Text Color" content="#262626" />
  66. <meta name="color:Ask Link Color" content="#000000" />
  67. <meta name="color:Borders Color" content="#f6f6f6" />
  68. <meta name="color:Scrollbar Color" content="#1a1a1a" />
  69. <meta name="color:Tumblr Controls Icon Color" content="#1a1a1a" />
  70.  
  71.  
  72. <!-- dark color options -->
  73. <meta name="color:Dark Background Theme Color" content="#151515" />
  74. <meta name="color:Dark Body Text Color" content="#c3c3c3" />
  75. <meta name="color:Dark Body Link Color" content="#ffffff" />
  76. <meta name="color:Dark Body Link Hover Color" content="#f6cf6a" />
  77. <meta name="color:Dark Bold Color" content="#eeeeee">
  78. <meta name="color:Dark Italic Color" content="#acacac">
  79. <meta name="color:Dark Sidebar Title Color" content="#ffffff">
  80. <meta name="color:Dark Sidebar Text Color" content="#e2e2e2">
  81. <meta name="color:Dark Sidebar Links Color" content="#fbfbfb">
  82. <meta name="color:Dark Sidebar Background Color" content="#171717">
  83. <meta name="color:Dark Hover Text Background Color" content="#ffffff" />
  84. <meta name="color:Dark Hover Text Color" content="#171717" />
  85. <meta name="color:Dark Date Link Color" content="#ffffff">
  86. <meta name="color:Dark Tags Link Color" content="#ffffff">
  87. <meta name="color:Dark Liked Link Color" content="#f6cf6a">
  88. <meta name="color:Dark Posts Background Color" content="#171717" />
  89. <meta name="color:Dark Background Ask Color" content="#151515" />
  90. <meta name="color:Dark Ask Text Color" content="#e2e2e2" />
  91. <meta name="color:Dark Ask Link Color" content="#ffffff" />
  92. <meta name="color:Dark Borders Color" content="#202020" />
  93. <meta name="color:Dark Scrollbar Color" content="#f6cf6a" />
  94. <meta name="color:Dark Tumblr Controls Icon Color" content="#f6cf6a" />
  95.  
  96. <!-- text, font style and sizes options -->
  97. <meta name="text:Body Font Family" content="Karla" />
  98.  
  99. <meta name="select:Body Font Size" content="1.2rem" title="12px" />
  100. <meta name="select:Body Font Size" content="0.8rem" title="8px" />
  101. <meta name="select:Body Font Size" content="0.9rem" title="9px" />
  102. <meta name="select:Body Font Size" content="1rem" title="10px" />
  103. <meta name="select:Body Font Size" content="1.1rem" title="11px" />
  104. <meta name="select:Body Font Size" content="1.3rem" title="13px" />
  105. <meta name="select:Body Font Size" content="1.4rem" title="14px" />
  106. <meta name="select:Body Font Size" content="1.5rem" title="15px" />
  107. <meta name="select:Body Font Size" content="1.6rem" title="16px" />
  108. <meta name="select:Body Font Size" content="1.7rem" title="17px" />
  109. <meta name="select:Body Font Size" content="1.8rem" title="18px" />
  110.  
  111. <meta name="select:Body Font Letter Spacing" content="normal" title="none" />
  112. <meta name="select:Body Font Letter Spacing" content="0.015rem" title="0.15px" />
  113. <meta name="select:Body Font Letter Spacing" content="0.025rem" title="0.25px" />
  114. <meta name="select:Body Font Letter Spacing" content="0.075rem" title="0.75px" />
  115. <meta name="select:Body Font Letter Spacing" content="0.08rem" title="0.80px" />
  116. <meta name="select:Body Font Letter Spacing" content="0.085rem" title="0.85px" />
  117. <meta name="select:Body Font Letter Spacing" content="0.09rem" title="0.90px" />
  118. <meta name="select:Body Font Letter Spacing" content="0.095rem" title="0.95px" />
  119. <meta name="select:Body Font Letter Spacing" content="0.1rem" title="1px" />
  120. <meta name="select:Body Font Letter Spacing" content="0.2rem" title="2px" />
  121. <meta name="select:Body Font Letter Spacing" content="0.3rem" title="3px" />
  122.  
  123. <meta name="select:Body Font Word Spacing" content="normal" title="none" />
  124. <meta name="select:Body Font Word Spacing" content="0.015rem" title="0.15px" />
  125. <meta name="select:Body Font Word Spacing" content="0.025rem" title="0.25px" />
  126. <meta name="select:Body Font Word Spacing" content="0.075rem" title="0.75px" />
  127. <meta name="select:Body Font Word Spacing" content="0.08rem" title="0.80px" />
  128. <meta name="select:Body Font Word Spacing" content="0.085rem" title="0.85px" />
  129. <meta name="select:Body Font Word Spacing" content="0.09rem" title="0.90px" />
  130. <meta name="select:Body Font Word Spacing" content="0.095rem" title="0.95px" />
  131. <meta name="select:Body Font Word Spacing" content="0.1rem" title="1px" />
  132. <meta name="select:Body Font Word Spacing" content="0.2rem" title="2px" />
  133. <meta name="select:Body Font Word Spacing" content="0.3rem" title="3px" />
  134.  
  135. <meta name="select:Body Font Weight" content="400" title="normal" />
  136. <meta name="select:Body Font Weight" content="700" title="bold" />
  137. <meta name="select:Body Font Weight" content="300" title="light" />
  138. <meta name="select:Body Font Weight" content="500" title="medium" />
  139. <meta name="select:Body Font Weight" content="600" title="semi-bold" />
  140.  
  141. <meta name="select:Bold Font Weight" content="700" title="bold" />
  142. <meta name="select:Bold Font Weight" content="300" title="light" />
  143. <meta name="select:Bold Font Weight" content="400" title="normal" />
  144. <meta name="select:Bold Font Weight" content="500" title="medium" />
  145. <meta name="select:Bold Font Weight" content="600" title="semi-bold" />
  146.  
  147. <meta name="select:Posts Text Position" content="left">
  148. <meta name="select:Posts Text Position" content="justify">
  149.  
  150. <!-- posts titles (h1, h2, h3...) -->
  151. <meta name="select:Posts Titles Font Size" content="1.5rem" title="15px" />
  152. <meta name="select:Posts Titles Font Size" content="1rem" title="10px" />
  153. <meta name="select:Posts Titles Font Size" content="1.1rem" title="11px" />
  154. <meta name="select:Posts Titles Font Size" content="1.2rem" title="12px" />
  155. <meta name="select:Posts Titles Font Size" content="1.3rem" title="13px" />
  156. <meta name="select:Posts Titles Font Size" content="1.4rem" title="14px" />
  157. <meta name="select:Posts Titles Font Size" content="1.6rem" title="16px" />
  158. <meta name="select:Posts Titles Font Size" content="1.7rem" title="17px" />
  159. <meta name="select:Posts Titles Font Size" content="1.8rem" title="18px" />
  160.  
  161. <meta name="select:Posts Titles Font Letter Spacing" content="normal" title="none" />
  162. <meta name="select:Posts Titles Font Letter Spacing" content="0.015rem" title="0.15px" />
  163. <meta name="select:Posts Titles Font Letter Spacing" content="0.025rem" title="0.25px" />
  164. <meta name="select:Posts Titles Font Letter Spacing" content="0.075rem" title="0.75px" />
  165. <meta name="select:Posts Titles Font Letter Spacing" content="0.08rem" title="0.80px" />
  166. <meta name="select:Posts Titles Font Letter Spacing" content="0.085rem" title="0.85px" />
  167. <meta name="select:Posts Titles Font Letter Spacing" content="0.09rem" title="0.90px" />
  168. <meta name="select:Posts Titles Font Letter Spacing" content="0.095rem" title="0.95px" />
  169. <meta name="select:Posts Titles Font Letter Spacing" content="0.1rem" title="1px" />
  170. <meta name="select:Posts Titles Font Letter Spacing" content="0.2rem" title="2px" />
  171. <meta name="select:Posts Titles Font Letter Spacing" content="0.3rem" title="3px" />
  172.  
  173. <meta name="select:Posts Titles Font Word Spacing" content="normal" title="none" />
  174. <meta name="select:Posts Titles Font Word Spacing" content="0.015rem" title="0.15px" />
  175. <meta name="select:Posts Titles Font Word Spacing" content="0.025rem" title="0.25px" />
  176. <meta name="select:Posts Titles Font Word Spacing" content="0.075rem" title="0.75px" />
  177. <meta name="select:Posts Titles Font Word Spacing" content="0.08rem" title="0.80px" />
  178. <meta name="select:Posts Titles Font Word Spacing" content="0.085rem" title="0.85px" />
  179. <meta name="select:Posts Titles Font Word Spacing" content="0.09rem" title="0.90px" />
  180. <meta name="select:Posts Titles Font Word Spacing" content="0.095rem" title="0.95px" />
  181. <meta name="select:Posts Titles Font Word Spacing" content="0.1rem" title="1px" />
  182. <meta name="select:Posts Titles Font Word Spacing" content="0.2rem" title="2px" />
  183. <meta name="select:Posts Titles Font Word Spacing" content="0.3rem" title="3px" />
  184.  
  185. <meta name="select:Posts Titles Font Weight" content="700" title="bold" />
  186. <meta name="select:Posts Titles Font Weight" content="300" title="light" />
  187. <meta name="select:Posts Titles Font Weight" content="400" title="normal" />
  188. <meta name="select:Posts Titles Font Weight" content="500" title="medium" />
  189. <meta name="select:Posts Titles Font Weight" content="600" title="semi-bold" />
  190.  
  191. <meta name="select:Posts Titles Font Style" content="normal">
  192. <meta name="select:Posts Titles Font Style" content="italic">
  193.  
  194. <meta name="select:Posts Titles Text Transform" content="none">
  195. <meta name="select:Posts Titles Text Transform" content="uppercase">
  196. <meta name="select:Posts Titles Text Transform" content="lowercase">
  197. <meta name="select:Posts Titles Text Transform" content="capitalize">
  198.  
  199. <meta name="select:Posts Titles Text Position" content="left">
  200. <meta name="select:Posts Titles Text Position" content="center">
  201. <meta name="select:Posts Titles Text Position" content="justify">
  202. <meta name="select:Posts Titles Text Position" content="right">
  203.  
  204.  
  205. <!-- sidebar position -->
  206. <meta name="select:Sidebar Content Position" content="flex-start" title="top">
  207. <meta name="select:Sidebar Content Position" content="center" title="center">
  208.  
  209.  
  210. <!-- sidebar title -->
  211. <meta name="select:Sidebar Title Font Size" content="1.4rem" title="14px" />
  212. <meta name="select:Sidebar Title Font Size" content="0.8rem" title="8px" />
  213. <meta name="select:Sidebar Title Font Size" content="0.9rem" title="9px" />
  214. <meta name="select:Sidebar Title Font Size" content="1rem" title="10px" />
  215. <meta name="select:Sidebar Title Font Size" content="1.1rem" title="11px" />
  216. <meta name="select:Sidebar Title Font Size" content="1.2rem" title="12px" />
  217. <meta name="select:Sidebar Title Font Size" content="1.3rem" title="13px" />
  218. <meta name="select:Sidebar Title Font Size" content="1.5rem" title="15px" />
  219. <meta name="select:Sidebar Title Font Size" content="1.6rem" title="16px" />
  220. <meta name="select:Sidebar Title Font Size" content="1.7rem" title="17px" />
  221. <meta name="select:Sidebar Title Font Size" content="1.8rem" title="18px" />
  222.  
  223. <meta name="select:Sidebar Title Font Letter Spacing" content="normal" title="none" />
  224. <meta name="select:Sidebar Title Font Letter Spacing" content="0.015rem" title="0.15px" />
  225. <meta name="select:Sidebar Title Font Letter Spacing" content="0.025rem" title="0.25px" />
  226. <meta name="select:Sidebar Title Font Letter Spacing" content="0.075rem" title="0.75px" />
  227. <meta name="select:Sidebar Title Font Letter Spacing" content="0.08rem" title="0.80px" />
  228. <meta name="select:Sidebar Title Font Letter Spacing" content="0.085rem" title="0.85px" />
  229. <meta name="select:Sidebar Title Font Letter Spacing" content="0.09rem" title="0.90px" />
  230. <meta name="select:Sidebar Title Font Letter Spacing" content="0.095rem" title="0.95px" />
  231. <meta name="select:Sidebar Title Font Letter Spacing" content="0.1rem" title="1px" />
  232. <meta name="select:Sidebar Title Font Letter Spacing" content="0.2rem" title="2px" />
  233. <meta name="select:Sidebar Title Font Letter Spacing" content="0.3rem" title="3px" />
  234.  
  235. <meta name="select:Sidebar Title Font Word Spacing" content="normal" title="none" />
  236. <meta name="select:Sidebar Title Font Word Spacing" content="0.015rem" title="0.15px" />
  237. <meta name="select:Sidebar Title Font Word Spacing" content="0.025rem" title="0.25px" />
  238. <meta name="select:Sidebar Title Font Word Spacing" content="0.075rem" title="0.75px" />
  239. <meta name="select:Sidebar Title Font Word Spacing" content="0.08rem" title="0.80px" />
  240. <meta name="select:Sidebar Title Font Word Spacing" content="0.085rem" title="0.85px" />
  241. <meta name="select:Sidebar Title Font Word Spacing" content="0.09rem" title="0.90px" />
  242. <meta name="select:Sidebar Title Font Word Spacing" content="0.095rem" title="0.95px" />
  243. <meta name="select:Sidebar Title Font Word Spacing" content="0.1rem" title="1px" />
  244. <meta name="select:Sidebar Title Font Word Spacing" content="0.2rem" title="2px" />
  245. <meta name="select:Sidebar Title Font Word Spacing" content="0.3rem" title="3px" />
  246.  
  247. <meta name="select:Sidebar Title Font Weight" content="700" title="bold" />
  248. <meta name="select:Sidebar Title Font Weight" content="400" title="normal" />
  249. <meta name="select:Sidebar Title Font Weight" content="300" title="light" />
  250. <meta name="select:Sidebar Title Font Weight" content="500" title="medium" />
  251. <meta name="select:Sidebar Title Font Weight" content="600" title="semi-bold" />
  252.  
  253.  
  254. <meta name="select:Sidebar Title Font Style" content="normal">
  255. <meta name="select:Sidebar Title Font Style" content="italic">
  256.  
  257. <meta name="select:Sidebar Title Text Transform" content="none">
  258. <meta name="select:Sidebar Title Text Transform" content="uppercase">
  259. <meta name="select:Sidebar Title Text Transform" content="lowercase">
  260. <meta name="select:Sidebar Title Text Transform" content="capitalize">
  261.  
  262. <meta name="select:Sidebar Title Text Position" content="left" />
  263. <meta name="select:Sidebar Title Text Position" content="center" />
  264. <meta name="select:Sidebar Title Text Position" content="right" />
  265.  
  266.  
  267. <!-- description -->
  268. <meta name="select:Description Font Size" content="1.1rem" title="11px" />
  269. <meta name="select:Description Font Size" content="1rem" title="10px" />
  270. <meta name="select:Description Font Size" content="0.8rem" title="8px" />
  271. <meta name="select:Description Font Size" content="0.9rem" title="9px" />
  272. <meta name="select:Description Font Size" content="1.2rem" title="12px" />
  273. <meta name="select:Description Font Size" content="1.3rem" title="13px" />
  274. <meta name="select:Description Font Size" content="1.4rem" title="14px" />
  275. <meta name="select:Description Font Size" content="1.5rem" title="15px" />
  276. <meta name="select:Description Font Size" content="1.6rem" title="16px" />
  277. <meta name="select:Description Font Size" content="1.7rem" title="17px" />
  278. <meta name="select:Description Font Size" content="1.8rem" title="18px" />
  279.  
  280. <meta name="select:Description Font Letter Spacing" content="normal" title="none" />
  281. <meta name="select:Description Font Letter Spacing" content="0.015rem" title="0.15px" />
  282. <meta name="select:Description Font Letter Spacing" content="0.025rem" title="0.25px" />
  283. <meta name="select:Description Font Letter Spacing" content="0.075rem" title="0.75px" />
  284. <meta name="select:Description Font Letter Spacing" content="0.08rem" title="0.80px" />
  285. <meta name="select:Description Font Letter Spacing" content="0.085rem" title="0.85px" />
  286. <meta name="select:Description Font Letter Spacing" content="0.09rem" title="0.90px" />
  287. <meta name="select:Description Font Letter Spacing" content="0.095rem" title="0.95px" />
  288. <meta name="select:Description Font Letter Spacing" content="0.1rem" title="1px" />
  289. <meta name="select:Description Font Letter Spacing" content="0.2rem" title="2px" />
  290. <meta name="select:Description Font Letter Spacing" content="0.3rem" title="3px" />
  291.  
  292. <meta name="select:Description Font Word Spacing" content="normal" title="none" />
  293. <meta name="select:Description Font Word Spacing" content="0.015rem" title="0.15px" />
  294. <meta name="select:Description Font Word Spacing" content="0.025rem" title="0.25px" />
  295. <meta name="select:Description Font Word Spacing" content="0.075rem" title="0.75px" />
  296. <meta name="select:Description Font Word Spacing" content="0.08rem" title="0.80px" />
  297. <meta name="select:Description Font Word Spacing" content="0.085rem" title="0.85px" />
  298. <meta name="select:Description Font Word Spacing" content="0.09rem" title="0.90px" />
  299. <meta name="select:Description Font Word Spacing" content="0.095rem" title="0.95px" />
  300. <meta name="select:Description Font Word Spacing" content="0.1rem" title="1px" />
  301. <meta name="select:Description Font Word Spacing" content="0.2rem" title="2px" />
  302. <meta name="select:Description Font Word Spacing" content="0.3rem" title="3px" />
  303.  
  304.  
  305. <meta name="select:Description Font Weight" content="400" title="normal" />
  306. <meta name="select:Description Font Weight" content="700" title="bold" />
  307. <meta name="select:Description Font Weight" content="300" title="light" />
  308. <meta name="select:Description Font Weight" content="500" title="medium" />
  309. <meta name="select:Description Font Weight" content="600" title="semi-bold" />
  310.  
  311. <meta name="select:Description Font Style" content="normal" />
  312. <meta name="select:Description Font Style" content="italic" />
  313.  
  314. <meta name="select:Description Text Transform" content="none">
  315. <meta name="select:Description Text Transform" content="uppercase">
  316. <meta name="select:Description Text Transform" content="lowercase">
  317. <meta name="select:Description Text Transform" content="capitalize">
  318.  
  319. <meta name="select:Description Text Position" content="left" />
  320. <meta name="select:Description Text Position" content="center" />
  321. <meta name="select:Description Text Position" content="right" />
  322.  
  323. <!-- sidebar links -->
  324. <meta name="select:Sidebar Links Font Size" content="1.1rem" title="11px" />
  325. <meta name="select:Sidebar Links Font Size" content="1rem" title="10px" />
  326. <meta name="select:Sidebar Links Font Size" content="0.8rem" title="8px" />
  327. <meta name="select:Sidebar Links Font Size" content="0.9rem" title="9px" />
  328. <meta name="select:Sidebar Links Font Size" content="1.2rem" title="12px" />
  329. <meta name="select:Sidebar Links Font Size" content="1.3rem" title="13px" />
  330. <meta name="select:Sidebar Links Font Size" content="1.4rem" title="14px" />
  331. <meta name="select:Sidebar Links Font Size" content="1.5rem" title="15px" />
  332. <meta name="select:Sidebar Links Font Size" content="1.6rem" title="16px" />
  333. <meta name="select:Sidebar Links Font Size" content="1.7rem" title="17px" />
  334. <meta name="select:Sidebar Links Font Size" content="1.8rem" title="18px" />
  335.  
  336. <meta name="select:Sidebar Links Font Letter Spacing" content="normal" title="none" />
  337. <meta name="select:Sidebar Links Font Letter Spacing" content="0.015rem" title="0.15px" />
  338. <meta name="select:Sidebar Links Font Letter Spacing" content="0.025rem" title="0.25px" />
  339. <meta name="select:Sidebar Links Font Letter Spacing" content="0.075rem" title="0.75px" />
  340. <meta name="select:Sidebar Links Font Letter Spacing" content="0.08rem" title="0.80px" />
  341. <meta name="select:Sidebar Links Font Letter Spacing" content="0.085rem" title="0.85px" />
  342. <meta name="select:Sidebar Links Font Letter Spacing" content="0.09rem" title="0.90px" />
  343. <meta name="select:Sidebar Links Font Letter Spacing" content="0.095rem" title="0.95px" />
  344. <meta name="select:Sidebar Links Font Letter Spacing" content="0.1rem" title="1px" />
  345. <meta name="select:Sidebar Links Font Letter Spacing" content="0.2rem" title="2px" />
  346. <meta name="select:Sidebar Links Font Letter Spacing" content="0.3rem" title="3px" />
  347.  
  348. <meta name="select:Sidebar Links Font Word Spacing" content="normal" title="none" />
  349. <meta name="select:Sidebar Links Font Word Spacing" content="0.015rem" title="0.15px" />
  350. <meta name="select:Sidebar Links Font Word Spacing" content="0.025rem" title="0.25px" />
  351. <meta name="select:Sidebar Links Font Word Spacing" content="0.075rem" title="0.75px" />
  352. <meta name="select:Sidebar Links Font Word Spacing" content="0.08rem" title="0.80px" />
  353. <meta name="select:Sidebar Links Font Word Spacing" content="0.085rem" title="0.85px" />
  354. <meta name="select:Sidebar Links Font Word Spacing" content="0.09rem" title="0.90px" />
  355. <meta name="select:Sidebar Links Font Word Spacing" content="0.095rem" title="0.95px" />
  356. <meta name="select:Sidebar Links Font Word Spacing" content="0.1rem" title="1px" />
  357. <meta name="select:Sidebar Links Font Word Spacing" content="0.2rem" title="2px" />
  358. <meta name="select:Sidebar Links Font Word Spacing" content="0.3rem" title="3px" />
  359.  
  360.  
  361. <meta name="select:Sidebar Links Font Weight" content="400" title="normal" />
  362. <meta name="select:Sidebar Links Font Weight" content="700" title="bold" />
  363. <meta name="select:Sidebar Links Font Weight" content="300" title="light" />
  364. <meta name="select:Sidebar Links Font Weight" content="500" title="medium" />
  365. <meta name="select:Sidebar Links Font Weight" content="600" title="semi-bold" />
  366.  
  367. <meta name="select:Sidebar Links Font Style" content="normal" />
  368. <meta name="select:Sidebar Links Font Style" content="italic" />
  369.  
  370. <meta name="select:Sidebar Links Text Transform" content="lowercase" />
  371. <meta name="select:Sidebar Links Text Transform" content="none" />
  372. <meta name="select:Sidebar Links Text Transform" content="uppercase" />
  373. <meta name="select:Sidebar Links Text Transform" content="capitalize" />
  374.  
  375. <meta name="select:Sidebar Links Position" content="left" />
  376. <meta name="select:Sidebar Links Position" content="center" />
  377. <meta name="select:Sidebar Links Position" content="right" />
  378.  
  379. <!-- pagination links -->
  380. <meta name="select:Pagination Links Font Size" content="1.1rem" title="11px" />
  381. <meta name="select:Pagination Links Font Size" content="1rem" title="10px" />
  382. <meta name="select:Pagination Links Font Size" content="0.8rem" title="8px" />
  383. <meta name="select:Pagination Links Font Size" content="0.9rem" title="9px" />
  384. <meta name="select:Pagination Links Font Size" content="1.2rem" title="12px" />
  385. <meta name="select:Pagination Links Font Size" content="1.3rem" title="13px" />
  386. <meta name="select:Pagination Links Font Size" content="1.4rem" title="14px" />
  387. <meta name="select:Pagination Links Font Size" content="1.5rem" title="15px" />
  388. <meta name="select:Pagination Links Font Size" content="1.6rem" title="16px" />
  389. <meta name="select:Pagination Links Font Size" content="1.7rem" title="17px" />
  390. <meta name="select:Pagination Links Font Size" content="1.8rem" title="18px" />
  391.  
  392. <meta name="select:Pagination Font Letter Spacing" content="normal" title="none" />
  393. <meta name="select:Pagination Font Letter Spacing" content="0.015rem" title="0.15px" />
  394. <meta name="select:Pagination Font Letter Spacing" content="0.025rem" title="0.25px" />
  395. <meta name="select:Pagination Font Letter Spacing" content="0.075rem" title="0.75px" />
  396. <meta name="select:Pagination Font Letter Spacing" content="0.08rem" title="0.80px" />
  397. <meta name="select:Pagination Font Letter Spacing" content="0.085rem" title="0.85px" />
  398. <meta name="select:Pagination Font Letter Spacing" content="0.09rem" title="0.90px" />
  399. <meta name="select:Pagination Font Letter Spacing" content="0.095rem" title="0.95px" />
  400. <meta name="select:Pagination Font Letter Spacing" content="0.1rem" title="1px" />
  401. <meta name="select:Pagination Font Letter Spacing" content="0.2rem" title="2px" />
  402. <meta name="select:Pagination Font Letter Spacing" content="0.3rem" title="3px" />
  403.  
  404. <meta name="select:Pagination Font Word Spacing" content="normal" title="none" />
  405. <meta name="select:Pagination Font Word Spacing" content="0.015rem" title="0.15px" />
  406. <meta name="select:Pagination Font Word Spacing" content="0.025rem" title="0.25px" />
  407. <meta name="select:Pagination Font Word Spacing" content="0.075rem" title="0.75px" />
  408. <meta name="select:Pagination Font Word Spacing" content="0.08rem" title="0.80px" />
  409. <meta name="select:Pagination Font Word Spacing" content="0.085rem" title="0.85px" />
  410. <meta name="select:Pagination Font Word Spacing" content="0.09rem" title="0.90px" />
  411. <meta name="select:Pagination Font Word Spacing" content="0.095rem" title="0.95px" />
  412. <meta name="select:Pagination Font Word Spacing" content="0.1rem" title="1px" />
  413. <meta name="select:Pagination Font Word Spacing" content="0.2rem" title="2px" />
  414. <meta name="select:Pagination Font Word Spacing" content="0.3rem" title="3px" />
  415.  
  416.  
  417. <meta name="select:Pagination Links Font Weight" content="400" title="normal" />
  418. <meta name="select:Pagination Links Font Weight" content="700" title="bold" />
  419. <meta name="select:Pagination Links Font Weight" content="300" title="light" />
  420. <meta name="select:Pagination Links Font Weight" content="500" title="medium" />
  421. <meta name="select:Pagination Links Font Weight" content="600" title="semi-bold" />
  422.  
  423. <meta name="select:Pagination Links Font Style" content="normal" />
  424. <meta name="select:Pagination Links Font Style" content="italic" />
  425.  
  426. <meta name="select:Pagination Links Text Transform" content="lowercase" />
  427. <meta name="select:Pagination Links Text Transform" content="none" />
  428. <meta name="select:Pagination Links Text Transform" content="uppercase" />
  429. <meta name="select:Pagination Links Text Transform" content="capitalize" />
  430.  
  431. <!-- date / post info -->
  432. <meta name="select:Date Font Size" content="1.1rem" title="11px" />
  433. <meta name="select:Date Font Size" content="1rem" title="10px" />
  434. <meta name="select:Date Font Size" content="0.8rem" title="8px" />
  435. <meta name="select:Date Font Size" content="0.9rem" title="9px" />
  436. <meta name="select:Date Font Size" content="1.2rem" title="12px" />
  437. <meta name="select:Date Font Size" content="1.3rem" title="13px" />
  438. <meta name="select:Date Font Size" content="1.4rem" title="14px" />
  439. <meta name="select:Date Font Size" content="1.5rem" title="15px" />
  440. <meta name="select:Date Font Size" content="1.6rem" title="16px" />
  441. <meta name="select:Date Font Size" content="1.7rem" title="17px" />
  442. <meta name="select:Date Font Size" content="1.8rem" title="18px" />
  443.  
  444. <meta name="select:Date Font Letter Spacing" content="normal" title="none" />
  445. <meta name="select:Date Font Letter Spacing" content="0.015rem" title="0.15px" />
  446. <meta name="select:Date Font Letter Spacing" content="0.025rem" title="0.25px" />
  447. <meta name="select:Date Font Letter Spacing" content="0.075rem" title="0.75px" />
  448. <meta name="select:Date Font Letter Spacing" content="0.08rem" title="0.80px" />
  449. <meta name="select:Date Font Letter Spacing" content="0.085rem" title="0.85px" />
  450. <meta name="select:Date Font Letter Spacing" content="0.09rem" title="0.90px" />
  451. <meta name="select:Date Font Letter Spacing" content="0.095rem" title="0.95px" />
  452. <meta name="select:Date Font Letter Spacing" content="0.1rem" title="1px" />
  453. <meta name="select:Date Font Letter Spacing" content="0.2rem" title="2px" />
  454. <meta name="select:Date Font Letter Spacing" content="0.3rem" title="3px" />
  455.  
  456. <meta name="select:Date Font Word Spacing" content="normal" title="none" />
  457. <meta name="select:Date Font Word Spacing" content="0.015rem" title="0.15px" />
  458. <meta name="select:Date Font Word Spacing" content="0.025rem" title="0.25px" />
  459. <meta name="select:Date Font Word Spacing" content="0.075rem" title="0.75px" />
  460. <meta name="select:Date Font Word Spacing" content="0.08rem" title="0.80px" />
  461. <meta name="select:Date Font Word Spacing" content="0.085rem" title="0.85px" />
  462. <meta name="select:Date Font Word Spacing" content="0.09rem" title="0.90px" />
  463. <meta name="select:Date Font Word Spacing" content="0.095rem" title="0.95px" />
  464. <meta name="select:Date Font Word Spacing" content="0.1rem" title="1px" />
  465. <meta name="select:Date Font Word Spacing" content="0.2rem" title="2px" />
  466. <meta name="select:Date Font Word Spacing" content="0.3rem" title="3px" />
  467.  
  468. <meta name="select:Date Font Weight" content="700" title="bold" />
  469. <meta name="select:Date Font Weight" content="400" title="normal" />
  470. <meta name="select:Date Font Weight" content="300" title="light" />
  471. <meta name="select:Date Font Weight" content="500" title="medium" />
  472. <meta name="select:Date Font Weight" content="600" title="semi-bold" />
  473.  
  474. <meta name="select:Date Font Style" content="normal" />
  475. <meta name="select:Date Font Style" content="italic" />
  476.  
  477. <meta name="select:Date Text Transform" content="lowercase" />
  478. <meta name="select:Date Text Transform" content="none" />
  479. <meta name="select:Date Text Transform" content="uppercase" />
  480. <meta name="select:Date Text Transform" content="capitalize" />
  481.  
  482.  
  483. <!-- tags / post info -->
  484. <meta name="select:Tags Font Size" content="1.1rem" title="11px" />
  485. <meta name="select:Tags Font Size" content="1rem" title="10px" />
  486. <meta name="select:Tags Font Size" content="0.8rem" title="8px" />
  487. <meta name="select:Tags Font Size" content="0.9rem" title="9px" />
  488. <meta name="select:Tags Font Size" content="1.2rem" title="12px" />
  489. <meta name="select:Tags Font Size" content="1.3rem" title="13px" />
  490. <meta name="select:Tags Font Size" content="1.4rem" title="14px" />
  491. <meta name="select:Tags Font Size" content="1.5rem" title="15px" />
  492. <meta name="select:Tags Font Size" content="1.6rem" title="16px" />
  493. <meta name="select:Tags Font Size" content="1.7rem" title="17px" />
  494. <meta name="select:Tags Font Size" content="1.8rem" title="18px" />
  495.  
  496. <meta name="select:Tags Font Letter Spacing" content="normal" title="none" />
  497. <meta name="select:Tags Font Letter Spacing" content="0.015rem" title="0.15px" />
  498. <meta name="select:Tags Font Letter Spacing" content="0.025rem" title="0.25px" />
  499. <meta name="select:Tags Font Letter Spacing" content="0.075rem" title="0.75px" />
  500. <meta name="select:Tags Font Letter Spacing" content="0.08rem" title="0.80px" />
  501. <meta name="select:Tags Font Letter Spacing" content="0.085rem" title="0.85px" />
  502. <meta name="select:Tags Font Letter Spacing" content="0.09rem" title="0.90px" />
  503. <meta name="select:Tags Font Letter Spacing" content="0.095rem" title="0.95px" />
  504. <meta name="select:Tags Font Letter Spacing" content="0.1rem" title="1px" />
  505. <meta name="select:Tags Font Letter Spacing" content="0.2rem" title="2px" />
  506. <meta name="select:Tags Font Letter Spacing" content="0.3rem" title="3px" />
  507.  
  508. <meta name="select:Tags Font Word Spacing" content="normal" title="none" />
  509. <meta name="select:Tags Font Word Spacing" content="0.015rem" title="0.15px" />
  510. <meta name="select:Tags Font Word Spacing" content="0.025rem" title="0.25px" />
  511. <meta name="select:Tags Font Word Spacing" content="0.075rem" title="0.75px" />
  512. <meta name="select:Tags Font Word Spacing" content="0.08rem" title="0.80px" />
  513. <meta name="select:Tags Font Word Spacing" content="0.085rem" title="0.85px" />
  514. <meta name="select:Tags Font Word Spacing" content="0.09rem" title="0.90px" />
  515. <meta name="select:Tags Font Word Spacing" content="0.095rem" title="0.95px" />
  516. <meta name="select:Tags Font Word Spacing" content="0.1rem" title="1px" />
  517. <meta name="select:Tags Font Word Spacing" content="0.2rem" title="2px" />
  518. <meta name="select:Tags Font Word Spacing" content="0.3rem" title="3px" />
  519.  
  520. <meta name="select:Tags Font Weight" content="400" title="normal" />
  521. <meta name="select:Tags Font Weight" content="300" title="light" />
  522. <meta name="select:Tags Font Weight" content="500" title="medium" />
  523. <meta name="select:Tags Font Weight" content="600" title="semi-bold" />
  524. <meta name="select:Tags Font Weight" content="700" title="bold" />
  525.  
  526. <meta name="select:Tags Font Style" content="normal" />
  527. <meta name="select:Tags Font Style" content="italic" />
  528.  
  529. <meta name="select:Tags Text Transform" content="none" />
  530. <meta name="select:Tags Text Transform" content="uppercase" />
  531. <meta name="select:Tags Text Transform" content="lowercase" />
  532. <meta name="select:Tags Text Transform" content="capitalize" />
  533.  
  534.  
  535.  
  536. <!-- conditionals -->
  537. <meta name="if:Disable Switch Theme Color" content="0" />
  538. <meta name="if:Sidebar Image" content="1"/>
  539. <meta name="if:Sidebar Icon Image" content="0"/>
  540. <meta name="if:Sidebar Title" content="1"/>
  541. <meta name="if:Custom Controls" content="1"/>
  542. <meta name="if:Links Underline Border" content="0" />
  543. <meta name="if:Tumblr Captions" content="1"/>
  544. <meta name="if:Custom Caption Icon" content="1" />
  545. <meta name="if:Username Original Post" content="1"/>
  546. <meta name="if:Box Shadow" content="1" />
  547. <meta name="if:Show Borders" content="1" />
  548. <meta name="if:Images Black and White" content="0" />
  549.  
  550. <meta name="if:Submit Link" content="1" />
  551. <meta name="if:Sidebar Link 1" content="1" />
  552. <meta name="if:Sidebar Link 2" content="1" />
  553. <meta name="if:Sidebar Link 3" content="1" />
  554. <meta name="if:Sidebar Link 4" content="1" />
  555. <meta name="if:Sidebar Link 5" content="1" />
  556. <meta name="if:Sidebar Link 6" content="1" />
  557. <meta name="if:Sidebar Link 7" content="1" />
  558. <meta name="if:Sidebar Link 8" content="1" />
  559.  
  560. <!--posts sizes-->
  561. <meta name="select:Post Size" content="54rem" title="540px" />
  562. <meta name="select:Post Size" content="50rem" title="500px" />
  563. <meta name="select:Post Size" content="40rem" title="400px" />
  564.  
  565. <meta name="select:Post Size Gap" content="0.4rem" title="For 540px" />
  566. <meta name="select:Post Size Gap" content="1rem" title="For 500px" />
  567. <meta name="select:Post Size Gap" content="0.2rem" title="For 400px" />
  568.  
  569. <!--posts box shadow-->
  570. <meta name="text:Box Shadow Size" content="0px 0.4rem 0.8rem" />
  571. <meta name="text:Box Shadow Color" content="0, 0, 0, 0.1" />
  572.  
  573. <!-- sidebar and posts borders -->
  574. <meta name="select:Borders Size" content="0.1rem" title="1px" />
  575. <meta name="select:Borders Size" content="0rem" title="0px" />
  576. <meta name="select:Borders Size" content="0.2rem" title="2px" />
  577. <meta name="select:Borders Size" content="0.3rem" title="3px" />
  578. <meta name="select:Borders Size" content="0.4rem" title="4px" />
  579. <meta name="select:Borders Size" content="0.5rem" title="5px" />
  580.  
  581. <meta name="select:Borders Style" content="solid" />
  582. <meta name="select:Borders Style" content="dotted" />
  583. <meta name="select:Borders Style" content="dashed" />
  584. <meta name="select:Borders Style" content="double" />
  585. <meta name="select:Borders Style" content="ridge" />
  586.  
  587. <!-- sidebar image sizes and position -->
  588. <meta name="select:Sidebar Image Size" content="26.8rem" title="268px" />
  589. <meta name="select:Sidebar Image Size" content="24.5rem" title="245px" />
  590. <meta name="select:Sidebar Image Size" content="20rem" title="200px" />
  591. <meta name="select:Sidebar Image Size" content="16rem" title="160px" />
  592.  
  593. <meta name="select:Sidebar Icon Image Size" content="10rem" title="100px" />
  594. <meta name="select:Sidebar Icon Image Size" content="6rem" title="60px" />
  595. <meta name="select:Sidebar Icon Image Size" content="7rem" title="70px" />
  596. <meta name="select:Sidebar Icon Image Size" content="8rem" title="80px" />
  597. <meta name="select:Sidebar Icon Image Size" content="9rem" title="90px" />
  598. <meta name="select:Sidebar Icon Image Size" content="17rem" title="160px" />
  599.  
  600. <meta name="select:Sidebar Image Position" content="center" />
  601. <meta name="select:Sidebar Image Position" content="left" />
  602. <meta name="select:Sidebar Image Position" content="right" />
  603.  
  604. <!--sidebar link-->
  605. <meta name="text:Home URL" content="/" />
  606. <meta name="text:Home Text" content="Index" />
  607. <meta name="text:Ask URL" content="/ask" />
  608. <meta name="text:Ask Text" content="Ask" />
  609. <meta name="text:Submit URL" content="/submit" />
  610. <meta name="text:Submit Text" content="Submit" />
  611. <meta name="text:Sidebar Link 1 URL" content="/" />
  612. <meta name="text:Sidebar Link 1 Text" content="Link 1" />
  613.  
  614. <meta name="text:Sidebar Link 2 URL" content="/" />
  615. <meta name="text:Sidebar Link 2 Text" content="Link 2" />
  616.  
  617. <meta name="text:Sidebar Link 3 URL" content="/" />
  618. <meta name="text:Sidebar Link 3 Text" content="Link 3" />
  619.  
  620. <meta name="text:Sidebar Link 4 URL" content="/" />
  621. <meta name="text:Sidebar Link 4 Text" content="Link 4" />
  622.  
  623. <meta name="text:Sidebar Link 5 URL" content="/" />
  624. <meta name="text:Sidebar Link 5 Text" content="Link 5" />
  625.  
  626. <meta name="text:Sidebar Link 6 URL" content="/" />
  627. <meta name="text:Sidebar Link 6 Text" content="Link 6" />
  628.  
  629. <meta name="text:Sidebar Link 7 URL" content="/" />
  630. <meta name="text:Sidebar Link 7 Text" content="Link 7" />
  631.  
  632. <meta name="text:Sidebar Link 8 URL" content="/" />
  633. <meta name="text:Sidebar Link 8 Text" content="Link 8" />
  634.  
  635. {/block:Hidden}
  636.  
  637. <meta name="viewport" content="width=device-width, initial-scale=1">
  638. <link rel="shortcut icon" href="{Favicon}" />
  639. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  640. <link rel="apple-touch-icon-precomposed" href="{PortraitURL-128}">
  641.  
  642. <!-- stylesheets -->
  643. <link href="https://static.tumblr.com/0siu224/1Eaqd80d8/normalize.css" rel="stylesheet"> <!-- reset html code -->
  644.  
  645. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet"> <!-- photosets -->
  646.  
  647. <!-- custom icons -->
  648. <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet"> <!-- custom icons -->
  649. <script src="https://unpkg.com/feather-icons"></script> <!-- custom icons -->
  650.  
  651. <!-- custom fonts -->
  652. <link
  653. href="https://fonts.googleapis.com/css2?family={text:Body Font Family}:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap"
  654. rel="stylesheet" />
  655.  
  656.  
  657. <style>
  658. :root {
  659. /* colors */
  660. --backgroundThemeColor: {color:Background Theme Color};
  661. --bodyTextColor: {color:Body Text Color};
  662. --bodyLinkColor: {color:Body Link Color};
  663. --bodyLinkHoverColor: {color:Body Link Hover Color};
  664. --boldColor: {color:Bold Color};
  665. --italicColor: {color:Italic Color};
  666. --sidebarTextColor: {color:Sidebar Text Color};
  667. --sidebarLinksColor: {color:Sidebar Links Color};
  668. --sidebarTitleColor: {color:Sidebar Title Color};
  669. --sidebarBackgroundColor: {color:Sidebar Background Color};
  670. --hoverTextBackgroundColor: {color:Hover Text Background Color};
  671. --hoverTextColor: {color:Hover Text Color};
  672. --dateLinkColor:{color:Date Link Color};
  673. --tagsLinkColor: {color:Tags Link Color};
  674. --likedLinkColor: {color:Liked Link Color};
  675. --scrollbarColor: {color:Scrollbar Color};
  676. --bordersColor: {color:Borders Color};
  677. --postsBackgroundColor: {color:Posts Background Color};
  678. --backgroundAskColor: {color:Background Ask Color};
  679. --askTextColor: {color:Ask Text Color};
  680. --askLinkColor: {color:Ask Link Color};
  681. --tumblrControlsIconColor: {color:Tumblr Controls Icon Color};
  682.  
  683. /* fonts, sizes, styles */
  684. --bodyFontFamily: {text:Body Font Family};
  685.  
  686. /* body */
  687. --bodyFontSize: {select:Body Font Size};
  688. --bodyFontLetterSpacing: {select:Body Font Letter Spacing};
  689. --bodyFontWordSpacing: {select:Body Font Word Spacing};
  690. --bodyFontWeight: {select:Body Font Weight};
  691. --boldFontWeight: {select:Bold Font Weight};
  692.  
  693. --bodyLineHeight: calc(var(--bodyFontSize) * 1.5);
  694. --content="0.015rem"tlesLineHeight: calc(var(--content="0.015rem"tlesFontSize) * 1.2);
  695. --sidebarTitleLineHeight: calc(var(--sidebarTitleFontSize) * 1.2);
  696.  
  697. /*sidebar title*/
  698. --sidebarTitleFontSize: {select:Sidebar Title Font Size};
  699. --sidebarTitleFontLetterSpacing: {select:Sidebar Title Font Letter Spacing};
  700. --sidebarTitleFontWordSpacing: {select:Sidebar Title Font Word Spacing};
  701. --sidebarTitleFontWeight: {select:Sidebar Title Font Weight};
  702. --sidebarTitleTextTransform: {select:Sidebar Title Text Transform};
  703. --sidebarTitleFontStyle: {select:Sidebar Title Font Style};
  704. --sidebarTitleTextPosition: {select:Sidebar Title Text Position};
  705.  
  706. --sidebarTitleLineHeight: calc(var(--sidebarTitleFontSize) * 1.2);
  707.  
  708. /*description*/
  709. --descriptionFontSize: {select:Description Font Size};
  710. --descriptionFontLetterSpacing: {select:Description Font Letter Spacing};
  711. --descriptionFontWordSpacing: {select:Description Font Word Spacing};
  712. --descriptionFontWeight: {select:Description Font Weight};
  713. --descriptionTextTransform: {select:Description Text Transform};
  714. --descriptionFontStyle: {select:Description Font Style};
  715. --descriptionTextPosition: {select:Description Text Position};
  716.  
  717.  
  718. /*sidebar links*/
  719. --sidebarLinksFontSize: {select:Sidebar Links Font Size};
  720. --sidebarLinksFontLetterSpacing: {select:Sidebar Links Font Letter Spacing};
  721. --sidebarLinksFontWordSpacing: {select:Sidebar Links Font Word Spacing};
  722. --sidebarLinksFontWeight: {select:Sidebar Links Font Weight};
  723. --sidebarLinksTextTransform: {select:Sidebar Links Text Transform};
  724. --sidebarLinksFontStyle: {select:Sidebar Links Font Style};
  725. --sidebarLinksPosition: {select:Sidebar Links Position};
  726.  
  727.  
  728. /*pagination, dark switch, credit*/
  729. --sidebarContentPosition: {select:Sidebar Content Position};
  730. --paginationLinksFontSize: {select:Pagination Links Font Size};
  731. --paginationFontLetterSpacing: {select:Pagination Font Letter Spacing};
  732. --paginationFontWordSpacing: {select:Pagination Font Word Spacing};
  733. --paginationFontWeight: {select:Pagination Links Font Weight};
  734. --paginationLinksTextTransform: {select:Pagination Links Text Transform};
  735. --paginationLinksFontStyle: {select:Pagination Links Font Style};
  736. --paginationLinksPosition: {select:Pagination Links Position};
  737.  
  738. /*margins, paddings, spaces*/
  739. --postsMargin: 8.5rem;
  740. --postsPadding: 0rem;
  741.  
  742. /*sizes*/
  743. --sidebarImageSize: {select:Sidebar Image Size};
  744. --sidebarIconImageSize: {select:Sidebar Icon Image Size};
  745.  
  746. /*posts*/
  747. --postsTextPosition: {select:Posts Text Position};
  748. --content="0.015rem"tlesFontSize: {select:Posts Titles Font Size};
  749. --content="0.015rem"tlesFontWeight: {select:Posts Titles Font Weight};
  750. --content="0.015rem"tlesFontLetterSpacing: {select:Posts Titles Font Letter Spacing};
  751. --content="0.015rem"tlesFontWordSpacing: {select:Posts Titles Font Word Spacing};
  752. --content="0.015rem"tlesTextTransform: {select:Posts Titles Text Transform};
  753. --content="0.015rem"tlesFontStyle: {select:Posts Titles Font Style};
  754. --postsTextPosition: {select:Posts Text Position};
  755. --content="0.015rem"tlesTextPosition: {select:Posts Titles Text Position};
  756.  
  757. /*date,tags, post info*/
  758. --dateFontSize:{select:Date Font Size};
  759. --dateFontLetterSpacing: {select:Date Font Letter Spacing};
  760. --dateFontWordSpacing: {select:Date Font Word Spacing};
  761. --dateFontWeight:{select:Date Font Weight};
  762. --dateTextTransform:{select:Date Text Transform};
  763. --dateFontStyle:{select:Date Font Style};
  764.  
  765. --tagsFontSize:{select:Tags Font Size};
  766. --tagsFontLetterSpacing: {select:Tags Font Letter Spacing};
  767. --tagsFontWordSpacing: {select:Tags Font Word Spacing};
  768. --tagsFontWeight:{select:Tags Font Weight};
  769. --tagsTextTransform:{select:Tags Text Transform};
  770. --tagsFontStyle:{select:Tags Font Style};
  771.  
  772. /* posts and sidebar borders */
  773. --bordersStyle: {select:Borders Style};
  774. --bordersSize: {select:Borders Size};
  775. --boxShadowSize:{text:Box Shadow Size};
  776. --boxShadowColor:{text:Box Shadow Color};
  777.  
  778.  
  779.  
  780. /* other styles */
  781. --transitions: all .3s ease;
  782.  
  783.  
  784. /*npf images readjustment */
  785. --NPF-Image-Spacing:0.4rem;
  786. --NPF-Bottom-Gap-From-Captions:1em;
  787. }
  788.  
  789. /* dark colors */
  790. [data-theme="dark"] {
  791. --backgroundThemeColor: {color:Dark Background Theme Color};
  792. --bodyTextColor: {color:Dark Body Text Color};
  793. --bodyLinkColor: {color:Dark Body Link Color};
  794. --bodyLinkHoverColor: {color:Dark Body Link Hover Color};
  795. --boldColor: {color:Dark Bold Color};
  796. --italicColor: {color:Dark Italic Color};
  797. --sidebarTextColor: {color:Dark Sidebar Text Color};
  798. --sidebarLinksColor: {color:Dark Sidebar Links Color};
  799. --sidebarTitleColor: {color:Dark Sidebar Title Color};
  800. --sidebarBackgroundColor: {color:Dark Sidebar Background Color};
  801. --hoverTextBackgroundColor: {color:Dark Hover Text Background Color};
  802. --hoverTextColor: {color:Dark Hover Text Color};
  803. --dateLinkColor:{color:Dark Date Link Color};
  804. --tagsLinkColor: {color:Dark Tags Link Color};
  805. --likedLinkColor: {color:Dark Liked Link Color};
  806. --scrollbarColor: {color:Dark Scrollbar Color};
  807. --bordersColor: {color:Dark Borders Color};
  808. --postsBackgroundColor: {color:Dark Posts Background Color};
  809. --backgroundAskColor: {color:Dark Background Ask Color};
  810. --askTextColor: {color:Dark Ask Text Color};
  811. --askLinkColor: {color:Dark Ask Link Color};
  812. --tumblrControlsIconColor: {color:Dark Tumblr Controls Icon Color};
  813. }
  814.  
  815. * {
  816. margin: 0;
  817. padding: 0;
  818. -webkit-box-sizing: inherit;
  819. box-sizing: inherit;
  820. }
  821.  
  822. html {
  823. font-size: 62.5%;
  824. }
  825.  
  826. body {
  827. background:var(--backgroundThemeColor) url({image:Background Image});
  828. background-attachment:fixed;
  829. background-color:var(--backgroundThemeColor);
  830. font-size:var(--bodyFontSize);
  831. font-family: var(--bodyFontFamily), Arial, sans-serif;
  832. font-weight: var(--bodyFontWeight);
  833. letter-spacing: var(--bodyFontLetterSpacing);
  834. word-spacing: var(--bodyFontWordSpacing);
  835. line-height: var(--bodyLineHeight);
  836. color: var(--bodyTextColor);
  837. }
  838.  
  839. a {
  840. text-decoration:none;
  841. color:var(--bodyLinkColor);
  842. transition:var(--transitions);
  843. }
  844.  
  845. a:hover {
  846. color:var(--bodyLinkHoverColor);
  847. }
  848.  
  849. p:first-child {
  850. margin-block-start: 0;
  851. margin-block-end: 0;
  852. }
  853.  
  854. p:last-child {
  855. margin-block-end: 0;
  856. }
  857.  
  858. small, sup, sub {
  859. font-size:var(--bodyFontSize);
  860. }
  861.  
  862. pre {
  863. word-wrap:break-word!Important;
  864. white-space: pre-wrap;
  865. }
  866.  
  867. h1, h2, h3, h4, h5, h6 {
  868. padding: 1.5rem;
  869. font-style:var(--content="0.015rem"tlesFontStyle);
  870. font-weight:var(--content="0.015rem"tlesFontWeight);
  871. letter-spacing: var(--content="0.015rem"tlesFontLetterSpacing);
  872. word-spacing: var(--content="0.015rem"tlesFontWordSpacing);
  873. color:var(--boldColor);
  874. text-transform:var(--content="0.015rem"tlesTextTransform);
  875. font-size:var(--content="0.015rem"tlesFontSize);
  876. text-align:var(--content="0.015rem"tlesTextPosition);
  877. line-height:var(--content="0.015rem"tlesLineHeight);
  878. }
  879.  
  880. strong, bold, b {
  881. color:var(--boldColor);
  882. font-weight:var(--boldFontWeight);
  883. }
  884.  
  885. italic, i, em {
  886. color:var(--italicColor);
  887. }
  888.  
  889. hr {
  890. width:10rem;
  891. margin:1rem 0 1rem 0;
  892. border-width: var(--bordersSize) 0px 0px 0px;
  893. border-style: var(--bordersStyle);
  894. border-color: var(--bordersColor);
  895. }
  896.  
  897.  
  898. {block:IfLinksUnderlineBorder}
  899. .sidebar-description a, .sidebar-navigation a, .date-content a,
  900. .caption a, .caption-content a, .tumblr_blog a, .ask-user a {
  901. text-decoration:underline;
  902. }
  903. {/block:IfLinksUnderlineBorder}
  904.  
  905. :where(picture, svg, video) {
  906. display: block;
  907. max-width: 100%;
  908. }
  909.  
  910. img {
  911. border:0;
  912. max-width:100%;
  913. height:auto;
  914. display:block;
  915. margin: 0;
  916. padding: 0;
  917. {block:ifImagesBlackandWhite}
  918. -webkit-filter: grayscale(100%);
  919. filter: grayscale(100%);
  920. {/block:ifImagesBlackandWhite}
  921. transition:var(--transitions);
  922. }
  923.  
  924. img:hover {
  925. opacity:1;
  926. -webkit-filter: grayscale(0%);
  927. filter: grayscale(0%);
  928. }
  929.  
  930. ::-moz-selection {
  931. background-color: var(--boldColor);
  932. color:var(--postsBackgroundColor);
  933. }
  934.  
  935. ::selection {
  936. background-color: var(--boldColor);
  937. color:var(--postsBackgroundColor);
  938. }
  939.  
  940. input {
  941. width: 100%;
  942. padding: 1rem;
  943. }
  944.  
  945. /* scrollbar */
  946. ::-webkit-scrollbar {
  947. width:0.7rem;
  948. height:0.7rem;
  949. }
  950. ::-webkit-scrollbar {
  951. background-color:var(--backgroundThemeColor);
  952. }
  953. ::-webkit-scrollbar-track {
  954. border:0.8rem solid var(--backgroundThemeColor);
  955. background-color:var(--backgroundThemeColor);
  956. }
  957. ::-webkit-scrollbar-thumb {
  958. border:0.2rem solid var(--backgroundThemeColor);
  959. background-color:var(--scrollbarColor);
  960. border-radius:1rem;
  961. min-height:2.4rem;
  962. min-width:2.4rem;
  963. }
  964.  
  965. /* scroll to top */
  966. .scrolltop .feather {
  967. margin:-3px 5px -3px -5px;
  968. }
  969.  
  970. .scrolltop {
  971. width:15px;
  972. height:15px;
  973. text-align:center;
  974. color:var(--bodyLinkColor);
  975. display: none;
  976. font-size:var(--bodyFontSize);
  977. }
  978.  
  979. .scrolltop:hover {
  980. color:var(--bodyLinkHoverColor);
  981. }
  982.  
  983. /* tooltips */
  984. .tippy-tooltip.custom-theme {
  985. text-align:center;
  986. font-size:var(--bodyFontSize);
  987. font-weight:var(--boldFontWeight);
  988. color:var(--hoverTextColor);
  989. background-color:var(--hoverTextBackgroundColor);
  990. {block:ifBoxShadow}
  991. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  992. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  993. {/block:ifBoxShadow}
  994. transition:var(--transitions);
  995. }
  996.  
  997. /* custom icons */
  998. .cp:hover, .feather:hover, .navigation ul li .feather:hover {
  999. color: var(--bodyLinkHoverColor);
  1000. stroke: var(--bodyLinkHoverColor);
  1001. }
  1002.  
  1003. .feather {
  1004. width: var(--bodyFontSize);
  1005. height: var(--bodyFontSize);
  1006. }
  1007.  
  1008. .clearfix::before, .clearfix::after{
  1009. content:'';
  1010. clear:both;
  1011. display:table;
  1012. }
  1013.  
  1014.  
  1015. /*global list style*/
  1016. ul li {
  1017. list-style: none;
  1018. margin: 0;
  1019. padding: 0;
  1020. }
  1021.  
  1022. /* lists style for posts */
  1023. .type-text ul,
  1024. .caption ul {
  1025. margin:1.5rem 0;
  1026. padding: 0;
  1027. list-style:none;
  1028. }
  1029.  
  1030. .type-text ul li,
  1031. .caption ul li {
  1032. margin:0.5rem 1.5rem;
  1033. list-style:none;
  1034. }
  1035.  
  1036. .type-text ul li::before,
  1037. .caption ul li::before {
  1038. content: '\e08f';
  1039. font-family:'saturnicons';
  1040. font-size:calc(var(--bodyFontSize) - 50%);
  1041. margin-right:0.7rem;
  1042. display:inline-block;
  1043. vertical-align:middle;
  1044. color: var(--bodyLinkColor);
  1045. }
  1046.  
  1047. .type-text ol,
  1048. .caption ol {
  1049. margin:1.5rem 0;
  1050. padding: 0 3rem;
  1051. }
  1052.  
  1053. .type-text ol li,
  1054. .caption ol li {
  1055. list-style-type: decimal;
  1056. }
  1057.  
  1058.  
  1059. /*main container*/
  1060. .theme-container {
  1061. display: grid;
  1062. grid-template-columns: 27rem 55rem;
  1063. grid-template-rows:1fr;
  1064. gap: 10rem;
  1065. margin: 5rem 2rem;
  1066. justify-content: center;
  1067. }
  1068.  
  1069. .sidebar {
  1070. width: 26.8rem;
  1071. height: 100vh;
  1072. display: flex;
  1073. align-items: var(--sidebarContentPosition);
  1074. }
  1075.  
  1076. .sidebar-content {
  1077. position: fixed;
  1078. width: 26.8rem;
  1079. background-color:var(--sidebarBackgroundColor);
  1080. {block:ifShowBorders}
  1081. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1082. {/block:ifShowBorders}
  1083.  
  1084. {block:ifBoxShadow}
  1085. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1086. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1087. {/block:ifBoxShadow}
  1088. }
  1089.  
  1090. .sidebar-title, .sidebar-description, .sidebar-navigation, .sidebar-search {
  1091. padding: 0 1rem;
  1092. }
  1093.  
  1094. .sidebar-description a, .sidebar-navigation a, .sidebar-pagination a {
  1095. color: var(--sidebarLinksColor);
  1096. }
  1097.  
  1098. .sidebar-description a:hover, .sidebar-navigation a:hover, .sidebar-pagination a:hover {
  1099. color: var(--bodyLinkHoverColor);
  1100. }
  1101.  
  1102. .sidebar-image, .sidebar-image-icon {
  1103. float:{select:Sidebar Image Position};
  1104. }
  1105.  
  1106. .sidebar-image img {
  1107. width: var(--sidebarImageSize);
  1108. margin: auto auto 1rem;
  1109. }
  1110.  
  1111. .sidebar-image-icon img {
  1112. width: var(--sidebarIconImageSize);
  1113. height: var(--sidebarIconImageSize);
  1114. border-radius: 50%;
  1115. object-fit: cover;
  1116. margin: auto auto 1rem;
  1117. }
  1118.  
  1119. .sidebar-title {
  1120. {block:IfNotSidebarIconImage}
  1121. {block:IfNotSidebarImage}
  1122. margin-top: 1rem;
  1123. {/block:IfNotSidebarImage}
  1124. {/block:IfNotSidebarIconImage}
  1125.  
  1126. font-weight:var(--sidebarTitleFontWeight);
  1127. font-style:var(--sidebarTitleFontStyle);
  1128. text-transform:var(--sidebarTitleTextTransform);
  1129. font-size:var(--sidebarTitleFontSize);
  1130. line-height:var(--sidebarTitleLineHeight);
  1131. letter-spacing: var(--sidebarTitleFontLetterSpacing);
  1132. word-spacing: var(--sidebarTitleFontWordSpacing);
  1133. text-align:var(--sidebarTitleTextPosition);
  1134. color: var(--sidebarTitleColor);
  1135. }
  1136.  
  1137. .sidebar-description {
  1138. margin: 1rem 0;
  1139. color: var(--sidebarTextColor);
  1140. font-weight:var(--descriptionFontWeight);
  1141. font-style:var(--descriptionFontStyle);
  1142. text-transform:var(--descriptionTextTransform);
  1143. font-size:var(--descriptionFontSize);
  1144. letter-spacing: var(--descriptionFontLetterSpacing);
  1145. word-spacing: var(--descriptionFontWordSpacing);
  1146. text-align:var(--descriptionTextPosition);
  1147. }
  1148.  
  1149. .sidebar-navigation {
  1150. font-size:var(--sidebarLinksFontSize);
  1151. font-style:var(--sidebarLinksFontStyle);
  1152. font-weight:var(--sidebarLinksFontWeight);
  1153. letter-spacing: var(--sidebarLinksFontLetterSpacing);
  1154. word-spacing: var(--sidebarLinksFontWordSpacing);
  1155. text-transform:var(--sidebarLinksTextTransform);
  1156. text-align:var(--sidebarLinksPosition);
  1157. margin: 0 0 1rem;
  1158. }
  1159.  
  1160. .sidebar-navigation ul {
  1161. list-style: none;
  1162. display:flex;
  1163. align-items: center;
  1164. flex-wrap: wrap;
  1165. width:100%;
  1166. }
  1167.  
  1168. .sidebar-navigation ul li {
  1169. padding: 0.2rem 0;
  1170. width:29%;
  1171. }
  1172.  
  1173. .sidebar-navigation ul li:not(:last-child) {
  1174. margin-right:1rem;
  1175. }
  1176.  
  1177. .sidebar-search {
  1178. width: 100%;
  1179. box-sizing: border-box;
  1180. padding: 0 1rem 1.5rem;
  1181. }
  1182.  
  1183. .sidebar-search input {
  1184. background-color:var(--sidebarBackgroundColor);
  1185. color: var(--sidebarTextColor);
  1186. border: none;
  1187. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1188. }
  1189.  
  1190. .sidebar-search input:focus {
  1191. border:none;
  1192. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1193. }
  1194.  
  1195. .sidebar-search input:placeholder {
  1196. color: var(--sidebarTextColor);
  1197. }
  1198.  
  1199. .sidebar-pagination {
  1200. font-size:var(--paginationLinksFontSize);
  1201. font-style:var(--paginationLinksFontStyle);
  1202. font-weight:var(--paginationLinksFontWeight);
  1203. letter-spacing: var(--paginationFontLetterSpacing);
  1204. text-transform:var(--paginationLinksTextTransform);
  1205. word-spacing: var(--paginationFontWordSpacing);
  1206. padding: 0 1rem 1.5rem;
  1207. }
  1208.  
  1209. .sidebar-pagination ul {
  1210. list-style: none;
  1211. display:flex;
  1212. align-items: center;
  1213. justify-content: space-between;
  1214. gap: 1rem;
  1215. }
  1216.  
  1217. .sidebar-pagination .credit {
  1218. width: var(--bodyFontSize);
  1219. height: var(--bodyFontSize);
  1220. }
  1221.  
  1222.  
  1223.  
  1224.  
  1225.  
  1226. /* posts */
  1227.  
  1228. .container-posts, .container-header {
  1229. width:100%;
  1230. max-width: calc({select:Post Size} + 1px);
  1231. margin: 0 auto;
  1232. text-align:var(--postsTextPosition);
  1233. padding: var(--postsPadding);
  1234. background-color: var(--postsBackgroundColor);
  1235. {block:ifShowBorders}
  1236. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1237. {/block:ifShowBorders}
  1238.  
  1239. {block:ifBoxShadow}
  1240. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1241. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1242. {/block:ifBoxShadow}
  1243. }
  1244.  
  1245. .container-header {
  1246. padding: 1rem;
  1247. box-sizing: border-box;
  1248. }
  1249.  
  1250. .search-result .search_query, .tag-wrapper .tag {
  1251. font-weight: var(--boldFontWeight);
  1252. color: var(--boldColor);
  1253. }
  1254.  
  1255. .container-posts img {
  1256. max-width:100%;
  1257. display:block;
  1258. height:auto;
  1259. }
  1260.  
  1261. .container-posts b, strong {
  1262. font-weight:var(--boldFontWeight);
  1263. }
  1264.  
  1265. .container-posts:not(:last-of-type) {
  1266. margin-bottom: var(--postsMargin);
  1267. }
  1268.  
  1269.  
  1270. /* photosets */
  1271. [photoset-layout] {
  1272. display: grid;
  1273. grid-template-columns: repeat(6, 1fr);
  1274. grid-gap: {select:Post Size Gap};
  1275. }
  1276.  
  1277. [photoset-layout] img {
  1278. display: block;
  1279. height: 100%;
  1280. width: 100%;
  1281. -o-object-fit: cover;
  1282. object-fit: cover;
  1283. }
  1284.  
  1285. .photoset-grid {
  1286. max-width: 100%;
  1287. width: {select:Post Size};
  1288. grid-gap: {select:Post Size Gap};
  1289. }
  1290.  
  1291. .photoset-grid div {
  1292. cursor: pointer;
  1293. }
  1294.  
  1295.  
  1296.  
  1297. /* captions & blockquote */
  1298. .tumblr_blog {
  1299. display:inline-block;
  1300. line-height:var(--bodyLineHeight);
  1301. margin-right:0.2rem;
  1302. text-transform:lowercase;
  1303. font-family: var(--bodyFont), Arial, sans-serif;
  1304. font-size:var(--bodyFontSize);
  1305. color:var(--bodyLinkColor);
  1306. font-weight:var(--boldFontWeight);
  1307. }
  1308.  
  1309. .tumblr_blog a {
  1310. color:var(--bodyLinkColor);
  1311. font-weight:var(--boldFontWeight);
  1312. vertical-align:bottom;
  1313.  
  1314. }
  1315.  
  1316. .tumblr_blog a:hover {
  1317. text-decoration:none;
  1318. color:var(--bodyLinkHoverColor);
  1319. }
  1320.  
  1321. /* old captions style */
  1322. {block:ifNotTumblrCaptions}
  1323. blockquote {
  1324. border-left:0.1rem solid var(--bordersColor);
  1325. padding-left: 1.5rem;
  1326. margin: 1rem 1rem;
  1327. }
  1328. {/block:ifNotTumblrCaptions}
  1329.  
  1330. /* tumblr's dashboad captions style */
  1331. {block:ifTumblrCaptions}
  1332. blockquote {
  1333. border-left:0px solid;
  1334. padding-left: 0px;
  1335. margin: 0px;
  1336. }
  1337. {/block:ifTumblrCaptions}
  1338.  
  1339.  
  1340. /* custom captions icons */
  1341. {block:ifCustomCaptionIcon}
  1342. .caption-user .feather {
  1343. display:inline-block;
  1344. vertical-align: middle;
  1345. width:var(--bodyFontSize);
  1346. height:var(--bodyFontSize);
  1347. margin-right: 0.5rem;
  1348. }
  1349. {/block:ifCustomCaptionIcon}
  1350.  
  1351. .caption-user .feather {
  1352. {block:ifNotCustomCaptionIcon}
  1353. display:none;
  1354. {/block:ifNotCustomCaptionIcon}
  1355. transition:var(--transitions);
  1356. }
  1357.  
  1358. .caption-user {
  1359. display: inline-block;
  1360. vertical-align: middle;
  1361. font-weight:var(--boldFontWeight);
  1362. padding-bottom: 0.2rem;
  1363. }
  1364.  
  1365. .caption-user a::after {
  1366. content:none;
  1367. }
  1368.  
  1369. .deactive::after {
  1370. content: '(deactivated)';
  1371. margin-left: 1em;
  1372. opacity: 0.75;
  1373. color: var(--bodyTextColor);
  1374. }
  1375.  
  1376.  
  1377. .caption {
  1378. padding: 1rem;
  1379. }
  1380.  
  1381. .caption p {
  1382. padding: 0.2rem;
  1383. }
  1384.  
  1385. /* captions links */
  1386. .caption a, .caption-content a, figcaption a {
  1387. color:var(--bodyLinkColor);
  1388. }
  1389.  
  1390. .caption a:hover, .caption-content a:hover, figcaption a:hover {
  1391. color:var(--bodyLinkHoverColor);
  1392. }
  1393.  
  1394.  
  1395. .container-date a:hover {
  1396. color:var(--bodyLinkHoverColor);
  1397. }
  1398.  
  1399. .container-date ul {
  1400. list-style: none;
  1401. width:100%;
  1402. }
  1403.  
  1404. .container-date ul li {
  1405. display:inline-block;
  1406. padding: 0.2rem 0;
  1407. }
  1408.  
  1409. .container-date ul li:not(:last-child) {
  1410. margin-right:1rem;
  1411. }
  1412.  
  1413. .container-date:first-of-type {
  1414. padding: 1rem;
  1415. margin: 1rem 0 0 0;
  1416. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1417. }
  1418.  
  1419. .container-date-info a, .container-date-tags-info a {
  1420. color: var(--dateLinkColor);
  1421. }
  1422.  
  1423. .container-date-info, .container-date-tags-info {
  1424. display: grid;
  1425. align-items: center;
  1426. justify-content: start;
  1427. grid-template-columns: repeat(3, 1fr);
  1428. font-weight:var(--dateFontWeight);
  1429. color:var(--bodyTextColor);
  1430. font-size:var(--dateFontSize);
  1431. text-transform: var(--dateTextTransform);
  1432. letter-spacing: var(--dateFontLetterSpacing);
  1433. word-spacing: var(--dateFontWordSpacing);
  1434. }
  1435.  
  1436. .container-date:last-of-type {
  1437. padding: 1rem;
  1438. margin: 0;
  1439. border-top:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1440. }
  1441.  
  1442. .container-date-info .note-count {
  1443. justify-self: start;
  1444. }
  1445.  
  1446. .container-date-info .date-time {
  1447. justify-self: center;
  1448. }
  1449.  
  1450. .container-date-info .reblog-link {
  1451. justify-self: end;
  1452. max-width: 170px;
  1453. white-space: nowrap;
  1454. overflow: hidden;
  1455. text-overflow: ellipsis;
  1456. display: block;
  1457. }
  1458.  
  1459. .container-date-info .reblog-link a:not(:last-child) {
  1460. margin-right:1rem;
  1461. }
  1462.  
  1463. .container-tags {
  1464. margin: 0 0 1rem;
  1465. text-align: var(--tagsTextPosition);
  1466. text-transform: var(--tagsTextTransform);
  1467. font-style:var(--tagsFontStyle);
  1468. font-size:var(--tagsFontSize);
  1469. letter-spacing: var(--tagsFontLetterSpacing);
  1470. word-spacing: var(--tagsFontWordSpacing);
  1471. font-weight:var(--tagsFontWeight);
  1472. }
  1473.  
  1474. .container-tags a {
  1475. color:var(--tagsLinkColor);
  1476. }
  1477.  
  1478. .container-date-tags-info .reblog {
  1479. justify-self: start;
  1480. }
  1481.  
  1482. .container-date-tags-info .pinned-post {
  1483. justify-self: center;
  1484. }
  1485.  
  1486. .container-date-tags-info .pinned-post a {
  1487. color: var(--bodyLinkColor);
  1488. }
  1489.  
  1490. .container-date-tags-info .pinned-post a:hover {
  1491. color:var(--bodyLinkHoverColor);
  1492. }
  1493.  
  1494. .container-date-tags-info .pinned-post .sf {
  1495. margin-left: 0.5rem;
  1496. }
  1497.  
  1498. .container-date-tags-info .like-button {
  1499. justify-self: end;
  1500. }
  1501.  
  1502.  
  1503. /* like text */
  1504. .like-b {
  1505. position:relative;
  1506. display:inline-block;
  1507. height:1em;
  1508. line-height:1.5em;
  1509. padding: 0 0.1rem;
  1510. }
  1511.  
  1512. .like-b .like_button iframe {
  1513. position:absolute;
  1514. top:0;
  1515. left:0;
  1516. bottom:0;
  1517. right:0;
  1518. z-index:2;
  1519. opacity:0;
  1520. }
  1521.  
  1522. .like-b .liked + .b {
  1523. color: var(--likedLinkColor);
  1524. font-weight:var(--boldFontWeight);
  1525. }
  1526.  
  1527. .like-b .liked + .b:after {
  1528. content:'d';
  1529. }
  1530.  
  1531. .like-b a:hover {
  1532. color:var(--bodyLinkHoverColor);
  1533. }
  1534.  
  1535. /* asks */
  1536. .ask {
  1537. color:var(--askTextColor);
  1538. padding: 1rem;
  1539. background-color: var(--backgroundAskColor);
  1540. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1541. }
  1542.  
  1543. .ask-user {
  1544. color:var(--askLinkColor);
  1545. font-weight:var(--boldFontWeight);
  1546. text-transform:lowercase;
  1547. }
  1548.  
  1549. .ask-user a {
  1550. color:var(--askLinkColor);
  1551. font-weight:var(--boldFontWeight);
  1552. }
  1553.  
  1554. .ask-user a:hover {
  1555. color:var(--bodyLinkHoverColor);
  1556. }
  1557.  
  1558. .ask-question {
  1559. display:block;
  1560. margin: 0 0 0.7rem;
  1561. }
  1562.  
  1563. .ask-answer.caption-content::after {
  1564. content: '';
  1565. height: 0px;
  1566. }
  1567.  
  1568. /*audio */
  1569. .audio {
  1570. display:flex;
  1571. {block:ifShowBorders}
  1572. border-bottom:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1573. {/block:ifShowBorders}
  1574. align-items: center;
  1575. position: relative;
  1576. }
  1577.  
  1578. .album-art {
  1579. z-index: 1;
  1580. display: inline-block;
  1581. vertical-align: middle;
  1582. float: left;
  1583. width: 10rem;
  1584. height: 10rem;
  1585. }
  1586.  
  1587. .button {
  1588. width: 3rem;
  1589. height: 3rem;
  1590. overflow: hidden;
  1591. position: relative;
  1592. z-index: 2;
  1593. margin: 0.7rem;
  1594. }
  1595.  
  1596. .audiobox {
  1597. background-color: #f2f2f2;
  1598. z-index: 3;
  1599. position: absolute;
  1600. margin: 2.8rem;
  1601. border-radius: 50%;
  1602. }
  1603.  
  1604. .audio_trackinfo {
  1605. max-height: 7.4rem;
  1606. min-height: 7.4rem;
  1607. display: flex;
  1608. flex: 4;
  1609. align-items: flex-start;
  1610. justify-content: center;
  1611. flex-direction: column;
  1612. padding: 0.5rem;
  1613. padding: 1rem;
  1614. background-color: var(--backgroundAskColor);
  1615. color:var(--askTextColor);
  1616. }
  1617.  
  1618. .audio_trackname {
  1619. font-weight:var(--boldFontWeight);
  1620. color:var(--askLinkColor);
  1621. text-align:var(--postsTextPosition);
  1622. font-size:1.6rem;
  1623. }
  1624.  
  1625. .spotify_audio_player {
  1626. max-width: 100%;
  1627. width: {select:Post Size};
  1628. height: 80px;
  1629. }
  1630.  
  1631.  
  1632. /* postnotes */
  1633. .post-notes {
  1634. max-width: 100%;
  1635. width: {select:Post Size};
  1636. margin: 2.5rem 0.5rem;
  1637. padding-top: 1.5rem;
  1638. list-style-type: none;
  1639. font-family: var(--bodyFont), Arial, sans-serif;
  1640. font-size:var(--bodyFontSize);
  1641. color:var(--bodyTextColor);
  1642. background-color:var(--postsBackgroundColor);
  1643. text-align:center;
  1644. {block:ifBoxShadow}
  1645. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1646. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1647. {/block:ifBoxShadow}
  1648. {block:ifShowBorders}
  1649. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1650. {/block:ifShowBorders}
  1651. }
  1652.  
  1653. .post-notes ol li, .post-notes ul li {
  1654. list-style-type: none;
  1655. margin:0;
  1656. line-height: calc(var(--bodyLineHeight) + 0.5rem);
  1657. }
  1658.  
  1659. .post-notes ol li.like::before {
  1660. content: '\e12c';
  1661. font-family:'saturnicons';
  1662. font-size:calc(var(--bodyFontSize) - 40%);
  1663. margin-right:0.7rem;
  1664. display:inline-block;
  1665. vertical-align:middle;
  1666. position:relative;
  1667. color: var(--bodyLinkColor);
  1668. }
  1669.  
  1670. .post-notes ol li.reblog::before {
  1671. content: '\e1f5';
  1672. font-family:'saturnicons';
  1673. font-size:calc(var(--bodyFontSize) - 40%);
  1674. margin-right:0.7rem;
  1675. display:inline-block;
  1676. vertical-align:middle;
  1677. position:relative;
  1678. color: var(--bodyLinkColor);
  1679. }
  1680.  
  1681. .post-notes ol li.original_post::before {
  1682. content: '\e213';
  1683. font-family:'saturnicons';
  1684. font-size:calc(var(--bodyFontSize) - 40%);
  1685. bottom:0.5rem;
  1686. margin-right:0.7rem;
  1687. display:inline-block;
  1688. vertical-align:middle;
  1689. position:relative;
  1690. color: var(--bodyLinkColor);
  1691. }
  1692.  
  1693.  
  1694. .post-notes ol li:hover:before {
  1695. color:var(--bodyLinkHoverColor);
  1696. }
  1697.  
  1698. .post-notes ol li .more_notes_link a::before {
  1699. content: '';
  1700. }
  1701.  
  1702.  
  1703. ol.notes {
  1704. list-style:none;
  1705. color:var(--bodyTextColor);
  1706. padding:0;
  1707. }
  1708.  
  1709. ol.notes img {
  1710. display: none;
  1711. }
  1712.  
  1713. /* quote */
  1714. .type-quote {
  1715. padding:1rem 2rem;
  1716. font-size:var(--content="0.015rem"tlesFontSize);
  1717. text-transform:var(--content="0.015rem"tlesTextTransform);
  1718. color:var(--boldColor);
  1719. font-weight:var(--boldFontWeight);
  1720. text-align:var(--postsTextPosition);
  1721. }
  1722.  
  1723. .type-quote blockquote {
  1724. padding: 0 0 1rem;
  1725. }
  1726.  
  1727. .quote-source {
  1728. font-weight: normal;
  1729. font-size: var(--bodyFontSize);
  1730. }
  1731.  
  1732. .quote-source::before {
  1733. content: '';
  1734. width: 1.5rem;
  1735. height: 0.1rem;
  1736. margin-right:1rem;
  1737. display:inline-block;
  1738. vertical-align:middle;
  1739. position:relative;
  1740. background-color: var(--bordersColor);
  1741. }
  1742.  
  1743. /* link */
  1744.  
  1745. .link-image img {
  1746. -o-object-fit: cover;
  1747. object-fit: cover;
  1748. margin-bottom:0.5rem;
  1749. }
  1750.  
  1751. .container-link-txt, .container-link-host {
  1752. padding:0.5rem 1rem;
  1753. }
  1754.  
  1755. .container-link-txt {
  1756. font-style: italic;
  1757. }
  1758.  
  1759. /* chat */
  1760. .type-chat .chat-lines li::before {
  1761. content: '';
  1762. margin: 0;
  1763. padding: 0;
  1764. }
  1765.  
  1766. .label {
  1767. font-weight:var(--boldFontWeight);
  1768. color:var(--boldColor);
  1769. }
  1770.  
  1771. .line {
  1772. padding: 0px 0px 0.5rem;
  1773. margin: 0px 0px 0.5rem;
  1774. }
  1775.  
  1776.  
  1777. p.npf_chat {
  1778. font-size:var(--bodyFontSize);
  1779. font-family: var(--bodyFont), Arial, sans-serif;
  1780. list-style:none;
  1781. }
  1782.  
  1783. #btn-mobile, #mobile-pagination {
  1784. overflow:hidden;
  1785. visibility: hidden;
  1786. display: none;
  1787. }
  1788.  
  1789.  
  1790.  
  1791.  
  1792. /*STYLES FOR MOBILE*/
  1793.  
  1794. @media (max-width:950px) {
  1795.  
  1796. /*mobile container*/
  1797. .theme-container {
  1798. width: 100%;
  1799. display: grid;
  1800. grid-template-columns: 1fr;
  1801. gap: 3rem;
  1802. justify-items: center;
  1803. margin: 7rem 0;
  1804. }
  1805.  
  1806. .sidebar {
  1807. height: auto;
  1808. display: block;
  1809. top: 0;
  1810. position: fixed;
  1811. width: 100%;
  1812. width: {select:Post Size};
  1813. {block:ifShowBorders}
  1814. outline:0;
  1815. {/block:ifShowBorders}
  1816.  
  1817. {block:ifBoxShadow}
  1818. box-shadow: none;
  1819. {/block:ifBoxShadow}
  1820. }
  1821.  
  1822. .sidebar-content {
  1823. position: static;
  1824. }
  1825.  
  1826. .sidebar, .container {
  1827. width: 90%;
  1828. }
  1829.  
  1830. .sidebar-image, .sidebar-image-icon {
  1831. display: none;
  1832. overflow:hidden;
  1833. visibility: hidden;
  1834. }
  1835.  
  1836. .photoset-grid {
  1837. width:100%;
  1838. max-width: {select:Post Size};
  1839. grid-gap: {select:Post Size Gap};
  1840. margin: 0 auto;
  1841. }
  1842.  
  1843.  
  1844.  
  1845. /* menu mobile */
  1846. #btn-mobile {
  1847. margin: 1.5rem 0 0;
  1848. cursor: pointer;
  1849. display: inline-block;
  1850. overflow:auto;
  1851. visibility: visible;
  1852. }
  1853.  
  1854. #sidebar-mobile-content {
  1855. display: block;
  1856. position: absolute;
  1857. width: 100%;
  1858. height: 0px;
  1859. top: 70px;
  1860. background-color: var(--sidebarBackgroundColor);
  1861. transition: .6s;
  1862. visibility: hidden;
  1863. overflow-y: hidden;
  1864. }
  1865.  
  1866. #sidebar-mobile.active #sidebar-mobile-content {
  1867. height: auto;
  1868. width: 75%;
  1869. padding: 5rem;
  1870. visibility: visible;
  1871. overflow-y: auto;
  1872. display: block;
  1873. z-index: ;
  1874. }
  1875.  
  1876. #mobile-pagination {
  1877. visibility: visible;
  1878. display: inline-block;
  1879. margin-right:1rem;
  1880. }
  1881.  
  1882. }
  1883.  
  1884. /* tumblr controls */
  1885. {block:ifCustomControls}
  1886. iframe.tmblr-iframe {
  1887. background-color: var(--backgroundThemeColor);
  1888. z-index:99999999999999!important;
  1889. top: 1rem!important;
  1890. right: 1rem!important;
  1891. opacity:0;
  1892. padding-right:1.5rem;
  1893. -webkit-transform:scale(0.75);
  1894. -ms-transform:scale(0.75);
  1895. transform:scale(0.75);
  1896. -webkit-transform-origin:100% 0;
  1897. -ms-transform-origin:100% 0;
  1898. transform-origin:100% 0;
  1899. cursor: pointer;
  1900. }
  1901. iframe.tmblr-iframe:hover {
  1902. opacity:1!important;
  1903. }
  1904. .hcontrols {
  1905. position:fixed;
  1906. top:1.5rem;
  1907. right:1.5rem;
  1908. z-index:999999999;
  1909. cursor: pointer;
  1910. }
  1911. .hcontrols .feather,
  1912. #btn-mobile .feather{
  1913. width:2.5rem;
  1914. height:2.5rem;
  1915. stroke-width: 2;
  1916. stroke:var(--tumblrControlsIconColor);
  1917. cursor: pointer;
  1918. }
  1919. .hcontrols .feather:hover {
  1920. stroke: var(--bodyLinkHoverColor);
  1921. }
  1922. {/block:ifCustomControls}
  1923.  
  1924. {block:ifNotDisableSwitchThemeColor}
  1925. /* css for dark theme */
  1926. .theme-switch input {
  1927. display: none;
  1928. }
  1929.  
  1930. .slider {
  1931. width: var(--bodyFontSize);
  1932. height: var(--bodyFontSize);
  1933. }
  1934.  
  1935. .slider svg {
  1936. width: var(--bodyFontSize);
  1937. height: var(--bodyFontSize);
  1938. stroke: var(--bodyTextColor);
  1939. cursor: pointer;
  1940. }
  1941. {/block:ifNotDisableSwitchThemeColor}
  1942.  
  1943.  
  1944. /* DO NOT REMOVE */
  1945. .mcredito {
  1946. display: flex;
  1947. align-items: center;
  1948. position:fixed;
  1949. right:5px;
  1950. bottom:10px;
  1951. padding:8px 12px;
  1952. background: var(--sidebarBackgroundColor);
  1953. {block:ifBoxShadow}
  1954. -webkit-box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1955. box-shadow: var(--boxShadowSize) rgba(var(--boxShadowColor));
  1956. {/block:ifBoxShadow}
  1957. {block:ifShowBorders}
  1958. outline:var(--bordersSize) var(--bordersStyle) var(--bordersColor);
  1959. {/block:ifShowBorders}
  1960. }
  1961.  
  1962. .mcredito a {
  1963. margin:0;
  1964. font-weight:var(--boldFontWeight);
  1965. text-transform:lowercase;
  1966. text-align:center;
  1967. color:var(--bodyLinkColor);
  1968. }
  1969.  
  1970. .mcredito a:hover {
  1971. color:var(--bodyLinkHoverColor);
  1972. }
  1973.  
  1974. .dot-separator {
  1975. width: 0.3rem;
  1976. height: 0.3rem;
  1977. margin:0.1rem 0.5rem;
  1978. display:inline-block;
  1979. border-radius: 50%;
  1980. background-color: var(--bodyLinkColor);
  1981. }
  1982.  
  1983.  
  1984. /* Tumblr: Custom CSS */
  1985. {CustomCSS}
  1986. </style>
  1987. </head>
  1988.  
  1989. <body>
  1990. <div class="theme-container">
  1991. <aside class="sidebar" id="sidebar-mobile">
  1992. <div id="btn-mobile">
  1993. <i data-feather="menu" class="feather"></i>
  1994. </div>
  1995. <div class="sidebar-content" id="sidebar-mobile-content">
  1996. {block:IfNotSidebarIconImage}
  1997. {block:IfSidebarImage}
  1998. <div class="sidebar-image">
  1999. <img src="{image:Sidebar Image}" />
  2000. </div>
  2001. {/block:IfSidebarImage}
  2002. {/block:IfNotSidebarIconImage}
  2003.  
  2004. {block:IfNotSidebarImage}
  2005. {block:IfSidebarIconImage}
  2006. <div class="sidebar-image-icon">
  2007. <img src="{image:Sidebar Image}" />
  2008. </div>
  2009. {/block:IfSidebarIconImage}
  2010. {/block:IfNotSidebarImage}
  2011. <span class="clearfix"></span>
  2012. {block:IfSidebarTitle}
  2013. <div class="sidebar-title">
  2014. {Title}
  2015. </div>
  2016. {/block:IfSidebarTitle}
  2017.  
  2018. {block:Description}
  2019. <div class="sidebar-description">
  2020. {Description}
  2021. </div>
  2022. {/block:Description}
  2023.  
  2024. <nav class="sidebar-navigation">
  2025. <ul>
  2026. <li>
  2027. <a href="{text:Home URL}">
  2028. {text:Home Text}
  2029. </a>
  2030. </li>
  2031.  
  2032. <li>
  2033. <a href="{text:Ask URL}">
  2034. {text:Ask Text}
  2035. </a>
  2036. </li>
  2037.  
  2038. {block:ifSubmitLink}
  2039. <li>
  2040. <a href="{text:Submit Link}">
  2041. {text:Submit Text}
  2042. </a>
  2043. </li>
  2044. {/block:ifSubmitLink}
  2045.  
  2046. {block:ifSidebarLink1}
  2047. <li>
  2048. <a href="{text:Sidebar Link 1 URL}">
  2049. {text:Sidebar Link 1 Text}
  2050. </a>
  2051. </li>
  2052. {/block:ifSidebarLink1}
  2053.  
  2054. {block:ifSidebarLink2}
  2055. <li>
  2056. <a href="{text:Sidebar Link 2 URL}">
  2057. {text:Sidebar Link 2 Text}
  2058. </a>
  2059. </li>
  2060. {/block:ifSidebarLink2}
  2061.  
  2062. {block:ifSidebarLink3}
  2063. <li>
  2064. <a href="{text:Sidebar Link 3 URL}">
  2065. {text:Sidebar Link 3 Text}
  2066. </a>
  2067. </li>
  2068. {/block:ifSidebarLink3}
  2069.  
  2070. {block:ifSidebarLink4}
  2071. <li>
  2072. <a href="{text:Sidebar Link 4 URL}">
  2073. {text:Sidebar Link 4 Text}
  2074. </a>
  2075. </li>
  2076. {/block:ifSidebarLink4}
  2077.  
  2078. {block:ifSidebarLink5}
  2079. <li>
  2080. <a href="{text:Sidebar Link 5 URL}">
  2081. {text:Sidebar Link 5 Text}
  2082. </a>
  2083. </li>
  2084. {/block:ifSidebarLink5}
  2085.  
  2086. {block:ifSidebarLink6}
  2087. <li>
  2088. <a href="{text:Sidebar Link 6 URL}">
  2089. {text:Sidebar Link 6 Text}
  2090. </a>
  2091. </li>
  2092. {/block:ifSidebarLink6}
  2093.  
  2094. {block:ifSidebarLink7}
  2095. <li>
  2096. <a href="{text:Sidebar Link 7 URL}">
  2097. {text:Sidebar Link 7 Text}
  2098. </a>
  2099. </li>
  2100. {/block:ifSidebarLink7}
  2101.  
  2102. {block:ifSidebarLink8}
  2103. <li>
  2104. <a href="{text:Sidebar Link 8 URL}">
  2105. {text:Sidebar Link 8 Text}
  2106. </a>
  2107. </li>
  2108. {/block:ifSidebarLink8}
  2109.  
  2110. {block:HasPages}
  2111. {block:Pages}
  2112. <li>
  2113. <a href="{URL}">{Label}</a>
  2114. </li>
  2115. {/block:Pages}
  2116. {/block:HasPages}
  2117. </ul>
  2118. </nav>
  2119.  
  2120. <form action="javascript:return false" method="get" class="search sidebar-search">
  2121. <input type="text" name="q" value="{SearchQuery}" placeholder="{lang:Search}" />
  2122. </form>
  2123. <nav class="sidebar-pagination">
  2124. <ul>
  2125. <ul>
  2126. {block:PreviousPage}<li><a href="{PreviousPage}">{lang:Previous}</a></li>{/block:PreviousPage}
  2127. {block:NextPage}<li><a href="{NextPage}">{lang:Next}</a></li>{/block:NextPage}
  2128. </ul>
  2129. <ul>
  2130. <li>
  2131. {block:ifNotDisableSwitchThemeColor}
  2132. <div class="theme-switch-wrapper">
  2133. <label class="theme-switch" for="checkbox">
  2134. <input type="checkbox" id="checkbox" />
  2135. <div class="slider" title="Change Theme Color">
  2136. </div>
  2137. </label>
  2138. </div>
  2139. {/block:ifNotDisableSwitchThemeColor}
  2140. </li>
  2141. </ul>
  2142. </ul>
  2143. </nav>
  2144. </div>
  2145. </aside>
  2146.  
  2147. <main class="container">
  2148. {block:SearchPage}
  2149. <div class="search-page container-header">
  2150. {block:SearchResults}
  2151. <p class="search-result">{lang:Search results for SearchQuery 2}</p>
  2152. {/block:SearchResults}
  2153.  
  2154. {block:NoSearchResults}
  2155. <p class="search-result">{lang:Sorry no results for SearchQuery 2}</p>
  2156. {/block:NoSearchResults}
  2157. </div>
  2158. {/block:SearchPage}
  2159.  
  2160. {block:TagPage}
  2161. <div class="tag-page container-header">
  2162. <p class="tag-wrapper">{lang:Showing posts tagged Tag 2}</p>
  2163. </div>
  2164. {/block:TagPage}
  2165.  
  2166. {block:Posts}
  2167. <article class="container-posts" id="{PostID}" post-type="{PostType}">
  2168. {block:Date}
  2169. <div class="container-date">
  2170. <div class="container-date-info">
  2171. <a class="note-count" href="{Permalink}#notes">
  2172. <span class="notecount">{NoteCountWithLabel}</span>
  2173. </a>
  2174.  
  2175. <a class="date-time" href="{Permalink}" title="{TimeAgo}">
  2176. {ShortMonth} {DayOfMonth}{DayOfMonthSuffix} {Year}
  2177. </a>
  2178.  
  2179. <div class="reblog-link">
  2180. {block:RebloggedFrom}
  2181. <a target="_blank" href="{ReblogParentURL}" title="{lang:Reblogged from} {ReblogParentName}">{ReblogParentName}</a>
  2182. {/block:RebloggedFrom}
  2183. {block:ContentSource}
  2184. <a target="_blank" href="{SourceURL}" title="{lang:Originally from ReblogRootName}">{SourceTitle}</a>
  2185. {/block:ContentSource}
  2186. {block:NotReblog}
  2187. <a target="_blank" href="{Permalink}" title="Original post">{Name}</a>
  2188. {/block:NotReblog}
  2189. </div>
  2190. </div>
  2191. </div>
  2192. {/block:Date}
  2193.  
  2194. {block:Text}
  2195. <div class="type-text post">
  2196. {block:Title}
  2197. <h2 class="title">
  2198. <a href="{Permalink}">{Title}</a>
  2199. </h2>
  2200. {/block:Title}
  2201.  
  2202. <!-- captions -->
  2203. {block:ifTumblrCaptions}
  2204. {block:Notreblog}
  2205. <div class="caption">
  2206. {block:IfUsernameOriginalPost}
  2207. <div class="caption-user">
  2208. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2209. </div>
  2210. {/block:IfUsernameOriginalPost}
  2211. <div class="caption-content">{Body}</div>
  2212. </div>
  2213. {/block:Notreblog}
  2214. {block:Rebloggedfrom}
  2215. {block:Reblogs}
  2216. <div class="caption">
  2217. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2218. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2219. </div>
  2220. <div class="caption-content">{Body}</div>
  2221. </div>
  2222. {/block:Reblogs}
  2223. {/block:RebloggedFrom}
  2224. {/block:ifTumblrCaptions}
  2225.  
  2226. {block:ifNotTumblrCaptions}
  2227. <div class="caption caption-content">
  2228. {Body}
  2229. </div>
  2230. {/block:ifNotTumblrCaptions}
  2231. </div>
  2232. {/block:Text}
  2233.  
  2234. {block:Photo}
  2235. <figure class="type-photo post">
  2236. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag}
  2237. {block:Caption}
  2238. {block:ifTumblrCaptions}
  2239. {block:Notreblog}
  2240. <figcaption class="caption">
  2241. {block:IfUsernameOriginalPost}
  2242. {block:NotReblog}
  2243. <div class="caption-user">
  2244. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2245. </div>
  2246. {/block:NotReblog}
  2247. {/block:IfUsernameOriginalPost}
  2248. <div class="caption-content">{Caption}</div>
  2249. </figcaption>
  2250. {/block:Notreblog}
  2251. {block:Rebloggedfrom}
  2252. {block:Reblogs}
  2253. <div class="caption">
  2254. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2255. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2256. </div>
  2257. <figcaption class="caption-content">{Body}</figcaption>
  2258. </div>
  2259. {/block:Reblogs}
  2260. {/block:RebloggedFrom}
  2261. {/block:ifTumblrCaptions}
  2262.  
  2263. {block:ifNotTumblrCaptions}
  2264. <figcaption class="caption caption-content">
  2265. {Caption}
  2266. </figcaption>
  2267. {/block:ifNotTumblrCaptions}
  2268. {/block:Caption}
  2269. </figure>
  2270. {/block:Photo}
  2271.  
  2272. {block:Photoset}
  2273. <figure class="type-photoset post">
  2274. <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>
  2275. {block:Caption}
  2276. {block:ifTumblrCaptions}
  2277. {block:Notreblog}
  2278. <figcaption class="caption">
  2279. {block:IfUsernameOriginalPost}
  2280. {block:NotReblog}
  2281. <div class="caption-user">
  2282. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2283. </div>
  2284. {/block:NotReblog}
  2285. {/block:IfUsernameOriginalPost}
  2286. <div class="caption-content">{Caption}</div>
  2287. </figcaption>
  2288. {/block:Notreblog}
  2289. {block:Rebloggedfrom}
  2290. {block:Reblogs}
  2291. <div class="caption">
  2292. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2293. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2294. </div>
  2295. <figcaption class="caption-content">{Body}</figcaption>
  2296. </div>
  2297. {/block:Reblogs}
  2298. {/block:RebloggedFrom}
  2299. {/block:ifTumblrCaptions}
  2300.  
  2301. {block:ifNotTumblrCaptions}
  2302. <figcaption class="caption caption-content">
  2303. {Caption}
  2304. </figcaption>
  2305. {/block:ifNotTumblrCaptions}
  2306. {/block:Caption}
  2307. </figure>
  2308. {/block:Photoset}
  2309.  
  2310. {block:Quote}
  2311. <div class="type-quote post">
  2312. <blockquote>{Quote}</blockquote>
  2313.  
  2314. {block:Source}
  2315. <cite class="quote-source">
  2316. {Source}
  2317. </cite>
  2318. {/block:Source}
  2319. </div>
  2320. {/block:Quote}
  2321.  
  2322. {block:Link}
  2323. <div class="type-link post">
  2324. <div class="link-content caption">
  2325. <a href="{URL}" class="link-wrap">
  2326. {block:Thumbnail}<img class="link-image" src="{Thumbnail-HighRes}">{/block:Thumbnail}
  2327. </a>
  2328. <div class="container-link">
  2329. <h3><a href="{URL}" class="link-wrap">{Name}</a></h3>
  2330.  
  2331. {block:Excerpt}<div class="container-link-txt">{Excerpt}</div>{/block:Excerpt}
  2332. <a href="{URL}" class="link-wrap">
  2333. {block:Host}<div class="container-link-host">{Host}</div>{/block:Host}
  2334. </a>
  2335. </div>
  2336. </div>
  2337. {block:Caption}
  2338. {block:ifTumblrCaptions}
  2339. {block:Description}
  2340. {block:Notreblog}
  2341. <div class="caption">
  2342. {block:IfUsernameOriginalPost}
  2343. {block:NotReblog}
  2344. <div class="caption-user">
  2345. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2346. </div>
  2347. {/block:NotReblog}
  2348. {/block:IfUsernameOriginalPost}
  2349. <div class="caption-content">{Description}</div>
  2350. </div>
  2351. {/block:Notreblog}
  2352. {/block:Description}
  2353. {block:Rebloggedfrom}
  2354. {block:Reblogs}
  2355. <div class="caption">
  2356. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2357. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2358. </div>
  2359. <div class="caption-content">{Body}</div>
  2360. </div>
  2361. {/block:Reblogs}
  2362. {/block:RebloggedFrom}
  2363. {/block:ifTumblrCaptions}
  2364.  
  2365. {block:ifNotTumblrCaptions}
  2366. <div class="caption caption-content">
  2367. {Description}
  2368. </div>
  2369. {/block:ifNotTumblrCaptions}
  2370. {/block:Caption}
  2371. </div>
  2372. {/block:Link}
  2373.  
  2374. {block:Chat}
  2375. <div class="type-chat caption post">
  2376. {block:Title}
  2377. <h2>{Title}</h2>
  2378. {/block:Title}
  2379. {block:Lines}
  2380. {block:Label}
  2381. <div class="label">{Label}</div>
  2382. {/block:Label}
  2383. <div class="line">{Line}</div>
  2384. {/block:Lines}
  2385. </div>
  2386. {/block:Chat}
  2387.  
  2388. {block:Audio}
  2389. <div class="type-audio post">
  2390. <div class="audio">
  2391. <div class="audiobox">
  2392. <div class="button">
  2393. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  2394. </div>
  2395. </div>
  2396. <div class="album-art">
  2397. {block:AlbumArt}
  2398. <img src="{AlbumArtURL}" />
  2399. {/block:AlbumArt}
  2400. </div>
  2401.  
  2402. {block:TrackName}
  2403. <div class="audio_trackinfo">
  2404. <div class="audio_trackname">{TrackName}</div>
  2405. {block:Artist}<div class="audio_artist">{Artist}</div>{/block:Artist}
  2406. {block:Album}<div class="audio_album">{Album}</div>{/block:Album}
  2407. </div>
  2408. {/block:TrackName}
  2409. </div>
  2410. {block:Caption}
  2411. {block:ifTumblrCaptions}
  2412. {block:Notreblog}
  2413. <div class="caption">
  2414. {block:IfUsernameOriginalPost}
  2415. {block:NotReblog}
  2416. <div class="caption-user">
  2417. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2418. </div>
  2419. {/block:NotReblog}
  2420. {/block:IfUsernameOriginalPost}
  2421. <div class="caption-content">{Caption}</div>
  2422. </div>
  2423. {/block:Notreblog}
  2424. {block:Rebloggedfrom}
  2425. {block:Reblogs}
  2426. <div class="caption">
  2427. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2428. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2429. </div>
  2430. <div class="caption-content">{Body}</div>
  2431. </div>
  2432. {/block:Reblogs}
  2433. {/block:RebloggedFrom}
  2434. {/block:ifTumblrCaptions}
  2435.  
  2436. {block:ifNotTumblrCaptions}
  2437. <div class="caption caption-content">
  2438. {Caption}
  2439. </div>
  2440. {/block:ifNotTumblrCaptions}
  2441. {/block:Caption}
  2442. </div>
  2443. {/block:Audio}
  2444.  
  2445. {block:Video}
  2446. <div class="type-video post video">
  2447. {Video-500}
  2448. {block:Caption}
  2449. {block:ifTumblrCaptions}
  2450. {block:Notreblog}
  2451. <div class="caption">
  2452. {block:IfUsernameOriginalPost}
  2453. {block:NotReblog}
  2454. <div class="caption-user">
  2455. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2456. </div>
  2457. {/block:NotReblog}
  2458. {/block:IfUsernameOriginalPost}
  2459. <div class="caption-content">{Caption}</div>
  2460. </div>
  2461. {/block:Notreblog}
  2462. {block:Rebloggedfrom}
  2463. {block:Reblogs}
  2464. <div class="caption">
  2465. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2466. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2467. </div>
  2468. <div class="caption-content">{Body}</div>
  2469. </div>
  2470. {/block:Reblogs}
  2471. {/block:RebloggedFrom}
  2472. {/block:ifTumblrCaptions}
  2473.  
  2474. {block:ifNotTumblrCaptions}
  2475. <div class="caption caption-content">
  2476. {Caption}
  2477. </div>
  2478. {/block:ifNotTumblrCaptions}
  2479. {/block:Caption}
  2480. </div>
  2481. {/block:Video}
  2482.  
  2483.  
  2484. {block:Answer}
  2485. <div class="type-ask">
  2486. <div class="ask">
  2487. <span class="ask-question">
  2488. {Question}
  2489. </span>
  2490. <span class="clearfix"></span>
  2491.  
  2492. <span class="ask-user">
  2493. {lang:Asked by Asker 2}
  2494. </span>
  2495. </div>
  2496. {block:Answerer}
  2497. <div class="caption">
  2498. {block:ifTumblrCaptions}
  2499. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2500. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Answerer}</a>
  2501. </div>
  2502. {/block:ifTumblrCaptions}
  2503. <div class="ask-answer caption-content">
  2504. {Answer}
  2505. </div>
  2506. </div>
  2507. {/block:Answerer}
  2508. {block:ifTumblrCaptions}
  2509. {block:NotReblog}
  2510. <div class="caption">
  2511. {block:IfUsernameOriginalPost}
  2512. {block:NotReblog}
  2513. <div class="caption-user">
  2514. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Name}</a>
  2515. </div>
  2516. {/block:NotReblog}
  2517. {/block:IfUsernameOriginalPost}
  2518. <div class="caption-content">{Replies}</div>
  2519. </div>
  2520. {/block:NotReblog}
  2521. {block:Rebloggedfrom}
  2522. {block:Reblogs}
  2523. <div class="caption">
  2524. <div class="caption-user {block:IsDeactivated}deactive{/block:IsDeactivated}">
  2525. <a target="_blank" href="{Permalink}"><i data-feather="user" class="feather"></i>{Username}</a>
  2526. </div>
  2527. <div class="caption-content">{Body}</div>
  2528. </div>
  2529. {/block:Reblogs}
  2530. {/block:RebloggedFrom}
  2531. {/block:ifTumblrCaptions}
  2532.  
  2533. {block:ifNotTumblrCaptions}
  2534. <div class="caption caption-content">
  2535. {Replies}
  2536. </div>
  2537. {/block:ifNotTumblrCaptions}
  2538. </div>
  2539. {/block:Answer}
  2540.  
  2541. {block:Date}
  2542. <div class="container-date">
  2543. {block:HasTags}
  2544. <ul class="container-tags">
  2545. {block:Tags}<li class="container-tags-info"><a href="{TagURL}">#{Tag}</a> </li>{/block:Tags}
  2546. </ul>
  2547. {/block:HasTags}
  2548.  
  2549. <div class="container-date-tags-info">
  2550. <div class="reblog">
  2551. <a target="_blank" href="{ReblogURL}" target="_blank"> reblog</a>
  2552. </div>
  2553.  
  2554. <div class="pinned-post">
  2555. {block:PinnedPostLabel}
  2556. <a href="{Permalink}">{PinnedPostLabel} <span class="sf sf-push-pin-o"></span>
  2557. </a>
  2558. {/block:PinnedPostLabel}
  2559. </div>
  2560.  
  2561. <div class="like-button">
  2562. <a class="like-b" href="#">
  2563. {LikeButton}<span class="b">like</span>
  2564. </a>
  2565. </div>
  2566. </div>
  2567. </div>
  2568. {/block:Date}
  2569. </article>
  2570. {block:PostNotes}
  2571. <div class="post-notes">
  2572. {PostNotes}
  2573. </div>
  2574. {/block:PostNotes}
  2575. {/block:Posts}
  2576. </main>
  2577.  
  2578. <div class="mcredito">
  2579. {block:Pagination}
  2580. <div id="mobile-pagination">
  2581. {block:PreviousPage}<a href="{PreviousPage}">{lang:Previous page}</a> <span class="dot-separator"></span> {/block:PreviousPage}
  2582. {block:NextPage}<a href="{NextPage}">{lang:Next page}</a>{/block:NextPage} <span class="dot-separator"></span>
  2583. </div>
  2584. {/block:Pagination}
  2585. <a class="scrolltop" href="javascript:;" id="scrollToTop" title="Scroll to top">
  2586. <i data-feather="arrow-up" class="feather"></i>
  2587. </a>
  2588. <a href="http://maziekeen.tumblr.com/" target="_blank">maziekeen</a>
  2589. </div>
  2590. </div>
  2591.  
  2592. <!-- top right icon for custom tumblr controls -->
  2593. {block:ifCustomControls}
  2594. <div class="hcontrols"><i data-feather="more-horizontal" class="feather"></i></div>
  2595. {/block:ifCustomControls}
  2596.  
  2597.  
  2598. {block:ifNotDisableSwitchThemeColor}
  2599. <!-- scripts for dark theme -->
  2600. <script type="text/javascript">
  2601. // The icons
  2602. const sunIcon = '<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>';
  2603.  
  2604. const moonIcon = '<svg viewBox="0 0 24 24" width="24" height="24" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>';
  2605.  
  2606. // Get the div where the icons will be added
  2607. const themeIcon = document.querySelector('.slider');
  2608.  
  2609. // Get the current theme from local storage
  2610. const currentTheme = localStorage.getItem('theme') ? localStorage.getItem('theme') : null;
  2611.  
  2612. // Get the theme toggle input
  2613. const toggleSwitch = document.querySelector('.theme-switch input[type="checkbox"]');
  2614.  
  2615.  
  2616. // Check for saved user preference and set the icons for the respective theme accordingly
  2617. if (currentTheme === 'dark') {
  2618. document.documentElement.setAttribute('data-theme', currentTheme);
  2619. toggleSwitch.checked = true;
  2620. themeIcon.innerHTML = sunIcon;
  2621. } else {
  2622. document.documentElement.setAttribute('data-theme', currentTheme);
  2623. toggleSwitch.checked = false;
  2624. themeIcon.innerHTML = moonIcon;
  2625. }
  2626.  
  2627.  
  2628. // Function that will switch the theme based on the if the theme toggle is checked or not
  2629. function switchTheme(e) {
  2630. if (e.target.checked) {
  2631. document.documentElement.setAttribute('data-theme', 'dark');
  2632. localStorage.setItem('theme', 'dark');
  2633. themeIcon.innerHTML = sunIcon;
  2634. toggleSwitch.checked = true;
  2635. } else {
  2636. document.documentElement.setAttribute('data-theme', 'light');
  2637. localStorage.setItem('theme', 'light');
  2638. themeIcon.innerHTML = moonIcon;
  2639. toggleSwitch.checked = false;
  2640. }
  2641. }
  2642.  
  2643. // Add an event listener to the theme toggle, which will switch the theme
  2644. toggleSwitch.addEventListener('change', switchTheme, false);
  2645. </script>
  2646. {/block:ifNotDisableSwitchThemeColor}
  2647.  
  2648. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  2649. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
  2650. <script src="https://unpkg.com/popper.js@1"></script> <!-- tooltips -->
  2651. <script src="https://unpkg.com/tippy.js@5/dist/tippy-bundle.iife.js"></script> <!-- tooltips -->
  2652. <script src="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script> <!-- resize videos -->
  2653. <script src="//npf-images-v3.github.io/script.js"></script> <!-- npf images readjustment -->
  2654. <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css"> <!-- npf images readjustment -->
  2655. <script src="https://static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script> <!-- photosets -->
  2656. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.min.js"></script> <!-- smooth scroll -->
  2657. <script src="https://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script> <!-- scroll to top -->
  2658.  
  2659. <script type="text/javascript">
  2660.  
  2661. // menu hamburguer / mobile
  2662. const btnMobile = document.getElementById('btn-mobile');
  2663.  
  2664. function toggleMenu(event) {
  2665. if (event.type === 'touchstart') event.preventDefaut();
  2666. const sidebarMobile = document.getElementById('sidebar-mobile');
  2667. sidebarMobile.classList.toggle('active');
  2668. const active = sidebarMobile.classList.contains('active');
  2669. event.currentTarget.setAttribute('aria-expanded', active);
  2670. if(active) {
  2671. event.currentTarget.setAttribute('aria-label', 'Fechar Menu')
  2672. } else {
  2673. event.currentTarget.setAttribute('aria-label', 'Abrir Menu')
  2674. }
  2675. }
  2676.  
  2677.  
  2678. btnMobile.addEventListener('click', toggleMenu);
  2679. btnMobile.addEventListener('touchstart', toggleMenu);
  2680.  
  2681. // tooltips
  2682. tippy('a[title], span[title], div[title]', {
  2683. theme: 'custom',
  2684. arrow: false,
  2685. zIndex: 9999999999,
  2686. maxWidth: 300,
  2687.  
  2688. content(reference) {
  2689. const title = reference.getAttribute('title');
  2690. reference.removeAttribute('title');
  2691. return title;
  2692. },
  2693. });
  2694.  
  2695. // custom notecount
  2696. var $container = $('.theme-container');
  2697. $container.find('.notecount').each(function(){
  2698. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  2699. if (n > 999) {
  2700. n = Math.floor(n / 100) / 10;
  2701. $(this).text(n + 'k notes');
  2702. }
  2703. });
  2704.  
  2705. // search box
  2706. $(document).ready(function(){
  2707. $('.search').submit(function(event){
  2708. var value = $('input:first').val();
  2709. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  2710. });
  2711. });
  2712.  
  2713.  
  2714. // initialize css photosets
  2715. function gatherData(images, arr) {
  2716. for (let i = 0; i < images.length; i++) {
  2717. let currentData = {
  2718. "width": images[i].getAttribute('data-width'),
  2719. "height": images[i].getAttribute('data-height'),
  2720. "low_res": images[i].getAttribute('data-lowres'),
  2721. "high_res": images[i].getAttribute('data-highres')
  2722. };
  2723. arr.push(currentData);
  2724. }
  2725. }
  2726. function getIndex(elem) {
  2727. let i = 0;
  2728. while( (elem = elem.previousElementSibling) != null ) i++;
  2729. return i;
  2730. }
  2731. function lightbox(elem) {
  2732. let currentPhotoset = elem.parentNode;
  2733. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  2734. let data = [];
  2735. gatherData(photosetPhotos, data);
  2736. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  2737. }
  2738.  
  2739. // detach sidebar on small screens
  2740. var sidebarBottom = document.querySelector('.sidebar-content');
  2741. var selectedSidebarBottom = sidebarBottom.getBoundingClientRect().bottom;
  2742. var selectedSidebarWidth = sidebarBottom.getBoundingClientRect().width;
  2743. var windowHeight = $(window).height();
  2744.  
  2745. if(selectedSidebarBottom >= windowHeight) {
  2746. $('.sidebar-content').css('position', 'static');
  2747. $('#mobile-pagination').css({'visibility': 'visible','overflow':'visible','display': 'inline-block', 'margin-right':'1rem'});
  2748. }
  2749.  
  2750.  
  2751. // feather icons (custom icons)
  2752. feather.replace();
  2753.  
  2754. </script>
  2755. </body>
  2756.  
  2757. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement