Advertisement
ogaraster

Freeze Theme v.2

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