API tools faq
paste
Belgrravia

High Dive

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