Print CSS enhancements for TiddlyWiki

StyleSheet.css

/* Blockquote margins are too fat */
.viewer blockquote { margin-left: 1em; }
.viewer blockquote blockquote { margin-left: 0.5ex; }

/* I think in-tiddler bordered elements (tables and pre blocks) 
 * should line up */
.viewer table, .viewer table.twtable { margin-left: 0.5em; }

/* Bullet my checklists with the checkboxes so they look nicer both
 * on screen and in print */
.checkList ul li { list-style-type: none; }
.checkList ul li input[type='checkbox']:first-child { 
  margin-left: -1.5em; 
  vertical-align: bottom;
}

/* Tidy things up for clean printing */
@media print {
  /* Sans-Serif for screen, but Serif for print */
  body { font-family: "Georgia", Times New Roman, Serif; }

  /* Get rid of stuff that just wastes space */
  #contentWrapper .header, #displayAreaHeader, #searchResults,
  #tiddlerDisplay .tiddler .subtitle,
  div.dp-highlighter div.bar { 
    display: none !important; 
  }
  div.dp-highlighter ol.dp-css { margin-left: 1.5ex !important; }

  /* Adjust things that might waste ink or have poor contrast */  
  .title, h1, h2, h3, h4, h5, th, code { color: black !important; }  
  th { background: none repeat scroll 0 0 #fff !important; }  
  .viewer a.button { border: 1px solid #777; }  
  .viewer pre {   
    background: none repeat scroll 0 0 #F7F7F7;   
    border: 1px solid #AAAAAA;  
  }  

  /* Make tiddler titles stand out more */
  .title { 
    padding-left: 0.5ex;
    border-left: 1pt solid #ccc;
    border-bottom: 1pt solid #ccc; 
  }

  /* Hide tag-related floats as they're almost always irrelevant to
   * print copies */
  .tagging, .tagged { display: none !important; }

  /* Mark up highlighted regions in dotted borders as a surrogate for
   * background colors */
  .marked { 
    border: 1px dotted black; 
    padding-left: 0.3ex;
    padding-right:0.3ex;
  }
  
  /* Also set a "highlighter marker yellow" background on highlighted 
   * text if the browser allows background colors OR images. */  
  .marked { background: url(data:image/gif;base64,R0lGODdhAQABAIABAP//Rf///ywAAAAAAQABAAACAkQBADs=) repeat scroll 0 0 #ffff45; }

  /* Force Firefox and Chrome to render checkboxes properly and at 
   * the same scale as fonts */
  input[type="checkbox"] {
    vertical-align: bottom !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    outline: 1px solid black !important;
    width: 0.7em;
    height: 0.7em;
  }
  input[type="checkbox"]:checked{
    border: 0.4em solid black;
  }

  /* Display URLs for links in the print version */
  /* DISABLED: More bother than it's worth, given how I use external links
  a.externalLink:after { content: " (" attr(href) ") "; }
  */

  /* Page break before each tiddler like chapters in a book */
  #tiddlerDisplay .tiddler { page-break-after: always; }
}

/* TODO:
- Look into whether there are any tricks for typesetting outline 
  lists nicely that I'm not yet doing here.
- Try to find ways to make a list with many external links not look
  so chaotic.

Notes:
- Add header extras by modifying PageTemplate to also draw from a 
  tiddler like my SiteSubtitleExtra so that you keep cruft out of 
  the ones that'll reach your print header via <title>. 
  (SiteTitle and SiteSubtitle)
*/