API tools faq
paste
chevanscodes

THEME #15: READING IN BED

chevanscodes
Mar 10th, 2021 (edited)
1,199
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.80 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <head><title>{Title}</title>
  3. <link rel="shortcut icon" href="{Favicon}">
  4. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  5. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  6.  
  7.  
  8. <!----------- THEME #15: READING IN BED by CHEVANS.TUMBLR.COM ------------>
  9.  
  10.  
  11. <!--------default variables-------->
  12.  
  13. <meta name="color:background" content="#ffffff"/>
  14. <meta name="color:text" content="#333333"/>
  15. <meta name="color:links" content="#5b5b5b"/>
  16. <meta name="color:links hover" content="#c9c9c9"/>
  17. <meta name="color:scrollbar bg" content="#ffffff"/>
  18. <meta name="color:scrollbar" content="#eeeeee">
  19. <meta name="color:accent" content="#2b2b2b"/>
  20. <meta name="color:border" content="#eeeeee">
  21.  
  22. <meta name="image:sidebar image" content=""/>
  23.  
  24. <meta name="text:link 1 URL" content="" />
  25. <meta name="text:link 1" content="" />
  26. <meta name="text:link 2 URL" content="" />
  27. <meta name="text:link 2" content="" />
  28. <meta name="text:link 3 URL" content="" />
  29. <meta name="text:link 3" content="" />
  30.  
  31. <meta name="if:500 posts" content="0"/>
  32. <meta name="if:400 posts" content="1"/>
  33.  
  34.  
  35.  
  36. <!------------------------TOOLTIPS SCRIPT--------------------->
  37.  
  38. <link href="https://static.tumblr.com/5omyijl/bzrn2yg7i/style-my-tooltips.css" rel="stylesheet" type="text/css" />
  39. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  40. <script src="https://static.tumblr.com/5omyijl/RZtn2yg9v/jquery.style-my-tooltips.js"></script>
  41. <script>
  42. (function($){
  43. $(document).ready(function(){
  44. $("[title]").style_my_tooltips({
  45. tip_follows_cursor:true,
  46. tip_delay_time:200,
  47. tip_fade_speed:300
  48. });
  49. });
  50. })(jQuery);
  51. </script>
  52.  
  53.  
  54. <!------------------------FONTS--------------------->
  55.  
  56. <link href='https://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>
  57.  
  58. <link href="https://fonts.googleapis.com/css?family=DM+Serif+Display&display=swap" rel="stylesheet">
  59.  
  60. <link rel="preconnect" href="https://fonts.gstatic.com">
  61. <link href="https://fonts.googleapis.com/css2?family=IM+Fell+English:ital@1&display=swap" rel="stylesheet">
  62.  
  63. <link href="https://fonts.googleapis.com/css?family=Radley&display=swap" rel="stylesheet">
  64.  
  65. <link href="https://fonts.googleapis.com/css?family=Alegreya+Sans+SC:400,700&display=swap" rel="stylesheet">
  66.  
  67. <link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet">
  68.  
  69. <link rel="preconnect" href="https://fonts.gstatic.com">
  70. <link href="https://fonts.googleapis.com/css2?family=Bitter&display=swap" rel="stylesheet">
  71.  
  72. <link href="https://fonts.googleapis.com/css?family=Abril+Fatface&display=swap" rel="stylesheet">
  73.  
  74. <link rel="preconnect" href="https://fonts.gstatic.com">
  75. <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@600&display=swap" rel="stylesheet">
  76.  
  77. <link rel="preconnect" href="https://fonts.gstatic.com">
  78. <link href="https://fonts.googleapis.com/css2?family=Crimson+Text&display=swap" rel="stylesheet">
  79.  
  80. <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'>
  81.  
  82. <link rel="preconnect" href="https://fonts.gstatic.com">
  83. <link href="https://fonts.googleapis.com/css2?family=Lora:ital@1&display=swap" rel="stylesheet">
  84.  
  85. <link rel="preconnect" href="https://fonts.gstatic.com">
  86. <link href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro&display=swap" rel="stylesheet">
  87.  
  88. <link rel="preconnect" href="https://fonts.gstatic.com">
  89. <link href="https://fonts.googleapis.com/css2?family=Anton&display=swap" rel="stylesheet">
  90.  
  91. <link rel="preconnect" href="https://fonts.gstatic.com">
  92. <link href="https://fonts.googleapis.com/css2?family=Passion+One&display=swap" rel="stylesheet">
  93.  
  94. <link rel="preconnect" href="https://fonts.gstatic.com">
  95. <link href="https://fonts.googleapis.com/css2?family=Bowlby+One+SC&display=swap" rel="stylesheet">
  96.  
  97. <link rel="preconnect" href="https://fonts.gstatic.com">
  98. <link href="https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@800&display=swap" rel="stylesheet">
  99.  
  100. <!-------------------------------------------------------------------->
  101.  
  102.  
  103. <style type="text/css">
  104.  
  105.  
  106. /*----------tooltips---------*/
  107.  
  108. #s-m-t-tooltip {
  109. font-family:'Bodoni MT Condensed';
  110. max-width:300px;
  111. margin:15px;
  112. padding:5px;
  113. border:1px solid {color:border};
  114. border-radius:0px;
  115. background:{color:background};
  116. color:{color:text};
  117. z-index:999999;
  118. font-size:13px;
  119. font-weight:bold;
  120. letter-spacing:2px;
  121. text-transform:lowercase;
  122. font-style:italic;
  123. box-shadow:1px 1px 3px rgba(0,0,0,.0);
  124. }
  125.  
  126.  
  127. /*----------selection aka highlight---------*/
  128.  
  129.  
  130. ::selection {
  131. background: #222222;
  132. color: white;
  133. }
  134.  
  135. ::-moz-selection {
  136. background: #222222;
  137. color: white;
  138. }
  139.  
  140. p::selection {
  141. background: #222222;
  142. color: white;
  143. }
  144.  
  145.  
  146. /*----------scrollbar---------*/
  147.  
  148. ::-webkit-scrollbar {
  149. width:11px;height:11px;
  150. }
  151. ::-webkit-scrollbar {
  152. background-color:transparent;
  153. }
  154. ::-webkit-scrollbar-track {
  155. border:5px solid {color:background};
  156. background-color:#ddd;
  157. }
  158. ::-webkit-scrollbar-thumb {
  159. border:5px solid {color:background};
  160. background-color:{color:accent};
  161. min-height:24px;min-width:24px;
  162. }
  163.  
  164.  
  165. /*----------basics---------*/
  166.  
  167. body {
  168. background:{color:background};
  169. color:{color:text};
  170. font-family: 'Source Serif Pro', serif;
  171. line-height:15px;
  172. font-size:12px;
  173. margin:0;
  174. text-align:left;
  175. }
  176.  
  177. blockquote {
  178. padding-left:10px;
  179. border-left:1px solid;
  180. border-color:#eeeeee;
  181. margin:10px;
  182. }
  183.  
  184. a {
  185. color:{color:links};
  186. text-decoration:none;
  187. }
  188.  
  189. a:hover {
  190. text-decoration:none;
  191. color: {color:links hover};
  192. -webkit-transition:all 0.5s;
  193. -moz-transition:all 0.5s;
  194. -ms-transition:all 0.5s;
  195. -o-transition:all 0.5s;
  196. transition:all 0.5s;
  197. }
  198.  
  199. img {
  200. opacity:1;
  201. text-decoration:none;
  202. }
  203.  
  204. big {
  205. font-size:16px;
  206. font-family:'EB Garamond';
  207. }
  208.  
  209. small, sub {
  210. font-size:12px;
  211. }
  212.  
  213. em, i {
  214. font-size: 10px;
  215. letter-spacing: 1px;
  216. text-transform: normal;
  217. color:{color:accent};
  218. font-weight:bold;
  219. }
  220.  
  221. h1, h2, h3 {
  222. font-family:'EB Garamond';
  223. font-weight: bold;
  224. font-style:italic;
  225. text-transform: lowercase uppercase;
  226. color:{color:accent};
  227. text-align: fixed;
  228. letter-spacing: 1px;
  229. font-size:19px;
  230. }
  231.  
  232.  
  233. /*----------posts---------*/
  234.  
  235. .container {
  236. left:50%;
  237. margin-left:-50px;
  238. position:absolute;
  239. {block:If400posts}
  240. width:400px;
  241. {/block:If400posts}
  242. {block:If500posts}
  243. width:500px;
  244. {/block:If500posts}
  245. }
  246.  
  247. .posts {
  248. {block:If400posts}
  249. width:400px;
  250. {/block:If400posts}
  251. {block:If500posts}
  252. width:500px;
  253. {/block:If500posts}
  254. {block:IndexPage}
  255. margin-bottom:75px;
  256. {/block:IndexPage}
  257. {block:PermalinkPage}
  258. margin-bottom:50px;
  259. {/block:PermalinkPage}
  260. }
  261.  
  262. .entries {
  263. margin-left:-115px;
  264. width:500px;
  265. margin-top:80px;
  266. margin-bottom:50px;
  267. }
  268.  
  269. .posts img, .posts li, .posts blockquote {
  270. max-width: 100%;
  271. }
  272.  
  273. .posts li {
  274. list-style: square;
  275. }
  276.  
  277. blockquote img {
  278. max-width:320px!important;
  279. }
  280.  
  281.  
  282. /*----------post info---------*/
  283.  
  284. .info {
  285. border-top:1px solid #eeeeee;
  286. font-family:'Lora';
  287. padding-top:15px;
  288. text-transform:uppercase;
  289. text-align:center;
  290. font-size:10px;
  291. letter-spacing:1px;
  292. margin-top:15px;
  293. }
  294.  
  295. .tags {
  296. margin-top:5px;
  297. font-size:10px;
  298. text-align:center;
  299. letter-spacing:1px;
  300. font-style:italic;
  301. }
  302.  
  303. .tags a {
  304. margin-right:8px;
  305. }
  306.  
  307.  
  308. /*----------post notes---------*/
  309.  
  310. ol.notes {
  311. padding:0px;
  312. margin:25px 0px 0px -10px;
  313. list-style-type:none;
  314. }
  315.  
  316. ol.notes li.note {
  317. padding:10px;
  318. }
  319.  
  320. ol.notes li.note img.avatar {
  321. vertical-align:-4px;
  322. margin-right:10px;
  323. width:16px;
  324. height:16px;
  325. }
  326.  
  327. ol.notes li.note span.action {
  328. font-weight:none;
  329. }
  330.  
  331. ol.notes li.note .answer_content {
  332. font-weight:normal;
  333. }
  334.  
  335. ol.notes li.note blockquote {
  336. padding:4px 10px;
  337. margin:10px 0px 0px 25px;
  338. }
  339.  
  340. ol.notes li.note blockquote a {
  341. text-decoration:none;
  342. }
  343.  
  344. /*----------sidebar---------*/
  345.  
  346. .sidebar {
  347. position:fixed;
  348. width:150px;
  349. margin-left:-350px;
  350. top:120px;
  351. }
  352.  
  353. .sidebarimage {
  354. width:150px;
  355. }
  356.  
  357. .sidebarimage img {
  358. width:150px;
  359. height:250px;
  360. margin-bottom:-20px;
  361. }
  362.  
  363. .sidetitle {
  364. position:fixed;
  365. color:{color:accent};
  366. font-family: 'Shippori Mincho B1', serif;
  367. margin-top:5px;
  368. font-size:19px;
  369. margin-top:-260px;
  370. text-transform:lowercase;
  371. font-style:italic;
  372. font-weight:bold;
  373. width:150px;
  374. height:18px;
  375. text-align:center;
  376. }
  377.  
  378.  
  379. .description {
  380. position:fixed;
  381. width:150px;
  382. font-size:11px;
  383. text-align:center;
  384. margin-top:75px;
  385. }
  386.  
  387. .links {
  388. position:fixed;
  389. font-family: 'Shippori Mincho B1', serif;
  390. border-bottom:6px solid {color:border};
  391. width:150px;
  392. height:25px;
  393. text-align:center;
  394. font-weight:bold;
  395. font-size:12px;
  396. margin-top:30px;
  397. word-spacing:3px;
  398. color:{color:links};
  399. }
  400.  
  401. .links a {
  402. padding:5px;
  403. }
  404.  
  405. .links a:hover {
  406. background-color:{color:accent};
  407. color:#fff;
  408. }
  409.  
  410. /*----------pagination---------*/
  411.  
  412. .pagination {
  413. font-family:'EB Garamond';
  414. color:{color:links};
  415. width:250px;
  416. margin-top:20px;
  417. text-align:center;
  418. text-transform:uppercase;
  419. font-style:italic;
  420. font-weight:bold;
  421. font-size:17px;
  422. padding-top:15px;
  423.  
  424. }
  425.  
  426.  
  427. /*----------quotes---------*/
  428.  
  429. .quote {
  430. text-transform:uppercase;
  431. font-size:12px;
  432. font-weight:bold;
  433. text-align:center;
  434. }
  435.  
  436. .quotesource {
  437. text-align:center;
  438. margin-top:10px;
  439. }
  440.  
  441.  
  442. /*----------chat---------*/
  443.  
  444. .chat {
  445. line-height:20px;
  446. list-style:none;
  447. }
  448.  
  449. .line.odd {
  450. background:#fafafa;
  451. margin-bottom:2px;
  452. padding:5px;
  453. list-style:none;
  454. font-size:10px;
  455. }
  456.  
  457. .line.even {
  458. background:#ffffff;
  459. margin-bottom:2px;
  460. padding:5px;
  461. list-style:none;
  462. font-size:10px;
  463. }
  464.  
  465. .label {
  466. padding-right:1px;
  467. text-transform:uppercase;
  468. font-weight:bold;
  469. color:{color:links};
  470. }
  471.  
  472.  
  473. /*----------questions---------*/
  474.  
  475. .asker {
  476. font-family: 'Shippori Mincho B1', serif;
  477. text-transform:lowercase;
  478. font-style:italic;
  479. color:{color:links};
  480. letter-spacing:1px;
  481. font-size:15px;
  482. }
  483.  
  484. .q {
  485. padding:8px;
  486. font-family:'Lora';
  487. font-size:12px;
  488. text-transform:uppercase lowercase;
  489. text-align:center;
  490. color:{color:text};
  491. background-color:{color:background};
  492. border:1px solid {color:border};
  493. }
  494.  
  495.  
  496. /*----------audio---------*/
  497.  
  498. .playerbutton {
  499. position:relative;
  500. width:30px;
  501. height:35px;
  502. overflow:hidden;
  503. }
  504.  
  505. .playerbuttonhug {
  506. position: absolute;
  507. top:-7px;
  508. left:2px;
  509. }
  510.  
  511. .tumblr_audio_player {
  512. height:50px;
  513. width:500px;
  514. }
  515.  
  516. .playerbuttonbg {
  517. position:absolute;
  518. width:35px;
  519. height:35px;
  520. background-color:#e4e4e4;
  521. padding:10px;
  522. }
  523.  
  524. .trackdetails {
  525. width:auto;
  526. display:inline-block;
  527. margin-left:70px;
  528. font-size:10px;
  529. letter-spacing:1px;
  530. text-transform:lowercase;
  531. padding:5px;
  532. line-height:15px;
  533. }
  534.  
  535. .audiowrapper {
  536. position:relative;
  537. display:inline-block;
  538. }
  539.  
  540. /*----------credit---------*/
  541.  
  542. .credit {
  543. font-family: 'Karla', sans-serif;
  544. font-size:8px;
  545. position:fixed;
  546. font-weight:bold;
  547. text-transform:uppercase;
  548. bottom:5px;
  549. right:15px;
  550. z-index:10;
  551. text-align:right;
  552. letter-spacing:1px;
  553. padding:2px;
  554. }
  555.  
  556. .credit a {
  557. color:#5b5b5b;
  558. text-decoration:none;
  559. }
  560.  
  561. .credit a:hover {
  562. color:#fff;
  563. background-color:#000;
  564. text-decoration:none;
  565. padding:10px;
  566. }
  567.  
  568.  
  569. </style>
  570. </head>
  571.  
  572. <body>
  573. <div class="container">
  574.  
  575. <div class="credit">
  576. <a title="theme" href="https://chevans.tumblr.com/" target="_blank">chevans</a></div>
  577.  
  578.  
  579. <div class="sidebar">
  580.  
  581.  
  582. <div class="sidebarimage">
  583. <img src="{image:sidebar image}">
  584. </a></div>
  585.  
  586.  
  587. <div class="sidetitle">{Title}</div>
  588.  
  589.  
  590. <div class="description">{Description}</div>
  591.  
  592.  
  593. <div class="links">
  594. <a href="/" title="refresh">I</a>
  595. <a href="/ask" title="questions">II</a>
  596. <a href="{text:link 1 url}" title="{text:link 1}">III</a>
  597. <a href="{text:link 2 url}" title="{text:link 2}">IV</a>
  598. <a href="{text:link 3 url}" title="{text:link 3}">V</a>
  599. </div>
  600.  
  601.  
  602.  
  603. </div>
  604.  
  605.  
  606. <div class="entries">
  607. {block:Posts}
  608. <div class="posts">
  609.  
  610. {block:Text}
  611. <h1>{block:Title}{Title}{/block:Title}</h1>
  612. {Body}{/block:Text}
  613.  
  614.  
  615. {block:Photo}
  616. {LinkOpenTag}{block:If400posts}<img src="{PhotoURL-400}">{/block:If400posts}{block:If500posts}<img src="{PhotoURL-500}">{/block:If500posts}{LinkCloseTag}
  617. {block:Caption}{Caption}{/block:Caption}
  618. {/block:Photo}
  619.  
  620.  
  621. {block:Photoset}
  622. {block:If400posts}
  623. {Photoset-400}
  624. {/block:If400posts}
  625. {block:If500posts}
  626. {Photoset-500}
  627. {/block:If500posts}
  628. {block:Caption}{Caption}{/block:Caption}
  629. {/block:Photoset}
  630.  
  631.  
  632. {block:Quote}
  633. <div class="quote">"{Quote}"</div>
  634. {block:Source}<div class="quotesource"> — {Source}</div>
  635. {/block:Source}{/block:Quote}
  636.  
  637.  
  638. {block:Link}
  639. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  640. {block:Description}{Description}{/block:Description}
  641. {/block:Link}
  642.  
  643.  
  644. {block:Chat}
  645. {block:Title}<h1>{Title}</h1>{/block:Title} <div class="chat"> {block:Lines} <li class="line {Alt}"> {block:Label} <span class="label"> {Label}</span> {/block:Label}{Line}</li> {/block:Lines}</div>
  646. {/block:Chat}
  647.  
  648.  
  649. {block:Audio}
  650. {block:AudioPlayer}
  651. <div class="audiowrapper">
  652. <div class="playerbuttonbg">
  653. <div class="playerbutton">
  654. <div class="playerbuttonhug">
  655. {AudioPlayerGrey}
  656. </div></div></div>
  657.  
  658. <div class="trackdetails">
  659. {block:TrackName}<b>TRACK:</b> {TrackName}{/block:TrackName}<br>
  660.  
  661. {block:Artist}<b>ARTIST:</b> {Artist}{/block:Artist}<br>
  662.  
  663. <b>PLAYS:</b> {FormattedPlayCount}</div></div>
  664. {/block:AudioPlayer}
  665.  
  666. {block:Caption}
  667. <div class="caption">{Caption}</div>
  668. {/block:Caption}
  669. {/block:Audio}
  670.  
  671.  
  672. {block:Video}
  673. {Video-500}
  674. {block:Caption}{Caption}{/block:Caption}
  675. {/block:Video}
  676.  
  677.  
  678. {block:Answer}
  679. <div class="questions">
  680. <span> <b>{Asker}</b> ... </span>
  681. <br><div class="q">{Question}</div>
  682. <div class="as">{Answer}</div>
  683. </div>
  684. {/block:Answer}
  685.  
  686.  
  687. <div class="info">
  688. {block:Date}
  689. <b><a href="{Permalink}">{TimeAgo}</b></a>
  690. {/block:Date}
  691.  
  692. &nbsp;&nbsp;
  693. <a href="{Permalink}">{NoteCountWithLabel}</a>
  694. &nbsp;&nbsp;
  695.  
  696. {block:RebloggedFrom}
  697. <a href="{ReblogParentURL}" title="{ReblogParenttitle}">via </a>
  698. {block:ContentSource}
  699. <a href="{ReblogRootURL}" "{ReblogRootName}" title="{ReblogRoottitle}">&nbsp; src</a>
  700. {/block:ContentSource}
  701. {/block:RebloggedFrom}
  702.  
  703. <a href="{ReblogURL}" target="_blank" class="details">&nbsp; reblog</a>
  704. </div>
  705.  
  706.  
  707. {block:HasTags}
  708. <div class="tags">
  709. {block:Tags}
  710. <a href="{TagURL}">#{Tag}</a>
  711. {/block:Tags}
  712. </div>
  713. {/block:HasTags}
  714.  
  715. </div>
  716.  
  717.  
  718. {block:PostNotes}
  719. {PostNotes}
  720. {/block:PostNotes}
  721.  
  722. {/block:Posts}
  723.  
  724. {block:ContentSource}
  725. <!---{SourceURL}{block:SourceLogo}<img src=”{BlackLogoURL}”
  726. width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  727. {/block:SourceLogo}
  728. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} --->
  729. {/block:ContentSource}{block:ReblogParent}{/block:ReblogParent}
  730.  
  731.  
  732. <div class="pagination">
  733. {block:Pagination}
  734. {block:PreviousPage}
  735. <a href="{PreviousPage}">back</a>{/block:PreviousPage}&nbsp;
  736.  
  737. {block:NextPage}
  738. <a href="{NextPage}">forth</a>
  739. {/block:NextPage}
  740. {/block:Pagination}
  741. </div>
  742.  
  743. </body>
  744.  
  745. </div></div></div></div></div></div></div></div></div></div></div>
  746. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!