calliearambulo

Extirpate Theme by Pillow Themes

Jul 16th, 2020 (edited)
1,730
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.96 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!---
  6. ___ ___ _ _ _____ __ _____ _ _ ___ __ __ ___ ___
  7. | _ \_ _| | | | / _ \ \ / / |_ _| || | __| \/ | __/ __|
  8. | _/| || |__| |_| (_) \ \/\/ / | | | __ | _|| |\/| | _|\__ \
  9. |_| |___|____|____\___/ \_/\_/ |_| |_||_|___|_| |_|___|___/
  10.  
  11. BY CARA
  12.  
  13. R U L E S :
  14. 1. Do not steal snippets or all of my codes.
  15. 2. Do not claim theme as yours.
  16. 3. Do not remove the credit.
  17.  
  18. C R E D I T :
  19. Markup from Tumblr Documentation
  20. https://www.tumblr.com/docs/en/custom_themes
  21. -->
  22.  
  23. <!--- Meta Tags --->
  24. <meta name="color:Background Color" content="#ffffff"/>
  25. <meta name="color:Text Color" content="#000000"/>
  26. <meta name="color:Border Color" content="#eeeeee"/>
  27. <meta name="color:Accent Color" content="#dc866b"/>
  28.  
  29. <meta name="if:infinite scroll" content="1"/>
  30.  
  31. <meta name="text:Link 1 Name" content=""/>
  32. <meta name="text:Link 1 URL" content=""/>
  33.  
  34. <meta name="text:Link 2 Name" content=""/>
  35. <meta name="text:Link 2 URL" content=""/>
  36.  
  37. <meta name="text:Link 3 Name" content=""/>
  38. <meta name="text:Link 3 URL" content=""/>
  39.  
  40. <meta name="text:Link 4 Name" content=""/>
  41. <meta name="text:Link 4 URL" content=""/>
  42.  
  43. <link rel="shortcut icon" href="{Favicon}">
  44. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  45. <link href="https://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css"/>
  46. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  47.  
  48. <link href="https://fonts.googleapis.com/css2?family=Cabin&family=Raleway:wght@700&display=swap" rel="stylesheet">
  49.  
  50. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  51.  
  52. </head>
  53.  
  54. <style type="text/css">
  55.  
  56. /* SCROLLBAR TUTORIAL FROM W3SCHOOLS THANK U :>*/
  57. /* Scrollbar */
  58. ::-webkit-scrollbar {
  59. width:15px;
  60. background-color:{color:Background Color};
  61. }
  62.  
  63. ::-webkit-scrollbar-track-piece {
  64. border-top:7px solid {color:Accent Color};
  65. border-left:7px solid {color:Accent Color};
  66. border-right:7px solid {color:Accent Color};
  67. border-bottom:7px solid {color:Accent Color};
  68. }
  69.  
  70. /* Handle */
  71. ::-webkit-scrollbar-thumb {
  72. background-color:{color:Accent Color};
  73. border-top:7px solid {color:Background Color};
  74. border-left:7px solid {color:Background Color};
  75. border-right:7px solid {color:Background Color};
  76. border-bottom:7px solid {color:Background Color};
  77. }
  78. /* SCROLLBAR TUTORIAL FROM W3SCHOOLS */
  79.  
  80. iframe, img, embed, object, video {
  81. max-width:100%;
  82. }
  83.  
  84. img {
  85. height:auto;
  86. width:auto;
  87. }
  88.  
  89. blockquote {
  90. border-left:1.5px solid {color:Accent Color};
  91. color:{color:Text Color};
  92. margin-left:20px;
  93. padding-left:20px;
  94. }
  95.  
  96. body {
  97. font-family: 'Cabin', sans-serif;
  98. background-color:{color:Background Color};
  99. font-size:14px;
  100. color:{color:Text Color};
  101. line-height:auto;
  102. letter-spacing:0.5px;
  103. overflow-x:hidden;
  104. -webkit-font-smoothing: antialiased;
  105. -moz-osx-font-smoothing: grayscale;
  106. }
  107.  
  108. a {
  109. color:{color:Accent Color};
  110. text-decoration:none;
  111. }
  112.  
  113. /* DO NOT REMOVE MY CREDITS */
  114. #pillowthemes {
  115. right:20px;
  116. bottom:20px;
  117. position:fixed;
  118. background-image: linear-gradient(to right, #fff1eb 0%, #ace0f9 100%);
  119. width:30px;
  120. height:30px;
  121. border-radius:50%;
  122. }
  123. /* DO NOT REMOVE MY CREDITS */
  124.  
  125. #left {
  126. left:0;
  127. top:0;
  128. width:auto;
  129. height:100%;
  130. background-color:{color:Accent Color};
  131. padding:20px;
  132. position:fixed;
  133. }
  134.  
  135. #left a {
  136. color:{color:Background Color};
  137. display:block;
  138. margin-bottom:5px;
  139. text-transform:uppercase;
  140. }
  141.  
  142. /* CONTAINER OF EVERYTHING */
  143. #container {
  144. width:552px;
  145. height:auto;
  146. margin:0 auto;
  147. background-color:{color:Background Color};
  148. }
  149.  
  150. /* POSTS CONTAINER */
  151. #content {
  152. width:502px;
  153. float:right;
  154. margin-top:220px; /* INCREASE OR DECREASE AS YOU SEE FIT */
  155. }
  156.  
  157. posts {
  158. width:500px;
  159. margin-bottom:50px;
  160. background-color:#fff;
  161. border:1px solid {color:Border Color};
  162. }
  163.  
  164. #space {
  165. width:552px;
  166. height:50px;
  167. background-color:{color:Background Color};
  168. position:fixed;
  169. z-index:9;
  170. }
  171.  
  172. /* CONTAINER OF YOUR BLOG TITLE AND DESCRIPTION */
  173. #title {
  174. margin-top:50px;
  175. width:552px;
  176. height:auto;
  177. background-color:{color:Background Color};
  178. text-align:center;
  179. position:fixed;
  180. z-index:9;
  181. }
  182.  
  183. /* BLOG TITLE */
  184. #blogt {
  185. font-weight:700;
  186. font-size:30px;
  187. text-transform:uppercase;
  188. font-family: 'Raleway', sans-serif;
  189. color:{color:Accent Color};
  190. }
  191.  
  192. #description {
  193. margin-top:10px;
  194. padding-bottom:20px;
  195. }
  196.  
  197. /* Text Post Title*/
  198. #ptitle {
  199. color:{color:Accent Color};
  200. margin:20px;
  201. font-weight:700;
  202. }
  203.  
  204. /* Text Post Body */
  205. #pbody {
  206. margin:20px;
  207. }
  208.  
  209. /* Asker */
  210. .as {
  211. font-weight:700;
  212. color:{color:Accent Color};
  213. margin:20px;
  214. }
  215.  
  216. /* Question */
  217. .qu {
  218. margin:20px;
  219. font-weight:700;
  220. color:{color:Accent Color};
  221. }
  222.  
  223. /* Answer */
  224. .ans {
  225. margin:20px;
  226. }
  227.  
  228. /* Quote */
  229. .quo {
  230. margin:20px;
  231. font-weight:700;
  232. color:{color:Accent Color};
  233. }
  234.  
  235. /* Source */
  236. .sou {
  237. margin:20px;
  238. }
  239.  
  240. #chat {
  241. margin:20px;
  242. }
  243.  
  244. /* Person in the chat */
  245. .label {
  246. display:inline-block;
  247. background-color:{color:Background Color};
  248. padding:10px;
  249. border:1px solid {color:Accent Color};
  250. margin:0px 10px 10px 0px;
  251. }
  252.  
  253. /* What the person says */
  254. .line {
  255. display:inline-block;
  256. }
  257.  
  258. .caption {margin:20px;
  259. }
  260.  
  261. /* Reblogged from, reblog, and note count */
  262. #postinfo {
  263. position:relative;
  264. width:460px;
  265. height:auto;
  266. padding:20px;
  267. border-top:1px solid {color:Border Color};
  268. text-transform:capitalize;
  269. }
  270.  
  271. #postinfo a {color:{color:Text Color};}
  272.  
  273. .info-links {
  274. width:auto;
  275. float:right;
  276. background-color:{color:Background Color};
  277. display:inline;
  278. }
  279.  
  280. .rblg {
  281. width:40px;
  282. height:40px;
  283. background-color:{color:Background Color};
  284. margin-right:10px;
  285. display:inline;
  286. }
  287.  
  288. .nts {
  289. width:40px;
  290. height:40px;
  291. background-color:#fff;
  292. display:inline;
  293. }
  294.  
  295. /* The three lines at the side of the post */
  296. .set-ribbons {
  297. top:0;
  298. left:-30px;
  299. position:absolute;
  300. width:20px;
  301. height:auto;
  302. display:block;
  303. text-align:right;
  304. }
  305.  
  306. /* PERMALINK FEATURES */
  307. #permatags {
  308. width:499px;
  309. margin-top:30px;
  310. position:absolute;
  311. border:1px solid {color:Border Color};
  312. height:55px;
  313. overflow-x:auto;
  314. }
  315.  
  316. #ptags {padding:20px;}
  317.  
  318. #ptags a {margin-right:20px;}
  319.  
  320. #ptags a:last-child {margin-right:0px;}
  321.  
  322. #postnotes {
  323. position:absolute;
  324. width:500px;
  325. margin-top:90px;
  326. margin-bottom:20px;
  327. background-color:{color:Background Color};
  328. }
  329.  
  330. /* CREDITS TO TUMBLR DOCS */
  331. ol.notes {
  332. padding: 0px;
  333. margin: 25px 0px;
  334. list-style-type: none;
  335. }
  336.  
  337. ol.notes li.note {
  338. padding-bottom:5px;
  339. }
  340.  
  341. ol.notes li.note img.avatar {
  342. vertical-align: -4px;
  343. margin-right: 10px;
  344. width: 16px;
  345. height: 16px;
  346. }
  347.  
  348. ol.notes li.note span.action {
  349. }
  350.  
  351. ol.notes li.note .answer_content {
  352. font-weight: normal;
  353. }
  354.  
  355. ol.notes li.note blockquote {
  356. border-color:{color:Accent Color};
  357. padding: 4px 10px;
  358. margin: 10px 0px 0px 25px;
  359. }
  360.  
  361. ol.notes li.note blockquote a {
  362. text-decoration: none;
  363. }
  364.  
  365. /* Infinite Scroll */
  366. {block:ifnotinfinitescroll}
  367. .pagi {
  368. left:0;
  369. bottom:0;
  370. position:fixed!important;
  371. padding:20px;
  372. }
  373. {/block:ifnotinfinitescroll}
  374.  
  375. .pagi a {
  376. color:{color:Background Color};
  377. display:block;
  378. margin-bottom:5px;
  379. }
  380.  
  381. {block:ifinfinitescroll}
  382. .pagi {
  383. display:none;
  384. }
  385. {/block:ifinfinitescroll}
  386.  
  387. /* TUMBLR CONTROLS */
  388. .tmblr-iframe {
  389. position:fixed!important;
  390. top:0;
  391. margin-top:20px;
  392. right:0;
  393. margin-right:20px;
  394. z-index:999999!important;
  395. -webkit-transform:scale(0.8,0.8);
  396. -webkit-transform-origin: 100% 0%;
  397. -ms-transform-origin:100% 0%;
  398. -ms-transform:scale(0.8,0.8);
  399. transform:scale(0.8,0.8);
  400. transform-origin:100% 0%;
  401. }
  402.  
  403. .lnr-chevron-left-circle, .lnr-chevron-right-circle {
  404. margin-right:5px;
  405. font-weight:700;
  406. }
  407.  
  408. </style>
  409. <body>
  410.  
  411. <title>{Title}</title>
  412.  
  413. <div id="left">
  414. <a href="/">Home</a>
  415. <a href="/ask">Mailbox</a>
  416. <a href="{text:Link 1 URL}">{text:Link 1 Name}</a>
  417. <a href="{text:Link 2 URL}">{text:Link 2 Name}</a>
  418. <a href="{text:Link 3 URL}">{text:Link 3 Name}</a>
  419. <a href="{text:Link 5 URL}">{text:Link 4 Name}</a>
  420. <!-- DO NOT REMOVE MY CREDITS -->
  421. <a href="https://pillowthemes.tumblr.com/">Theme</a>
  422. <!-- DO NOT REMOVE MY CREDITS -->
  423. {block:Pagination}
  424. <div class="pagination">
  425. <div class="pagi">
  426. {block:PreviousPage}<a href="{PreviousPage}"><span class="lnr lnr-chevron-left-circle"></span>Back</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}"><span class="lnr lnr-chevron-right-circle"></span>Next</a>{/block:NextPage}</div></div>
  427. {/block:Pagination}
  428. <nav>
  429. <ul>
  430. {block:HasPages}
  431. {block:Pages}
  432. <li><a href="{URL}">{Label}</a></li>
  433. {/block:Pages}
  434. {/block:HasPages}
  435. </ul>
  436. </nav>
  437. </div>
  438.  
  439. <div id="container">
  440.  
  441. <div id="space"></div>
  442. <div id="title">
  443. <div id="blogt">{Title}</div>
  444. <div id="description">{Description}</div>
  445. </div>
  446.  
  447. <div id="content">
  448. {block:Posts}
  449. <posts>
  450.  
  451. <div class="set-ribbons">
  452. <div style="background-color:#df9078;width:20px;height:3px;margin-bottom:5px;float:right;"></div>
  453. <div style="background-color:#df9078;width:15px;height:3px;margin-bottom:5px;float:right;"></div>
  454. <div style="background-color:#df9078;width:10px;height:3px;float:right;"></div>
  455. </div>
  456.  
  457. {block:Text}
  458. {block:Title}
  459. <div id="ptitle">{Title}</div>
  460. {/block:Title}
  461. <div id="pbody">{Body}</div>
  462. {/block:Text}
  463.  
  464. {block:Photo}
  465. {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag}
  466. {/block:Photo}
  467.  
  468. {block:Panorama}
  469. {LinkOpenTag}
  470. <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  471. {LinkCloseTag}{block:Caption}
  472. <div class="caption">{Caption}</div>
  473. {/block:Caption}
  474. {/block:Panorama}
  475.  
  476. {block:Photoset}
  477. {Photoset-500}
  478. {/block:Photoset}
  479.  
  480. {block:Quote}
  481. <div class="quo">“{Quote}”</div>
  482. {block:Source}<div class="sou">– {Source}</div>{/block:Source}
  483. {/block:Quote}
  484.  
  485. {block:Link}
  486. <h1 class="title"><a href="{URL}">{Name}</a></h1>
  487. {block:Description}{Description}{/block:Description}
  488. {/block:Link}
  489.  
  490. {block:Chat}
  491. <div id="chat">
  492. {block:Lines}
  493. <div class="{Alt} user_{UserNumber}">
  494. {block:Label}
  495. <div class="label">{Label}</div>
  496. {/block:Label}
  497. <div class="line">{Line}</div>
  498. </div>
  499. {/block:Lines}
  500. </div>
  501. {/block:Chat}
  502.  
  503. {block:Answer}
  504. <div class="as">{Asker} asked:</div>
  505. <div class="qu">{Question}</div>
  506. <div class="ans">{Answer}</div>
  507. {/block:Answer}
  508.  
  509. {block:Video}
  510. {Video-500}
  511. {/block:Video}
  512.  
  513. {block:Audio}
  514. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  515. {AudioEmbed}
  516. {/block:Audio}
  517.  
  518. {block:IndexPage}
  519. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  520. <div id="postinfo">
  521. {block:RebloggedFrom}<a href="{ReblogParentURL}"><img src="{ReblogParentPortraitURL-16}" style="margin-right:10px;border-radius:50%;">{ReblogParentName}</a>
  522. {/block:RebloggedFrom}
  523. {block:NotReblog}<img src="{PortraitURL-16}" style="margin-right:10px;border-radius:50%;"><a href="/">{Title}</a>
  524. {/block:NotReblog}
  525. <div class="info-links">
  526. <div class="rblg"><a href="{ReblogURL}">Reblog</a></div>
  527. <div class="nts"><a href="{Permalink}">{NoteCountWithLabel}</a></div></div>
  528. </div>
  529. {block:IndexPage}
  530.  
  531. {block:PermalinkPage}
  532. {block:Caption}<div class="caption">{Caption}
  533. <br>
  534. <span style="font-size:30px;color:{color:accent};">{NoteCount}N</span>
  535. <br>
  536. Posted on {DayOfMonthWithZero} {Month} {Year}
  537. </div>
  538. {/block:Caption}
  539. {block:HasTags}
  540. <div id="permatags">
  541. <div id="ptags">
  542. <span>Tags:&nbsp;&nbsp;&nbsp;</span>
  543. {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  544. </div>
  545. </div>
  546. {block:HasTags}
  547. {block:PostNotes}<div id="postnotes">{PostNotes}</div>{/block:PostNotes}
  548. {/block:PermalinkPage}
  549.  
  550. </posts>
  551. {/block:Posts}
  552. </div>
  553. </div>
  554.  
  555. <!--- DO NOT TOUCH THIS PART --->
  556. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  557. <script src="https://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  558. {block:IfInfiniteScroll}
  559. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  560. <script src="https://static.tumblr.com/iwtk77u/Yhym2yygt/jquery.imagesloaded.min.js"></script>
  561. {/block:IfInfiniteScroll}
  562.  
  563. <script>
  564. (function() {
  565. var $tumblelog = $('#content');
  566. {block:IfInfiniteScroll}
  567. $tumblelog.infinitescroll({
  568. navSelector : ".pagination",
  569. nextSelector : ".pagination a:first",
  570. itemSelector : "posts",
  571. bufferPx : 50,
  572. done : "",
  573. loading: {
  574. img : "",
  575. msgText: ""
  576. },
  577. },
  578. function( newElements ) {
  579. var $newElems = $( newElements ).css({ opacity: 0 });
  580. $newElems.imagesLoaded(function(){
  581. $newElems.animate({ opacity: 1 });
  582. $tumblelog.masonry( 'appended', $newElems);
  583. });
  584. }
  585. );
  586. {/block:IfInfiniteScroll}
  587. $tumblelog.imagesLoaded( function(){
  588. $tumblelog.masonry({
  589. columnWidth: function( containerWidth ) {
  590. return containerWidth / 100;
  591. }
  592. });
  593. });
  594. })();
  595. </script>
  596. <!--- DO NOT TOUCH THIS PART --->
  597.  
  598. <a href="https://pillowthemes.tumblr.com/"><div id="pillowthemes"></div></a>
  599.  
  600. </body>
  601. </html>
Add Comment
Please, Sign In to add comment