API tools faq
paste
alicescreed

007 | the feels

alicescreed
Dec 21st, 2023
367
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.88 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.  
  3. "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  5. <head>
  6. <title>{Title}</title>
  7.  
  8. <!--007 THE FEELS blog theme by anahilation
  9. please don't redistribute or claim as your own!
  10. editing for personal use is okay.
  11. enjoy <3
  12. -->
  13.  
  14. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0" />
  15. <link rel="shortcut icon" href="{Favicon}">
  16. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  17. {block:Description}<meta name="description" content="{MetaDescription}" />
  18.  
  19. {/block:Description}
  20.  
  21. <meta name="image:sidebar" content="https://placehold.co/300x200.png">
  22. <meta name="image:icon" content="https://placehold.co/140x140.png">
  23.  
  24. <meta name="color:background" content="#d8d8d8">
  25. <meta name="color:text" content="#484848">
  26. <meta name="color:borders" content="#bebebe">
  27. <meta name="color:container" content="#ececec">
  28. <meta name="color:links" content="#ab66c0">
  29. <meta name="color:heart" content="#cf90e2">
  30. <meta name="color:heart hover" content="#ab66c0">
  31. <meta name="color:bold" content="#cf90e2">
  32. <meta name="color:italic" content="#ab66c0">
  33.  
  34. <meta name="text:link 1 url" content="URL">
  35. <meta name="text:link 1 title" content="link one title">
  36. <meta name="text:link 2 url" content="URL">
  37. <meta name="text:link 2 title" content="link two title">
  38. <meta name="text:link 3 url" content="URL">
  39. <meta name="text:link 3 title" content="link three title">
  40. <meta name="text:custom title" content="you have stolen my heart">
  41. <meta name="text:right sidebar title" content="never let it go">
  42. <meta name="text:right sidebar desc" content="don't make this too long!">
  43.  
  44. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  45. <script src="https://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  46. <script>
  47. (function($){
  48. $(document).ready(function(){
  49. $("[title]").style_my_tooltips({
  50. tip_follows_cursor:true,
  51. tip_delay_time:200,
  52. tip_fade_speed:300
  53. }
  54. );
  55. });
  56. })(jQuery);
  57. </script>
  58.  
  59.  
  60. <style type="text/css">
  61.  
  62. @import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:[email protected]&family=Rubik+Scribble&display=swap');
  63.  
  64. .tmblr-iframe {
  65. white-space:nowrap;
  66. -webkit-filter: invert(100%);
  67. -moz-filter: invert(100%);
  68. -o-filter: invert(100%);
  69. -ms-filter: invert(100%);
  70. filter: invert(100%);
  71. opacity:.2;
  72. transition: 0.6s ease-in-out;
  73. -webkit-transition: 0.6s ease-in-out;
  74. -moz-transition: 0.6s ease-in-out;
  75. -o-transition: 0.6s ease-in-out;
  76. position:fixed!important;
  77. right:-20px!important;
  78. transform:scale(0.7,0.7); }
  79.  
  80. .tmblr-iframe:hover {
  81. opacity:1;
  82.  
  83. }
  84.  
  85. body {
  86. font-family: 'Nunito Sans', sans-serif;
  87. color: {color:text};
  88. background-color: {color:background};
  89. font-size: 9pt;
  90. letter-spacing: 1px;
  91. line-height: 14pt;
  92. font-style: normal;
  93. text-align: justify;
  94. }
  95.  
  96. small, sup, sub {
  97. font-size: 100%;
  98. }
  99.  
  100. a {
  101. text-decoration: none;
  102. color: {color:links};
  103. font-size: 14pt;
  104. line-height: 19pt;
  105. transition-duration: 0.6s;
  106. -moz-transition-duration: 0.6s;
  107. -webkit-transition-duration: 0.6s;
  108. -o-transition-duration: 0.6s;
  109. letter-spacing: 1px;
  110. }
  111.  
  112. b, strong {
  113. font-size: 110%;
  114. color: {color:bold};
  115. }
  116.  
  117. i {
  118. font-size: 110%;
  119. color: {color:italic};
  120. }
  121.  
  122. a:hover {
  123. text-decoration: none;
  124. filter:blur(1px);
  125. letter-spacing: 1px;
  126. color: {color:hover link};
  127. transition-duration: 0.6s;
  128. -moz-transition-duration: 0.6s;
  129. -webkit-transition-duration: 0.6s;
  130. -o-transition-duration: 0.6s;
  131. }
  132.  
  133. blockquote {
  134. border: 10px solid {color:background};
  135. outline: 1px solid {color:borders};
  136. background-color: {color:container};
  137. color: {color:text};
  138. padding: 10px;
  139. font-size: 95%
  140. }
  141.  
  142. blockquote img {
  143. max-width: 100%;
  144. display: block;
  145. height: auto;
  146. }
  147.  
  148. img {
  149. max-width: 100%;
  150. display: block;
  151. height: auto;
  152. }
  153.  
  154. #post {
  155. width: 400px;
  156. padding: 20px;
  157. background-color: {color:container};
  158. border: 1px solid {color:borders};
  159. margin-bottom: 100px;
  160. }
  161.  
  162. #posts {
  163. width: 540px;
  164. position: absolute;
  165. overflow: auto;
  166. margin-left: 420px;
  167. margin-top: 30px;
  168. }
  169.  
  170.  
  171. #ask {
  172. background: {color:background};
  173. text-align: center;
  174. background-position: top center;
  175. color: {color:text};
  176. height: auto;
  177. padding-top: 12px;
  178. padding-right: 10px;
  179. padding-left: 10px;
  180. border: 1px solid {color:borders};
  181. }
  182.  
  183. #ask a {
  184. font-size: 24pt;
  185. font-weight: bold;
  186. color: {color:links};
  187. font-family: 'rubik scribble', cursive;
  188. }
  189.  
  190. #pa { margin-top: 25px;
  191. text-align: center;
  192. }
  193.  
  194. #pa a {
  195. color: {color:text};
  196. font-family: 'Rubik Scribble', cursive;
  197. text-transform: uppercase;
  198. font-size: 13pt;
  199. }
  200.  
  201. #audio {
  202. text-align: center;
  203. font-size: 8pt;
  204. line-height: 9pt;
  205. }
  206.  
  207. #musicinfo {
  208. text-transform: uppercase;
  209. margin-top:10px;
  210. }
  211.  
  212.  
  213. ol.notes {
  214. text-align: left;
  215. list-style: upper-roman;
  216. padding: 10px;
  217. }
  218.  
  219. #credit {
  220. right:10px;
  221. bottom:7px;
  222. padding:5px;
  223. font-size:10px;
  224. position:fixed;
  225. text-align: center;
  226. font-style: italic;
  227. letter-spacing: 1px;
  228. border: 1px solid {color:borders};
  229. padding: 5px;
  230. background-color: {color:container};
  231. font-size: 120%;
  232. margin-bottom: 5px;
  233. transition-duration: 0.6s;
  234. -moz-transition-duration: 0.6s;
  235. -webkit-transition-duration: 0.6s;
  236. -o-transition-duration: 0.6s;
  237. }
  238.  
  239. #credit a {
  240. color: {color:links};
  241. }
  242.  
  243.  
  244. #s-m-t-tooltip{
  245. position: absolute;
  246. z-index: 999999999999999999999999999999999999999999999999999999999999;
  247. margin-top: 10px;
  248. margin-left: 5px;
  249. display: block;
  250. background: {color:links};
  251. text-align: center;
  252. font-family: 'nunito sans', sans serif;
  253. letter-spacing: 1px;
  254. border: 1px solid {color:borders};
  255. padding: 10px;
  256. font-size: 12pt;
  257. color: {color:container};
  258. margin-bottom: 5px;
  259. }
  260.  
  261. ::-webkit-scrollbar-thumb:vertical {
  262. background-color: transparent;
  263. height:auto;
  264. }
  265.  
  266. ::-webkit-scrollbar-thumb:horizontal {
  267. background-color: transparent;
  268. height:2px;
  269. }
  270.  
  271. ::-webkit-scrollbar {
  272. height:3px;
  273. width:3px;
  274. background-color: transparent;
  275. }
  276.  
  277. #pa {
  278. margin-top:10px;
  279. }
  280.  
  281. #info {
  282. text-align: center;
  283. margin-top: 10px;
  284. border-top: 1px solid {color:borders};
  285. padding: 10px;
  286. width: 380px;
  287. height: auto;
  288. }
  289.  
  290. #info a {
  291. margin-right: 5px;
  292. }
  293.  
  294. #info span {
  295. font-size: 12pt;
  296. }
  297.  
  298. #tags {
  299. }
  300.  
  301. #tags a {
  302. font-family: 'nunito sans', sans serif;
  303. font-size: 8pt;
  304. line-height: 9pt;
  305. color: #000;
  306. }
  307.  
  308. #h1 {
  309. font-size: 22pt;
  310. margin-bottom: 5px;
  311. font-weight: bold;
  312. text-align: center;
  313. line-height: 20pt;
  314. font-family: 'Rubik Scribble', cursive;
  315. }
  316.  
  317. #notes {
  318. margin-top: -20px;
  319. width: 400px;
  320. }
  321.  
  322. #notes img {
  323. display:none;
  324. }
  325.  
  326. #notes a {
  327. font-weight:bold;
  328. }
  329.  
  330. #notes ol {
  331. list-style-type:none;
  332. margin:0px;
  333. padding:0px;
  334. }
  335.  
  336. #notes ol li {
  337. margin:5px;
  338. line-height:20px;
  339. }
  340.  
  341. #sidebar {
  342. width: 300px;
  343. height: auto;
  344. background-color: #fff;
  345. padding: 20px;
  346. transition-duration: 0.6s;
  347. -moz-transition-duration: 0.6s;
  348. -webkit-transition-duration: 0.6s;
  349. -o-transition-duration: 0.6s;
  350. background-color: {color:container};
  351. border: 1px solid {color:borders};
  352. }
  353.  
  354.  
  355. #desc {
  356. max-height: 50px;
  357. overflow: scroll;
  358. padding-right: 5px;
  359. margin-bottom: 10px;
  360. margin-top: 10px;
  361. padding: 10px;
  362. }
  363.  
  364. #side {
  365. position: fixed;
  366. margin-left: 30px;
  367. margin-top: 50px;
  368. transition-duration: 0.6s;
  369. -moz-transition-duration: 0.6s;
  370. -webkit-transition-duration: 0.6s;
  371. -o-transition-duration: 0.6s;
  372. }
  373.  
  374. #title {
  375. margin-top: 20px;
  376. line-height: 28pt;
  377. font-size: 26pt;
  378. text-align: center;
  379. font-family: 'Rubik Scribble', cursive;
  380. font-weight: bold;
  381. color: {color:text};
  382. }
  383.  
  384. #title a {
  385. color: {color:text};
  386. }
  387.  
  388. #heart {
  389. display: inline-block;
  390. width: 80px;
  391. aspect-ratio: 1;
  392. border-image: radial-gradient({color:heart} 69%, #0000 70%) 84.5%/50%;
  393. clip-path: polygon(-41% 0, 50% 91%, 141% 0);
  394. position: fixed;
  395. z-index: 9000;
  396. transition-duration: 0.6s;
  397. -moz-transition-duration: 0.6s;
  398. -webkit-transition-duration: 0.6s;
  399. -o-transition-duration: 0.6s;
  400. margin-top: -30px;
  401. margin-left: -20px;
  402. }
  403.  
  404. #side:hover #heart{
  405. border-image: radial-gradient({color:heart hover} 69%, #0000 70%) 84.5%/50%;
  406. clip-path: polygon(-41% 0, 50% 91%, 141% 0);
  407. position: fixed;
  408. z-index: 9000;
  409. transition-duration: 0.6s;
  410. -moz-transition-duration: 0.6s;
  411. -webkit-transition-duration: 0.6s;
  412. -o-transition-duration: 0.6s;
  413. width: 90px;
  414. }
  415.  
  416. #icon {
  417. }
  418.  
  419. #icon img {
  420. mask:
  421. radial-gradient(at 70% 31%,#000 29%,#0000 30%),
  422. radial-gradient(at 30% 31%,#000 29%,#0000 30%),
  423. linear-gradient(#000 0 0) bottom/100% 50% no-repeat;
  424. clip-path: polygon(-41% 0,50% 91%, 141% 0);
  425. }
  426.  
  427. #iconcontainer {
  428. margin-left: 910px;
  429. margin-top: 50px;
  430. position: fixed;
  431. width: 140px;
  432. padding: 20px;
  433. text-align: center;
  434. height: auto;
  435. background-color: {color:container};
  436. border: 1px solid {color:borders};
  437. }
  438.  
  439. #nav {
  440. text-align: center;
  441. margin-top: 20px;
  442. }
  443.  
  444. #nav span {
  445. font-size: 12pt;
  446. }
  447.  
  448. #title2 {
  449. margin-top: 0px;
  450. line-height: 28pt;
  451. font-size: 26pt;
  452. text-align: center;
  453. margin-bottom: 10px;
  454. font-family: 'Rubik Scribble', cursive;
  455. font-weight: bold;
  456. }
  457.  
  458. #anchor {
  459. width: 1200px;
  460. margin: 0 auto;
  461. position: float;
  462. }
  463.  
  464. </style>
  465.  
  466. </head>
  467.  
  468. <body>
  469.  
  470. <div id="anchor">
  471.  
  472.  
  473. <div id="iconcontainer">
  474. <div id="icon">
  475. <img src="{image:icon}">
  476. </div>
  477. <div id="title2">{text:right sidebar title}</div>
  478. {text:right sidebar desc}
  479. </div>
  480.  
  481. <div id="side">
  482.  
  483. <a href="/"><div id="heart"></div></a>
  484.  
  485. <div id="sidebar">
  486. <img src="{image:sidebar}">
  487. <a href="/"><div id="title"> {text:custom title}</div></a>
  488. <div id="nav">
  489. <a href="/" title="home"><span class="material-symbols-outlined">
  490. fiber_manual_record
  491. </span></a>
  492. <a href="/ask" title="message"><span class="material-symbols-outlined">
  493. fiber_manual_record
  494. </span></a>
  495. <a href="/archive" title="archive"><span class="material-symbols-outlined">
  496. fiber_manual_record
  497. </span></a>
  498. <a href="{text:link 1 url}" title="{text:link 1 title}"><span class="material-symbols-outlined">
  499. fiber_manual_record
  500. </span></a>
  501. <a href="{text:link 2 url}" title="{text:link 2 title}"><span class="material-symbols-outlined">
  502. fiber_manual_record
  503. </span></a>
  504. <a href="{text:link 3 url}" title="{text:link 3 title}"><span class="material-symbols-outlined">
  505. fiber_manual_record
  506. </span></a>
  507. </div>
  508. <div id="desc">
  509. {description}
  510. </div>
  511.  
  512. <div id="pa">{block:Pagination}
  513. {block:PreviousPage}
  514. <a href="{PreviousPage}"><span class="material-symbols-outlined">navigate_before</span></a>
  515. {/block:PreviousPage} {block:NextPage}<a href="{NextPage}"><span class="material-symbols-outlined">navigate_next</span></a>
  516. {/block:NextPage}
  517. {/block:Pagination}</div>
  518.  
  519.  
  520. </div>
  521.  
  522. </div>
  523.  
  524.  
  525.  
  526.  
  527. <div id="posts">
  528.  
  529.  
  530. {block:Posts}<div id="post">
  531.  
  532.  
  533.  
  534. {block:Text}<div id="h1">{block:Title}{Title}{/block:Title}</div>{Body}{/block:Text}
  535.  
  536. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-400}" style="margin-bottom: 10px;">{LinkCloseTag}{block:Caption}
  537.  
  538. {Caption} {/block:Caption}{/block:Photo}
  539.  
  540. {block:Photoset}{Photoset-400}{block:Caption}{Caption}{/block:Caption}
  541.  
  542. {/block:Photoset}
  543.  
  544. {block:Quote}<b style="text-align: center; font-size: 18pt; line-height: 20pt;">{Quote}</b>{block:Source}<div style="text-align:center;">—{Source}</div>{/block:Source}{/block:Quote}
  545.  
  546. {block:Link}<div id="h1"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}
  547.  
  548. {Description}{/block:Description}{/block:Link}
  549.  
  550. {block:Chat}{block:Title}<div id="h1">{Title}</div>{/block:Title}{block:Lines}{block:Label}<b>
  551.  
  552. {Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  553.  
  554. {block:Audio}
  555. <div id="audio">
  556. {block:TrackName}
  557. <div id="musicinfo" style="margin-top: 5px;">
  558. {AudioPlayerGrey} <br>
  559. {TrackName} by
  560. {/block:TrackName}
  561. {block:Artist}
  562. {Artist}
  563. {/block:Artist}
  564.  
  565. </div>
  566. </div>
  567. {block:caption}<div id="caption">{Caption} </div>{/block:caption}
  568. {/block:Audio}
  569.  
  570.  
  571. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  572.  
  573. {block:Answer}
  574. <div id="ask">
  575. {Asker}<br>
  576. <div style="margin-top: -10px;">{Question}</div>
  577. </div>
  578. {Answer}{/block:Answer}
  579.  
  580. <div id="info">
  581. <a title="{TimeAgo}" title="{TimeAgo}"><span class="material-symbols-outlined">
  582. fiber_manual_record
  583. </span></a> <a href="{Permalink}" title="{NoteCount} notes"><span class="material-symbols-outlined">
  584. fiber_manual_record
  585. </span></a> <a href="{ReblogURL}" title="reblog"><span class="material-symbols-outlined">
  586. fiber_manual_record
  587. </span></a>
  588. <div id="tags">
  589. {block:HasTags}{block:Tags} <a href="{TagURL}">#{Tag} </a>
  590. {/block:Tags}{/block:HasTags}
  591. </div>
  592. </div>
  593.  
  594.  
  595. </div>
  596. {block:PostNotes}
  597. <div id="notes">
  598. <Div style="width: 400px;">
  599.  
  600.  
  601. {PostNotes}</div>{/block:PostNotes}
  602. {/block:Posts}</div></div>
  603.  
  604. </div>
  605.  
  606.  
  607. <div id="credit">
  608. <a href="https://anahilation.tumblr.com/" title="theme by ana"><span class="material-symbols-outlined">gesture</span></a>
  609. </div>
  610.  
  611.  
  612.  
  613.  
  614.  
  615. </body>
  616.  
  617.  
  618.  
  619. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!