API tools faq
paste
Advertisement
ogaraster

Aluminum Theme

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