timeline_setter 0.1.0

data/.document

@@ -0,0 +1,4 @@
+README
+lib/**/*.rb
+bin/*
+LICENSE

data/LICENSE.txt

@@ -0,0 +1,18 @@
+Copyright © 2011 ProPublica
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the “Software”), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
+of the Software, and to permit persons to whom the Software is furnished to
+do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README

@@ -0,0 +1,15 @@
+=
+  '
+    _______                ___           _____      __  __           
+   /_  __(_)___ ___  ___  / (_)___  ___ / ___/___  / /_/ /____  _____
+    / / / / __ `__ \/ _ \/ / / __ \/ _ \\__ \/ _ \/ __/ __/ _ \/ ___/
+   / / / / / / / / /  __/ / / / / /  __/__/ /  __/ /_/ /_/  __/ /    
+  /_/ /_/_/ /_/ /_/\___/_/_/_/ /_/\___/____/\___/\__/\__/\___/_/    
+                                                                 
+  TimelineSetter is a tool to create HTML timelines from spreadsheets of events.
+  
+  For usage and installation instructions, see:
+  http://propublica.github.com/timeline-setter/
+  
+  To report a bug or suggest a feature:
+  http://github.com/propublica/timeline-setter/issues

data/Rakefile

@@ -0,0 +1,98 @@
+require 'rubygems'
+require 'rake'
+require 'rake/clean'
+require 'rake/rdoctask'
+require 'rspec/core/rake_task'
+require './lib/timeline_setter'
+
+
+desc "build docs"
+task :docs do 
+  require 'rdiscount'
+  require 'erb'
+  version = TimelineSetter::VERSION
+  license = File.open('LICENSE.txt','r').read
+  mdown   = RDiscount.new(ERB.new(File.open('doc/doc.markdown','r').read).result(binding), :smart).to_html
+  wrapper = File.open('doc/doc_wrapper.erb','r').read
+  mdown   = File.open('index.html','w+') do |f|
+    f.write ERB.new(wrapper).result(binding)
+  end
+end
+
+desc "generate gh-pages"
+task :gh_pages do
+  `rake docs`
+  `rake yard`
+  `rake docco`
+  `rake sample`
+  
+  `git branch` =~ /^\* (.+)?\n/
+  current_branch = $1
+  
+  `git commit -am "docs"`
+  `git push github #{current_branch}`
+  `git checkout gh-pages`
+  `git merge #{current_branch}`
+  `git push github gh-pages`
+  `git checkout #{current_branch}`
+end
+
+desc "generate docco"
+task :docco do
+  `docco ./public/javascripts/*.js`
+  `cp -R ./docs/* ./doc`
+  `rm -R docs`
+end
+
+begin
+  require 'jeweler'
+  Jeweler::Tasks.new do |gem|
+    gem.name          = "timeline_setter"
+    gem.summary       = %Q{TimelineSetter is a tool to create HTML timelines from spreadsheets of events.}
+    gem.description   = %Q{TimelineSetter is a tool to create HTML timelines from spreadsheets of events.}
+    gem.email         = "almshaw@gmail.com"
+    gem.homepage      = "http://github.com/propublica/timeline-setter"
+    gem.authors       = ["Al Shaw", "Jeff Larson"]
+    gem.executables   = "timeline-setter"
+    gem.require_paths = ['lib']
+    gem.add_dependency "json"
+    gem.add_dependency "table_fu"
+    gem.add_dependency "kompress", ">= 0.0.2"
+    gem.add_dependency "closure-compiler"
+    gem.add_development_dependency "rspec", ">= 2.0.0"
+    gem.version = TimelineSetter::VERSION
+  end
+  Jeweler::GemcutterTasks.new
+rescue LoadError
+  puts "Jeweler (or a dependency) not available. Install it with: gem install jeweler"
+end
+
+Rake::RDocTask.new do |rdoc|
+  version = File.exist?('VERSION') ? File.read('VERSION') : ""
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title = "TimelineSetter #{version}"
+  rdoc.rdoc_files.include('README*')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+# run tests with `rake spec`
+RSpec::Core::RakeTask.new(:spec) do |spec|
+  spec.pattern = 'spec/*_spec.rb'
+  spec.rspec_opts = ['--color', '--format nested']
+end
+
+desc "generate yard docs"
+task :yard do
+  `yard -o ./documentation`
+end
+
+desc "generate sample timeline"
+task :sample do
+  # noop this for now.
+  
+  # `./bin/timeline-setter -c ./tbi.csv -m -o ./public/`
+  # `cp ./public/timeline.html ./doc/timeline-sample.html`
+end
+
+
+

data/bin/timeline-setter

@@ -0,0 +1,9 @@
+#!/usr/bin/env ruby
+
+# $ ./bin/timeline-setter -c ./test.csv -o ./public/ -O
+
+require 'rubygems'
+require File.expand_path("../../lib/timeline_setter.rb", __FILE__)
+require File.expand_path("../../lib/timeline_setter/cli.rb", __FILE__)
+
+TimelineSetter::CLI.new

data/doc/doc.markdown

@@ -0,0 +1,253 @@
+# TimelineSetter <%= version %>
+
+TimelineSetter creates beautiful timelines.
+
+It is a command-line utility that takes a [specially-structured CSV file](#csv)
+as input and outputs standards-compliant HTML/CSS/JavaScript. It supports any
+span of time from minutes to years, and supports multiple parallel event
+series in a single timeline. It can handle custom descriptions and even
+arbitrary HTML in each event "card." It creates fluid embeds that will look
+great at any width.
+
+TimelineSetter "bakes out" timelines, ready for uploading directly into your
+CMS, Amazon S3, or however you typically serve static files. It requires no
+server-side processing at all once you've generated a timeline.
+
+TimelineSetter [source on Github](https://github.com/propublica/timeline-setter/).
+
+<a id="samples"></a>
+## Assorted Docs and Samples
+
+* TimelineSetter Ruby source [documentation](documentation/index.html)
+* timeline-setter.js [annotated source](doc/timeline-setter.html)
+* A [TimelineSetter demo](doc/twitter-demo.html) using Twitter data
+
+<a id="innards"></a>
+## How it Works
+
+The project is broken into two parts: a Ruby package (along with a binary) for
+generating the assets, and the HTML, CSS and JavaScript for the timeline
+itself. TimelineSetter will create a unique HTML page that embeds a JSON
+object with your data. The CSS and JavaScript are identical for every timeline
+created, so you can host those centrally and simply point to them when you
+deploy a timeline, or (with the minified option) you can package them up with your HTML 
+and paste it into your CMS all at once. You can [customize the CSS](#styling) to match the look
+and feel of your site.
+
+<a id="deps"></a>
+## Dependencies
+
+TimelineSetter relies on [TableFu](http://propublica.github.com/table-fu/), as
+well as the JavaScript libraries
+[Underscore](http://documentcloud.github.com/underscore/) and
+[jQuery](http://jquery.com/). All of these are either installed along with
+TableSetter, or packaged with the source. It has been tested with jQuery 1.5.1 
+and Underscore 1.1.5.
+
+<a id="install"></a>
+## Installation
+
+Install TimelineSetter through RubyGems on Unix-like OSes:
+
+    gem install timeline_setter
+    
+(Note: We haven't tested using the TimelineSetter tools on Windows even once,
+though the timelines themselves have been tested in modern browsers on
+Windows, Mac and Linux.)
+
+<a id="commandline"></a>
+## The \`timeline-setter\` command
+
+After TimelineSetter is installed, the `timeline-setter` command should be
+available in your shell. The command looks for a CSV file to parse and outputs
+static assets. At any point, you can find help by running `timeline-setter`
+without any arguments, or by adding the `-h` flag. Run the command like so:
+
+    timeline-setter -c /path/to/data.csv -o /path/to/output/directory
+
+Running `timeline-setter` with no `-o` option will generate the timeline (and 
+supporting assets if applicable) within the current directory.
+
+Full list of options:
+
+* `-c CSV` Path to your CSV file.
+* `-o OUTPUT_PATH` Path to output timeline and assets. If absent, timeline will be created in current directory.
+* `-a` Add the default supporting assets to the output directory, along with the timeline itself.
+* `-m` Create a minified one-page version of your timeline with all supporting assets inline.
+* `-O` Open a browser to your new timeline after it is generated (currently Mac OS only).
+* `-h` Print help to standard output.
+
+<a id="csv"></a>
+## Setting Up Your CSV File
+
+TimelineSetter looks for certain column names in your CSV file in order to
+generate a timeline. All columns are required, though as you'll see, some of
+them can be left blank. Here's a summary of each column and its significance:
+
+<a id="date-csv"></a>
+### date
+
+The date the event happened. Right now, TimelineSetter only supports
+single-date events, but this can be specific down to the second. The generator
+will try its best to parse out human dates. Try "March 20, 2010," "3/20/2010,"
+"Mar. 20, 2010 11:59 PM" etc.
+
+<a id="display-date-csv"></a>
+### display\_date
+
+The date *displayed* on the event's card in the timeline. If this is blank, it
+will fall back to `date`
+
+<a id="desc-csv"></a>
+### description
+
+A description of the event.
+
+<a id="link-csv"></a>
+### link
+
+A URL to send users to more details about an event. This will generate a "read
+more" button at the bottom of the card pointing to the URL.
+
+<a id="series-csv"></a>
+### series
+
+A string representing the name of the series of events this particular event
+is a part of. TimelineSetter will find all the unique series among events in
+the spreadsheet and assign both colors and checkboxes for them at the top of
+the spreadsheet. Events not assigned to a series will be part of the "default"
+series, which have their timeline notches colored charcoal, and have no
+associated checkbox. **Note:** As a corollary, if you only have one series, it is
+best not to assign a name.
+
+<a id="html-csv"></a>
+### html
+
+Any arbitrary HTML that will be inserted above `description`. This
+field may contain image tags, YouTube tags, etc. -- nearly everything except
+`<script>` tags. If you choose to use JavaScript, you must do it inside an
+iframe and call that iframe inside this field.
+
+<a id="deployment"></a>
+## Folder structure and deployment
+
+After you've generated a timeline with the `timeline-setter` command, you
+should see a structure much like this where you've specified your output:
+
+      |-output
+      |---timeline.html
+      |---javascripts
+      |-----timeline-setter.js
+      |-----vendor
+      |-------underscore-min.js
+      |-------jquery-min.js      
+      |---stylesheets
+      |-----timeline-setter.css
+      
+Dropping the whole folder onto your server or an asset host like S3 will allow
+the app to run self-contained. It requires no server-side processing at all.
+To drop into your CMS, simply copy the relevant bits of `timeline.html` and
+paste into your site's template. Then, adjust the `<link>` and `<script>` tags
+to point to their appropriate destinations.
+
+<a id="defn"></a>
+## Definitions
+
+The timeline is made up of non-clickable *interval notches* used to denote
+periods of time, and *event notches*, which, when clicked, reveal their
+associated *event cards*.
+
+<a name="styling"></a>
+## Styling Your Timeline
+
+TimelineSetter timelines are fully style-able. The default "ProPublica theme"
+stylesheet is packaged alongside each generated asset bundle, and is available
+in `stylesheets/timeline-setter.css`. You can alter this stylesheet, or
+replace it completely. Here's a guide to do that.
+
+<a id="styling-container"></a>
+### Overview and Styling the Container and Top Matter
+
+All TimelineSetter CSS is scoped within a namespace starting with `TS.` The
+outermost container is `#timeline_setter.`
+
+Upon first glance, it may not seem like there is much markup at all. That's
+because we make extensive use of JavaScript (ERB-style) templating via
+[Underscore.js](http://documentcloud.github.com/underscore/#template) -- so
+templates for each part of the timeline reside in the DOM. The controls (zoom
+in/out, previous/next buttons) are available within `#TS-top_matter_container .TS-controls`.
+
+Series checkboxes are injected into `.TS-series_nav_container` and templated
+via `script#TS-notch_tmpl`. Currently, series colors are hard coded in the
+JavaScript. We support a maximum of nine series colors (assigned in this order:
+``#065718, #EDC047, #91ADD1, #929E5E, #9E5E23, #C44846, #065718, #EDD4A5, #CECECE``,
+they can be overridden in the "color priority" section of `timeline-setter.css`). Technically
+you can create an unlimited number of series, but they will eventually fall back
+to the default charcoal notch color.
+
+<a id="styling-bar"></a>
+### Styling the bar, notches and cards
+
+Interval notches are templated within `script#TS-year_notch_tmpl`. Their
+position is based on the interval of time between events as automatically
+determined by the JavaScript. Here's a sampling of what you might see in
+interval notches:
+
+    year        => 2001
+    month       => June, 2004
+    day         => May 1, 2005
+    hour/minute => 11:59
+    second      => 11:59:22
+
+Event notches are templated through `#TS-card-tmpl` and contain individual
+classes corresponding to spreadsheet columns. `.TS-item-label` corresponds to
+`description`, `.TS-item_html` corresponds to `html`,
+`.TS-read_btn` is linked to `link` and `.TS-item_year` corresponds to
+`display_date` falling through to `date`. Finally, `TS-permalink`
+is a fragment link which will show the active card on page load if used.
+
+<a id="roadmap"></a>
+## Roadmap
+
+On the client side, there are a number of features we plan to add, including:
+
+* Smoother zooming
+* Deactivating series checkboxes if none of its events are within the zoomed viewport
+* Auto-zooming the timeline if embedded into smaller containers
+* More iOS gestures such as "pinching"
+* Zooming to fit a series when the series is activated
+* Ranges of events (e.g. Elizabeth Taylor was married to Michael Wilding between
+  Feb. 21, 1952 and Jan. 26, 1957, as shown 
+  [here](http://www.nytimes.com/interactive/2011/03/23/movies/20110323-ELIZABETH-TAYLOR-TIMELINE.html))
+* Embed code
+* JavaScript tests
+
+<a id="links"></a>
+## Links
+
+* In the Wild: [ProPublica: How One Blast Affected Five Soldiers](http://www.propublica.org/special/tbi-psycho-platoon-timeline)
+
+<a id="credits"></a>
+## Credits
+
+[Al Shaw](http://twitter.com/a_l), [Jeff Larson](http://github.com/thejefflarson), ProPublica
+
+<a id="contact"></a>
+## Contact
+
+For issues with TimelineSetter, use the 
+[Issue Tracker](https://github.com/propublica/timeline-setter/issues). General 
+questions should go to <a href="mailto:opensource@propublica.org">opensource@propublica.org</a>.
+
+<a id="changelog"></a>
+## Change Log
+
+<a id="release-001"></a>
+### 0.1.0
+
+Initial release
+
+<a id="license"></a>
+## License 
+
+<%= license %>

data/doc/doc_wrapper.erb

@@ -0,0 +1,87 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
+    <link href="http://cloud.webtype.com/css/50942e7d-aebe-4c83-9824-ead7e49ec5af.css" rel="stylesheet" type="text/css" />
+    <style>
+    html {
+      background: #f7f7f7;
+    }
+    body {
+      font-family: Georgia, serif;
+      font-size: 16px;
+      line-height:24px;
+      width: 600px;
+      margin-left:auto;
+      margin-right:auto;
+      margin-top:10px;
+      background: #fff;
+      padding:10px 10px;
+      color:#444;
+      border-top:1px solid #cecece;
+      border-bottom:1px solid #cecece;
+    }
+    h1,h2,h3,h4,h5 {
+      font-family: 'Helvetica Neue', Arial, sans-serif;
+      color:#444;
+    }
+    h1 {
+      padding-top:0;
+      margin-top:0;
+    }
+    h2,h3 {
+    }
+    a.propublica{
+      position:absolute;
+      background: transparent url(http://propublica.github.com/table-fu/documentation/images/proplogo.png) no-repeat -40px -20px;
+      top: 0;
+      left: 0;
+      width: 160px;
+      height: 141px;
+    }
+
+    pre,code {
+      font-family: Monaco, Courier, monospace;
+      font-size:12px;
+    }
+    pre {
+      line-height: 16px;
+      padding:0.5em 1em;
+      overflow: auto;
+      border-left: 1px solid #cecece;
+      margin-left: 0;
+      background:#f7f7f7;
+    }
+    code {
+      padding: 2px;
+      background-color: #f7f7f7;
+    }
+    pre > code {
+      padding:0;
+    }
+    a {
+      color: #4369AF;
+      text-decoration: none;
+      font-weight: bold;
+    }
+    a:hover {
+      text-decoration:underline;
+    }
+    ul {
+      margin:0 1em;
+      padding:0;
+      list-style: disc;
+    }
+    li {
+      margin:0;
+      padding:0;
+    }
+
+    </style>
+    <title>TimelineSetter</title>
+  </head>
+  <body>
+    <a href="http://www.propublica.org" class="propublica">&nbsp;</a>
+    <%= mdown %>
+  </body>
+</html>

data/doc/docco.css

@@ -0,0 +1,186 @@
+/*--------------------- Layout and Typography ----------------------------*/
+body {
+  font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, FreeSerif, serif;
+  font-size: 15px;
+  line-height: 22px;
+  color: #252519;
+  margin: 0; padding: 0;
+}
+a {
+  color: #261a3b;
+}
+  a:visited {
+    color: #261a3b;
+  }
+p {
+  margin: 0 0 15px 0;
+}
+h1, h2, h3, h4, h5, h6 {
+  margin: 0px 0 15px 0;
+}
+  h1 {
+    margin-top: 40px;
+  }
+#container {
+  position: relative;
+}
+#background {
+  position: fixed;
+  top: 0; left: 525px; right: 0; bottom: 0;
+  background: #f5f5ff;
+  border-left: 1px solid #e5e5ee;
+  z-index: -1;
+}
+#jump_to, #jump_page {
+  background: white;
+  -webkit-box-shadow: 0 0 25px #777; -moz-box-shadow: 0 0 25px #777;
+  -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px;
+  font: 10px Arial;
+  text-transform: uppercase;
+  cursor: pointer;
+  text-align: right;
+}
+#jump_to, #jump_wrapper {
+  position: fixed;
+  right: 0; top: 0;
+  padding: 5px 10px;
+}
+  #jump_wrapper {
+    padding: 0;
+    display: none;
+  }
+    #jump_to:hover #jump_wrapper {
+      display: block;
+    }
+    #jump_page {
+      padding: 5px 0 3px;
+      margin: 0 0 25px 25px;
+    }
+      #jump_page .source {
+        display: block;
+        padding: 5px 10px;
+        text-decoration: none;
+        border-top: 1px solid #eee;
+      }
+        #jump_page .source:hover {
+          background: #f5f5ff;
+        }
+        #jump_page .source:first-child {
+        }
+table td {
+  border: 0;
+  outline: 0;
+}
+  td.docs, th.docs {
+    max-width: 450px;
+    min-width: 450px;
+    min-height: 5px;
+    padding: 10px 25px 1px 50px;
+    overflow-x: hidden;
+    vertical-align: top;
+    text-align: left;
+  }
+    .docs pre {
+      margin: 15px 0 15px;
+      padding-left: 15px;
+    }
+    .docs p tt, .docs p code {
+      background: #f8f8ff;
+      border: 1px solid #dedede;
+      font-size: 12px;
+      padding: 0 0.2em;
+    }
+    .pilwrap {
+      position: relative;
+    }
+      .pilcrow {
+        font: 12px Arial;
+        text-decoration: none;
+        color: #454545;
+        position: absolute;
+        top: 3px; left: -20px;
+        padding: 1px 2px;
+        opacity: 0;
+        -webkit-transition: opacity 0.2s linear;
+      }
+        td.docs:hover .pilcrow {
+          opacity: 1;
+        }
+  td.code, th.code {
+    padding: 14px 15px 16px 25px;
+    width: 100%;
+    vertical-align: top;
+    background: #f5f5ff;
+    border-left: 1px solid #e5e5ee;
+  }
+    pre, tt, code {
+      font-size: 12px; line-height: 18px;
+      font-family: Monaco, Consolas, "Lucida Console", monospace;
+      margin: 0; padding: 0;
+    }
+
+
+/*---------------------- Syntax Highlighting -----------------------------*/
+td.linenos { background-color: #f0f0f0; padding-right: 10px; }
+span.lineno { background-color: #f0f0f0; padding: 0 5px 0 5px; }
+body .hll { background-color: #ffffcc }
+body .c { color: #408080; font-style: italic }  /* Comment */
+body .err { border: 1px solid #FF0000 }         /* Error */
+body .k { color: #954121 }                      /* Keyword */
+body .o { color: #666666 }                      /* Operator */
+body .cm { color: #408080; font-style: italic } /* Comment.Multiline */
+body .cp { color: #BC7A00 }                     /* Comment.Preproc */
+body .c1 { color: #408080; font-style: italic } /* Comment.Single */
+body .cs { color: #408080; font-style: italic } /* Comment.Special */
+body .gd { color: #A00000 }                     /* Generic.Deleted */
+body .ge { font-style: italic }                 /* Generic.Emph */
+body .gr { color: #FF0000 }                     /* Generic.Error */
+body .gh { color: #000080; font-weight: bold }  /* Generic.Heading */
+body .gi { color: #00A000 }                     /* Generic.Inserted */
+body .go { color: #808080 }                     /* Generic.Output */
+body .gp { color: #000080; font-weight: bold }  /* Generic.Prompt */
+body .gs { font-weight: bold }                  /* Generic.Strong */
+body .gu { color: #800080; font-weight: bold }  /* Generic.Subheading */
+body .gt { color: #0040D0 }                     /* Generic.Traceback */
+body .kc { color: #954121 }                     /* Keyword.Constant */
+body .kd { color: #954121; font-weight: bold }  /* Keyword.Declaration */
+body .kn { color: #954121; font-weight: bold }  /* Keyword.Namespace */
+body .kp { color: #954121 }                     /* Keyword.Pseudo */
+body .kr { color: #954121; font-weight: bold }  /* Keyword.Reserved */
+body .kt { color: #B00040 }                     /* Keyword.Type */
+body .m { color: #666666 }                      /* Literal.Number */
+body .s { color: #219161 }                      /* Literal.String */
+body .na { color: #7D9029 }                     /* Name.Attribute */
+body .nb { color: #954121 }                     /* Name.Builtin */
+body .nc { color: #0000FF; font-weight: bold }  /* Name.Class */
+body .no { color: #880000 }                     /* Name.Constant */
+body .nd { color: #AA22FF }                     /* Name.Decorator */
+body .ni { color: #999999; font-weight: bold }  /* Name.Entity */
+body .ne { color: #D2413A; font-weight: bold }  /* Name.Exception */
+body .nf { color: #0000FF }                     /* Name.Function */
+body .nl { color: #A0A000 }                     /* Name.Label */
+body .nn { color: #0000FF; font-weight: bold }  /* Name.Namespace */
+body .nt { color: #954121; font-weight: bold }  /* Name.Tag */
+body .nv { color: #19469D }                     /* Name.Variable */
+body .ow { color: #AA22FF; font-weight: bold }  /* Operator.Word */
+body .w { color: #bbbbbb }                      /* Text.Whitespace */
+body .mf { color: #666666 }                     /* Literal.Number.Float */
+body .mh { color: #666666 }                     /* Literal.Number.Hex */
+body .mi { color: #666666 }                     /* Literal.Number.Integer */
+body .mo { color: #666666 }                     /* Literal.Number.Oct */
+body .sb { color: #219161 }                     /* Literal.String.Backtick */
+body .sc { color: #219161 }                     /* Literal.String.Char */
+body .sd { color: #219161; font-style: italic } /* Literal.String.Doc */
+body .s2 { color: #219161 }                     /* Literal.String.Double */
+body .se { color: #BB6622; font-weight: bold }  /* Literal.String.Escape */
+body .sh { color: #219161 }                     /* Literal.String.Heredoc */
+body .si { color: #BB6688; font-weight: bold }  /* Literal.String.Interpol */
+body .sx { color: #954121 }                     /* Literal.String.Other */
+body .sr { color: #BB6688 }                     /* Literal.String.Regex */
+body .s1 { color: #219161 }                     /* Literal.String.Single */
+body .ss { color: #19469D }                     /* Literal.String.Symbol */
+body .bp { color: #954121 }                     /* Name.Builtin.Pseudo */
+body .vc { color: #19469D }                     /* Name.Variable.Class */
+body .vg { color: #19469D }                     /* Name.Variable.Global */
+body .vi { color: #19469D }                     /* Name.Variable.Instance */
+body .il { color: #666666 }                     /* Literal.Number.Integer.Long */