Belgrravia

After The Fall

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