API tools faq
paste
Advertisement
ogaraster

Sphere Theme

ogaraster
Jan 27th, 2013
3,998
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.99 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. Theme by Atlas Designs
  4. http://atlasdesigns.co/
  5.  
  6. Please do not remove the credit!
  7.  
  8. Enjoy!
  9.  
  10. -->
  11.  
  12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  13. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  14.  
  15. <head>
  16.  
  17. <link rel="shortcut icon" href="{Favicon}">
  18.  
  19. <title>{title}</title>
  20.  
  21. <meta name="color:background" content="#ffffff" />
  22. <meta name="color:description circle" content="#f0f0f0" />
  23. <meta name="color:text" content="#000000" />
  24. <meta name="color:links" content="#000000" />
  25. <meta name="color:link hover" content="#d4ff00" />
  26. <meta name="color:title circle" content="#000" />
  27. <meta name="color:scrollbar" content="#E0E0E0" />
  28. <meta name="color:link border" content="#E0E0E0" />
  29.  
  30. <meta name="image:background" content="/" />
  31.  
  32. <meta name="if:font petit formal" content="0" />
  33. <meta name="if:font quicksand" content="0" />
  34. <meta name="if:font snowburst" content="0" />
  35. <meta name="if:font julius sans" content="0" />
  36. <meta name="if:font satisfy" content="0" />
  37. <meta name="if:font lato" content="1" />
  38.  
  39. <meta name="text:title letter" content="S" />
  40. <meta name="text:home link" content="home" />
  41. <meta name="text:message link" content="message" />
  42. <meta name="text:archive link" content="archive" />
  43. <meta name="text:reblog" content="reblog" />
  44.  
  45. <link href='http://fonts.googleapis.com/css?family=Lato:300' rel='stylesheet' type='text/css'>
  46.  
  47. <link href='http://fonts.googleapis.com/css?family=Petit+Formal+Script|Quicksand:700|Snowburst+One|Julius+Sans+One|Satisfy' rel='stylesheet' type='text/css'>
  48.  
  49. <style type="text/css">
  50. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.8s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  51.  
  52. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  53.  
  54. ::-webkit-scrollbar {width: 7px; height: 4px; background: #ffffff; border-left: 1px solid #aaaaaa; }
  55.  
  56. ::-webkit-scrollbar-thumb { background-color:{color:scrollbar}; }
  57.  
  58.  
  59. body{
  60. margin:0px;
  61. background-color: {color:Background};
  62. background: url("{image:background}") top left fixed repeat;
  63. background-attachment: fixed;
  64. background-repeat: repeat;
  65. font-size: 11px;
  66. font-family: Lato;
  67. line-height:8px;
  68. color:{color:Text};
  69. }
  70.  
  71. a:link, a:active, a:visited{
  72. color:{color:links};
  73. text-decoration: none;
  74. }
  75.  
  76. a:hover {
  77. color:{color:link hover};
  78. border-bottom:2px solid {color:link border};
  79. text-decoration: none;
  80. }
  81.  
  82. #posting{
  83. padding-top:0px;
  84. padding-bottom:0px;
  85. position:fixed !important;
  86. width:250px;
  87. height:207px;
  88. background-color:transparent;
  89. {block:PermalinkPage}
  90. width:410px;
  91. height:207px;
  92. {/block:PermalinkPage}
  93. }
  94.  
  95. #posts{
  96. opacity: 1;
  97. float:center;
  98. {block:indexpage}
  99. width:1100px;
  100. {/block:indexpage}
  101. {block:permalinkpage}
  102. width:800px;
  103. {/block:permalinkpage}
  104. margin-left: 350px;
  105. margin-top: 17px;
  106. }
  107.  
  108. #permalink {
  109. position: absolute;
  110. margin-top: 8px;
  111. margin-rigth: 1061px;
  112. opacity: 1;
  113. -webkit-transition: all .3s ease;
  114. -moz-transition: all .3s ease;
  115. -o-transition: all .3s ease;
  116. transition: all .3s ease;
  117. }
  118.  
  119. #entry:hover #permalink {
  120. margin-top: 8px;
  121. margin-left: 400px;
  122. opacity: 1;
  123. }
  124.  
  125. #permalink {
  126. position: absolute;
  127. margin-top: -21px;
  128. margin-left: 05px;
  129. opacity: 0;
  130. -webkit-transition: all .3s ease;
  131. -moz-transition: all .3s ease;
  132. -o-transition: all .3s ease;
  133. transition: all .3s ease;
  134. }
  135.  
  136. #entry:hover #permalink {
  137. margin-top: -21px;
  138. margin-left: 05px;
  139. opacity: 1;
  140. }
  141.  
  142. .not {
  143. position: absolute;
  144. background: url("http://static.tumblr.com/uiqhh9x/X6Ym17xp2/middle.png");
  145. height: 20px;
  146. width: auto;
  147. font-size: 10px;
  148. line-height: 20px;
  149. color: #fff;
  150. position: absolute;
  151. margin-top: 26px;
  152. margin-left: 60px;
  153. padding-left: 4px;
  154. padding-right: 4px;
  155. -moz-border-radius: 2px;
  156. border-radius: 2px;
  157. }
  158.  
  159. .not a{
  160. color: #fff;
  161. width: auto;
  162. font-family: Lato;
  163. }
  164.  
  165. .perma{
  166. opacity: 0;
  167. filter: alpha(opacity = 0);
  168. margin-top: 0px;
  169. width: 60px;
  170. height: 30px;
  171. line-height: 30px;
  172. font-size: 10px;
  173. position:absolute;
  174. text-align: center;
  175. z-index:9999991;
  176. margin-top: 5px;
  177. border: 0px dotted #aaa;
  178. font-family: overlock;
  179. margin-left: -2px;
  180. -webkit-transition: all .4s ease;
  181. -moz-transition: all .4s ease;
  182. -o-transition: all .4s ease;
  183. transition: all .4s ease;
  184. }
  185.  
  186. #entry:hover .perma {
  187. -webkit-transition: opacity 1s linear;
  188. opacity: 1;
  189. margin-top: 5px;
  190. margin-left: -2px;
  191. -webkit-transition: all .4s ease;
  192. -moz-transition: all .4s ease;
  193. -o-transition: all .4s ease;
  194. transition: all .4s ease;
  195. }
  196.  
  197. .likep {
  198. display: inline;
  199. width: 21px;
  200. float: right;
  201. height: 20px;
  202. margin-left:-4px;
  203. overflow: hidden;
  204. position: relative;
  205. z-index: 9999999;
  206. }
  207.  
  208. .likep a {
  209. background-image:
  210. url("http://static.tumblr.com/uiqhh9x/BPnlzww8v/like.png");
  211. background-position: 0px 0px;
  212. display: block;
  213. z-index: 9999999;
  214. -webkit-transition: all .4s ease;
  215. -moz-transition: all .4s ease;
  216. -o-transition: all .4s ease;
  217. transition: all .4s ease;
  218. }
  219.  
  220. .likep img {
  221. width: 21px;
  222. height: 20px;
  223. -webkit-transition: all .4s ease;
  224. -moz-transition: all .4s ease;
  225. -o-transition: all .4s ease;
  226. transition: all .4s ease;
  227. }
  228. .rep img{
  229. width: 24px;
  230. height: 20px;
  231. line-height: 30px;
  232. display: inline;
  233. }
  234.  
  235. .permatext{
  236. background-color:#eee;
  237. display: block;
  238. text-transform:uppercase;
  239. font-family: Lato;
  240. font-size: 10px;
  241. text-align: center;
  242. letter-spacing:1px;
  243. }
  244.  
  245. #postnotes{
  246. text-align: right;
  247. }
  248.  
  249. #entry{
  250. font-family: Lato;
  251. opacity:1;
  252. font-size: 12px;
  253. line height: 14px;
  254. text-align:left;
  255. z-index:9999;
  256. float:left;
  257. width: 200px;
  258. height: auto;
  259. {block:PermalinkPage}
  260. width: 502px;
  261. height: auto;
  262. {/block:PermalinkPage}
  263. line-height:14px;
  264. background: transparent;
  265. margin-right:20px;
  266. overflow:hidden;
  267. margin-bottom:10px;
  268. padding: 10px;
  269. padding-bottom:20px;
  270. transition: all 0.5s ease-out;
  271. -o-transition-transition: all 0.5s ease-out;
  272. -webkit-transition: all 0.5s ease-out;
  273. -moz-transition: all 0.5s ease-out;
  274. }
  275.  
  276. #entry:hover{
  277. transform: scale(1.05);
  278. -ms-transform: scale(1.05);
  279. -webkit-transform: scale(1.05);
  280. -o-transform: scale(1.05);
  281. -moz-transform: scale(1.05);
  282. transition: all 0.5s ease-out;
  283. -o-transition-transition: all 0.5s ease-out;
  284. -webkit-transition: all 0.5s ease-out;
  285. -moz-transition: all 0.5s ease-out;
  286. }
  287.  
  288. blockquote{
  289. padding:0px 0px 2px 3px;
  290. margin:0px 0px 2px 1px;
  291. }
  292. ul, ol, li{
  293. list-style:none;
  294. margin:0px;
  295. padding:0px;
  296. }
  297.  
  298. #other {
  299. text-transform: lowercase;
  300. }
  301.  
  302. #titlecube{
  303. position:fixed;
  304.  
  305. {block:iffontsatisfy}
  306. font-family:satisfy;
  307. text-transform:bold;
  308. text-align:center;
  309. font-size:200px;
  310. line-height:220px;
  311. {/block:iffontsatisfy}
  312.  
  313. {block:iffontpetitformal}
  314. font-family:petit formal script;
  315. text-transform:bold;
  316. text-align:center;
  317. font-size:200px;
  318. line-height:210px;
  319. {/block:iffontpetitformal}
  320.  
  321. {block:iffontquicksand}
  322. font-family:quicksand;
  323. text-transform:bold;
  324. text-align:center;
  325. font-size:200px;
  326. line-height:190px;
  327. {/block:iffontquicksand}
  328.  
  329. {block:iffontjuliussans}
  330. font-family:julius sans one;
  331. text-transform:bold;
  332. text-align:center;
  333. font-size:200px;
  334. line-height:220px;
  335. {/block:iffontjuliussans}
  336.  
  337. {block:iffontsnowburst}
  338. font-family:snowburst one;
  339. text-transform:bold;
  340. text-align:center;
  341. font-size:200px;
  342. line-height:185px;
  343. {/block:iffontsnowburst}
  344.  
  345. {block:iffontlato}
  346. font-family:lato;
  347. text-transform:bold;
  348. text-align:center;
  349. font-size:200px;
  350. line-height:185px;
  351. {/block:iffontlato}
  352.  
  353. color:{color:description circle};
  354. top:80px;
  355. left:60px;
  356. height:200px;
  357. width:200px;
  358. border-radius:50%;
  359. background:{color:title circle};
  360. z-index:99999999999999999999999999;
  361. }
  362.  
  363. #navigation{
  364. position:fixed;
  365. top:300px;
  366. left:57px;
  367. width:200px;
  368. font-size:14.5px;
  369. text-align:center;
  370. line-height:20px;
  371. letter-spacing;.5px;
  372. }
  373.  
  374. #titlecube:hover{
  375. z-index:-9999;
  376. }
  377.  
  378. #descriptioncube{
  379. position:fixed;
  380. left:50px;
  381. top:70px;
  382. height:220px;
  383. width:220px;
  384. border-radius:50%;
  385. font-size:0px;
  386. text-align:center;
  387. line-height:14px;
  388. font-family: lato;
  389. background-color:{color:description circle};
  390. overflow:hidden;
  391. z-index:999999;}
  392.  
  393. #descriptioncube:hover{
  394. font-size:14px;
  395. z-index:999999999999999999999999999999999999;
  396. }
  397.  
  398. #logo{
  399. position:fixed;
  400. bottom:-40px;
  401. right:20px;
  402. border:1px solid;
  403. border-color:#e8e8e8;
  404. border-radius:7px;
  405. padding-top:4px;
  406. padding-left:7px;
  407. padding-right:7px;
  408. padding-bottom:40px;
  409. -webkit-transition: all .4s ease;
  410. -moz-transition: all .4s ease;
  411. -o-transition: all .4s ease;
  412. transition: all .4s ease;
  413. z-index:99999999;
  414. }
  415.  
  416. #logo:hover{
  417. position:fixed;
  418. bottom:-10px;
  419. -webkit-transition: all .4s ease;
  420. -moz-transition: all .4s ease;
  421. -o-transition: all .4s ease;
  422. transition: all .4s ease;
  423. }
  424.  
  425. .title{
  426. font-size:16px;
  427. }
  428.  
  429. </style>
  430.  
  431. <title>{title}</title>
  432.  
  433. <link rel="shortcut icon" href="{Favicon}">
  434. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  435. <meta name="viewport" content="width=720" />
  436.  
  437. </head>
  438. <body>
  439.  
  440. <div id="titlecube">
  441. {text:title letter}
  442. </div>
  443.  
  444. <div id="descriptioncube">
  445. <br><br><br>
  446. {description}
  447. </div>
  448.  
  449. <div id="navigation">
  450. <a href="/">{text:home link}</a> <br>
  451. <a href="/ask">{text:message link}</a> <br>
  452. <a href="/archive">{text:archive link}</a> <br>
  453. <a href="http://atlasdesigns.tumblr.com">theme</a> <br>
  454. {block:HasPages}{block:Pages}<a href="{URL}">{Label}</a><br>{/block:Pages}{/block:HasPages}
  455. </div>
  456.  
  457. <div id="posts">
  458. {block:Posts}
  459. <div id="entry">
  460.  
  461. {block:Photo}
  462. {block:IndexPage}
  463. <posting>
  464. <div class="perma">
  465. <div class="likep"><a id="like{PostID}" href="javascript:likelink('{PostID}','{Permalink}','');"><img src="http://static.tumblr.com/lba83dv/OUUltd958/spacer.gif" width="21" height="20" alt="like" id="likeimage{PostID}"/></a></div>
  466. <div class="rep"><a href="{reblogurl}" target="_blank"><img src="http://static.tumblr.com/uiqhh9x/OAClzwwao/reblog.png" width="30"/></a></div>
  467. </div>
  468. <div id="permalink">
  469. <span class="not"><a href="{Permalink}">{notecount}</a></span></div>
  470. {/block:IndexPage}
  471. {block:IndexPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width=220px /></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"width=200px/>{LinkCloseTag}{/block:PermalinkPage}
  472. {block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="{TagURL}"> #{Tag}</a> {/block:Tags}{/block:hasTags}{/block:PermalinkPage}
  473. {/block:Photo}
  474.  
  475. {block:Answer}
  476. <div style="margin-top:2px; margin-bottom:0px; min-height:30px; padding: 3px; background-color: #{color:Accent};">
  477. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;"/>
  478. <askk>{Asker}</askk>: {Question}</div>
  479. <div style="margin-top:2px; margin-bottom:4px; background: transparent;">{Answer}</div>
  480. <div class="permalink"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a> </div>
  481. {/block:Answer}
  482.  
  483.  
  484. {block:Photoset}
  485. {block:IndexPage}
  486. <center>
  487. <div class="perma">
  488. <div class="likep"><a id="like{PostID}" href="javascript:likelink('{PostID}','{Permalink}','');"><img src="http://static.tumblr.com/lba83dv/OUUltd958/spacer.gif" width="21" height="20" alt="like this post" id="likeimage{PostID}"/></a></div>
  489. <div class="rep"><a href="{reblogurl}" target="_blank"><img src="http://static.tumblr.com/uiqhh9x/OAClzwwao/reblog.png" width="30"/></a></div>
  490. </div>
  491. <div id="permalink">
  492. <span class="countreblog"><a href="{Permalink}">{notecount}<font color="#fc3c5c">♥ </font></a></a></span></div>
  493. {/block:IndexPage}
  494. <div style="padding-top:0px; padding-bottom:0px;"><a href="{permalink}">
  495. {Photoset-250}</a></div>
  496.  
  497. {/block:Photoset}
  498.  
  499. {block:Text}
  500. {block:Title}<span class="title"><a href="{permalink}">{Title}</a></span>{/block:Title}
  501. <span class="entrytext">{Body}</span>
  502. <span class="permalink">
  503. </span>
  504. <div align="right"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp;<a href="{ReblogURL}" target="_blank">{text:reblog}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a> </a></div>
  505. {/block:Text}
  506.  
  507.  
  508. {block:Link}
  509. <a href="{URL}" class="title">{Name}</a>
  510. {block:Description}{Description}{/block:Description}<br>
  511. <div align="right"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp;<a href="{ReblogURL}" target="_blank">{text:reblog}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a></div>
  512. {block:Link}
  513.  
  514. {block:Quote}
  515. <span class="title">{Quote}</span> <br>
  516. {block:Source}<strong>{Source}</strong>{/block:Source}
  517. <span class="permalink">
  518. </span>
  519. <br>
  520. <div align="right"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp;<a href="{ReblogURL}" target="_blank">{text:reblog}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a></div>
  521. {/block:Quote}
  522.  
  523. {block:Chat}
  524. {block:Title}<span class="title">{Title}</span>{/block:Title}
  525. <ul class="chat">
  526. {block:Lines}
  527. <li class="user_{UserNumber}">
  528. {block:Label}
  529. <span class="label">{Label}</span>
  530. {/block:Label}
  531.  
  532. {Line}
  533. </li>
  534. {/block:Lines}
  535. <span class="permalink">
  536. </span><br>
  537. <div align="right"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp<a href="{ReblogURL}" target="_blank">{text:reblog}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a> </a></div>
  538. {/block:Chat}
  539.  
  540.  
  541. {block:Audio}
  542. <div style="padding-top:0px; padding-bottom:0px;">
  543. <div style="float:center">
  544. {AudioPlayerGrey}
  545. </div>
  546. </div>
  547.  
  548. <div style="padding-bottom:0px;">{block:Caption}{Caption}{/block:Caption}</div>{block:indexpage}
  549. <hr size="1" width="270">
  550. <div style=" float:left; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:10px;"><a href="{permalink}">{FormattedPlayCount}&nbsp;Plays</a></div>
  551. <div align="right" style="padding-right:10px; padding-top:5px; padding-bottom:10px;"><a href="{permalink}">{NoteCountwithLabel}</a></div>{/block:indexpage}
  552. {/block:Audio}
  553.  
  554. {block:Video}
  555. <div style="padding-top:0px; padding-bottom:2px;">
  556. {Video-250}</div>
  557. <div style="padding-bottom:5px;">{block:Caption}{Caption}{/block:Caption}</div>
  558. {block:indexpage}<hr size="1" width="270">
  559. <div align="right" style="padding-right:10px; padding-top:5px; padding-bottom:10px;"><a href="{permalink}">{NoteCountwithLabel}</a>&nbsp;+&nbsp;<a href="{ReblogURL}" target="_blank">{text:reblog}</a>&nbsp;+&nbsp;<a href="{permalink}">{TimeAgo}</a></div>{/block:indexpage}
  560. {/block:Video}
  561.  
  562. {block:PermalinkPage}</a>
  563. <div id="other"><br>
  564. {TimeAgo}<br>{block:RebloggedFrom} reblogged from
  565. <a href="{ReblogParentURL}">{ReblogParentName}</a></a><br><br>posted by
  566. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  567. {/block:RebloggedFrom}
  568. <br><br>
  569. <div align="left">
  570. {block:PostNotes}
  571. {PostNotes}
  572. {/block:PostNotes}
  573. </div>
  574. </div>
  575. {/block:PermalinkPage}
  576. </div>
  577. {/block:Posts}
  578. </div>
  579. </div>
  580. </div>
  581. </center>
  582. </div>
  583. </div>
  584. {block:indexpage}
  585. {block:NextPage}<div id="page-nav"><a href="{NextPage}"></a></div>{/block:NextPage}
  586. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  587. <script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>
  588. <script type="text/javascript">
  589. $(window).load(function(){
  590. var $wall = $('#posts');
  591. $wall.imagesLoaded(function(){
  592. $wall.masonry({
  593. itemSelector: '#entry, #entry_photo',
  594. isAnimated : false
  595. });
  596. });
  597.  
  598. $wall.infinitescroll({
  599. navSelector : '#page-nav',
  600. nextSelector : '#page-nav a',
  601. itemSelector : '#entry, #entry_photo',
  602. bufferPx : 2000,
  603. debug : false,
  604. errorCallback: function() {
  605. $('#infscr-loading').fadeOut('normal');
  606. }},
  607. function( newElements ) {
  608. var $newElems = $( newElements );
  609. $newElems.hide();
  610. $newElems.imagesLoaded(function(){
  611. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  612. });
  613. }); $('#content').show(500);
  614. });
  615. </script>
  616. {/block:indexpage}
  617.  
  618. </body>
  619. </html>
  620.  
  621. <!--Please don't remove anything below this line-->
  622. <div id="logo">
  623. <a href="http://atlasdesigns.tumblr.com/"><img src="http://i47.tinypic.com/2cpxg8o.png" height="30px"></a>
  624. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!