Advertisement
ogaraster

Atlantis Theme

Feb 20th, 2013
6,307
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.51 KB | None | 0 0
  1. <!--
  2.  
  3. Atlantis Theme brought to you by Atlas Designs
  4. http://atlasdesigns.co/
  5.  
  6. Do not remove credit unless given permission to do so.
  7.  
  8. Updated July 2013:
  9. - new like/reblog buttons
  10. - formatted text posts
  11. - minor design tweaks
  12.  
  13. -->
  14.  
  15. <head>
  16.  
  17. <link rel="shortcut icon" href="{PortraitURL-24}">
  18. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  19. <meta name="viewport" content="width=820" />
  20.  
  21. <link href='http://fonts.googleapis.com/css?family=Convergence' rel='stylesheet' type='text/css'>
  22. <link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
  23.  
  24. {block:IndexPage}
  25.  
  26. <script type="text/javascript"
  27. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  28.  
  29. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  30.  
  31. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  32. <script type="text/javascript">
  33. $(window).load(function () {
  34. var $content = $('#content');
  35. $content.masonry({itemSelector: '.entry'}),
  36. $content.infinitescroll({
  37. navSelector : 'div#pagination',
  38. nextSelector : 'div#pagination a#nextPage',
  39. itemSelector : '.entry',
  40. loading: {
  41. finishedMsg: '',
  42. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  43. },
  44. bufferPx : 600,
  45. debug : false,
  46. },
  47. // call masonry as a callback.
  48. function( newElements ) {
  49. var $newElems = $( newElements );
  50. $newElems.hide();
  51. // ensure that images load before adding to masonry layout
  52. $newElems.imagesLoaded(function(){
  53. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );});});});</script>
  54. {/block:IndexPage}
  55.  
  56. <meta name="color:background" content="#ffffff" />
  57. <meta name="color:text" content="#000000" />
  58. <meta name="color:title" content="#ffffff" />
  59. <meta name="color:link" content="#828282" />
  60. <meta name="color:link hover" content="#ebebeb" />
  61. <meta name="color:nav border" content="#a3a3a3">
  62. <meta name="color:scrollbar" content="#e0e0e0" />
  63. <meta name="color:post background" content="#f0f0f0">
  64. <meta name="color:title banner" content="#ebebeb">
  65. <meta name="color:banner border" content="#a3a3a3">
  66.  
  67. <meta name="if:title font" content="0">
  68. <meta name="if:show shadows" content="1">
  69.  
  70. <meta name="text:reblog" content="share">
  71. <meta name="text:home" content="refresh">
  72. <meta name="text:message" content="mailbox">
  73. <meta name="text:links" content="links">
  74. <meta name="text:archive" content="index">
  75.  
  76. <meta name="image:background" content="" />
  77.  
  78. <style type="text/css">
  79.  
  80.  
  81. ::-webkit-scrollbar {width: 7px; height: 0px; background:{color:background};}
  82. ::-webkit-scrollbar-thumb {background: {color:scrollbar}; border-radius:10px;}
  83.  
  84. iframe#tumblr_controls {position:fixed; z-index:9999999999; top: 3px; margin: 0 0 0 0; right:4px; -webkit-filter: invert(100%);}
  85.  
  86. body {
  87. background-color: {color:background};
  88. background-image:url({image:Background});
  89. background-attachment: fixed;
  90. background-repeat: repeat;
  91. font-size:12px;
  92. font-family:Convergence;
  93. line-height:14px;
  94. text-transform:none;
  95. color: {color:text};
  96. }
  97.  
  98. #title{
  99. position:absolute;
  100. top:-5px;
  101. width:auto;
  102. padding-left:20px;
  103. padding-right:20px;
  104. padding-top:30px;
  105. padding-bottom:10px;
  106. right:60%;
  107. text-align:center;
  108. font-size:30px;
  109. line-height:50px;
  110. color:{color:title};
  111. background-color:{color:title banner};
  112. border:3px solid {color:banner border};
  113. {block:ifshowshadows}
  114. box-shadow:0 1px 5px gray;
  115. {/block:ifshowshadows}
  116. letter-spacing:3px;
  117. text-transform:uppercase;
  118.  
  119. {block:iftitlefont}
  120. font-family:pacifico;
  121. font-size:50px;
  122. text-transform:lowercase;
  123. letter-spacing:0px;
  124. {/block:iftitlefont}
  125.  
  126. cursor:default;
  127. -moz-transition: all 0.4s ease-in-out;
  128. -webkit-transition: all 0.4s ease-in-out;
  129. -o-transition: all 0.4s ease-in-out;
  130. -ms-transition: all 0.4s ease-in-out;
  131. transition: all 0.4s ease-in-out;
  132. }
  133.  
  134. #title:hover{
  135. padding-top:50px;
  136. -moz-transition: all 0.4s ease-in-out;
  137. -webkit-transition: all 0.4s ease-in-out;
  138. -o-transition: all 0.4s ease-in-out;
  139. -ms-transition: all 0.4s ease-in-out;
  140. transition: all 0.4s ease-in-out;
  141. }
  142.  
  143. #nav{
  144. position:absolute;
  145. width:50%;
  146. top:10px;
  147. left:43%;
  148. font-size:13px;
  149. line-height:20px;
  150. letter-spacing:2px;
  151. word-spacing:10px;
  152. text-transform:uppercase;
  153. -moz-transition: all 0.3s ease-in-out;
  154. -webkit-transition: all 0.3s ease-in-out;
  155. -o-transition: all 0.3s ease-in-out;
  156. -ms-transition: all 0.3s ease-in-out;
  157. transition: all 0.3s ease-in-out;
  158. }
  159.  
  160. #nav a{
  161. border-bottom:2px solid {color:nav border};
  162. }
  163.  
  164. #nav a:hover{
  165. color:{color:link hover};
  166. border-color:{color:link hover};
  167. }
  168.  
  169. #description{
  170. position:absolute;
  171. top:40px;
  172. left:43%;
  173. width:300px;
  174. font-size:12px;
  175. line-height:13px;
  176. text-align:left;
  177. }
  178.  
  179. .answer{
  180. width:90%;
  181. padding:5%;
  182. background:{color:post background};
  183. border-radius:3px;
  184. {block:ifshowshadows}
  185. box-shadow:0 1px 3px gray;
  186. {/block:ifshowshadows}
  187. }
  188. .answer img {
  189. width:250px;
  190. height:auto;
  191. {block:permalinkpage}
  192. width:auto;
  193. height:auto;
  194. {/block:permalinkpage}
  195. }
  196.  
  197. a {
  198. text-decoration:none;
  199. color:{color:link};
  200. -webkit-transition: all 0.4s linear;
  201. -moz-transition: all 0.4s linear;
  202. transition: all 0.4s linear;
  203. }
  204.  
  205. a:link, a:active, a:visited{
  206. color: {color:link};
  207. }
  208.  
  209. a:hover{
  210. color: {color:link hover};
  211. }
  212.  
  213. div#content {
  214. width: 100%;
  215. margin-left:2%;
  216. margin-top:140px;
  217. float:left;
  218. position: absolute;
  219. }
  220.  
  221. .entry{
  222. margin:13px;
  223. float:left;
  224. height:auto;
  225. {block:IndexPage}
  226. width:17%;
  227. overflow:hidden;
  228. {/block:IndexPage}
  229. {block:PermalinkPage}
  230. position:absolute;
  231. left:50%;
  232. margin-left:-500px;
  233. width:500px;
  234. height:auto;
  235. {/block:PermalinkPage}
  236. }
  237.  
  238. .title{
  239. font-size:16px;
  240. line-height:16px;
  241. color: {color:text};
  242. }
  243.  
  244. blockquote{
  245. padding:0px 0px 0px 3px;
  246. margin:0px 0px 0px 2px;
  247. border-left: 2px solid #ddd;
  248. }
  249.  
  250. .entry .perma{
  251. opacity:0;
  252. -webkit-transition: all 0.3s ease-in-out;
  253. -moz-transition: all 0.3s ease-in-out;
  254. transition: all 0.3s ease-in-out;
  255. }
  256. .entry:hover .perma{
  257. opacity:1;
  258. }
  259.  
  260. .permaback{
  261. position:absolute;
  262. bottom:3px;
  263. left:0px;
  264. width:95%;
  265. padding-left:5%;
  266. background:rgba(0,0,0,.2);
  267. opacity:1;
  268. height:30px;
  269. border-bottom-left-radius:3px;
  270. border-bottom-right-radius:3px;
  271. }
  272. .permanote a{
  273. color:white;
  274. font-size:11px;
  275. line-height:30px;
  276. }
  277. .like_and_reblog_buttons {
  278. position:absolute;
  279. bottom:-2px;
  280. right:5%;
  281. list-style: none;
  282. opacity:1;
  283. }
  284. .like_and_reblog_buttons li {
  285. float: left;
  286. height:15px;
  287. width:15px;
  288. }
  289. .like_and_reblog_buttons li:first-child {
  290. margin-right:12px;
  291. }
  292.  
  293. .play{
  294. position:absolute;
  295. left:50%;
  296. margin-left:-24px;
  297. top:50%;
  298. margin-top:-42px;
  299. border:10px solid white;
  300. height:27px;
  301. width:27px;
  302. border-radius:100%;
  303. overflow:hidden;
  304. }
  305.  
  306. .notess{
  307. position:absolute;
  308. left:520px;
  309. top:0px;
  310. height:500px;
  311. width:450px;
  312. overflow:scroll;
  313. padding:10px;
  314. background-color:{color:post background};
  315. {block:ifshowshadows}
  316. box-shadow:0 1px 3px gray;
  317. {/block:ifshowshadows}
  318. border-radius:3px;
  319. }
  320. ol.notes {
  321. list-style-type: none;
  322. margin-top:20px;
  323. padding:0px;
  324. line-height:40px;
  325. font-size:13px;
  326. }
  327. .notess img{
  328. border-radius:100%;
  329. }
  330.  
  331. .textbuttons ul{
  332. list-style:none;
  333. position:relative;
  334. }
  335. .textbuttons li {
  336. list-style:None;
  337. float: right;
  338. }
  339. .textbuttons li:first-child {
  340. margin-left:12px;
  341. }
  342.  
  343. .textnote{
  344. position:absolute;
  345. margin-left:0px;
  346. margin-bottom:15px;
  347. font-weight:700;
  348. font-size:12px;
  349. }
  350. .textnote a{
  351. font-size:11px;
  352. color:#a3a3a3;
  353. }
  354.  
  355. .caption{
  356. width:90%;
  357. padding:5%;
  358. background:{color:post background};
  359. {block:ifshowshadows}
  360. box-shadow:0 1px 3px gray;
  361. {/block:ifshowshadows}
  362. margin-top:-3px;
  363. border-bottom-left-radius:3px;
  364. border-bottom-right-radius:3px;
  365. }
  366.  
  367. .chat li {
  368. list-style-type:none;
  369. margin-left:-40px;
  370. padding:5px;
  371. border-bottom:2px solid #dddddd;
  372. }
  373. .label{
  374. font-weight:700;
  375. font-size:11px;
  376. }
  377.  
  378. {CustomCSS}
  379. </style>
  380.  
  381. <title>{title}</title>
  382.  
  383. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  384.  
  385. </head>
  386. <body>
  387.  
  388. <div id="title">{title}</div>
  389.  
  390. <div id="description">{description}</div>
  391.  
  392. <div id="nav">
  393. <a href="/">{text:home}</a>
  394. <a href="/ask">{text:message}</a>
  395. <a href="/archive">{text:archive}</a>
  396. {block:HasPages}{block:Pages}<a href="{URL}"><span class="speclink">{Label}</span></a> {/block:Pages}{/block:HasPages}
  397. <a href="http://baesil.tumblr.com/">theme</a>
  398. </div>
  399.  
  400. <div id="content">
  401.  
  402. {block:Posts}
  403. <div class="entry">
  404.  
  405. {block:Text}
  406. <div class="answer">{block:Title}<span class="title">{Title}</span>{/block:Title}{Body}
  407. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  408. <ul class="textbuttons">
  409. <li>{ReblogButton color="gray" size=15}</li>
  410. <li>{LikeButton color="gray" size=15}</li>
  411. </ul><br>
  412. {/block:IndexPage}
  413. </div>
  414. {/block:Text}
  415.  
  416. {block:Link}
  417. <div class="answer"><a href="{URL}"><span class="title">{Name}</span></a>
  418. {block:Description}{Description}{/block:Description}
  419. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  420. <ul class="textbuttons">
  421. <li>{ReblogButton color="gray" size=15}</li>
  422. <li>{LikeButton color="gray" size=15}</li>
  423. </ul><br>
  424. {/block:IndexPage}
  425. </div>
  426. {block:Link}
  427.  
  428. {block:Photo}
  429. {block:IndexPage}
  430. <div class="perma">
  431. <div class="permaback"><span class="permanote"><a href="{Permalinkl}">{NoteCountwithLabel}</a></span></div>
  432. <ul class="like_and_reblog_buttons">
  433. <li>{ReblogButton color="white" size=17}</li>
  434. <li>{LikeButton color="white" size=17}</li>
  435. </ul>
  436. </div>
  437. {/block:IndexPage}
  438. {block:IndexPage}{LinkOpenTag}<div class="photo"><a href="{permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}" width=100%/></a></div>{LinkCloseTag}
  439. {block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}
  440. {/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width=500px/>{LinkCloseTag}{/block:PermalinkPage}
  441. {/block:Photo}
  442.  
  443. {block:Photoset}
  444. <center>
  445. {block:IndexPage}{Photoset-250}{/block:IndexPage}
  446. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  447. </center>
  448. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  449. <ul class="textbuttons">
  450. <li>{ReblogButton color="gray" size=15}</li>
  451. <li>{LikeButton color="gray" size=15}</li>
  452. </ul><br>
  453. {/block:IndexPage}
  454. {/block:Photoset}
  455.  
  456. {block:Quote}
  457. <div class="answer"><div class="title">{Quote}</div>- {Source}
  458. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  459. <ul class="textbuttons">
  460. <li>{ReblogButton color="gray" size=15}</li>
  461. <li>{LikeButton color="gray" size=15}</li>
  462. </ul><br>
  463. {/block:IndexPage}
  464. </div>
  465. {/block:Quote}
  466.  
  467. {block:Chat}
  468. <div class="answer">
  469. <div style="margin-left:3px;">
  470. {block:Title}<span class="title">{Title}</span>{/block:Title}
  471. <ul class="chat">
  472. {block:Lines}
  473. <li class="user_{UserNumber}">
  474. {block:Label}
  475. <span class="label">{Label}</span>
  476. {/block:Label}
  477. {Line}
  478. </li>
  479. {/block:Lines}
  480. </ul>
  481. </div>
  482. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  483. <ul class="textbuttons">
  484. <li>{ReblogButton color="gray" size=15}</li>
  485. <li>{LikeButton color="gray" size=15}</li>
  486. </ul><br>
  487. {/block:IndexPage}
  488. </div>
  489. {/block:Chat}
  490.  
  491. {block:Audio}
  492. {block:AlbumArt}
  493. <center><a href="{Permalink}"><img src="{AlbumArtURL}" width="100%"></a></center>
  494. {/block:AlbumArt}
  495. <div class="play">{AudioPlayerWhite}</div>
  496. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  497. <div class="perma">
  498. <div class="permaback"><span class="permanote"><a href="{Permalinkl}">{NoteCountwithLabel}</a></span></div>
  499. <ul class="like_and_reblog_buttons">
  500. <li>{ReblogButton color="white" size=17}</li>
  501. <li>{LikeButton color="white" size=17}</li>
  502. </ul>
  503. </div>
  504. {/block:IndexPage}
  505. {/block:Audio}
  506.  
  507. {block:Answer}
  508. <div class="answer"><div style="font-size:11px;line-height:11px;font-style:italic;color:{color:links}"><i>{Asker} asked:</i></div><br><span class="title">{Question}</span><hr color={color:title}>{Answer}
  509. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  510. <ul class="textbuttons">
  511. <li>{ReblogButton color="gray" size=15}</li>
  512. <li>{LikeButton color="gray" size=15}</li>
  513. </ul><br>
  514. {/block:IndexPage}
  515. </div>
  516. {/block:Answer}
  517.  
  518. {block:Video}
  519. {block:IndexPage}
  520. <center>
  521. {Video-250}</center>
  522. {block:IndexPage}<div class="textnote"><a href="{Permalink}">{NoteCountwithLabel}</a></div>
  523. <ul class="textbuttons">
  524. <li>{ReblogButton color="gray" size=15}</li>
  525. <li>{LikeButton color="gray" size=15}</li>
  526. </ul><br>
  527. {/block:IndexPage}
  528. {/block:IndexPage}
  529. {block:PermalinkPage}
  530. <center>
  531. {Video-500}</center>
  532. {/block:PermalinkPage}
  533. {block:Video}
  534.  
  535. {block:PermalinkPage}
  536. {block:HasTags} &middot; {block:Tags}<a href="TagURL"> #{Tag}</a> {/block:Tags}{/block:hasTags}
  537. {/block:PermalinkPage}
  538.  
  539. {block:PostNotes}
  540. <div class="notess">{block:Caption}{Caption}{/block:Caption}
  541. {block:NoteCount}<br><span class="title">{NoteCountWithLabel}:</span>{/block:NoteCount}
  542. <br>{PostNotes}</div>
  543. {/block:PostNotes}
  544. </div>
  545.  
  546. {/block:Posts}
  547.  
  548. {block:IndexPage}
  549. {block:Pagination}
  550. <div id="pagination">
  551. {block:NextPage}
  552. <a id="nextPage" href="{NextPage}"></a>
  553. {/block:NextPage}
  554. {block:PreviousPage}
  555. <a href="{PreviousPage}"></a>
  556. {/block:PreviousPage}
  557. </div>
  558. {/block:Pagination}
  559. {/block:IndexPage}
  560. </div>
  561.  
  562. <div style="position:fixed;z-index:1338; !important;top:26px;right:3px;-webkit-filter: invert(100%);"><a href="http://atlasdesigns.tumblr.com/"><img src="http://static.tumblr.com/2w7y46r/wuvmba8c2/installtheme.png"></a></div>
  563.  
  564. </body>
  565. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement