Belgrravia

Forsaken

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