Advertisement
solarre

oxygen

Dec 25th, 2015
5,988
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.38 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4.  
  5. oxygen by solarre
  6.  
  7. -keep credit intact
  8. -don't steal any code
  9. -don't use as a basecode/claim as your own
  10.  
  11. credits:
  12. soundcloud player & video resizing script: shythemes
  13.  
  14. -->
  15.  
  16.  
  17. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  18. <head>
  19.  
  20. <title>{Title}</title>
  21. <link rel="shortcut icon" href="{Favicon}">
  22. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  23. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  24.  
  25. <meta name="color:Background" content="#ffffff"/>
  26. <meta name="color:Title" content="#000000"/>
  27. <meta name="color:Text" content="#bbbbbb"/>
  28. <meta name="color:Accent" content="#bdd1fc"/>
  29. <meta name="color:Link" content="#aaaaaa"/>
  30. <meta name="color:Hover" content="#b3b3b3"/>
  31. <meta name="color:Line" content="#f2f2f2"/>
  32. <meta name="color:Tooltip" content="#777777"/>
  33. <meta name="color:Scrollbar" content="#eeeeee"/>
  34.  
  35. <meta name="image:Sidebar" content=""/>
  36.  
  37. <meta name="if:Fade In Posts" content="1"/>
  38. <meta name="if:Opacity Change On Hover" content="0"/>
  39. <meta name="if:Small Cursor" content="1"/>
  40.  
  41. <meta name="text:Blog Title" content="">
  42. <meta name="text:linkA" content="">
  43. <meta name="text:linkA url" content="/">
  44. <meta name="text:linkB" content="">
  45. <meta name="text:linkB url" content="/">
  46. <meta name="text:linkC" content="">
  47. <meta name="text:linkC url" content="/">
  48. <meta name="text:linkD" content="">
  49. <meta name="text:linkD url" content="/">
  50. <meta name="text:linkE" content="">
  51. <meta name="text:linkE url" content="/"/>
  52.  
  53. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  54. <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  55. <script>
  56. (function($){
  57. $(document).ready(function(){
  58. $("[title]").style_my_tooltips({
  59. tip_follows_cursor:true,
  60. tip_delay_time:1,
  61. tip_fade_speed:100,
  62. attribute:"title"
  63. });
  64. });
  65. })(jQuery);
  66. </script>
  67.  
  68. <link href='//fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
  69.  
  70. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  71. <script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
  72. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  73.  
  74. <style type="text/css">
  75.  
  76. ::-webkit-scrollbar {width:4px; height:auto; background:{color:Background};}
  77. ::-webkit-scrollbar-corner {background:transparent;}
  78. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar}; width:2px; border:1px solid {color:background};}
  79. ::-webkit-scrollbar-thumb:horizontal {background:{color:scrollbar};height:4px !important;}
  80. ::-webkit-scrollbar-increment {width:4px; height:4px; background-color:#fff;}
  81.  
  82. iframe.tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop, .tmblr-iframe {
  83. position:fixed;
  84. white-space:nowrap;
  85. -webkit-filter: invert(100%);
  86. -moz-filter: invert(100%);
  87. -o-filter: invert(100%);
  88. -ms-filter: invert(100%);
  89. filter: invert(100%);
  90. opacity:.2;transition: .8s ease-in-out;
  91. -webkit-transition: .8s ease-in-out;
  92. -moz-transition: .8s ease-in-out;
  93. -o-transition: .8s ease-in-out;
  94. }
  95.  
  96. iframe.tmblr-iframe.tmblr-iframe--desktop-loggedin-controls.iframe-controls--desktop:hover {opacity:0.8;}
  97.  
  98. #s-m-t-tooltip {
  99. max-width:300px;
  100. padding: 5px 8px;
  101. margin:10px;
  102. background-color:{color:background};
  103. font-size:8px;
  104. letter-spacing:1px;
  105. text-transform:uppercase;
  106. color:{color:tooltip};
  107. box-shadow:2px 2px 0.2em #eee;
  108. border-radius:2px;
  109. z-index:100000000000000000000000000000000000000000;
  110. transition:0.5s ease-in-out;
  111. -webkit-transition:0.5s ease-in-out;
  112. -moz-transition:0.5s ease-in-out;
  113. -ms-transition:0.5s ease-in-out;
  114. -o-transition:0.5s ease-in-out;
  115. }
  116.  
  117.  
  118. @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  119. @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  120. @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  121.  
  122. .fade-in {
  123. opacity:0;
  124. -webkit-animation:fadeIn ease-in 1;
  125. -moz-animation:fadeIn ease-in 1;
  126. animation:fadeIn ease-in 1;
  127. -webkit-animation-fill-mode:forwards;
  128. -moz-animation-fill-mode:forwards;
  129. animation-fill-mode:forwards;
  130. -webkit-animation-duration:1s;
  131. -moz-animation-duration:1s; animation-duration:1s; }
  132.  
  133. .fade-in.one { -webkit-animation-delay: 0.7s; -moz-animation-delay: 0.7s; animation-delay: 0.7s; }
  134.  
  135. ::selection {background-color:{color:Accent};color:white;text-shadow:none;}
  136. ::-o-selection {background-color:{color:accent};color:#fff;text-shadow:none;}
  137. ::-moz-selection {background-color:{color:accent};color:#fff;text-shadow:none;}
  138.  
  139. {block:ifSmallCursor}
  140.  
  141. *, body, img { cursor:url(http://static.tumblr.com/vmteopo/yYInjhg6e/small_black_cursor.png), auto;}
  142.  
  143. a, a:hover, a:active {cursor:url(http://static.tumblr.com/vmteopo/DH3njhg50/help_cursor.png), crosshair; }
  144.  
  145. {/block:ifSmallCursor}
  146.  
  147. body {
  148. background:{color:background};
  149. margin:0px;
  150. color:{color:text};
  151. font-family:'Open Sans', arial, sans-serif;
  152. font-size:10px;
  153. line-height:15px;
  154. -moz-font-smoothing:subpixel-antialiased;
  155. -webkit-font-smoothing:subpixel-antialiased;
  156. font-smoothing:subpixel-antialiased;
  157. }
  158.  
  159. a {
  160. text-decoration:none;
  161. color:{color:text};
  162. -moz-outline-style:none;
  163. transition:0.5s ease-in-out;
  164. -webkit-transition:0.5s ease-in-out;
  165. -moz-transition:0.5s ease-in-out;
  166. -ms-transition:0.5s ease-in-out;
  167. -o-transition:0.5s ease-in-out;
  168. }
  169.  
  170. a:hover {color:{color:hover};}
  171. img {border:none;max-width:100%;height:auto;}
  172. img a {border:none;} a img {border:none;}
  173. h1 {font-size:12px;text-transform:uppercase;}
  174. h2 {font:italic 15px 'open sans', sans-serif;line-height:110%; color:#333;}
  175. b, strong {font-weight:700;}
  176. ol {list-style:lower-roman;line-height:123%;}
  177. blockquote {padding-left:5px;border-left:1px solid {color:line};margin-right:0;margin-left:20px;}
  178. blockquote blockquote {padding-left:5px;border-left:1px solid {color:line};margin-right:0;}
  179. ul {list-style-type:none;}
  180. ul li {position:relative;padding-left:20px;margin-left:-10px;}
  181. ul li:before {
  182. content:'';
  183. position:absolute;
  184. display:block;
  185. top:5px;
  186. left:0;
  187. width:15px;
  188. height:1px;
  189. border-top:1px solid #ececec;
  190. }
  191.  
  192. ul ul li:before {
  193. content:'›';
  194. position:absolute;
  195. display:block;
  196. border:none;
  197. top:0;
  198. left:0;
  199. margin-left:10px;
  200. width:0px;
  201. }
  202.  
  203. pre {
  204. padding:3px 5px;
  205. text-transform:uppercase;
  206. white-space: pre-wrap;
  207. white-space: -moz-pre-wrap;
  208. white-space: -pre-wrap;
  209. white-space: -o-pre-wrap;
  210. word-wrap: break-word;
  211. }
  212.  
  213. #sidebar {
  214. position:fixed;
  215. height:auto;
  216. width:350px;
  217. left:30px;
  218. opacity:1;
  219. padding:20px;
  220. z-index:2;
  221. }
  222.  
  223. #sidebar2 {
  224. background:{color:background} url('{image:sidebar}') no-repeat right center;
  225. background-size:cover;
  226. position:fixed;
  227. height:100%;
  228. width:250px;
  229. right:0;
  230. top:0;
  231. }
  232.  
  233. .title {
  234. margin-top:200px;
  235. font:bold 25px arial;
  236. color:{color:title};
  237. width:330px;
  238. padding:5px 10px;
  239. text-align:center;
  240. line-height:130%;
  241. }
  242.  
  243. .desc {
  244. margin:-10px 40px auto;
  245. line-height:125%;
  246. font-size:10px;
  247. font-style:italic;
  248. width:250px;
  249. height:auto;
  250. padding:10px;
  251. text-align:center;
  252. color:{color:text};
  253. }
  254.  
  255. .links {
  256. margin-top:0px;
  257. width:auto;
  258. padding:10px;
  259. word-spacing:1em;
  260. text-align:center;
  261. font-size:9px;
  262. text-transform:lowercase;
  263. }
  264.  
  265. .links a:hover {color:{color:Hover};}
  266.  
  267. .links a, #details a {
  268. display: inline-block;
  269. border-bottom:none;
  270. vertical-align: middle;
  271. -webkit-transform: translateZ(0);
  272. transform: translateZ(0);
  273. box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  274. -webkit-backface-visibility: hidden;
  275. backface-visibility: hidden;
  276. -moz-osx-font-smoothing: grayscale;
  277. position: relative;
  278. overflow: hidden;
  279. }
  280.  
  281. .links a:before, #details a:before {
  282. content: "";
  283. position: absolute;
  284. z-index: -1;
  285. left: 50%;
  286. right: 50%;
  287. bottom: 0;
  288. background:{color:hover};
  289. height: 1px;
  290. -webkit-transition-property: left, right;
  291. transition-property: left, right;
  292. -webkit-transition-duration: 0.3s;
  293. transition-duration: 0.3s;
  294. -webkit-transition-timing-function: ease-out;
  295. transition-timing-function: ease-out;
  296. }
  297. .links a:hover:before, .links a:focus:before, .links a:active:before, #details a:hover:before, #details a:focus:before, #details a:active:before {
  298. left: 0;
  299. right: 0;
  300. }
  301.  
  302. .pagi{
  303. font-size:8px;
  304. text-align:center;
  305. padding:5px 10px;
  306. width:330px;
  307. letter-spacing:0px;
  308. z-index:99;
  309. }
  310.  
  311. .jump_page {height:10px;width:20px;padding:5px;}
  312. .current_page {height:10px;width:20px;padding:3px 5px;text-decoration:underline;}
  313.  
  314. #all {
  315. padding:10px 50px;
  316. width:370px;
  317. z-index:2;
  318. margin:auto;
  319. letter-spacing:0.5px;
  320. }
  321.  
  322. #thing {margin:auto auto 50px;padding-bottom:50px;}
  323.  
  324. #posts {
  325. width:350px;
  326. padding:10px;
  327. margin-top:80px;
  328. -ms-word-break: break-all;
  329. word-break: break-all;
  330. word-break: break-word;
  331. -webkit-hyphens: auto;
  332. -moz-hyphens: auto;
  333. -ms-hyphens: auto;
  334. hyphens: auto;
  335. transition:0.5s ease-in-out;
  336. -webkit-transition:0.5s ease-in-out;
  337. -moz-transition:0.5s ease-in-out;
  338. -ms-transition:0.5s ease-in-out;
  339. -o-transition:0.5s ease-in-out;
  340. }
  341.  
  342. {block:ifOpacityChangeOnHover}
  343. #posts {opacity:0.8;}
  344. #posts:hover {opacity:1;}
  345. {/block:ifOpacityChangeOnHover}
  346.  
  347. #caption {
  348. width:340px;
  349. padding:5px 5px 0;
  350. -ms-word-break: break-all;
  351. word-break: break-all;
  352. word-break: break-word;
  353. -webkit-hyphens: auto;
  354. -moz-hyphens: auto;
  355. -ms-hyphens: auto;
  356. hyphens: auto;
  357. }
  358.  
  359. #caption a {padding-bottom:1px;border-bottom:1px solid {color:text};}
  360. #caption a:hover { border-bottom:1px solid {color:hover};}
  361.  
  362. #posts:hover #details {opacity:1;margin-left:-10px;}
  363.  
  364. #details {
  365. opacity:0;
  366. max-width:50px;
  367. text-align:left;
  368. margin-top:-17px;
  369. margin-left:-30px;
  370. text-transform:uppercase;
  371. padding:3px 3px 3px 10px;
  372. font-size:8px;
  373. font-style:italic;
  374. transition:0.5s ease-in-out;
  375. -webkit-transition:0.5s ease-in-out;
  376. -moz-transition:0.5s ease-in-out;
  377. -ms-transition:0.5s ease-in-out;
  378. -o-transition:0.5s ease-in-out;
  379. }
  380.  
  381. #details a {display:inline-block;padding:0px;}
  382.  
  383. #dets {padding:5px;border-top:1px solid #eee;font-size:8px;}
  384. #dets a {display:inline-block;}
  385.  
  386. #tags {display:inline-block;opacity:0.9;}
  387. #tags a {display:inline-block;padding:0 2px;}
  388.  
  389. #question {
  390. padding:10px;
  391. letter-spacing:1px;
  392. text-align:center;
  393. color:{color:text};
  394. border-bottom:1px solid #f5f5f5;
  395. }
  396.  
  397. #akport {
  398. width:330px;
  399. text-align:center;
  400. height:12px;
  401. padding:5px 0;
  402. color:#444;
  403. opacity:1;
  404. z-index:99999;
  405. margin-bottom:5px;
  406. letter-spacing:1px;
  407.  
  408. }
  409.  
  410. #akport a {text-decoration:none;border:none;}
  411.  
  412. .tumblr_audio_player {width:100%;margin-top:12px;}
  413.  
  414. .player {
  415. width:50px;
  416. height:50px;
  417. padding:10px;
  418. overflow:hidden;
  419. background:#fff;
  420. margin:10px 0 0px 0;
  421. display:block;
  422. float:left;
  423. }
  424.  
  425. .audioinfo {
  426. color:{color:text};
  427. margin:10px 0 10px 75px;
  428. display:block;
  429. padding:25px 25px;
  430. height:20px;
  431. text-align:left;
  432. font-size:10px;
  433. line-height:110%;
  434. width:224px;
  435. background:#fff;
  436. }
  437.  
  438. .chat li {list-style:none;line-height:115%;}
  439. .line.odd {border-left:1px solid {color:line};padding:3px 5px;}
  440. .line.even {border-left:1px solid transparent;padding:3px 5px;}
  441.  
  442. .webs {font-size:12px;text-transform:uppercase;padding-top:10px;text-align:center;}
  443. .webs a {border-bottom:none;}
  444. .webs a:before, .webs a:after {
  445. display: inline-block;
  446. opacity: 0;
  447. -webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
  448. -moz-transition: -moz-transform 0.3s, opacity 0.2s;
  449. transition: transform 0.3s, opacity 0.2s;
  450. }
  451.  
  452. .webs a:before {
  453. margin-right: 10px;
  454. content: '[';
  455. -webkit-transform: translateX(20px);
  456. -moz-transform: translateX(20px);
  457. transform: translateX(20px);
  458. }
  459.  
  460. .webs a:after {
  461. margin-left: 10px;
  462. content: ']';
  463. -webkit-transform: translateX(-20px);
  464. -moz-transform: translateX(-20px);
  465. transform: translateX(-20px);
  466. }
  467.  
  468. .webs a:hover:before, .webs a:hover:after, .webs a:focus:before, .webs a:focus:after {
  469. opacity: 1;
  470. -webkit-transform: translateX(0px);
  471. -moz-transform: translateX(0px);
  472. transform: translateX(0px);
  473. }
  474.  
  475. .notes {
  476. width:300px;
  477. max-height:150px;
  478. padding:5px 10px;
  479. margin:0px 15px auto 25px;
  480. overflow-y:scroll;
  481. overflow-x:hidden;
  482. text-align:left;
  483. font-size:10px;
  484. line-height:125%;
  485. }
  486.  
  487. .notes img {display:none;}
  488. .notes ol, .notes li {list-style:circle;line-height:125%;}
  489.  
  490. #credit, #credit a {
  491. position:fixed;
  492. bottom:20px;
  493. left:20px;
  494. color:{color:text};
  495. font:normal normal 12px calibri;
  496. text-decoration:none;
  497. }
  498.  
  499. {CustomCSS}</style></head>
  500. <body>
  501. <div id="sidebar2"></div>
  502. <div id="sidebar">
  503. <div class="title">{text:Blog Title}</div>
  504. <div class="links">
  505. {block:iflinkA}<a href="{text:linkA url}">{text:linkA}</a>{/block:iflinkA}
  506. {block:iflinkB}<a href="{text:linkB url}">{text:linkB}</a>{/block:iflinkB}
  507. {block:iflinkC}<a href="{text:linkC url}">{text:linkC}</a>{/block:iflinkC}
  508. {block:iflinkD}<a href="{text:linkD url}">{text:linkD}</a>{/block:iflinkD}
  509. {block:iflinkE}<a href="{text:linkE url}">{text:linkE}</a>{/block:iflinkE}
  510. </div>
  511. <div class="desc">{Description}</div>
  512. {block:Pagination}<div class="pagi">
  513. {block:PreviousPage}<a href="{PreviousPage}">&larr;</a>&emsp;{/block:PreviousPage}
  514. {block:JumpPagination length="3"}
  515. {block:CurrentPage}<span class="current_page">{PageNumber}</span>&emsp;{/block:CurrentPage}
  516. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>&emsp;{/block:JumpPage}
  517. {/block:JumpPagination}
  518. {block:NextPage}<a href="{NextPage}">&rarr;</a>{/block:NextPage}
  519. </div>{/block:Pagination}
  520. </div>
  521. <div id="thing">
  522. <div id="all" {block:ifFadeInPosts} class="box fade-in one" {/block:ifFadeInPosts}>
  523. {block:Posts}<div id="posts">
  524.  
  525. {block:IndexPage}<div id="details">
  526. {block:Date}<a href="{Permalink}" title="{12HourWithZero}:{Minutes}{AmPm}">{MonthNumberWithZero}.{DayOfMonthWithZero}.{ShortYear}</a>{/block:Date}
  527. </div>
  528. {/block:IndexPage}
  529.  
  530. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1><div id="caption" style="padding-top:0">{Body}</div>{/block:Text}
  531.  
  532. {block:Photo}<center><img src="{PhotoURL-HighRes}"></center>{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  533.  
  534. {block:Link}<div class="webs"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}<div id="caption">{Description}</div>{/block:Description}{/block:Link}
  535.  
  536. {block:Photoset}{LinkOpenTag}{Photoset}{LinkCloseTag}{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  537.  
  538. {block:Quote}<center><h2>{Quote}</h2>↳ {Source}</center><br>{/block:Quote}
  539.  
  540. {block:Audio}
  541. <div class="player">{AudioPlayerWhite}</div>
  542. <div class="audioinfo">
  543. {block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}</div>
  544. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Audio}
  545.  
  546. {block:Video}<div class="video">{Video-500}</div>{block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Video}
  547.  
  548. {block:Chat}<div class="chat">{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}<li class="line {Alt}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</li><br>{/block:Lines}</div>{/block:Chat}
  549.  
  550. {block:Answer}<div id="question"><span style="text-transform:uppercase;font-size:10px; padding-bottom:10px"><div id="akport">{Asker} asked</div></span>{Question}</div><div id="caption">{Answer}</div>{/block:Answer}
  551.  
  552. {block:PermalinkPage}
  553. <div id="dets">{block:Date}{MonthNumberWithZero}.{DayOfMonthWithZero}.{ShortYear}{/block:Date}{block:NoteCount}&emsp;+{NoteCount}{/block:NoteCount}{block:RebloggedFrom}&emsp;<a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}{block:ContentSource}&emsp;<a href="{SourceURL}" title="{SourceTitle}">src</a>{/block:ContentSource}{block:HasTags}<br>&emsp;<i>— filed under:</i> {block:Tags}<div id="tags"><a href="{TagURL}">#{Tag}</a></div>{/block:Tags}{/block:HasTags}</div>
  554. {/block:PermalinkPage}
  555.  
  556. </div>
  557. {/block:Posts}
  558. {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
  559. {/block:Posts}
  560. </div></div></div>
  561.  
  562. <div id="credit"><a href="http://solarre.tumblr.com" title="solarre">☼</a></div>
  563.  
  564. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  565. <script>
  566. $(document).ready(function(){
  567. var color = '{color:hover}';
  568. $('.soundcloud_audio_player').each(function(){
  569. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  570. });
  571. });
  572. </script>
  573.  
  574. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement