tumbler scrapbook theme

Tags:

My modifications to the scrapbook theme for tumblr. Also just to be safe I have attached all the images used to the bottom of this page.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
 <title>{Title}</title>
 <!--
  Scrapbook Theme v1.2 for Tumblr (http://scrapbooktheme.tumblr.com/)
  License: http://creativecommons.org/licenses/by-sa/3.0/
 -->
 
 <!-- meta -->
 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
 <link rel="alternate" type="application/rss+xml" title="RSS" href="/rss"/>
 <style type="text/css">
  * { margin: 0; padding: 0; }
  .clear { clear: both; }
  hr, .hide { display: none; }
  
  body {
   background: #BB812C url(http://img174.imageshack.us/img174/3540/tartancz0.png);
   font: .75em "Trebuchet MS", Helvetica, sans-serif;
  }
  
  #box {
   background: white url(http://img174.imageshack.us/img174/3540/tartancz0.png);
   width: 700px;
   margin: 0 auto;
   padding: 14px 0;
  }
  
  #header {
   background: #D7391D url(http://img72.imageshack.us/img72/8273/headercq3.png) no-repeat center;
   color: white;
   font: 1.5em Georgia, Arial, sans-serif;
   height: 231px;
   overflow: hidden;
   padding: 100px 60px 0px;
  }
  
  #header h1 {
   font-size: 2em;
  }
  
  #header a {
   color: white;
  }
  
  #content {
   background: url(http://img212.imageshack.us/img212/3348/contentip3.png) repeat-y center;
   padding: 20px 40px;
   min-height: 231px;
  }
  
  #footer {
   background: url(http://img184.imageshack.us/img184/4067/footerau2.gif) no-repeat center;
   font: 1em "Segoe Script", "Lucida Handwriting", Georgia, cursive;
   height: 67px;
   padding: 10px 142px 0;
   text-transform: lowercase;
  }
  
  #footer a {
   color: black;
   text-decoration: none;
  }
  
  h1 {
   font-family: Constantia, Georgia, Arial, sans-serif;
  }
  
  h1, h2, h3, h4, ul, p {
   margin: 10px 0;
  }
  
  h2, .note {
   font-family: "Segoe Script", "Lucida Handwriting", Georgia, cursive;
  }
  
  h2 em {
   color: #aaa;
   display: block;
   font: normal 0.8em Georgia, sans-serif;
  }
  
  h2 a {
   color: black;
  }
  
  .post {
   float: left;
   padding-right: 20px;
   width: 580px;
  }
  
  .link {
   background: url(http://img168.imageshack.us/img168/8531/notetc6.png) no-repeat;
   font: 1.2em "Segoe Script", "Comic Sans MS", "Trebuchet MS", sans-serif;
   height: 123px;
   width: 229px;
   overflow: hidden;
   padding: 45px 40px 0 20px;
  }
  
  .link a {
   color: black;
   text-decoration: none;
   margin: 10px 0;
  }
  
  .link a strong {
   display: block;
   margin-bottom: 10px;
  }
  
  blockquote {
   font: 1.5em Georgia, sans-serif;
  }
  
  blockquote .quote, blockquote .quote:active {
   background: none;
   color: #ccc;
   display: block;
   float: left;
   font: 4em "Trebuchet MS", Helvetica, sans-serif;
   line-height: 29px;
   margin-top: 16px;
   margin-right: 5px;
   text-decoration: none;
  }
  
  blockquote .quote:hover, blockquote .quote:focus {
   background: none;
   color: #aaa;
  }
  
  .source {
   clear: both;
  }
  
  .photo, .video {
   margin: 0 auto;
   padding: 26px !important;
   padding: 5px;
   position: relative;
   text-align: center;
   width: 510px;
  }
  
  .photo a img {
   background: white;
   border: 1px solid #ccc;
   padding: 4px;
  }
  
  .tapetop, .tapebottom {
   background: url(http://img341.imageshack.us/img341/9425/tapelu8.png);
   display: block !important;
   display: none;
   height: 79px;
   width: 79px;
   position: absolute;
  }
  
  .tapetop {
   top: 0;
   left: 0;
  }
  
  .tapebottom {
   right: 0;
   bottom: 0;
  }
  
  .note {
   text-align: center;
   margin-top: 0;
  }
  
  .conversation {
   border: 1px solid #ccc;
   list-style: none;
   padding: 4px;
  }
  
  .conversation li {
   padding: 2px;
  }
  
  .conversation .odd {
   background: #EFEFEF url(http://img57.imageshack.us/img57/5341/conversationoddwy6.png) center;
  }
  
  p a {
   color: #BE331A;
  }
  
  p a:hover, p a:focus {
   background: #BE331A;
   color: white;
  }
  
  p a:active {
   background: #F54D2F;
   color: white;
  }
  
  #pages {
   clear: both;
  }
  
  #prevp {
   float: left;
  }
  
  #nexp {
   float: right;
  }
  ol {
   list-style-type: decimal;
   list-style-position: inside;
  } 
  ul {
   list-style-type: disc;
   list-style-position: inside;  
  }
 </style>
 <!-- /meta -->
</head>

<body>
 <div id="box">
  <div id="header">
   <img src="http://lh6.ggpht.com/BryanLockwood/SEonCw34JiI/AAAAAAAAAJY/5R_KsNAWTfM/Tanstaafl-sm.png?imgmax=512" align="right" />
   <h1><a href="/">{Title}</a></h1>
   
   {block:Description}
    <span>{Description}</span>
   {/block:Description}
   
   
  </div><!-- /header -->

  
  <div id="content">
   {block:Posts}
    <div class="post">
     {block:Regular}
      <h2>
       <em>{Month} {DayOfMonth}, {Year}:</em>
       {block:Title}
        <a href="{Permalink}" title="Permalink to '{Title}'">{Title}</a>
       {/block:Title}
      </h2>
      {Body}
     {/block:Regular}
     
     {block:Quote}
      <h2><em>{Month} {DayOfMonth}, {Year}:</em></h2>
      
      <blockquote>
       <p>
        <a href="{Permalink}" title="Permalink" class="quote">
         <span class="hide">Permalink:</span>
         &#147;
        </a>
        {Quote}
       </p>
      </blockquote>
      {block:Source}<p class="source">{Source}</p>{/block:Source}
      
      <div class="clear"></div>
     {/block:Quote}
     
     {block:Conversation}
      <h2>
       <em>{Month} {DayOfMonth}, {Year}:</em>
       {block:Title}
        <a href="{Permalink}" title="Permalink to '{Title}'">{Title}</a>
       {/block:Title}
      </h2>
      
      <ul class="conversation">
       {block:Lines}
        <li class="{Alt}">
         {block:Label}<strong>{Label}</strong>{/block:Label}
         {Line}
        </li>
       {/block:Lines}
      </ul>
     {/block:Conversation}
     
     {block:Audio}
      <h2>
       <em>{Month} {DayOfMonth}, {Year}:</em>
       {Caption}
      </h2>
      
      {AudioPlayerBlack}
     {/block:Audio}
    </div>
    
    {block:Link}
     <div class="link post">
      <a href="{URL}" title="Posted on {Month} {DayOfMonth}, {Year}" {Target}>
       <strong>{Name}</strong>
       {block:Description}{Description}{/block:Description}
      </a>
     </div>
    {/block:Link}
    
    {block:Photo}
     <div class="clear">
      <h2><em>{Month} {DayOfMonth}, {Year}:</em></h2>
      
      <div class="photo">
       <a href="{Permalink}" title="Permalink">
        <img src="{PhotoURL-500}" alt="{PhotoAlt}" />
       </a>
       
       <div class="tapetop"></div>
       <div class="tapebottom"></div>
      </div>
      
      {block:Caption}
       <p class="note">{Caption}</p>
      {/block:Caption}
     </div>
    {/block:Photo}
    
    {block:Video}
     <div class="clear">
      <h2>
       <em>{Month} {DayOfMonth}, {Year}:</em>
       {block:Caption}{Caption}{/block:Caption}
      </h2>
      
      <div class="video">
       {Video-500}
       
       <div class="tapetop"></div>
       <div class="tapebottom"></div>
      </div>
     </div>
    {/block:Video}
   {/block:Posts}
   
   <p id="pages">
    {block:PreviousPage}
     <a href="{PreviousPage}" id="prevp">&larr; Newer</a>
    {/block:PreviousPage}
    
    {block:NextPage}
     <a href="{NextPage}" id="nexp">Older &rarr;</a>
    {/block:NextPage}
   </p>
   
   <div class="clear"></div>
  </div>
  
  <div id="footer">
   <a href="/rss" title="Subscribe via RSS">RSS</a>
   | <a href="/archive" title="Browse the archive">Archive</a>
   | <a href="http://tumblr.com/" title="Proudly powered by tumblr">Tumblr</a>
   | <a href="http://tools.assembla.com/quuxutils" title="tools">tools</a>
   | <a href="http://quux.wiki.zoho.com" title="wiki">wiki</a>
   | <a href="http://adminfoo.net" title="blog">blog</a><br/>
     <a href="http://scrapbooktheme.tumblr.com">scrapbook theme</a>

  </div>
 </div><!-- /box -->
</body>

</html>

0 Comments