Belgrravia

Rainy Girl

Oct 12th, 2014
403
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.98 KB | None | 0 0
  1. <!--
  2. Rainy Girl
  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=Roboto: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:sidebar" content="#ffffff"/>
  25. <meta name="color:sidebar text" content="#ffffff"/>
  26. <meta name="color:link" content="#000000"/>
  27. <meta name="color:link hover" content="#000000"/>
  28. <meta name="color:text" content="#000000"/>
  29. <meta name="image:sidebar" content=""/>
  30.  
  31. <meta name="text:link1" content="">
  32. <meta name="text:link1url" content="" />
  33. <meta name="text:link2" content="">
  34. <meta name="text:link2url" content="" />
  35. <meta name="text:link3" content="">
  36. <meta name="text:link3url" content="" />
  37. <meta name="text:link4" content="">
  38. <meta name="text:link4url" content="" />
  39.  
  40.  
  41. <style type="text/css">
  42.  
  43. ::-webkit-scrollbar {height: 2px;
  44. width: 3px;
  45. -webkit-border-radius: 0px;
  46. background-color:{color:posts}}
  47. ::-webkit-scrollbar-thumb{background-color:{color:sidebar};
  48.  
  49. border:0px solid {color:scrollbar};}
  50. ::-webkit-scrollbar-track{background-color:{color:background};}
  51.  
  52. #s-m-t-tooltip {max-width:400px;
  53. padding:2px;
  54. margin:10px 0px 0px 10px;
  55. padding:1px 4px;
  56. background-color:#737373;
  57. text-transform:uppercase;
  58. font-size:7px;
  59. font-family:Arial, serif;
  60. letter-spacing:2px;
  61. color:white;
  62. z-index:999
  63.  
  64. }
  65. body {
  66. background:{color:background};
  67. color:{color:text};
  68. font-size:11px;
  69. margin:0;
  70. font-family:Arial, serif;
  71. line-height:16px;
  72. }
  73.  
  74.  
  75. blockquote {
  76. padding-left:10px;
  77. margin:5px;
  78. margin-left:20px;
  79. word-wrap:break-word;
  80. border-left:1px solid {color:sidebar};
  81. }
  82.  
  83. #posts {
  84. width:500px;
  85. margin-bottom:150px;
  86. margin-top:80px;
  87. }
  88.  
  89. #posts img {
  90. max-width:500px;
  91. }
  92.  
  93.  
  94. #posts, #posts img, #posts blockquote {
  95. font-size:11px;
  96. color:{color:text};
  97. }
  98.  
  99.  
  100. small {
  101. font-size:10px;
  102. }
  103.  
  104. big {
  105. font-size:12px;
  106. }
  107.  
  108.  
  109. h2 {
  110. display:inline;
  111. font-size:16px;
  112. color:{color:text};
  113. }
  114.  
  115. h1 {
  116. font-size:9px;
  117. Text-align:center;
  118. letter-spacing:1px;
  119. color:{color:text};
  120. }
  121.  
  122. h3 {
  123. font-size:13px;
  124. color:{color:text};
  125. letter-spacing:1px;
  126. text-transform:uppercase;
  127. }
  128.  
  129. #content {
  130. padding:0px;
  131.  
  132. width:100%;
  133.  
  134. width:500px;
  135.  
  136. margin-left:40%;
  137.  
  138.  
  139. }
  140.  
  141. #container {
  142. background:{color:sidebar};
  143. position: fixed;
  144. width:300px;
  145. top: 0; bottom: 0;
  146. }
  147.  
  148. #sidebar {
  149. width:125px;
  150. margin:auto;
  151. margin-top:200px;
  152. }
  153.  
  154. #top, #bottom, #left, #right {
  155. background:{color:sidebar};
  156. position: fixed;
  157. }
  158. #left, #right {
  159. top: 0; bottom: 0;
  160. width: 20px;
  161. }
  162. #left { left: 0; }
  163. #right { right: 0; }
  164.  
  165. #top, #bottom {
  166. left: 0; right: 0;
  167. height: 20px;
  168. z-index:9999999;
  169. }
  170. #top { top: 0; }
  171. #bottom { bottom: 0; }
  172.  
  173. a:link,a:visited {
  174. text-decoration:none;
  175. color:{color:link};
  176. }
  177.  
  178. a:hover {
  179. text-decoration:underline;
  180. color:{link hover};
  181. }
  182.  
  183. .pagi {
  184. margin-left:40%;
  185. width:500px;
  186. margin-top:4px;
  187. letter-spacing:2px;
  188. text-align:center;
  189. color:{color:sidebar text};
  190. font-size:8px;
  191. text-transform:uppercase;
  192. }
  193.  
  194. .pagi a {
  195. color:{color:sidebar text};
  196. }
  197.  
  198. #title {
  199. font-size:18px;
  200. margin-top:5px;
  201. text-transform:lowercase;
  202. font-style:bold;
  203. color:{color:sidebar text};
  204. font-weight:700;
  205. font-family: 'Roboto', sans-serif;
  206. }
  207.  
  208. #description {
  209. font-size:11px;
  210. margin-top:10px;
  211. line-height:160%;
  212. color:{color:sidebar text};
  213. }
  214.  
  215. #nav {
  216. font-size:11px;
  217. color:{color:sidebar text};
  218. margin-top:10px;
  219. padding:5px;
  220. border:1px solid {color:sidebar text};
  221. }
  222.  
  223. #nav a {
  224. color:{color:sidebar text};
  225. }
  226.  
  227. #postinfo {
  228. font-size:9px;
  229. text-align:center;
  230. width:150px;
  231. padding:5px;
  232. margin:auto;
  233. margin-top:15px;
  234. border:1px solid {color:text};
  235. text-transform:lowercase;
  236. opacity:0;
  237. -moz-transition-duration:all .7s ease-in-out;
  238. -webkit-transition-duration:all .7s ease-in-out;
  239. -o-transition-duration:all .7s ease-in-out;
  240. }
  241.  
  242. #posts:hover #postinfo {
  243. opacity:1;
  244. -moz-transition-duration:.7s;
  245. -webkit-transition-duration: .7s;
  246. -o-transition-duration:.7s;
  247. }
  248.  
  249. #permalink {
  250. font-size:9px;
  251. text-align:center;
  252. margin:auto;
  253. margin-top:15px;
  254. border:1px solid {color:text};
  255. text-transform:lowercase;
  256. }
  257.  
  258. .pagenotes {
  259. {block:IndexPage}
  260. display: none;
  261. {/block:IndexPage}
  262. width:500px;
  263. margin-top:40px;
  264. text-transform:lowercase;
  265. font-size:9px;
  266. letter-spacing:1px;
  267. }
  268.  
  269. .pagenotes img {
  270. display:none;}
  271. .pagenotes li {
  272. list-style-type:none;
  273. padding:5px 0px;
  274. text-align:left;
  275. margin:0 0 0 0px;
  276. }
  277.  
  278. .player {
  279. width:25px;
  280. height:25px;
  281. overflow:hidden;
  282. position:absolute;
  283. background:white;}
  284.  
  285. .audioinfo {
  286. margin-left:50px;
  287. font-size:12px;
  288. }
  289.  
  290. .q {
  291. text-align:center;
  292. font-weight:bold;
  293. }
  294.  
  295. .as {
  296. font-weight:bold;
  297. text-transform:uppercase;
  298. margin-bottom:10px;
  299. }
  300.  
  301.  
  302. .a {
  303. margin-top:10px;
  304.  
  305. }
  306.  
  307. .chat ol {
  308. padding:0;
  309. list-style:none;
  310. }
  311.  
  312. .label {font-weight:bold;
  313. }
  314.  
  315. .newplayerbutton {
  316. position: relative;
  317. width: 28px;
  318. height: 27px;
  319. overflow: hidden;
  320. }
  321.  
  322. .playerbuttonhug {
  323. position: absolute;
  324. top: -11px;
  325. left: -12px;
  326. }
  327.  
  328.  
  329. .tumblr_audio_player {
  330. border: none;
  331. padding: 0px;
  332. margin: 0px;
  333. height: 50px;
  334. width: 500px;
  335. }
  336.  
  337. .playerbuttonbg {
  338. position: absolute;
  339. z-index:999;
  340. left: 20px;
  341. top: 20px;
  342. width: 28px;
  343. height: 28px;
  344. background-color: #ffffff;
  345. padding: 10px;
  346. -webkit-border-radius: 40px;
  347. -moz-border-radius: 40px;
  348. border-radius: 0px;
  349. opacity: .4;
  350. filter: alpha(opacity=40);
  351. -moz-opacity: 0.4;
  352. -khtml-opacity: 0.4;
  353. transition: opacity .7s ease-in-out;
  354. -moz-transition: opacity .7s ease-in-out;
  355. -webkit-transition: opacity .7s ease-in-out;
  356. }
  357.  
  358. .playerbuttonbg:hover {
  359. opacity: 1;
  360. filter: alpha(opacity=100);
  361. -moz-opacity: 1;
  362. -khtml-opacity: 1;
  363. }
  364.  
  365. .audioimgwrapper {
  366. position: absolute;
  367. left: 0px;
  368. top: 0px;
  369. -webkit-border-radius: 50px;
  370. -moz-border-radius: 50px;
  371. border-radius: 0px;
  372. overflow: hidden;
  373. width: 88px;
  374. height: 88px;
  375. }
  376.  
  377. .audioimgwrapper img {
  378. width: 100%;
  379. height: auto;
  380. -webkit-border-radius: 50px;
  381. -moz-border-radius: 50px;
  382. border-radius: 0px;
  383. }
  384.  
  385. .trackdetails {
  386. width: auto;
  387. display:inline-block;
  388. margin-left: 100px;
  389. min-height: 85px;
  390. margin-top:10px;
  391. }
  392.  
  393. .audiowrapper {
  394. position: relative;
  395. display:inline-block;
  396. }
  397. #right a {
  398. position:absolute;
  399. color:{color:sidebar text};
  400. bottom:15px;
  401. right:3px;
  402. padding:4px;
  403. font-size:12px;
  404. text-decoration:none;
  405. }
  406.  
  407.  
  408. </style>
  409. </head>
  410. <body>
  411.  
  412. <div id="left"></div>
  413. <div id="right">
  414. <a href="http://kalopsiathemes.tumblr.com" title="kalopsiathemes"</div>&#916;</a></div>
  415. <div id="top"></div>
  416. <div id="bottom">
  417. <div class="pagi">
  418. {block:Pagination}
  419. {block:PreviousPage}
  420. <a href="{PreviousPage}">&nbsp; future &nbsp;</a>
  421. {/block:PreviousPage}
  422.  
  423.  
  424. {block:NextPage}
  425. <a href="{NextPage}"> past </a>
  426. {/block:NextPage}
  427. {/block:Pagination}
  428. </div></div>
  429.  
  430. <div id="container">
  431. <div id="sidebar">
  432. <div id="title">{Title}</div>
  433. <div id="nav">
  434. <a href="{text:Link1url}">{text:link1}</a>
  435. <a href="{text:Link2url}">{text:link2}</a>
  436. <a href="{text:Link3url}">{text:link3}</a>
  437. <a href="{text:Link4url}">{text:link4}</a></div>
  438. <div id="description">{Description}</div>
  439. </div>
  440. </div>
  441. <div id="content">
  442. {block:Posts}<div id="posts">
  443.  
  444.  
  445. {block:Text}{block:Title}<h3>{Title}</h3>{/block:Title}{Body}{/block:Text}
  446.  
  447. {block:Quote}<h2>&#x201C;{Quote}&#x201D;</h2><h1>-{Source}</h1>{/block:Quote}
  448.  
  449. {block:Link}</div><a href="{URL}"><h3>{Name}</h3></a>
  450.  
  451. {block:Description}<p>{Description}</p>{/block:Description}{/block:Link}
  452.  
  453. {block:Photo}<img src="{PhotoURL-500}" />{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  454.  
  455. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  456.  
  457. {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}
  458.  
  459. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  460.  
  461. {block:Audio}{block:AudioPlayer}
  462. <div class="audiowrapper">
  463. {block:AlbumArt}
  464. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  465. {/block:AlbumArt}
  466.  
  467. <div class="playerbuttonbg">
  468. <div class="newplayerbutton">
  469. <div class="playerbuttonhug">
  470.  
  471. {AudioPlayerWhite}
  472.  
  473. </div>
  474. </div>
  475. </div>
  476.  
  477. <div class="trackdetails">
  478.  
  479. {block:TrackName}<strong>{TrackName}</strong>{/block:TrackName}<br/>
  480. {block:Artist}<strong>Artist:</strong> {Artist}{/block:Artist}<br/>
  481. {block:Album}<strong>Album:</strong> {Album}{/block:Album}<br/>
  482. {PlayCountWithLabel}
  483.  
  484. </div>
  485. </div>
  486. {/block:AudioPlayer}{/block:Audio}
  487.  
  488.  
  489. {block:Answer}
  490. <div class="q">
  491. <div class="as">{Asker} inquired: </div>
  492. {Question}</div>
  493. <div class="a">{Answer}</div>
  494. {/block:Answer}
  495.  
  496. {block:Date}{block:IndexPage}<div id="postinfo"><a href="{Permalink}">{TimeAgo}&nbsp;//<a href="{Permalink}">&nbsp;{NoteCount} notes</a>{/block:NoteCount}</div>{/block:IndexPage}{/block:Date}
  497.  
  498. {block:Date}
  499. {block:PermalinkPage}<div id="permalink"><a href="{Permalink}">{TimeAgo}&nbsp;//<a href="{Permalink}">&nbsp;{NoteCount} notes</a>{/block:NoteCount}&nbsp;//&nbsp;{block:RebloggedFrom}<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}">&nbsp;#{Tag},&nbsp;</a>{/block:Tags}</div>{/block:HasTags}</div>{/block:PermalinkPage}{/block:Date}
  500.  
  501.  
  502. {block:PostNotes}
  503. <div class="pagenotes">
  504. {PostNotes}
  505. </div>
  506. {/block:PostNotes}
  507. {/block:Posts}
  508.  
  509.  
  510. </div>
  511. </div>
  512. </div>
  513.  
  514.  
  515. {block:ContentSource}
  516. {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  517. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  518. {/block:SourceLogo}
  519. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}
  520. {/block:ContentSource}
  521.  
  522. <div id="credit">
  523. <a href="http://belgrravia.tumblr.com" title="Belgrravia"</div>&#946;</a></div>
  524.  
  525. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment