API tools faq
paste
Advertisement
plutoniumthm

Theme 02 - Stockholm [updated 09.23.2020]

plutoniumthm
Jun 18th, 2019 (edited)
2,218
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.26 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4.  
  5. <!---
  6.  
  7. Stockholm
  8. astrocodes @ tumblr
  9.  
  10. Loosely based on the original Redux theme. NOT a Redux edit.
  11.  
  12. --->
  13.  
  14. <meta name="color:Background" content="#f0f0f0">
  15. <meta name="color:Accent" content="#00bbcc">
  16. <meta name="color:Text" content="#333">
  17. <meta name="color:Sidebar Links Text" content="#333">
  18. <meta name="color:Sidebar Links Hover" content="#00bbcc">
  19. <meta name="color:Follow Link Text" content="#fff">
  20. <meta name="color:Post BG" content="#fff">
  21. <meta name="color:Sidebar BG" content="#fff">
  22. <meta name="color:Sidebar Image BG" content="#fff">
  23.  
  24. <meta name="if:Extra Links" content="0">
  25. <meta name="if:Social Media Links" content="0">
  26. <meta name="if:Link Transition Effect" content="0">
  27. <meta name="if:Circular Sidebar Image" content="0">
  28. <meta name="if:Borders" content="0">
  29. <meta name="if:Shadows" content="1">
  30. <meta name="if:Show Tags" content="1">
  31.  
  32. <meta name="select:Font" content="Fira Mono" title="Fira Mono">
  33. <meta name="select:Font" content="Roboto Mono" title="Roboto Mono">
  34. <meta name="select:Font" content="IBM Plex Mono" title="IBM Plex Mono">
  35. <meta name="select:Font" content="Space Mono" title="Space Mono">
  36. <meta name="select:Font" content="IBM Plex Sans" title="IBM Plex Sans">
  37. <meta name="select:Font" content="Roboto" title="Roboto">
  38. <meta name="select:Font" content="Overpass" title="Overpass">
  39. <meta name="select:Font" content="Karla" title="Karla">
  40. <meta name="select:Font" content="Lato" title="Lato">
  41. <meta name="select:Font" content="Nunito Sans" title="Nunito Sans">
  42. <meta name="select:Font" content="Work Sans" title="Work Sans">
  43. <meta name="select:Font" content="Chivo" title="Chivo">
  44. <meta name="select:Font" content="Inter" title="Inter">
  45. <meta name="select:Font" content="Roboto Slab" title="Roboto Slab">
  46. <meta name="select:Font" content="Merriweather" title="Merriweather">
  47.  
  48. <meta name="select:Link One Icon" content="far fa-user" title="User">
  49. <meta name="select:Link One Icon" content="far fa-ellipsis-h" title="Ellipsis">
  50. <meta name="select:Link One Icon" content="far fa-address-card" title="Info Card">
  51. <meta name="select:Link One Icon" content="far fa-bookmark" title="Bookmark">
  52. <meta name="select:Link One Icon" content="fab fa-deviantart" title="Deviantart">
  53. <meta name="select:Link One Icon" content="fab fa-ello" title="Ello">
  54. <meta name="select:Link One Icon" content="fab fa-facebook" title="Facebook">
  55. <meta name="select:Link One Icon" content="fab fa-facebook-f" title="Facebook 2">
  56. <meta name="select:Link One Icon" content="fab fa-github" title="Github">
  57. <meta name="select:Link One Icon" content="fab fa-github-alt" title="Github 2">
  58. <meta name="select:Link One Icon" content="far fa-images" title="Photos">
  59. <meta name="select:Link One Icon" content="fab fa-instagram" title="Instagram">
  60. <meta name="select:Link One Icon" content="far fa-list-alt" title="List">
  61. <meta name="select:Link One Icon" content="far fa-paragraph" title="Paragraph">
  62. <meta name="select:Link One Icon" content="far fa-pen-fancy" title="Pen">
  63. <meta name="select:Link One Icon" content="far fa-pen-nib" title="Pen Nib">
  64. <meta name="select:Link One Icon" content="far fa-pencil-alt" title="Pencil">
  65. <meta name="select:Link One Icon" content="far fa-highlighter" title="Highlighter">
  66. <meta name="select:Link One Icon" content="fab fa-pinterest-p" title="Pinterest">
  67. <meta name="select:Link One Icon" content="fab fa-reddit-alien" title="Reddit">
  68. <meta name="select:Link One Icon" content="far fa-sticky-note" title="Sticky Note">
  69. <meta name="select:Link One Icon" content="fab fa-tumblr" title="Tumblr">
  70.  
  71.  
  72. <meta name="select:Link Two Icon" content="far fa-user" title="User">
  73. <meta name="select:Link Two Icon" content="far fa-ellipsis-h" title="Ellipsis">
  74. <meta name="select:Link Two Icon" content="far fa-address-card" title="Info Card">
  75. <meta name="select:Link Two Icon" content="far fa-bookmark" title="Bookmark">
  76. <meta name="select:Link Two Icon" content="fab fa-deviantart" title="Deviantart">
  77. <meta name="select:Link Two Icon" content="fab fa-ello" title="Ello">
  78. <meta name="select:Link Two Icon" content="fab fa-facebook" title="Facebook">
  79. <meta name="select:Link Two Icon" content="fab fa-facebook-f" title="Facebook 2">
  80. <meta name="select:Link Two Icon" content="fab fa-github" title="Github">
  81. <meta name="select:Link Two Icon" content="fab fa-github-alt" title="Github 2">
  82. <meta name="select:Link Two Icon" content="far fa-images" title="Photos">
  83. <meta name="select:Link Two Icon" content="fab fa-instagram" title="Instagram">
  84. <meta name="select:Link Two Icon" content="far fa-list-alt" title="List">
  85. <meta name="select:Link Two Icon" content="far fa-paragraph" title="Paragraph">
  86. <meta name="select:Link Two Icon" content="far fa-pen-fancy" title="Pen">
  87. <meta name="select:Link Two Icon" content="far fa-pen-nib" title="Pen Nib">
  88. <meta name="select:Link Two Icon" content="far fa-pencil-alt" title="Pencil">
  89. <meta name="select:Link Two Icon" content="far fa-highlighter" title="Highlighter">
  90. <meta name="select:Link Two Icon" content="fab fa-pinterest-p" title="Pinterest">
  91. <meta name="select:Link Two Icon" content="fab fa-reddit-alien" title="Reddit">
  92. <meta name="select:Link Two Icon" content="far fa-sticky-note" title="Sticky Note">
  93. <meta name="select:Link Two Icon" content="fab fa-tumblr" title="Tumblr">
  94.  
  95.  
  96. <meta name="select:Link Three Icon" content="far fa-user" title="User">
  97. <meta name="select:Link Three Icon" content="far fa-ellipsis-h" title="Ellipsis">
  98. <meta name="select:Link Three Icon" content="far fa-address-card" title="Info Card">
  99. <meta name="select:Link Three Icon" content="far fa-bookmark" title="Bookmark">
  100. <meta name="select:Link Three Icon" content="fab fa-deviantart" title="Deviantart">
  101. <meta name="select:Link Three Icon" content="fab fa-ello" title="Ello">
  102. <meta name="select:Link Three Icon" content="fab fa-facebook" title="Facebook">
  103. <meta name="select:Link Three Icon" content="fab fa-facebook-f" title="Facebook 2">
  104. <meta name="select:Link Three Icon" content="fab fa-github" title="Github">
  105. <meta name="select:Link Three Icon" content="fab fa-github-alt" title="Github 2">
  106. <meta name="select:Link Three Icon" content="far fa-images" title="Photos">
  107. <meta name="select:Link Three Icon" content="fab fa-instagram" title="Instagram">
  108. <meta name="select:Link Three Icon" content="far fa-list-alt" title="List">
  109. <meta name="select:Link Three Icon" content="far fa-paragraph" title="Paragraph">
  110. <meta name="select:Link Three Icon" content="far fa-pen-fancy" title="Pen">
  111. <meta name="select:Link Three Icon" content="far fa-pen-nib" title="Pen Nib">
  112. <meta name="select:Link Three Icon" content="far fa-pencil-alt" title="Pencil">
  113. <meta name="select:Link Three Icon" content="far fa-highlighter" title="Highlighter">
  114. <meta name="select:Link Three Icon" content="fab fa-pinterest-p" title="Pinterest">
  115. <meta name="select:Link Three Icon" content="fab fa-reddit-alien" title="Reddit">
  116. <meta name="select:Link Three Icon" content="far fa-sticky-note" title="Sticky Note">
  117. <meta name="select:Link Three Icon" content="fab fa-tumblr" title="Tumblr">
  118.  
  119.  
  120. <meta name="select:Link Four Icon" content="far fa-user" title="User">
  121. <meta name="select:Link Four Icon" content="far fa-ellipsis-h" title="Ellipsis">
  122. <meta name="select:Link Four Icon" content="far fa-address-card" title="Info Card">
  123. <meta name="select:Link Four Icon" content="far fa-bookmark" title="Bookmark">
  124. <meta name="select:Link Four Icon" content="fab fa-deviantart" title="Deviantart">
  125. <meta name="select:Link Four Icon" content="fab fa-ello" title="Ello">
  126. <meta name="select:Link Four Icon" content="fab fa-facebook" title="Facebook">
  127. <meta name="select:Link Four Icon" content="fab fa-facebook-f" title="Facebook 2">
  128. <meta name="select:Link Four Icon" content="fab fa-github" title="Github">
  129. <meta name="select:Link Four Icon" content="fab fa-github-alt" title="Github 2">
  130. <meta name="select:Link Four Icon" content="far fa-images" title="Photos">
  131. <meta name="select:Link Four Icon" content="fab fa-instagram" title="Instagram">
  132. <meta name="select:Link Four Icon" content="far fa-list-alt" title="List">
  133. <meta name="select:Link Four Icon" content="far fa-paragraph" title="Paragraph">
  134. <meta name="select:Link Four Icon" content="far fa-pen-fancy" title="Pen">
  135. <meta name="select:Link Four Icon" content="far fa-pen-nib" title="Pen Nib">
  136. <meta name="select:Link Four Icon" content="far fa-pencil-alt" title="Pencil">
  137. <meta name="select:Link Four Icon" content="far fa-highlighter" title="Highlighter">
  138. <meta name="select:Link Four Icon" content="fab fa-pinterest-p" title="Pinterest">
  139. <meta name="select:Link Four Icon" content="fab fa-reddit-alien" title="Reddit">
  140. <meta name="select:Link Four Icon" content="far fa-sticky-note" title="Sticky Note">
  141. <meta name="select:Link Four Icon" content="fab fa-tumblr" title="Tumblr">
  142.  
  143.  
  144. <meta name="text:Link One Name" content="Link One">
  145. <meta name="text:Link One URL" content="/">
  146.  
  147. <meta name="text:Link Two Name" content="Link Two">
  148. <meta name="text:Link Two URL" content="/">
  149.  
  150. <meta name="text:Link Three Name" content="Link Three">
  151. <meta name="text:Link Three URL" content="/">
  152.  
  153. <meta name="text:Link Four Name" content="Link Four">
  154. <meta name="text:Link Four URL" content="/">
  155.  
  156.  
  157.  
  158. <!--- google fonts --->
  159. <link href="https://fonts.googleapis.com/css?family=Fira+Mono:400,700|IBM+Plex+Mono:400,400i,700,700i|IBM+Plex+Sans:400,400i,700,700i|Karla:400,400i,700,700i|Lato:400,400i,700,700i|Merriweather:400,400i,700,700i|Nunito+Sans:400,400i,700,700i|Roboto+Mono:400,400i,700,700i|Roboto+Slab:400,700|Roboto:400,400i,700,700i|Space+Mono:400,400i,700,700i|Work+Sans:400,700|Chivo:400,400i,700,700i|Overpass:400,400i,700,700i&display=swap" rel="stylesheet">
  160.  
  161. <!--- icon font --->
  162. <script src="https://kit.fontawesome.com/3faf027509.js" crossorigin="anonymous"></script>
  163.  
  164. <!--- audio player styling --->
  165. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  166.  
  167. <!-- smooth scroll -->
  168. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  169.  
  170. <!-- un-nest captions -->
  171. <script src="https://static.tumblr.com/p0knose/8Hbocatf1/unnest.min.js" type="text/javascript"></script>
  172.  
  173. <script type="text/javascript">
  174. $(document).ready(function(){
  175. $("article").unNest({
  176. yourCaption:".caption",
  177. newCaptionUsername:true,
  178. tumblrAvatars:true,
  179. usernameColon:false
  180. });
  181. });
  182. </script>
  183.  
  184.  
  185.  
  186. <style type="text/css">
  187.  
  188. @import url('https://rsms.me/inter/inter.css');
  189.  
  190. body {
  191. font-family:{select:font};
  192. background:{color:background};
  193. margin:100px;
  194. margin-top:50px;
  195. color:{color:text};
  196. }
  197.  
  198. a {
  199. color:{color:accent};
  200. {block:iflinktransitioneffect}
  201. transition:.3s;
  202. border-bottom:1px solid;
  203. text-decoration:none;
  204. {/block:iflinktransitioneffect}
  205. font-weight:700;
  206. }
  207.  
  208. a:hover {
  209. color:{color:text};
  210. text-decoration:none;
  211. {block:iflinktransitioneffect}
  212. transition:.3s;
  213. border-bottom:1px solid transparent;
  214. text-decoration:none;
  215. {/block:iflinktransitioneffect}
  216. }
  217.  
  218. ::selection {
  219. background:{color:accent};
  220. color:#fff;
  221. }
  222.  
  223.  
  224.  
  225.  
  226. /* ---- BLOG TITLE ---- */
  227.  
  228. .title {
  229. font-size:40px;
  230. font-weight:700;
  231. color:rgba(87,220,196,0.7);
  232. margin-bottom:50px;
  233. text-transform:capitalize;
  234. margin-left:400px;
  235. }
  236.  
  237. .title a {
  238. color:{color:text};
  239. text-decoration:none;
  240. border:none;
  241. }
  242.  
  243.  
  244.  
  245.  
  246. /* ---- POSTS ---- */
  247.  
  248. article {
  249. background:{color:post bg};
  250. width:500px;
  251. padding:30px;
  252. margin-left:400px;
  253. margin-bottom:100px;
  254. border-radius:3px;
  255. padding-bottom:0px;
  256. {block:ifborders}
  257. border:1px solid rgba(0,0,0,0.1);
  258. {/block:ifborders}
  259. {block:ifshadows}
  260. box-shadow: 0px 18px 65px -18px rgba(0,0,0,0.1);
  261. {/block:ifshadows}
  262. }
  263.  
  264. article img {
  265. width:500px;
  266. }
  267.  
  268. article .caption img {
  269. border-radius:5px;
  270. max-width:100%;
  271. }
  272.  
  273. article img.photo {
  274. border-radius:5px;
  275. }
  276.  
  277. article .video {
  278. margin-top:10px;
  279. width:500px!important;
  280. border-radius:5px!important;
  281. }
  282.  
  283. .caption {
  284. margin-top:20px;
  285. margin-left:-10px;
  286. }
  287.  
  288. .caption img {
  289. max-width:500px;
  290. margin-top:10px;
  291. }
  292.  
  293. /* reblogs */
  294. blockquote.tumblr_parent {
  295. margin-left:10px;
  296. padding-left:20px;
  297. padding-top:10px;
  298. padding-bottom:1px;
  299. padding-right:20px;
  300. width:520px;
  301. max-width:520px;
  302. margin-left:-20px;
  303. word-break:break-word;
  304. color:{color:text};
  305. margin-top:10px;
  306. font-size:12px;
  307. border-top:1px solid rgba(0,0,0,0.1);
  308. line-height:20px;
  309. }
  310.  
  311. /* non-reblogged original post */
  312. .originalpost blockquote.tumblr_parent {
  313. width:480px;
  314. margin:0;
  315. color:{color:text};
  316. border:none;
  317. background:transparent!important;
  318. padding-left:0px;
  319. font-size:12px;
  320. text-align:left;
  321. }
  322.  
  323. /* non-reblogged original post */
  324. .caption.originalpost {
  325. margin:-5px 0;
  326. line-height:30px;
  327. background:transparent!important;
  328. border:none;
  329. font-size:12px;
  330. }
  331.  
  332. /* reblogs; tumblr user icons */
  333. img.tumblr_avatar {
  334. margin-right:10px;
  335. margin-top:2px!important;
  336. height:25px;
  337. width:25px;
  338. margin-left:0px;
  339. border:3px solid {color:background};
  340. float:left;
  341. border-radius:100%!important;
  342. vertical-align:middle!important;
  343. color:#fff;
  344. }
  345.  
  346. /* reblogs; tumblr user names */
  347. .caption a.tumblr_blog {
  348. font-size:12px;
  349. line-height:20px;
  350. color:{color:text};
  351. display:block;
  352. padding:5px;
  353. padding-bottom:10px;
  354. font-weight:700;
  355. background:transparent;
  356. margin-top:2px;
  357. border:none;
  358. }
  359.  
  360. /* reblogs; tumblr user names hover */
  361. .caption a:hover.tumblr_blog {
  362. color:{color:text};
  363. }
  364.  
  365.  
  366.  
  367.  
  368. /* ---- QUOTE POSTS ---- */
  369.  
  370. .quote {
  371. font-weight:700;
  372. font-size:25px;
  373. color:{color:text};
  374. }
  375.  
  376. .source {
  377. margin-top:20px;
  378. color:{color:text};
  379. font-size:12px;
  380. }
  381.  
  382.  
  383.  
  384.  
  385. /* ---- POST INFO AND TAGS ---- */
  386.  
  387. .postinfo {
  388. border-top:1px solid rgba(0,0,0,0.1);
  389. color:{color:text};
  390. margin-top:30px;
  391. padding:15px;
  392. font-size:12px;
  393. margin-left:-30px;
  394. width:500px;
  395. padding-left:30px;
  396. padding-right:30px;
  397. }
  398.  
  399. .postinfo_notes {
  400. float:right;
  401. }
  402.  
  403. .tags {
  404. border-top:1px solid rgba(0,0,0,0.1);
  405. padding:15px;
  406. font-size:12px;
  407. margin-left:-30px;
  408. width:515px;
  409. padding-left:30px;
  410. line-height:20px;
  411. {block:ifnotshowtags}
  412. display:none;
  413. {/block:ifnotshowtags}
  414. }
  415.  
  416. .tags a {
  417. color:{color:text};
  418. padding:3px;
  419. border-radius:3px;
  420. border:none;
  421. font-weight:400;
  422. }
  423.  
  424. .tags a:hover {
  425. background:{color:accent};
  426. color:#fff;
  427. }
  428.  
  429.  
  430.  
  431. /* ---- SIDEBAR ---- */
  432.  
  433. .sidebar {
  434. width:250px;
  435. border-radius:3px;
  436. background:{color:sidebar bg};
  437. padding:25px;
  438. padding-bottom:15px;
  439. position:fixed;
  440. margin-right:0px;
  441. {block:ifborders}
  442. border:1px solid rgba(0,0,0,0.1);
  443. {/block:ifborders}
  444. {block:ifshadows}
  445. box-shadow: 0px 18px 65px -18px rgba(0,0,0,0.1);
  446. {/block:ifshadows}
  447. text-align:center;
  448. }
  449.  
  450. .sidebar img {
  451. padding:5px;
  452. background:{color:sidebar image bg};
  453. margin-top:-50px;
  454. border-radius:3px;
  455. {block:ifcircularsidebarimage}
  456. border-radius:100%;
  457. {/block:ifcircularsidebarimage}
  458. transition:.5s;
  459. {block:ifborders}
  460. border:1px solid rgba(0,0,0,0.1);
  461. {/block:ifborders}
  462. }
  463.  
  464. .sidebar:hover img {
  465. transition:.5s;
  466. }
  467.  
  468. .desc {
  469. font-size:12px;
  470. margin-top:20px;
  471. line-height:20px;
  472. text-align:center;
  473. color:{color:text};
  474. }
  475.  
  476. .search {
  477. outline:none;
  478. color:{color:text};
  479. border:none;
  480. padding:10px;
  481. font-family:{select:font};
  482. font-size:12px;
  483. background:{color:accent};
  484. margin-top:20px;
  485. width:calc(100% - 20px);
  486. text-align:center;
  487. transition:.3s;
  488. border-radius:3px;
  489. }
  490.  
  491. .search:hover {
  492. }
  493.  
  494.  
  495. input[type=text] {
  496. color:{color:accent};
  497. }
  498.  
  499. input[type=text]:focus {
  500. border-radius:3px;
  501. color:{color:accent};
  502. background:none;
  503. box-shadow: inset 0px 0px 0px 2px {color:accent};
  504. }
  505.  
  506. input::placeholder {
  507. color:{color:sidebar bg};
  508. }
  509.  
  510. input[type=submit] {
  511. display:none
  512. }
  513.  
  514. .follow {
  515. margin-top:10px;
  516. font-size:12px;
  517. width:100%;
  518. }
  519.  
  520. .follow a {
  521. background:{color:accent};
  522. color:{color:follow link text};
  523. padding:10px;
  524. display:block;
  525. border-radius:3px;
  526. text-align:center;
  527. text-decoration:none;
  528. border:none;
  529. font-weight:normal;
  530. }
  531.  
  532. .follow a:hover {
  533. background:none;
  534. box-shadow: inset 0px 0px 0px 2px {color:accent};
  535. color:{color:accent};
  536. }
  537.  
  538. .fa-plus {
  539. margin-right:10px;
  540. }
  541.  
  542. .nav {
  543. margin-top:30px;
  544. text-align:left;
  545. width:300px;
  546. }
  547.  
  548. .nav a {
  549. display:inline-block;
  550. color:{color:sidebar links text};
  551. font-size:11px;
  552. text-decoration:none;
  553. text-align:center;
  554. padding:9px;
  555. text-transform:capitalize;
  556. border-radius:3px;
  557. width:104px;
  558. margin-right:2px;
  559. margin-bottom:7px;
  560. letter-spacing:0.5px;
  561. border:none;
  562. font-weight:normal;
  563. }
  564.  
  565. .nav a:hover {
  566. background:none;
  567. color:{color:sidebar links hover};
  568. }
  569.  
  570. .fa-envelope, .fa-calendar-alt, .fa-user, .fa-ellipsis-h, .fa-address-card, .fa-bookmark, .fa-deviantart, .fa-ello, .fa-facebook, .fa-facebook-f, .fa-github, .fa-github-alt, .fa-images, .fa-instagram, .fa-list-alt, .fa-paragraph, .fa-pen-fancy, .fa-pen-nib, .fa-pencil-alt, .fa-pinterest-p, .fa-reddit-alien, .fa-sticky-note, .fa-tumblr, .fa-highlighter {
  571. margin-left:5px;
  572. margin-right:5px;
  573. margin-bottom:5px;
  574. font-size:13px;
  575. transition:.3s;
  576. color:{color:sidebar links text};
  577. }
  578.  
  579. .nav a:hover .fa-envelope {
  580. transform:translateY(-3px);
  581. transition:.3s;
  582. color:{color:sidebar links hover};
  583. }
  584.  
  585. .nav a:hover .fa-calendar-alt {
  586. transform:translateY(-3px);
  587. transition:.3s;
  588. color:{color:sidebar links hover};
  589. }
  590.  
  591. .nav a:hover .fa-user {
  592. transform:translateY(-3px);
  593. transition:.3s;
  594. color:{color:sidebar links hover};
  595. }
  596.  
  597. .nav a:hover .fa-ellipsis-h {
  598. transform:translateY(-3px);
  599. transition:.3s;
  600. color:{color:sidebar links hover};
  601. }
  602.  
  603. .nav a:hover .fa-address-card {
  604. transform:translateY(-3px);
  605. transition:.3s;
  606. color:{color:sidebar links hover};
  607. }
  608.  
  609. .nav a:hover .fa-bookmark {
  610. transform:translateY(-3px);
  611. transition:.3s;
  612. color:{color:sidebar links hover};
  613. }
  614.  
  615. .nav a:hover .fa-deviantart {
  616. transform:translateY(-3px);
  617. transition:.3s;
  618. color:{color:sidebar links hover};
  619. }
  620.  
  621. .nav a:hover .fa-ello {
  622. transform:translateY(-3px);
  623. transition:.3s;
  624. color:{color:sidebar links hover};
  625. }
  626.  
  627. .nav a:hover .fa-facebook {
  628. transform:translateY(-3px);
  629. transition:.3s;
  630. color:{color:sidebar links hover};
  631. }
  632.  
  633. .nav a:hover .fa-facebook-f {
  634. transform:translateY(-3px);
  635. transition:.3s;
  636. color:{color:sidebar links hover};
  637. }
  638.  
  639. .nav a:hover .fa-github {
  640. transform:translateY(-3px);
  641. transition:.3s;
  642. color:{color:sidebar links hover};
  643. }
  644.  
  645. .nav a:hover .fa-github-alt {
  646. transform:translateY(-3px);
  647. transition:.3s;
  648. color:{color:sidebar links hover};
  649. }
  650.  
  651. .nav a:hover .fa-images {
  652. transform:translateY(-3px);
  653. transition:.3s;
  654. color:{color:sidebar links hover};
  655. }
  656.  
  657. .nav a:hover .fa-instagram {
  658. transform:translateY(-3px);
  659. transition:.3s;
  660. color:{color:sidebar links hover};
  661. }
  662.  
  663. .nav a:hover .fa-list-alt {
  664. transform:translateY(-3px);
  665. transition:.3s;
  666. color:{color:sidebar links hover};
  667. }
  668.  
  669. .nav a:hover .fa-paragraph {
  670. transform:translateY(-3px);
  671. transition:.3s;
  672. color:{color:sidebar links hover};
  673. }
  674.  
  675. .nav a:hover .fa-pen-fancy {
  676. transform:translateY(-3px);
  677. transition:.3s;
  678. color:{color:sidebar links hover};
  679. }
  680.  
  681. .nav a:hover .fa-pen-nib {
  682. transform:translateY(-3px);
  683. transition:.3s;
  684. color:{color:sidebar links hover};
  685. }
  686. .nav a:hover .fa-pencil-alt {
  687. transform:translateY(-3px);
  688. transition:.3s;
  689. color:{color:sidebar links hover};
  690. }
  691.  
  692. .nav a:hover .fa-pinterest-p {
  693. transform:translateY(-3px);
  694. transition:.3s;
  695. color:{color:sidebar links hover};
  696. }
  697.  
  698. .nav a:hover .fa-reddit-alien {
  699. transform:translateY(-3px);
  700. transition:.3s;
  701. color:{color:sidebar links hover};
  702. }
  703.  
  704. .nav a:hover .fa-sticky-note {
  705. transform:translateY(-3px);
  706. transition:.3s;
  707. color:{color:sidebar links hover};
  708. }
  709.  
  710. .nav a:hover .fa-tumblr {
  711. transform:translateY(-3px);
  712. transition:.3s;
  713. color:{color:sidebar links hover};
  714. }
  715.  
  716. .nav a:hover .fa-highlighter {
  717. transform:translateY(-3px);
  718. transition:.3s;
  719. color:{color:sidebar links hover};
  720. }
  721.  
  722.  
  723.  
  724.  
  725. /* ---- LINK POSTS ---- */
  726.  
  727. .link {
  728. background:{color:accent};
  729. padding:10px;
  730. padding-top:20px;
  731. padding-bottom:20px;
  732. border-radius:5px;
  733. text-align:center;
  734. box-shadow: inset 0px 0px 0px 3px rgba(255,255,255,0.4);
  735. }
  736.  
  737. .link a {
  738. border:none;
  739. color:#fff;
  740. padding:10px;
  741. padding-top:20px;
  742. padding-bottom:20px;
  743. border-radius:5px;
  744. transition:0.3s;
  745. letter-spacing:0.5px;
  746. }
  747.  
  748. .link a:hover .fa-angle-right {
  749. transform:translateX(5px);
  750. transition:0.3s;
  751. color:#fff;
  752. opacity:1;
  753. }
  754.  
  755. .link a:hover {
  756. opacity:0.8;
  757. }
  758.  
  759. .fa-angle-right {
  760. color:#fff;
  761. font-size:20px;
  762. vertical-align:middle;
  763. margin-left:10px;
  764. transition:0.3s;
  765. opacity:0.7;
  766. }
  767.  
  768. .link-description {
  769. font-size:12px;
  770. line-height:25px;
  771. margin-top:20px;
  772. }
  773.  
  774.  
  775.  
  776.  
  777. /* ---- CHAT POSTS ---- */
  778.  
  779. .chat {
  780. font-size:12px;
  781. line-height:25px;
  782. margin-bottom:20px;
  783. }
  784.  
  785. .label {
  786. font-weight:700;
  787. color:{color:accent};
  788. font-style:italic;
  789. }
  790.  
  791. .line {
  792. color:#222;
  793. }
  794.  
  795.  
  796.  
  797.  
  798. /* ---- SEARCH PAGE STUFF ---- */
  799.  
  800. .results {
  801. color:{color:text};
  802. font-size:16px;
  803. font-weight:700;
  804. margin-left:400px;
  805. width:560px;
  806. padding-top:20px;
  807. border-top:1px solid rgba(0,0,0,0.1);
  808. text-align:right;
  809. }
  810.  
  811. .return-to-blog {
  812. margin-left:400px;
  813. font-size:12px;
  814. font-weight:700;
  815. margin-top:20px;
  816. margin-bottom:40px;
  817. text-align:right;
  818. width:560px;
  819. }
  820.  
  821. .return-to-blog a {
  822. padding:10px;
  823. background:{color:accent};
  824. color:#fff;
  825. display:inline-block;
  826. width:160px;
  827. text-align:center;
  828. border-radius:3px;
  829. padding-top:12px;
  830. text-decoration:none;
  831. border:none;
  832. }
  833.  
  834. .return-to-blog a:hover {
  835. background:none;
  836. box-shadow: inset 0px 0px 0px 3px {color:accent};
  837. color:{color:accent};
  838. }
  839.  
  840. {block:NoSearchResults}
  841.  
  842. .results {
  843. display:none;
  844. }
  845.  
  846. .return-to-blog {
  847. display:none;
  848. }
  849.  
  850. .title a {
  851. color:{color:background};
  852. }
  853.  
  854. {/block:NoSearchResults}
  855.  
  856. .no_results {
  857. text-align:left;
  858. font-size:25px;
  859. font-weight:900;
  860. margin-top:50px;
  861. margin-left:400px;
  862. color:{color:text};
  863. }
  864.  
  865. .no_results p {
  866. font-family:{select:font};
  867. font-size:12px;
  868. font-weight:400;
  869. }
  870.  
  871. .fa-frown {
  872. color: {color:accent};
  873. margin-bottom:30px;
  874. font-size:50px;
  875. }
  876.  
  877.  
  878.  
  879.  
  880. /* ---- PAGINATION ---- */
  881.  
  882. .pagination {
  883. width:560px;
  884. padding:30px;
  885. padding-left:0px;
  886. margin-left:400px;
  887. padding-right:0px;
  888. }
  889.  
  890. .pagination_next {
  891. float:right;
  892. }
  893.  
  894. .pagination_next a {
  895. padding:10px;
  896. background:{color:accent};
  897. color:#fff;
  898. border-radius:3px;
  899. border:none;
  900. font-size:12px;
  901. width:150px;
  902. display:block;
  903. text-align:center;
  904. text-decoration:none;
  905. }
  906.  
  907. .pagination_next a:hover {
  908. background:none;
  909. box-shadow: inset 0px 0px 0px 3px {color:accent};
  910. color:{color:accent};
  911. }
  912.  
  913. .pagination_previous {
  914. float:left;
  915. }
  916.  
  917. .pagination_previous a {
  918. padding:10px;
  919. background:{color:accent};
  920. color:#fff;
  921. border-radius:3px;
  922. border:none;
  923. text-decoration:none;
  924. width:150px;
  925. font-size:12px;
  926. display:block;
  927. text-align:center;
  928. }
  929.  
  930. .pagination_previous a:hover {
  931. background:none;
  932. box-shadow: inset 0px 0px 0px 3px {color:accent};
  933. color:{color:accent};
  934. }
  935.  
  936.  
  937. iframe.tumblr_audio_player {
  938. height:85px;!important
  939. }
  940.  
  941.  
  942.  
  943.  
  944. /* ---- REBLOGGED FROM and NOT REBLOGGED ---- */
  945.  
  946. .reblogged_from {
  947. font-size:12px;
  948. font-weight:bold;
  949. padding-bottom:20px;
  950. margin-top:-10px;
  951. letter-spacing:0.5px;
  952. }
  953.  
  954. .fa-retweet {
  955.  
  956. }
  957.  
  958. .not_reblogged {
  959. font-size:12px;
  960. font-weight:bold;
  961. padding-bottom:20px;
  962. margin-top:-10px;
  963. letter-spacing:0.5px;
  964. }
  965.  
  966.  
  967.  
  968.  
  969. /* ---- REBLOG AND PERMALINK LINKS ---- */
  970.  
  971. .reblog_link {
  972. position:absolute;
  973. margin-left:530px;
  974. font-size:20px;
  975. transition:.3s;
  976. opacity:0;
  977. margin-top:-30px;
  978. }
  979.  
  980. .reblog_link a {
  981. border:none;
  982. color:{color:text};
  983. }
  984.  
  985. .reblog_link a:hover {
  986. color:{color:accent};
  987. }
  988.  
  989. article:hover .reblog_link {
  990. padding-left:25px;
  991. transition:.3s;
  992. opacity:1;
  993. transition-delay:0.1s;
  994. }
  995.  
  996. .permalink_link {
  997. position:absolute;
  998. margin-left:530px;
  999. transition:.3s;
  1000. margin-top:10px;
  1001. font-size:20px;
  1002. opacity:0;
  1003. }
  1004.  
  1005. .permalink_link a {
  1006. border:none;
  1007. color:{color:text};
  1008. }
  1009.  
  1010. .permalink_link a:hover {
  1011. color:{color:accent};
  1012. }
  1013.  
  1014. article:hover .permalink_link {
  1015. padding-left:25px;
  1016. transition-delay:0.3s;
  1017. opacity:1;
  1018. }
  1019.  
  1020. .fa-link {
  1021.  
  1022. }
  1023.  
  1024.  
  1025.  
  1026.  
  1027. /* ---- PERMALINK PAGE ---- */
  1028.  
  1029. .post_notes {
  1030. position:fixed;
  1031. font-size:11px;
  1032. height:calc(100% - 250px);
  1033. width:400px;
  1034. overflow:auto;
  1035. margin-left:560px;
  1036. padding:20px;
  1037. margin-top:-30px;
  1038. line-height:30px;
  1039. padding-left:0px;
  1040. color:{color:text};
  1041. background:{color:post bg};
  1042. border-radius:3px;
  1043. {block:ifborders}
  1044. border:1px solid rgba(0,0,0,0.1);
  1045. {/block:ifborders}
  1046. {block:ifshadows}
  1047. box-shadow: 0px 18px 65px -18px rgba(0,0,0,0.1);
  1048. {/block:ifshadows}
  1049. }
  1050.  
  1051. .post_notes img {
  1052. width:16px;
  1053. border-radius:100%;
  1054. vertical-align:middle;
  1055. margin-right:10px;
  1056. }
  1057.  
  1058. ul,li {
  1059. list-style-type:none;
  1060. }
  1061.  
  1062. .post_notes a {
  1063. border:none;
  1064. }
  1065.  
  1066. .post_notes a:hover {
  1067. color:{color:accent};
  1068. }
  1069.  
  1070. {block:PermalinkPage}
  1071.  
  1072. .reblog_link {
  1073. display:none;
  1074. }
  1075.  
  1076. .permalink_link {
  1077. display:none;
  1078. }
  1079.  
  1080. .reblogged_from, .not_reblogged {
  1081. display:none;
  1082. }
  1083.  
  1084. .postinfo, .tags {
  1085. display:none;
  1086. }
  1087.  
  1088. article {
  1089. padding-bottom:30px;
  1090. }
  1091.  
  1092. {/block:PermalinkPage}
  1093.  
  1094. .permalink_page_links {
  1095. position:fixed;
  1096. margin-top:250px;
  1097. width:400px;
  1098. margin-left:560px;
  1099. text-align:center;
  1100. padding:10px;
  1101. }
  1102.  
  1103. .permalink_page_links a {
  1104. display:inline-block;
  1105. background:{color:accent};
  1106. color:{color:text};
  1107. padding:15px;
  1108. border-radius:100%;
  1109. border:none;
  1110. text-align:center;
  1111. width:30px;
  1112. margin-right:20px;
  1113. margin-left:20px;
  1114. height:30px;
  1115. transition:.5s;
  1116. }
  1117.  
  1118. .permalink_page_links a:hover {
  1119. box-shadow: 0px 18px 45px -20px rgba(0,0,0,0.5);
  1120. transform:translateY(-5px);
  1121. }
  1122.  
  1123. .fa-sync {
  1124. font-size:25px;
  1125. margin-top:3px;
  1126. }
  1127.  
  1128. .perma_reblog {
  1129. position:absolute;
  1130. width:420px;
  1131. margin-left:-92px;
  1132. margin-top:50px;
  1133. text-align:center;
  1134. opacity:0;
  1135. letter-spacing:0.5px;
  1136. transition:.5s;
  1137. color:{color:text};
  1138. }
  1139.  
  1140. .permalink_page_links a:hover .perma_reblog {
  1141. opacity:1;
  1142. transition:.5s;
  1143. transform:translateY(10px);
  1144. }
  1145.  
  1146. .fa-clock {
  1147. font-size:25px;
  1148. margin-top:3px;
  1149. }
  1150.  
  1151. .perma_date {
  1152. position:absolute;
  1153. width:420px;
  1154. margin-left:-187px;
  1155. margin-top:50px;
  1156. text-align:center;
  1157. opacity:0;
  1158. letter-spacing:0.5px;
  1159. transition:.5s;
  1160. color:{color:text};
  1161. }
  1162.  
  1163. .permalink_page_links a:hover .perma_date {
  1164. opacity:1;
  1165. transition:.5s;
  1166. transform:translateY(10px);
  1167. }
  1168.  
  1169. .fa-arrow-left {
  1170. font-size:25px;
  1171. margin-top:3px;
  1172. }
  1173.  
  1174. .perma_back {
  1175. position:absolute;
  1176. width:420px;
  1177. margin-left:-157px;
  1178. margin-top:50px;
  1179. text-align:left;
  1180. opacity:0;
  1181. letter-spacing:0.5px;
  1182. transition:.5s;
  1183. color:{color:text};
  1184. }
  1185.  
  1186. .permalink_page_links a:hover .perma_back {
  1187. opacity:1;
  1188. transition:.5s;
  1189. transform:translateY(10px);
  1190. }
  1191.  
  1192.  
  1193.  
  1194.  
  1195. /* ---- BACK TO TOP BUTTON ---- */
  1196.  
  1197. #top {
  1198. width: 40px;
  1199. line-height: 40px;
  1200. overflow: hidden;
  1201. z-index: 999;
  1202. display: none;
  1203. position: fixed;
  1204. bottom: 0px;
  1205. right:0;
  1206. margin-right:40px;
  1207. color: #000;
  1208. text-align: center;
  1209. font-size: 30px;
  1210. text-decoration: none;
  1211. background:{color:sidebar};
  1212. border:none;
  1213. }
  1214.  
  1215. #top:hover {
  1216. color: {color:accent};
  1217. }
  1218.  
  1219. #top:hover .fa-arrow-circle-up {
  1220. color: {color:text};
  1221. transition:.6s;
  1222. }
  1223.  
  1224. .fa-arrow-circle-up {
  1225. color:{color:accent};
  1226. transition:.6s;
  1227. }
  1228.  
  1229.  
  1230.  
  1231.  
  1232. /* ---- CREDIT ---- */
  1233.  
  1234. .credit {
  1235. position:fixed;
  1236. bottom:5px;
  1237. right:10px;
  1238. }
  1239.  
  1240. .credit img {
  1241. width:20px;
  1242. height:20px;
  1243. border-radius:100%;
  1244. transition:0.3s;
  1245. }
  1246.  
  1247. .credit img:hover {
  1248. transform:scale(1.5);
  1249. transition:0.3s;
  1250. }
  1251.  
  1252. .credit a {
  1253. border:none;
  1254. }
  1255.  
  1256. .credit a:hover {
  1257. border:none;
  1258. }
  1259.  
  1260. </style>
  1261. </head>
  1262.  
  1263.  
  1264.  
  1265. <!--- audio player styling --->
  1266. <script>
  1267. $(document).ready(function() {
  1268. $('iframe.tumblr_audio_player').load( function() {
  1269. $('iframe.tumblr_audio_player').contents().find("head")
  1270. .append($("<link href='https://fonts.googleapis.com/css?family=Fira+Mono:400,700|IBM+Plex+Mono:400,400i,700,700i|IBM+Plex+Sans:400,400i,700,700i|Karla:400,400i,700,700i|Lato:400,400i,700,700i|Merriweather:400,400i,700,700i|Nunito+Sans:400,400i,700,700i|Roboto+Mono:400,400i,700,700i|Roboto+Slab:400,700|Roboto:400,400i,700,700i|Space+Mono:400,400i,700,700i|Work+Sans:400,700|Chivo:400,400i,700,700i|Overpass:400,400i,700,700i' rel='stylesheet' type='text/css'> <style type='text/css'> .audio-player{background:{color:accent}; color:#fff; font-family:{select:font};border-top-left-radius:3px;border-bottom-left-radius:3px;!important}</style>"));
  1271. });
  1272. });
  1273. </script>
  1274.  
  1275.  
  1276. <body>
  1277.  
  1278.  
  1279. <div class="title"><a href="/">{Title}</a></div>
  1280.  
  1281. <div class="sidebar">
  1282. <img src="{PortraitURL-96}">
  1283. <div class="desc">{description}</div>
  1284.  
  1285. <form action="/search" method="get">
  1286. <input type="submit" value="Search">
  1287. <input type="text" name="q" value="{SearchQuery}" class="search" autocomplete="off" placeholder="Search {Name}"/>
  1288.  
  1289. </form>
  1290.  
  1291. <div class="follow">
  1292. <a href="https://tumblr.com/follow/{name}"><span class="fas fa-plus"></span> Follow {name}</a>
  1293. </div>
  1294.  
  1295.  
  1296. <div class="nav">
  1297.  
  1298. <a href="/ask"><span class="fas fa-envelope"></span><br>Message</a>
  1299.  
  1300. <a href="/archive"><span class="far fa-calendar-alt"></span><br>archive</a><br>
  1301.  
  1302. <a href="{text:link one url}"><span class="fas {select:link one icon}"></span><br>{text:link one name}</a>
  1303.  
  1304. <a href="{text:link two url}"><span class="fas {select:link two icon}"></span><br>{text:link two name}</a>
  1305.  
  1306. <BR>
  1307.  
  1308. {block:ifextralinks}
  1309. <a href="{text:link three url}"><span class="fas {select:link three icon}"></span><br>{text:link three name}</a>
  1310.  
  1311. <a href="{text:link four url}"><span class="fas {select:link four icon}"></span><br>{text:link four name}</a>
  1312. {/block:ifextralinks}
  1313. </div>
  1314.  
  1315. </div>
  1316.  
  1317.  
  1318. {block:SearchPage}
  1319. <div class="results">{SearchResultCount} result(s) for "{SearchQuery}"</div>
  1320. <div class="return-to-blog"><a href="https://{Name}.tumblr.com/">Go back to the posts</a></div>
  1321. {/block:SearchPage}
  1322.  
  1323. {block:NoSearchResults}
  1324. <div class="no_results">
  1325. <span class="fal fa-frown"></span><br>
  1326. Sorry, nothing here.
  1327. <p>
  1328. <span style="font-weight:700;">"{SearchQuery}"</span> turned up no results.
  1329.  
  1330. </p>
  1331. <br>
  1332. <p><a href="/">Go back to the posts</a>
  1333. </div>
  1334. {/block:NoSearchResults}
  1335.  
  1336.  
  1337.  
  1338. {block:Posts}
  1339. <article id="p-{PostType}" class="post">
  1340.  
  1341. {block:PermalinkPage}
  1342. {block:PostNotes}
  1343. <div class="post_notes">
  1344. {PostNotes-16}
  1345. </div>
  1346. {/block:PostNotes}
  1347. {/block:PermalinkPage}
  1348.  
  1349.  
  1350. <div class="reblog_link">
  1351. <a href="{ReblogURL}"><i class="fas fa-retweet"></i></a>
  1352. </div>
  1353.  
  1354. <div class="permalink_link">
  1355. <a href="{Permalink}"><i class="fas fa-link"></i></a>
  1356. </div>
  1357.  
  1358. {block:RebloggedFrom}
  1359. <div class="reblogged_from">
  1360. {Name} <i class="fas fa-retweet"></i> {ReblogParentName}
  1361. </div>
  1362. {/block:RebloggedFrom}
  1363.  
  1364. {block:NotReblog}
  1365. <div class="not_reblogged">
  1366. <span style="font-weight:400;">posted by</span> {Name}
  1367. </div>
  1368. {/block:NotReblog}
  1369.  
  1370. {block:Quote}
  1371. <div class="quote">{Quote}</div>
  1372. <div class="source">— {Source}</div>
  1373. {/block:Quote}
  1374.  
  1375. {block:Photo}
  1376. <img src="{PhotoURL-500}">
  1377. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1378. {/block:Photo}
  1379.  
  1380. {block:Text}
  1381. {block:Title}<h3>{Title}</h3>{/block:Title}
  1382. <div class="caption">{Body}</div>
  1383. {/block:Text}
  1384.  
  1385. {block:Photoset}
  1386. {Photoset-500}
  1387. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1388. {/block:Photoset}
  1389.  
  1390. {block:Video}
  1391. {Video-500}
  1392. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1393. {/block:Video}
  1394.  
  1395. {block:Audio}
  1396. {AudioEmbed-500}
  1397. {/block:Audio}
  1398.  
  1399. {block:Chat}
  1400. {block:Title}<h3>{Title}</h3>{/block:Title}
  1401.  
  1402. <div class="chat">
  1403. {block:Lines}
  1404. {block:Label}
  1405. <span class="label">{Label}</span>
  1406. {/block:Label}
  1407. <span class="line">{Line}</span><Br>
  1408. {/block:Lines}
  1409. </div>
  1410.  
  1411. {/block:Chat}
  1412.  
  1413. {block:Link}
  1414. <div class="link">
  1415. <a href="{URL}">{Name} <i class="fas fa-angle-right"></i></a>
  1416. </div>
  1417. <div class="link-description">{Description}</div>
  1418. {/block:Link}
  1419.  
  1420. <div class="postinfo">
  1421. {DayOfMonthWithZero} {Month} {Year} at {12Hour}:{Minutes} {CapitalAMPM}
  1422. <div class="postinfo_notes">
  1423. {block:IndexPage}
  1424. {block:NoteCount}
  1425. {NoteCountWithLabel}
  1426. {/block:NoteCount}
  1427. {/block:IndexPage}
  1428. </div>
  1429. </div>
  1430.  
  1431. {block:HasTags}
  1432. <div class="tags">
  1433. {block:Tags}
  1434. <a href="{TagURL}"># {Tag}</a>&nbsp;
  1435. {/block:Tags}
  1436. </div>
  1437. {/block:HasTags}
  1438.  
  1439. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}{block:RebloggedFrom}<!-- {ReblogParentName} -->{/block:RebloggedFrom}
  1440.  
  1441. </article>
  1442. {/block:posts}
  1443.  
  1444. {block:Pagination}
  1445.  
  1446. <div class="pagination">
  1447.  
  1448. {block:NextPage}
  1449. <div class="pagination_next">
  1450. <a href="{NextPage}">Next</a>
  1451. </div>
  1452. {/block:NextPage}
  1453.  
  1454. {block:PreviousPage}
  1455. <div class="pagination_previous">
  1456. <a href="{PreviousPage}">Previous</a>
  1457. </div>
  1458. {/block:PreviousPage}
  1459.  
  1460. </div>
  1461.  
  1462. {/block:Pagination}
  1463.  
  1464. <!--- back to top button --->
  1465.  
  1466. <a id="top" title="Back to top" href="#"><span class="fas fa-arrow-circle-up"></span></a>
  1467.  
  1468. <!-- DON'T REMOVE THIS OR MOVE IT -->
  1469. <div class="credit">
  1470. <a href="http://astrocodes.tumblr.com"><i class="far fa-user-astronaut"></i></a>
  1471. </div>
  1472. <!-- SERIOUSLY -->
  1473.  
  1474.  
  1475. <script>
  1476. $(window).scroll(function() {
  1477. var height = $(window).scrollTop();
  1478. if (height > 100) {
  1479. $('#top').fadeIn();
  1480. } else {
  1481. $('#top').fadeOut();
  1482. }
  1483. });
  1484. $(document).ready(function() {
  1485. $("#top").click(function(event) {
  1486. event.preventDefault();
  1487. $("html, body").animate({ scrollTop: 0 }, "slow");
  1488. return false;
  1489. });
  1490.  
  1491. });
  1492. </script>
  1493.  
  1494. </body>
  1495. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!