Belgrravia

Radio War

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