Belgrravia

Rivers and Roads

Dec 23rd, 2014
352
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.59 KB | None | 0 0
  1. <!--
  2. rivers and roads
  3. theme by kalopsiathemes
  4. Please do not
  5. -remove the credit
  6. -steal parts of code
  7. -use as a base
  8.  
  9. Feel free to
  10. -edit parts of the theme
  11. -ask me any questions
  12. -->
  13. <!DOCTYPE html>
  14. <head>
  15. <link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Droid+Sans+Mono" />
  16. <title>{Title}</title>
  17. <link rel="shortcut icon" href="{Favicon}">
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  20.  
  21.  
  22.  
  23. <meta name="color:Background" content="#ffffff"/>
  24. <meta name="color:sidebar Background" content="#f4f4f6"/>
  25. <meta name="color:title" content="#c8cbd2"/>
  26. <meta name="color:link" content="#8c8e93"/>
  27. <meta name="color:link hover" content="#c8cbd2"/>
  28. <meta name="color:nav" content="#8c8e93"/>
  29. <meta name="color:nav hover" content="#8c8e93"/>
  30. <meta name="color:text" content="#8c8e93"/>
  31. <meta name="image:sidebar" content=""/>
  32.  
  33. <meta name="if:500px posts" content="1"/>
  34. <meta name="if:400px posts" content="0"/>
  35. <meta name="if:250px posts" content="0"/>
  36.  
  37.  
  38. <meta name="text:link1" content="">
  39. <meta name="text:link1url" content="" />
  40. <meta name="text:link2" content="">
  41. <meta name="text:link2url" content="" />
  42. <meta name="text:link3" content="">
  43. <meta name="text:link3url" content="" />
  44. <meta name="text:link4" content="">
  45. <meta name="text:link4url" content="" />
  46. <meta name="text:link5" content="">
  47. <meta name="text:link5url" content="" />
  48.  
  49. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  50. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  51.  
  52. <script>
  53.  
  54. (function($){
  55.  
  56. $(document).ready(function(){
  57.  
  58. $("a[title]").style_my_tooltips({
  59.  
  60. tip_follows_cursor:true,
  61.  
  62. tip_delay_time:30,
  63.  
  64. tip_fade_speed:300,
  65.  
  66. attribute:"title"
  67.  
  68. });
  69.  
  70. });
  71.  
  72. })(jQuery);
  73.  
  74. </script>
  75.  
  76.  
  77.  
  78. <style type="text/css">
  79.  
  80. #s-m-t-tooltip {max-width:400px;
  81. padding:2px;
  82. margin:10px 0px 0px 10px;
  83. padding:1px 4px;
  84. background-color:{color:text};
  85. text-transform:uppercase;
  86. font-size:7px;
  87. letter-spacing:2px;
  88. font-weight:700;
  89. font-family: Arial;
  90. color:{color:background};
  91. z-index:999;
  92.  
  93. }
  94.  
  95. ::-webkit-scrollbar {height: 0px;
  96. width: 3px;
  97. -webkit-border-radius: 0px;
  98. background-color:{color:background}}
  99. ::-webkit-scrollbar-thumb{background-color:{color:link hover};
  100. }
  101.  
  102. html, body {margin:0;padding:0;height:100%;}
  103.  
  104. body {
  105. background:{color:background};
  106. color:{color:text};
  107. font-size:9px;
  108. margin:0;
  109. font-family: Arial;
  110. }
  111.  
  112. #posts {
  113. {block:If500pxposts}
  114. width:500px;
  115. {/block:If500pxposts}
  116. {block:If400pxposts}
  117. width:400px;
  118. {/block:If400pxposts}
  119. {block:If250pxposts}
  120. width:250px;
  121. {/block:If250pxposts}
  122. margin-bottom:100px;
  123. }
  124.  
  125. #posts img {
  126. {block:If500pxposts}
  127. max-width:500px;
  128. {/block:If500pxposts}
  129. {block:If400pxposts}
  130. max-width:400px;
  131. {/block:If400pxposts}
  132. {block:If250pxposts}
  133. max-width:250px;
  134. {/block:If250pxposts}
  135. }
  136.  
  137.  
  138. #posts, #posts img, #posts blockquote {
  139. font-size:11px;
  140. color:{color:text};
  141. }
  142.  
  143. small {
  144. font-size:10px;
  145. }
  146.  
  147. big {
  148. font-size:12px;
  149. }
  150.  
  151.  
  152. h2 {
  153. font-size:14px;
  154. color:{color:title};
  155. text-transform:uppercase;
  156. font-family:arial;
  157. }
  158.  
  159. h1 {
  160. font-size:9px;
  161. Text-align:left;
  162. letter-spacing:1px;
  163. font-family: 'Droid Sans Mono';
  164. color:{color:text};
  165. }
  166.  
  167. h3 {
  168. font-size:11px;
  169. color:{color:title};
  170. letter-spacing:1px;
  171.  
  172. }
  173.  
  174.  
  175. #content {
  176. padding:0px;
  177. width:100%;
  178. {block:If500pxposts}
  179. width:500px;
  180. {/block:If500pxposts}
  181. {block:If400pxposts}
  182. width:400px;
  183. {/block:If400pxposts}
  184. {block:If250pxposts}
  185. width:250px;
  186. {/block:If250pxposts}
  187. margin-left:20%;
  188. padding-top:150px;
  189.  
  190. }
  191.  
  192. #top {
  193. width:70%;
  194. position:fixed;
  195. padding-bottom:5px;
  196. margin-top:0px;
  197. background-color:{color:background};
  198. border-bottom:1px solid {color:text};
  199. z-index:999999;
  200. }
  201.  
  202. #nav {
  203. text-align:left;
  204. text-transform:lowercase;
  205. vertical-align:bottom;
  206. font-size:10px;
  207. line-height:160%;
  208. margin-top:5px;
  209.  
  210. }
  211.  
  212. #nav a {
  213.  
  214. }
  215.  
  216. #nav a:hover {
  217. margin-left:5px;
  218. }
  219.  
  220. #sidebar {
  221. margin-left:20%;
  222. }
  223.  
  224. #sidebarimage {
  225. height:75px;
  226. margin-top:40px;
  227. text-align:center;
  228. vertical-align:bottom;
  229. }
  230.  
  231. #sidebarimage img {
  232. width:50px;
  233. height:50px;
  234. margin-left:55%;
  235. padding:10px;
  236. text-align:left;
  237. background:{color:sidebar background};
  238. -moz-transition-duration:all 1s ease-in-out;
  239. -webkit-transition-duration:all 1s ease-in-out;
  240. -o-transition-duration:all 1s ease-in-out;
  241. }
  242.  
  243. #sidebarimage img:hover {
  244. opacity:.8;
  245. -moz-transition-duration:1s;
  246. -webkit-transition-duration: 1s;
  247. -o-transition-duration:1s;
  248.  
  249. }
  250.  
  251. #side {
  252. width:120px;
  253. margin-left:51%;
  254. margin-top:100px;
  255. position:fixed;
  256. }
  257.  
  258. #title {
  259. font-size:11px;
  260. text-align:left;
  261. font-style:bold;
  262. margin-top:30px;
  263. text-transform:uppercase;
  264. font-weight:bold;
  265. color:{color:title};
  266. font-family: Arial;
  267. }
  268.  
  269. #description {
  270. width:120px;
  271. margin-top:5px;
  272. font-size:9px;
  273. text-align:justify;
  274. line-height:160%;
  275. padding-bottom:5px;
  276. border-bottom:1px solid {color:text};
  277. font-family: 'Droid Sans Mono';
  278. }
  279.  
  280.  
  281. #postinfo {
  282. margin-top:10px;
  283. letter-spacing:1px;
  284. font-size:8px;
  285. padding:2px;
  286. {block:If500pxposts}
  287. width:500px;
  288. {/block:If500pxposts}
  289. {block:If400pxposts}
  290. width:400px;
  291. {/block:If400pxposts}
  292. {block:If250pxposts}
  293. width:250px;
  294. {/block:If250pxposts}
  295. margin-bottom:100px;
  296. {block:permalinkPage}
  297. margin-bottom:50px;
  298. {/block:permalinkPage}
  299. margin-top:10px;
  300. font-family: 'Droid Sans Mono';
  301. float:left;
  302. display:inline;
  303. text-transform:lowercase;
  304. {block:IndexPage}
  305. opacity:0;
  306. {/block:IndexPage}
  307. -moz-transition-duration:all 1s ease-in-out;
  308. -webkit-transition-duration:all 1s ease-in-out;
  309. -o-transition-duration:all 1s ease-in-out;
  310. }
  311.  
  312. #posts:hover #postinfo {
  313. opacity:1;
  314. -moz-transition-duration:1s;
  315. -webkit-transition-duration: 1s;
  316. -o-transition-duration:1s;
  317. }
  318.  
  319.  
  320. .info {
  321. position:absolute;
  322. padding:5px;
  323. font-size:10px;
  324. }
  325.  
  326. .source {
  327. display:inline;
  328. float:right;
  329. {block:IndexPage}
  330. opacity:0;
  331. {/block:IndexPage}
  332. }
  333.  
  334. a:link, a:visited {
  335. text-decoration:none;
  336. color:{color:link};
  337. }
  338.  
  339. a:hover {
  340. text-decoration:none;
  341. cursor: crosshair;
  342. color:{color:link hover};
  343. }
  344.  
  345. .pagenotes {
  346. {block:IndexPage}
  347. display: none;
  348. {/block:IndexPage}
  349. {block:If500pxposts}
  350. width:500px;
  351. margin-left:-40px;
  352. {/block:If500pxposts}
  353. {block:If400pxposts}
  354. width:400px;
  355. margin-left:-40px;
  356. {/block:If400pxposts}
  357. {block:If250pxposts}
  358. width:250px;
  359. margin-left:-40px;
  360. {/block:If250pxposts}
  361. text-transform:lowercase;
  362. font-size:9px;
  363. letter-spacing:2px;
  364. }
  365.  
  366. #permalink {
  367. font-size:9px;
  368. margin-top:5px;
  369. letter-spacing:1px;
  370. text-transform:uppercase;
  371. }
  372.  
  373.  
  374. .pagenotes img {
  375. display:none;
  376. }
  377. .pagenotes li {
  378. list-style-type:none;
  379. line-height:120%;
  380. padding-top:10px;
  381. padding-bottom:10px;
  382. border-bottom:1px solid {color:link hover};
  383. }
  384.  
  385. .tags {
  386. {block:If500pxposts}
  387. width:500px;
  388. {/block:If500pxposts}
  389. {block:If400pxposts}
  390. width:400px;
  391. {/block:If400pxposts}
  392. {block:If250pxposts}
  393. width:250px;
  394. {/block:If250pxposts}
  395. font-size:7px;
  396. margin-top:5px;
  397. word-wrap:break-word;
  398. border-top:1px solid {color:text};
  399. padding-top:5px;
  400. text-align:left;
  401. opacity:1;
  402.  
  403. }
  404.  
  405. .pagi {
  406. margin-left:10%;
  407. width:500px;
  408. position:fixed;
  409. letter-spacing:2px;
  410. bottom:20px;
  411. text-align:center;
  412. color:{color:link};
  413. font-size:8px;
  414. text-transform:lowercase;
  415. }
  416.  
  417. .pagi a {
  418. padding:2px;
  419. color:{color:link};
  420. }
  421.  
  422.  
  423. .player {
  424. width:50px;
  425. height:25px;
  426. overflow:hidden;
  427. position:absolute;
  428. background:white;}
  429.  
  430. .audioinfo {
  431. margin-left:50px;
  432. font-size:12px;
  433. }
  434.  
  435. .q {
  436. text-align:center;
  437. font-weight:bold;
  438. }
  439.  
  440. .as {
  441. font-weight:bold;
  442. text-transform:uppercase;
  443. margin-bottom:10px;
  444. }
  445.  
  446.  
  447. .a {
  448. margin-top:10px;
  449.  
  450. }
  451.  
  452. .chat ol {
  453. padding:0;
  454. list-style:none;
  455. }
  456.  
  457. .label {font-weight:bold;
  458. }
  459.  
  460. .newplayerbutton {
  461. position: relative;
  462. width: 28px;
  463. height: 27px;
  464. overflow: hidden;
  465. }
  466.  
  467. .playerbuttonhug {
  468. position: absolute;
  469. top: -11px;
  470. left: -12px;
  471. }
  472.  
  473.  
  474. .tumblr_audio_player {
  475. border: none;
  476. padding: 0px;
  477. margin: 0px;
  478. height: 50px;
  479. width: 500px;
  480. }
  481.  
  482. .playerbuttonbg {
  483. position: absolute;
  484. z-index:999;
  485. left: 30px;
  486. top: 30px;
  487. width: 28px;
  488. height: 28px;
  489. background-color: #ffffff;
  490. padding: 10px;
  491. -webkit-border-radius: 40px;
  492. -moz-border-radius: 40px;
  493. border-radius: 0px;
  494. opacity: .4;
  495. filter: alpha(opacity=40);
  496. -moz-opacity: 0.4;
  497. -khtml-opacity: 0.4;
  498. transition: opacity .7s ease-in-out;
  499. -moz-transition: opacity .7s ease-in-out;
  500. -webkit-transition: opacity .7s ease-in-out;
  501. }
  502.  
  503. .playerbuttonbg:hover {
  504. opacity: 1;
  505. filter: alpha(opacity=100);
  506. -moz-opacity: 1;
  507. -khtml-opacity: 1;
  508. }
  509.  
  510. .audioimgwrapper {
  511. position: absolute;
  512. padding:10px;
  513. background-color:{color:sidebar background};
  514. left: 0px;
  515. top: 0px;
  516. -webkit-border-radius: 50px;
  517. -moz-border-radius: 50px;
  518. border-radius: 0px;
  519. overflow: hidden;
  520. width: 90px;
  521. height: 88px;
  522. }
  523.  
  524. .audioimgwrapper img {
  525. width: 100%;
  526. height: auto;
  527. -webkit-border-radius: 50px;
  528. -moz-border-radius: 50px;
  529. border-radius: 0px;
  530. }
  531.  
  532. .trackdetails {
  533. width: auto;
  534. display:inline-block;
  535. margin-left: 120px;
  536. line-height:200%;
  537. min-height: 85px;
  538. margin-top:0px;
  539. }
  540.  
  541. .audiowrapper {
  542. position: relative;
  543. display:inline-block;
  544. margin-bottom:20px;
  545. }
  546. #credit {
  547. position:fixed;
  548. color:{color:text};
  549. bottom:5px;
  550. right:10px;
  551. padding:4px;
  552. font-size:12px;
  553. }
  554.  
  555. #credit a {
  556. text-decoration:none;
  557. }
  558.  
  559.  
  560.  
  561. </style>
  562. </head>
  563. <body>
  564.  
  565. <div id="sidebar">
  566. <div id="top">
  567. <a href="/">
  568. <div id="sidebarimage"><img src="{image:sidebar}"></a></div></div>
  569. <div id="side">
  570. <div id="title">{Title}</div>
  571. <div id="description">{Description}</div>
  572. <div id="nav">
  573. <a href="{text:Link1url}">{text:link1}</a><br>
  574. <a href="{text:Link2url}">{text:link2}</a><br>
  575. <a href="{text:Link3url}">{text:link3}</a><br>
  576. <a href="{text:Link4url}">{text:link4}</a><br>
  577. <a href="{text:Link5url}">{text:link5}</a></div>
  578.  
  579. </div></div>
  580.  
  581. <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/ytzm5f1ke/infinitescrolling.js"></script>
  582.  
  583. <div id="content">
  584. <div class="autopagerize_page_element">
  585. {block:Posts}<div id="posts">
  586.  
  587. {block:Text}{block:Title}<h3>{Title}</h3>{/block:Title}{Body}{/block:Text}
  588.  
  589. {block:Quote}<h2>&#147;{Quote}&#148;</h2><h1>&mdash;{Source}</h1>{/block:Quote}
  590.  
  591. {block:Link}</div><a href="{URL}"><h3>{Name}</h3></a>
  592.  
  593. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  594.  
  595. {block:Photo} {block:If500pxposts}<img src="{PhotoURL-500}" />{block:Caption}{Caption}{/block:Caption} {/block:If500pxposts}{block:If400pxposts}<img src="{PhotoURL-400}" />{block:Caption}{Caption}{/block:Caption} {/block:If400pxposts}{block:If250pxposts}<img src="{PhotoURL-250}" />{block:Caption}{Caption}{/block:Caption} {/block:If250pxposts}{/block:Photo}
  596.  
  597. {block:Photoset}
  598. {block:If500pxposts}
  599. <center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}
  600. {/block:If500pxposts}
  601. {block:If400pxposts}
  602. <center>{Photoset-400}</center>{block:Caption}{Caption} {/block:If400pxposts}{/block:Caption}
  603.  
  604. {/block:If400pxposts}
  605. {block:If250pxposts}
  606. <center>{Photoset-250}</center>{block:Caption}{Caption} {/block:If400pxposts}{/block:Caption}
  607.  
  608. {/block:If250pxposts}
  609. {/block:Photoset}
  610.  
  611. {block:Chat}<ul class="chat">{block:Title}<h3>{Title}</h3>{/block:Title}{block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label}{Line}</li>{/block:Lines}</ul>{/block:Chat}
  612.  
  613. {block:Video}
  614. {block:If500pxposts}
  615. {Video-500}{block:Caption}{Caption}{/block:Caption}
  616. {/block:If500pxposts}
  617. {block:If400pxposts}
  618. {Video-400}{block:Caption}{Caption}{/block:Caption}
  619. {/block:If400pxposts}
  620. {block:If250pxposts}
  621. {Video-250}{block:Caption}{Caption}{/block:Caption}
  622. {/block:If250pxposts}
  623. {/block:Video}
  624. {block:Audio}{block:AudioPlayer}
  625. <div class="audiowrapper">
  626. {block:AlbumArt}
  627. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  628. {/block:AlbumArt}
  629.  
  630. <div class="playerbuttonbg">
  631. <div class="newplayerbutton">
  632. <div class="playerbuttonhug">
  633.  
  634. {AudioPlayerWhite}
  635.  
  636. </div>
  637. </div>
  638. </div>
  639.  
  640. <div class="trackdetails">
  641.  
  642. {block:TrackName}<strong>{TrackName}</strong>{/block:TrackName}<br/>
  643. {block:Artist}{Artist}{/block:Artist}<br/>
  644. {block:Album}<em>{Album}</em>{/block:Album}<br/>
  645. ({PlayCountWithLabel})
  646.  
  647. </div>
  648. </div>
  649. {/block:AudioPlayer}{/block:Audio}
  650.  
  651.  
  652.  
  653. {block:Answer}
  654. <div class="q">
  655. <div class="as">{Asker} inquired: </div>
  656. {Question}</div>
  657. <div class="a">{Answer}</div>
  658. {/block:Answer}
  659.  
  660. {block:Date}<div id="postinfo">{Month}&nbsp;{DayOfMonth}{DayOfMonthSuffix}<a href="{permalink}">&#8674;{NoteCount} notes</a>&nbsp;&#x7c;&nbsp;<a href="{ReblogURL}">reblog</a>{block:RebloggedFrom}<div class="source"><a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{block:ContentSource}&#8674;<a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>{/block:ContentSource}</div>{/block:RebloggedFrom}<br>{block:HasTags}<div class="tags">filed under: {block:Tags}<a href="{TagUrl}">{Tag},&nbsp;</a>{/block:Tags}</div>{/block:HasTags}</div>{/block:Date}
  661.  
  662. {/block:Date}
  663.  
  664. {block:PostNotes}
  665. <div class="pagenotes">
  666. {PostNotes}
  667. </div>
  668. {/block:PostNotes}
  669. {/block:Posts}
  670. </div>
  671. </div>
  672. </div>
  673.  
  674. {block:ContentSource}
  675. {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  676. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  677. {/block:SourceLogo}
  678. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}
  679. {/block:ContentSource}
  680.  
  681.  
  682. <div id="credit">
  683. <a href="http://kalopsiathemes.tumblr.com" title="kalopsiathemes"</div>&#916;</a></div></div>
  684. </div></div>
  685. </body>
  686. </html>
Advertisement
Add Comment
Please, Sign In to add comment