API tools faq
paste
Advertisement
rowrz

defensive theme

rowrz
May 12th, 2014
303
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 15.71 KB | None | 0 0
raw download clone embed print report
  1. <!--                                  
  2. _ __ _____      ___ __ ____        
  3. | '__/ _ \ \ /\ / / '__|_  /        
  4. | | | (_) \ V  V /| |   / /        
  5. |_|  \___/ \_/\_/ |_|  /___|        
  6. | | | |                            
  7. | |_| |__   ___ _ __ ___   ___  ___
  8. | __| '_ \ / _ \ '_ ` _ \ / _ \/ __|
  9. | |_| | | |  __/ | | | | |  __/\__ \
  10. \__|_| |_|\___|_| |_| |_|\___||___/
  11.                      
  12.                              
  13. defensive theme v1.8                                
  14. designed & manufacured by alex
  15. http://rowrz.tumblr.com/themes
  16. -->
  17. <!DOCTYPE html>
  18. <html>
  19. <head>
  20.  
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  22. {block:Description}
  23.             <meta name="description" content="{MetaDescription}" />
  24. {/block:Description}
  25. <link rel="shortcut icon" href="{Favicon}">
  26. <link rel="apple-touch-icon-precomposed" href="{PortraitURL-128}">
  27.  
  28. {MobileAppHeaders}
  29.  
  30. <title>{block:SearchPage}{lang:Search results for SearchQuery} - {/block:SearchPage}{block:PermalinkPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{/block:PermalinkPage}{Title} | {Name}</title>
  31. <link rel="shortcut icon" href="{favicon}">
  32. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  33. {block:hidden}
  34. <meta name="viewport" content="width=720" />
  35. <meta name="color:Background" content="#252525"/>
  36. <meta name="color:Text" content="#000000"/>
  37. <meta name="color:Link" content="#000000"/>
  38. <meta name="color:accents" content="#eeeeee"/>
  39. <meta name="color:linkhover" content="#888888"/>
  40. <meta name="color:entrybg" content="#FFFFFF"/>
  41.  
  42. <meta name="if:UseAccountAvi" content="1"/>
  43. <meta name="image:SideImg" content="{PortraitURL-128}"/>
  44. <meta name="if:2Columns" content="0"/>
  45. <meta name="if:showcaptions" content="0"/>
  46. <meta name="if:HomeLink" content="1"/>
  47. <meta name="if:AskLink" content="1"/>
  48.  
  49. <meta name="text:descfontsize" content="15px"/>
  50. <meta name="text:navfontsize" content="12px"/>
  51.  
  52. <meta name="text:link1" content=""/>
  53. <meta name="text:link1title" content=""/>
  54.  
  55. <meta name="text:link2" content=""/>
  56. <meta name="text:link2title" content=""/>
  57.  
  58. <meta name="text:link3" content=""/>
  59. <meta name="text:link3title" content=""/>
  60.  
  61. <meta name="text:link4" content=""/>
  62. <meta name="text:link4title" content=""/>
  63.  
  64. <meta name="text:link5" content=""/>
  65. <meta name="text:link5title" content=""/>
  66. {/block:hidden}
  67.  
  68. <script src="http://static.tumblr.com/ojd74qh/QKqn92qi7/jquery.1.11.0.min.defensive.js"></script>
  69.  
  70. <style type="text/css">
  71.  
  72. @font-face
  73. {
  74. font-family: silkscreen;
  75. src: url(http://static.tumblr.com/ojd74qh/noSn5fmf6/slkscr.ttf);
  76. }
  77.  
  78.  ::-webkit-scrollbar {width: 9px; height: 3px; background: #FFFFFF;}
  79. ::-webkit-scrollbar-thumb {background-color:#ffffff ; border: 1px solid black;}
  80.  
  81.  
  82. -webkit-transition: all 0.4s ease-in-out;
  83.  
  84. -moz-transition: all 0.4s ease-in-out;
  85.  
  86. -o-transition: all 0.4s ease-in-out;
  87.  
  88. a {
  89. text-decoration:none;
  90. -webkit-transition: all 0.7s ease-out;
  91. -moz-transition: all 0.7s ease-out;
  92. transition: all 0.7s ease-out;
  93. }
  94.  
  95. a:hover {
  96. text-decoration:none;
  97. -webkit-transition: all 0.7s ease-out;
  98. -moz-transition: all 0.7s ease-out;
  99. transition: all 0.7s ease-out;
  100. }
  101.  
  102. #tumblr_controls{position:fixed !important;right:104px;}
  103.  
  104.  
  105. #text img, #entry img {
  106.     height: auto;
  107.     max-width:100%;}
  108.  
  109. .left {margin-left:400px;}
  110.  
  111. #center{
  112. padding-top:3px;
  113. padding-bottom:3px;
  114. position:fixed !important;
  115. width:250px;
  116. height:207px;
  117. background-color:#fff;
  118. {block:PermalinkPage}
  119. width:410px;
  120. height:207px;
  121. {/block:PermalinkPage}
  122. }
  123.  
  124. #posts{
  125.  
  126. {block:permalinkpage}
  127. width:860px;
  128. {/block:permalinkpage}
  129. {block:ifnot2Columns}
  130.     {block:indexpage}
  131.     width:420px;
  132.     {/block:indexpage}
  133. {/block:ifnot2Columns}
  134. {block:if2Columns}
  135.     {block:indexpage}
  136.     width:620px;
  137.     {/block:indexpage}
  138. {/block:if2Columns}
  139. margin-top: 10px;
  140. }
  141.  
  142. body {
  143. padding: 0px;
  144. margin: 0px;
  145. color:{color:text};
  146. line-height:14px;
  147. font-size:9px;
  148. background-color: {color:Background};
  149. }
  150.  
  151. a:link, a:active, a:visited{
  152. text-decoration:none;
  153. color:{color:link};
  154. -webkit-transition: all 0.3s ease-out;
  155. -moz-transition: all 0.3s ease-out;
  156. transition: all 0.3s ease-out;}
  157.  
  158. a:hover{
  159. color:{color:linkhover};
  160. text-shadow:0px 0px 20px #fff;
  161. -webkit-transition: all 0.3s ease-out;
  162. -moz-transition: all 0.3s ease-out;
  163. transition: all 0.3s ease-out;
  164. }
  165. #entry blockquote {
  166.       border-left: solid 2px {color:accents};
  167.       margin: 0;
  168.       padding-left: 10px;}
  169. .text p{text-align:left;}
  170. .txttitle{font-size:11px;}
  171.  
  172. #entry {
  173. margin:16px;
  174. padding:9px;
  175. padding-bottom:6px;
  176. z-index:100;
  177. line-height:15px;
  178. {block:IndexPage}width:200px;{/block:IndexPage}
  179. {block:PermalinkPage}width:400px; margin-left:40px;{/block:PermalinkPage}
  180. font-family:'trebuchet ms', arial, sans-serif;
  181. background-color:{color:entrybg};
  182. }
  183.  
  184. #entry .photo{
  185.    margin-bottom:5px;
  186.    padding-bottom:0px;}
  187. .perma1, .perma2{
  188.     margin-top:-10px;
  189.     padding-top:5px;}
  190.  
  191. .perma1{
  192. float:left;
  193. height: auto;
  194. overflow:hidden;
  195. bottom:0px;
  196. left:0px;
  197. line-height:14px;
  198. text-transform: uppercase;
  199. -webkit-transition: all 0.8s ease;
  200. -moz-transition: all 0.8s ease;
  201. transition: all 0.8s ease;
  202. -o-transition: all 0.8s ease;}
  203.  
  204. .perma2{float:right;
  205. height: auto;
  206. overflow:hidden;
  207. bottom:0px;
  208. right:0px;
  209. line-height:14px;
  210. text-transform: uppercase;
  211. -webkit-transition: all 0.8s ease;
  212. -moz-transition: all 0.8s ease;
  213. transition: all 0.8s ease;
  214. -o-transition: all 0.8s ease;}
  215.  
  216. .perma1, .perma2, .perm, .perm2{
  217.     font-family:silkscreen, 'courier new', monospace;
  218.     font-size:8px;}
  219.    
  220. .perm{display: block;
  221. font-size:9px;
  222. line-height:13px;
  223. text-transform:uppercase;
  224. -webkit-transition: all 1s ease;
  225. -moz-transition: all 1s ease;
  226. transition: all 1s ease;
  227. -o-transition: all 1s ease;}
  228.  
  229. .perm2 {display: block;
  230. font-size:9px;
  231. line-height:13px;
  232. text-transform:uppercase;
  233. margin-top:-13px;
  234. -webkit-transition: all 1s ease;
  235. -moz-transition: all 1s ease;
  236. transition: all 1s ease;
  237. -o-transition: all 1s ease;
  238. float:right;}
  239.  
  240.  
  241. .sidebar{z-index:98;
  242. width:100px;
  243. max-height:300px;
  244. position:fixed;
  245. left:200px;
  246. padding:14px;
  247. line-height:15px;
  248. overflow:hidden;
  249. text-align:left;
  250. opacity:1;
  251. margin-top:100px;
  252. font-size:8px;
  253. background-color:{color:entrybg};
  254. -webkit-transition: all 0.8s linear;
  255. -moz-transition: all 0.8s linear;
  256. transition: all 0.8s linear;
  257. font-family:silkscreen, arial;}
  258.  
  259. .avatar {display:none;}
  260. .pano img{max-width:260px;}
  261.  
  262. #audioplayer:hover {opacity:1;
  263. -webkit-transition: all 0.6s ease-out;
  264.     -moz-transition: all 0.6s ease-out;
  265.     -o-transition: all 0.6s ease-out;}
  266.  
  267. #audioplayer {background:#fff;
  268.     width:30px;
  269.     height:30px;
  270.     border:30px solid transparent;
  271.     overflow:hidden;
  272.     position:absolute;
  273.     z-index:99;
  274.     opacity:0.3;
  275.     -webkit-transition: all 0.6s ease-out;
  276.     -moz-transition: all 0.6s ease-out;
  277.     -o-transition: all 0.6s ease-out;}
  278.    
  279. #audiod {height:90px;
  280.     padding-top:5px;
  281.     padding-right:20px;
  282.     margin-left:95px;
  283.     overflow:auto;}
  284.    
  285. #albumart img {float:left;
  286. margin-right:10px;}
  287.  
  288. {block:IndexPage}    
  289.     div.video iframe, div.video embed{width:200px;}
  290. {/block:IndexPage}
  291.  
  292. .sideimg-circle img{border-radius: 50%;}
  293. .sideimg{display:block;
  294.     width:100%;
  295.     padding-bottom:2px;}
  296. span.entrytext > p {margin-top: 1px;}
  297. .photo img{width:100%;}
  298. .index-page .1stphoto img {display: none;}
  299. .index-page .1stphoto img:first-child {display: block;}
  300. {CustomCSS}
  301.  
  302. </style>
  303.  
  304. </head>
  305.  
  306. <body class="{block:IndexPage}index-page{/block:IndexPage}">
  307.  
  308. <div class="center">
  309.  
  310. <div class="content">
  311.  
  312. <div class="left">
  313.  
  314. <div class="sidebar">
  315.     <!--the sidebar shit will go here-->
  316.     <a href="/">{block:ifUseAccountAvi}{block:ShowAvatar}<div class="sideimg sideimg-{AvatarShape}"><img src="{PortraitURL-128}" width="100%" /></div>{/block:ShowAvatar}{/block:ifUseAccountAvi}
  317.         {block:ifnotUseAccountAvi}<img class="sideimg" src="{image:SideImg}"/>{/block:ifnotUseAccountAvi}
  318.     </a>
  319.     <span class="desc">{Description}</span>
  320.     <br/>
  321.     <div id="nav">
  322.         {block:ifHomeLink}
  323.             <a class="nav" href="/">home</a>
  324.         {/block:ifHomeLink}
  325.         {block:AskEnabled}
  326.             {block:ifAskLink}
  327.                 <a class="nav" href="/ask">msg</a>
  328.             {/block:ifAskLink}
  329.         {/block:AskEnabled}
  330.         {block:iflink2title}
  331.             <a class="nav" href="{text:link2}">{text:link2title}</a>
  332.         {/block:iflink2title}
  333.         {block:iflink3title}
  334.             <a class="nav" href="{text:link3}">{text:link3title}</a>
  335.         {/block:iflink3title}
  336.         {block:iflink4title}
  337.             <a class="nav" href="{text:link4}">{text:link4title}</a>
  338.         {/block:iflink4title}
  339.         {block:iflink5title}
  340.             <a class="nav" href="{text:link5}">{text:link5title}</a>
  341.         {/block:iflink5title}
  342.         <span id="inner"></span>
  343.     </div>
  344. </div>
  345.  
  346.  
  347.  
  348. <div id="posts">
  349.  
  350. {block:Posts}
  351. <div id="entry">
  352.  
  353. {block:Text}
  354. {block:Title}<span class="txttitle">{Title}</span>{/block:Title}
  355. <span class="entrytext">{Body}</span></a>
  356. {block:IndexPage}
  357. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  358. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  359. {/block:IndexPage}
  360. {/block:Text}
  361.  
  362. {block:Link}
  363. <a href="{URL}" class="title">{Name}</a>
  364. {block:Description}{Description}{/block:Description}
  365. {block:IndexPage}
  366. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  367. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  368. {/block:IndexPage}
  369. {block:Link}
  370.  
  371. {block:Photo}
  372.  
  373. {block:IndexPage}
  374. <div class="photo">
  375. <a href="{Permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/></a>
  376. {block:ifshowcaptions}{block:Caption}{Caption}{/block:Caption}{/block:ifshowcaptions}
  377. <div class="perma1"><a href="{Permalink}" target="_blank">{NoteCount}</a></div>
  378. <div class="perma2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  379. </div>
  380. {/block:IndexPage}
  381. {block:PermalinkPage}{LinkOpenTag}<img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="400"/>{LinkCloseTag}{/block:PermalinkPage}
  382. {/block:Photo}
  383.  
  384. {block:Panorama}
  385. {block:IndexPage}
  386. <div class="photo">
  387.     {LinkOpenTag}<img class="pano" src="{PhotoURL-Panorama}" alt="{PhotoAlt}" width="200"/>{LinkCloseTag}
  388.     {block:ifshowcaptions}{block:Caption}{Caption}{/block:Caption}{/block:ifshowcaptions}
  389.     <div class="perma1"><a href="{Permalink}" target="_blank">{NoteCount}</a></div>
  390. <div class="perma2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  391. </div>
  392. {/block:IndexPage}
  393.     {block:PermalinkPage}
  394.     {LinkOpenTag}<img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"  width="400"/>{LinkCloseTag}
  395.         {Caption}
  396.     {/block:PermalinkPage}
  397. {/block:Panorama}
  398.  
  399.  
  400. {block:Photoset}{block:IndexPage}
  401. <div class="photo"><center>
  402.     <div class="1stphoto">
  403.     {block:Photos}<a rel="nofollow" href="{Permalink}">
  404.         <img alt="" src="{PhotoURL-500}"></a>
  405.     {/block:Photos}
  406.     </div>
  407. </center></span>
  408. {block:ifshowcaptions}{block:Caption}{Caption}{/block:Caption}{/block:ifshowcaptions}
  409. <div class="perma1"><a href="{Permalink}" target="_blank">{NoteCount}</a></div>
  410. <div class="perma2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  411. </div>
  412. {/block:IndexPage}
  413. {block:PermalinkPage}
  414. {Photoset}
  415. {/block:PermalinkPage}
  416. {/block:Photoset}
  417.  
  418. {block:Quote}
  419. <span class="title">{Quote}</span><br />
  420. {block:Source}{Source}{/block:Source}
  421. {block:IndexPage}
  422. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  423. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  424. {/block:IndexPage}
  425. {/block:Quote}
  426.  
  427. {block:Chat}
  428. {block:Title}<span class="title">{Title}</span>{/block:Title}
  429. <ul class="chat">
  430. {block:Lines}
  431. <li class="user_{UserNumber}">
  432. {block:Label}
  433. <span class="label">{Label}</span>
  434. {/block:Label}
  435.  
  436. {Line}
  437. </li>
  438. {/block:Lines}
  439. </ul>
  440. {block:IndexPage}
  441. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  442. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  443. {/block:IndexPage}
  444. {/block:Chat}
  445.  
  446. {block:Audio}
  447.  
  448. <div id="audioplayer">
  449. {AudioPlayer}</div>
  450. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="90px">{/block:AlbumArt}</div>
  451. <div id="audiod">{PlayCount} plays</br>
  452. {block:TrackName}Title: {TrackName}</br>{/block:TrackName}
  453. {block:Artist}Artist: {Artist}</br>{/block:Artist}</div>
  454.  
  455. {block:IndexPage}
  456. {block:ifshowcaptions}{block:Caption}{Caption}{/block:Caption}{/block:ifshowcaptions}
  457. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  458. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  459. {/block:IndexPage}
  460. {/block:Audio}
  461.  
  462. {block:Video}
  463. {block:IndexPage}
  464. <div class="post video">{Video-250}</div>
  465.  
  466. {block:ifshowcaptions}{block:Caption}{Caption}{/block:Caption}{/block:ifshowcaptions}
  467. <div style="padding-top:5px"></div>
  468. <div class="perm"><a href="{Permalink}"><a href="{Permalink}">{notecount}</span></a></div>
  469.  
  470. <div class="perm2"><a href="{ReblogURL}" target="_blank">rblg</a></div>
  471. {/block:IndexPage}
  472. {block:PermalinkPage}
  473. <div class="post video">{Video-400}</div>
  474. {/block:PermalinkPage}
  475. {/block:Video}
  476.  
  477. {block:PermalinkPage}
  478.  
  479. {block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="{TagURL}"> #{Tag}</a> {/block:Tags}{/block:hasTags}
  480.  
  481. {/block:PermalinkPage}
  482.  
  483. {block:PostNotes}{PostNotes}
  484. {/block:PostNotes}
  485. </div>
  486.  
  487. {/block:Posts}
  488. </div>
  489. </div>
  490. </div>
  491. </div>
  492.  
  493. {block:indexpage}
  494. {block:Pagination}
  495.         <div id="pagination">
  496.               {block:PreviousPage}
  497.                     <a href="{PreviousPage}">Previous</a>
  498.               {/block:PreviousPage}
  499.        
  500.               {block:JumpPagination length="5"}
  501.                     {block:CurrentPage}
  502.                           <span class="current_page">{PageNumber}</span>
  503.                     {/block:CurrentPage}
  504.        
  505.                     {block:JumpPage}
  506.                           <a class="jump_page" href="{URL}">{PageNumber}</a>
  507.                     {/block:JumpPage}
  508.               {/block:JumpPagination}
  509.        
  510.               {block:NextPage}
  511.                     <a href="{NextPage}">Next</a>
  512.               {/block:NextPage}
  513.         </div>
  514.     {/block:Pagination}
  515. <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
  516. <script type="text/javascript" src="http://isotope.metafizzy.co/isotope.pkgd.min.js"></script>
  517. <script type="text/javascript" src="http://static.tumblr.com/4ra4qv5/8N8n57y0s/infinitescroll.min.js"></script>
  518. <script type="text/javascript" src="http://imagesloaded.desandro.com/imagesloaded.pkgd.min.js"></script>
  519. <script type="text/javascript">
  520. $(document).ready(function() {
  521. //http://www.shambix.com/en/isotope-twitter-bootstrap-infinite-scroll-fluid-responsive-layout/
  522.     var $container = $('#posts');
  523.        
  524.     // Fire Isotope only when images are loaded
  525.     $container.imagesLoaded(function(){
  526.         $container.isotope({
  527.             itemSelector : '#entry',
  528.             masonry: {
  529.             }
  530.         });
  531.     });
  532.  
  533.     // Infinite Scroll
  534.     $('#posts').infinitescroll({
  535.         navSelector  : '#pagination',
  536.         nextSelector : '#pagination a',
  537.         itemSelector : '#entry',
  538.         bufferPx     : 200,
  539.         loading: {
  540.             finishedMsg: '',
  541.         }
  542.     },
  543.  
  544.     // Infinite Scroll Callback
  545.     function( newElements ) {
  546.         var $newElems = jQuery( newElements ).hide();
  547.         $newElems.imagesLoaded(function(){
  548.             $newElems.fadeIn();
  549.             $container.isotope( 'appended', $newElems );
  550.         });
  551.     });
  552.  
  553. });
  554. </script>
  555. {/block:indexpage}
  556.  
  557. </div>
  558.  
  559.  
  560.  
  561. </body>
  562. </html>
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!