API tools faq
paste
Advertisement
booksinvolved

theme #8 you are my beginning

booksinvolved
Aug 4th, 2014
1,006
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.92 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4.  
  5. <head>
  6.  
  7. <!--- theme by jasnahdavar
  8. ----- DO NOT steal/redistribute/remove credit
  9. ----- ASK ME if you want to use this as a base code i promise i'm nice
  10. ----- sidebar image automatically resizes to 200px wide
  11. ----- title looks best when it is no more than 2 lines long
  12. ----- you can toggle the number of navlinks with buttons
  13. ---------- COLOURS:
  14. ------------------ navlink 1: background of first, fourth and seventh sidebar link
  15. ------------------ navlink 2: background of second, fifth and eighth sidebar link
  16. ------------------ navlink 3: background of third and sixth sidebar link
  17. ------------------ post background 1: answer and quote background
  18. ------------------ post background 2: text post title and quote source background
  19. ------------------ the post info colours correspond to the navlink colours
  20. ----- this theme looks best with a pretty and bright colour scheme but as always you can edit it as much as you like
  21. ----- if you have any questions feel free to ask!
  22. --->
  23.  
  24. <title>{Title}</title>
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  27. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  28.  
  29. <meta name="image:sidebar" content="">
  30.  
  31. <meta name="color:background" content="#fff">
  32. <meta name="color:text" content="#000">
  33. <meta name="color:link" content="#ff8273">
  34. <meta name="color:link hover" content="#94e1ff">
  35. <meta name="color:title bg" content="#ffb69c">
  36. <meta name="color:description bg" content="#eee">
  37. <meta name="color:navlink 1" content="#ff8273">
  38. <meta name="color:navlink 2" content="#94e1ff">
  39. <meta name="color:navlink 3" content="#ffd98a">
  40. <meta name="color:post background 1" content="#ffbec3">
  41. <meta name="color:post background 2" content="#ff848d">
  42.  
  43. <meta name="if:show navlink 1" content="1">
  44. <meta name="if:show navlink 2" content="1">
  45. <meta name="if:show navlink 3" content="1">
  46. <meta name="if:show navlink 4" content="1">
  47. <meta name="if:show navlink 5" content="1">
  48. <meta name="if:show navlink 6" content="1">
  49.  
  50.  
  51. <meta name="text:link 1" content="link">
  52. <meta name="text:link 1 url" content="url">
  53. <meta name="text:link 2" content="link">
  54. <meta name="text:link 2 url" content="url">
  55. <meta name="text:link 3" content="link">
  56. <meta name="text:link 3 url" content="url">
  57. <meta name="text:link 4" content="link">
  58. <meta name="text:link 4 url" content="url">
  59. <meta name="text:link 5" content="link">
  60. <meta name="text:link 5 url" content="url">
  61. <meta name="text:link 6" content="link">
  62. <meta name="text:link 6 url" content="url">
  63.  
  64.  
  65.  
  66.  
  67.  
  68.  
  69.  
  70.  
  71. <style type="text/css">
  72. ::-webkit-scrollbar-thumb:vertical {
  73. background-color:#cfcfcf; /*scrollbar color*/
  74. height:100px;
  75. }
  76.  
  77. ::-webkit-scrollbar-thumb:horizontal {
  78. background-color:#cfcfcf; /*scrollbar color*/
  79. height:100px !important;
  80. }
  81.  
  82. ::-webkit-scrollbar {
  83. height:10px;
  84. width:8px;
  85. background-color:#eee; /*scrollbar bg color*/
  86. }
  87.  
  88.  
  89.  
  90. ol.notes {
  91. padding: 5px;
  92. margin: 25px 0px;
  93. list-style-type: circle;
  94. border-bottom: solid 1px #ccc;
  95. text-align:left;
  96. font-size:10px;
  97. }
  98.  
  99. ol.notes li.note {
  100. padding: 5px;
  101. font-weight: normal;
  102. text-align:left;
  103.  
  104.  
  105. }
  106.  
  107. ol.notes li.note img.avatar {
  108. vertical-align: -4px;
  109. margin-right: 10px;
  110. width: 16px;
  111. height: 16px;
  112. }
  113.  
  114. ol.notes li.note span.action {
  115. font-weight: normal;
  116. text-align:left;
  117.  
  118. }
  119.  
  120. ol.notes li.note .answer_content {
  121. font-weight: normal;
  122. text-align:left;
  123.  
  124. }
  125.  
  126. ol.notes li.note blockquote {
  127. border-color: #eee;
  128. padding: 4px 5px;
  129. margin: 10px 0px 0px 15px;
  130. }
  131.  
  132. ol.notes li.note blockquote a {
  133. text-decoration: none;
  134. }
  135.  
  136. blockquote {
  137. padding:5px;
  138. border-left:2px solid {color:text};
  139.  
  140. }
  141.  
  142. blockquote blockquote {
  143. padding:5px;
  144. border-left:2px solid {color:text};
  145.  
  146. }
  147.  
  148.  
  149.  
  150.  
  151.  
  152.  
  153. body {
  154. background:{color:background};
  155. margin:0px;
  156. color:{color:text};
  157. font-family:cambria;
  158. font-size:10px;
  159. line-height:115%;
  160. font-style: none;
  161. }
  162.  
  163.  
  164. #credit {
  165. position:fixed;
  166. right:10px;
  167. bottom:10px;
  168. z-index:10;
  169. }
  170.  
  171. #credit a {
  172. font-weight:bold;
  173. text-align:center;
  174. padding:5px;
  175. background:#ff8273;
  176. display:block;
  177. color:#000;
  178. }
  179.  
  180. #credit a:hover {
  181. color:#ff8273;
  182. background:#000;
  183. }
  184.  
  185.  
  186.  
  187. a:link, a:visited, a:active {
  188. text-decoration: none;
  189. color:{color:link};
  190. font-weight: normal;
  191. -webkit-transition: .6s;
  192. -moz-transition: .6s;
  193. transition: .6s;
  194. }
  195.  
  196. a:hover {
  197. text-decoration: none;
  198. color:{color:link hover};
  199. font-weight: normal;
  200. -webkit-transition: .6s;
  201. -moz-transition: .6s;
  202. transition: .6s;
  203. }
  204.  
  205.  
  206.  
  207. /* -------------- SIDEBAR ------------*/
  208.  
  209.  
  210. #sbar {
  211. left:50px;
  212. top:100px;
  213. width:250px;
  214. position:fixed;
  215. }
  216.  
  217. .title {
  218. font-family:"lobster";
  219. padding:5px;
  220. text-align:center;
  221. letter-spacing:1px;
  222. background:{color:title bg};
  223. font-size:16px;
  224. }
  225.  
  226. .sbimg img {
  227. width:200px;
  228. margin-left:25px;
  229. }
  230.  
  231. .desc {
  232. padding:10px;
  233. width:230px;
  234. text-align:center;
  235. background:{color:description bg};
  236. font-size:10px;
  237. margin-top:-3px;
  238. }
  239.  
  240. .pagination {
  241. width:190px;
  242. padding:5px;
  243. margin-left:25px;
  244. background:{color:title bg};
  245. text-align:center;
  246. }
  247.  
  248. .pagination a {
  249. color:#666;
  250. padding:0px 5px 0px 5px;
  251. }
  252.  
  253. .pagination a:hover {
  254. color:#000;
  255. }
  256.  
  257. .navl {
  258. position:fixed;
  259. left:305px;
  260. top:150px;
  261. width:200px;
  262. }
  263.  
  264. .navl a {
  265. width:60px;
  266. margin:5px;
  267. padding:5px;
  268. word-wrap:break-word;
  269. text-align:center;
  270. text-transform:uppercase;
  271. font-size:9px;
  272. display:inline-block;
  273. color:{color:text};
  274. }
  275.  
  276. .navl a:nth-of-type(odd):hover {
  277. background:#000;
  278. color:#eee;
  279. }.navl a:nth-of-type(even):hover {
  280. background:#000;
  281. color:#eee;
  282. }
  283.  
  284.  
  285. .navl a:nth-of-type(1), .navl a:nth-of-type(4), .navl a:nth-of-type(7) {
  286. background:{color:navlink 1};
  287. }
  288.  
  289. .navl a:nth-of-type(2), .navl a:nth-of-type(5), .navl a:nth-of-type(8) {
  290. background:{color:navlink 2};
  291. }
  292.  
  293.  
  294. .navl a:nth-of-type(3), .navl a:nth-of-type(6) {
  295. background:{color:navlink 3};
  296. }
  297.  
  298.  
  299.  
  300. #entries {
  301. position:absolute;
  302. left:510px;
  303. top:50px;
  304. width:400px;
  305. padding:10px;
  306. font-size:10px;
  307. }
  308.  
  309. #post {
  310. width:400px;
  311. padding:10px;
  312. margin:20px 10px 20px 10px;
  313. }
  314.  
  315. /* ASK */
  316.  
  317. .question {
  318. width:386px;
  319. margin-left:-3px;
  320. padding:10px;
  321. color:#fff;
  322. text-align:Center;
  323. background:#000;
  324. }
  325.  
  326. .question a {
  327. color:{color:post background 1};
  328. text-transform:uppercase;
  329. }
  330.  
  331. .question a:hover {
  332. color:#fff;
  333. }
  334.  
  335. .answer {
  336. width:380px;
  337. padding:10px;
  338. background:{color:post background 1};
  339. }
  340.  
  341.  
  342.  
  343. /* chat */
  344.  
  345. .chat ul {
  346. list-style: none;
  347. margin: 0;
  348. padding: 0;
  349. }
  350.  
  351. .chat li {
  352. padding: 2%;
  353. margin: 5px;
  354. }
  355.  
  356. .chat .odd {
  357. border:2px solid {color:post background 1};
  358. }
  359. .chat .even {
  360. border:2px solid {color:post background 2};
  361. }
  362.  
  363. .label {
  364. text-transform:uppercase;
  365. font-weight:bold;
  366. font-size:10px;
  367. }
  368.  
  369. /* text post title */
  370.  
  371. h1 {
  372. text-transform:uppercase;
  373. text-align:Center;
  374. padding:2px;
  375. background:{color:post background 2};
  376. font-size:10px;
  377. }
  378.  
  379. /* quote */
  380.  
  381. .quote {
  382. width:386px;
  383. margin-left:-3px;
  384. padding:10px;
  385. background:{color:post background 1};
  386. font-style:italic;
  387. font-size:12px;
  388. }
  389. .qsource {
  390. width:350px;
  391. margin-left:15px;
  392. padding:10px;
  393. background:{color:post background 2};
  394. text-align:right;
  395.  
  396. }
  397.  
  398. /* audio */
  399.  
  400. #player {
  401. width:30px;
  402. height:30px;
  403. overflow:hidden;
  404. position:absolute;
  405. margin-top:35px;
  406. margin-bottom:45px;
  407. margin-left:35px;
  408. opacity:0.7;
  409. }
  410.  
  411. #albumart {
  412. width:100px;
  413. height:100px;
  414. }
  415.  
  416. #albumart img {
  417. width:100px;
  418. height:100px;
  419. }
  420.  
  421. #audioinfo {
  422. margin-left:125px;
  423. margin-top:-100px;
  424. height:100px;
  425. text-align:left;
  426. width:355px;
  427. font-size:9px;
  428. text-transform:uppercase;
  429. }
  430.  
  431. .audioinf {
  432. padding:2px;
  433. border-left:20px solid {color:post background 2};
  434. margin-bottom:5px;
  435.  
  436. }
  437.  
  438.  
  439. /* info */
  440.  
  441. #info {
  442. margin-top:10px;
  443.  
  444. }
  445.  
  446. #info a {
  447. padding:3px;
  448. margin:5px;
  449. color:{color:text};
  450. display:inline-block;
  451. }
  452.  
  453. #info a:hover {
  454. border-bottom:3px solid {color:text};
  455. }
  456.  
  457. .perma a {
  458. border-bottom:3px solid {color:navlink 1};
  459. }
  460.  
  461. .viasrc a {
  462. border-bottom:3px solid {color:navlink 2};
  463. }
  464.  
  465. .tags a {
  466. border-bottom:3px solid {color:navlink 3};
  467. }
  468.  
  469.  
  470.  
  471.  
  472. @font-face { font-family: "lobster"; src: url('http://themes.googleusercontent.com/static/fonts/lobster/v3/MWVf-Rwh4GLQVBEwbyI61Q.woff'); }
  473.  
  474.  
  475. {CustomCSS}</style>
  476.  
  477.  
  478. </head><body>
  479.  
  480. <div id="sbar">
  481.  
  482. <div class="title">
  483.  
  484. {Title}
  485.  
  486. </div>
  487.  
  488. <div class="sbimg">
  489. <img src="{image:sidebar}">
  490. </div>
  491.  
  492. <div class="desc">
  493. {Description}
  494. </div>
  495.  
  496. <div class="pagination">
  497. {block:Pagination}
  498. {block:Previouspage}
  499. <span class="arrows"><a href="{PreviousPage}">←</a></span>
  500. {/block:previouspage}
  501. {CurrentPage} of {TotalPages}
  502. {block:nextpage}
  503. <span class="arrows"><a href="{NextPage}">→</a></span>
  504. {/block:nextpage}
  505. {/block:Pagination}</div>
  506.  
  507.  
  508.  
  509. <div class="navl">
  510. <a href="/">home</a>
  511. <a href="/ask">ask</a>
  512. {block:ifshownavlink1}<a href="{text:link 1 url}">{text:link 1}</a>{/block:ifshownavlink1}
  513. {block:ifshownavlink2}<a href="{text:link 2 url}">{text:link 2}</a>{/block:ifshownavlink2}
  514. {block:ifshownavlink3} <a href="{text:link 3 url}">{text:link 3}</a>{/block:ifshownavlink3}
  515. {block:ifshownavlink4} <a href="{text:link 4 url}">{text:link 4}</a>{/block:ifshownavlink4}
  516. {block:ifshownavlink5} <a href="{text:link 5 url}">{text:link 5}</a>{/block:ifshownavlink5}
  517. {block:ifshownavlink6} <a href="{text:link 6 url}">{text:link 6}</a>{/block:ifshownavlink6}
  518. </div>
  519.  
  520. </div>
  521.  
  522. <div id="entries">
  523. {block:posts}
  524. <div id="post">
  525.  
  526. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  527.  
  528. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  529.  
  530. {block:Photoset}{Photoset-400}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  531.  
  532. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  533.  
  534.  
  535.  
  536. {block:Chat}
  537. <div class="chat">
  538. {block:Title}{Title}{/block:Title}
  539. <ul>{block:Lines}
  540. <li class="{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>
  541. {/block:Lines}</ul>
  542. </div>
  543. {/block:Chat}
  544.  
  545. {block:Quote}
  546. <div class="quote">
  547. {Quote}
  548. </div>
  549.  
  550. {block:Source} <div class="qsource">—{Source}</div>{/block:Source}
  551.  
  552. {/block:Quote}
  553.  
  554. {block:Audio}
  555.  
  556. <div id="albumart">
  557.  
  558. <div id= "player">{AudioPlayerWhite}</div>
  559.  
  560. {block:AlbumArt}
  561. <img src="{AlbumArtURL}" width="100">
  562. {/block:AlbumArt}
  563. </div>
  564. <div id="audioinfo">{block:TrackName}
  565. <div class="audioinf"><strong>Title:</strong> {TrackName}</div>{/block:TrackName}
  566. <br>
  567. {block:Artist}<div class="audioinf"><strong>Artist:</strong> {Artist}</div>{/block:Artist}
  568. <br>
  569. <div class="audioinf">{PlayCount} plays</div>
  570. </div><!--audiotitle-->
  571.  
  572.  
  573. {block:Caption}{Caption}{/block:Caption}
  574. {/block:Audio}
  575.  
  576.  
  577. {block:Answer}
  578. <div class="question">
  579. {Asker}:&nbsp;{Question}
  580. </div>
  581. <div class="answer">
  582. {Answer}
  583. </div>
  584. {/block:Answer}
  585. <div id="info">
  586. <span class="perma">
  587.  
  588. {block:Date}
  589. <a href="{Permalink}">{TimeAgo}</a>
  590. {/block:Date}
  591.  
  592. {block:NoteCount}
  593.  
  594. <a href="{Permalink}">{NoteCountWithLabel}</a>
  595.  
  596. {/block:NoteCount}
  597. </span>
  598. <span class="viasrc">
  599.  
  600. {block:RebloggedFrom}
  601. <a href="{ReblogParentURL}">via {ReblogParentName}</a>
  602. {/block:RebloggedFrom}
  603.  
  604. {block:ContentSource}<a href="{SourceURL}">© {SourceTitle}</a> {/block:ContentSource}
  605. </span>
  606. <span class="tags">
  607.  
  608. {block:HasTags}
  609. {block:Tags}
  610. <a href="{TagUrl}">#{Tag}</a>
  611. {/block:Tags}
  612. {/block:Hastags}
  613. </span>
  614.  
  615. </div>
  616.  
  617.  
  618. {block:PostNotes}{PostNotes}{/block:PostNotes}
  619.  
  620.  
  621. </div>
  622. {/block:posts}
  623. </div>
  624.  
  625. <div id="credit">
  626. <a href="http://jasnahdavar.tumblr.com">JD.</a>
  627. </div>
  628.  
  629. </body></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!