Belgrravia

Restless Dream 2

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