Advertisement
Belgrravia

Swim

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