showoffer 0.0.1

data/lib/showoff/version.rb

@@ -0,0 +1,3 @@
+# No namespace here since ShowOff is a class and I'd have to inherit from
+# Sinatra::Application (which we don't want to load here)
+SHOWOFF_VERSION = '0.0.1'

data/lib/showoff_utils.rb

@@ -0,0 +1,360 @@
+class ShowOffUtils
+  def self.presentation_config_file
+    @presentation_config_file ||= 'showoff.json'
+  end
+
+  def self.presentation_config_file=(filename)
+    @presentation_config_file = filename
+  end
+
+  def self.create(dirname,create_samples,dir='one')
+    Dir.mkdir(dirname) if !File.exists?(dirname)
+    Dir.chdir(dirname) do
+      if create_samples
+        # create section
+        Dir.mkdir(dir)
+
+        # create markdown file
+        File.open("#{dir}/01_slide.md", 'w+') do |f|
+          f.puts make_slide("My Presentation")
+          f.puts make_slide("Bullet Points","bullets incremental",["first point","second point","third point"])
+        end
+      end
+
+      # create showoff.json
+      File.open(ShowOffUtils.presentation_config_file, 'w+') do |f|
+        f.puts "{ \"name\": \"My Preso\", \"sections\": [ {\"section\":\"#{dir}\"} ]}"
+      end
+    end
+  end
+
+  HEROKU_GEMS_FILE = '.gems'
+  HEROKU_BUNDLER_GEMS_FILE = 'Gemfile'
+  HEROKU_CONFIG_FILE = 'config.ru'
+
+	# Setup presentation to run on Heroku
+  #
+  # name         - String containing heroku name
+  # force        - boolean if .gems/Gemfile and config.ru should be overwritten if they don't exist
+  # password     - String containing password to protect your heroku site; nil means no password protection
+  # use_dot_gems - boolean that, if true, indicates we should use the old, deprecated .gems file instead of Bundler
+  def self.heroku(name, force = false, password = nil, use_dot_gems = false)
+    modified_something = false
+
+    if use_dot_gems
+      modified_something = create_gems_file(HEROKU_GEMS_FILE,
+                                            !password.nil?,
+                                            force,
+                                            lambda{ |gem| gem })
+    else
+      modified_something = create_gems_file(HEROKU_BUNDLER_GEMS_FILE,
+                                            !password.nil?,
+                                            force,
+                                            lambda{ |gem| "gem '#{gem}'" },
+                                            lambda{ "source :rubygems" })
+    end
+
+    create_file_if_needed(HEROKU_CONFIG_FILE,force) do |file|
+      modified_something = true
+      file.puts 'require "showoff"'
+      if password.nil?
+        file.puts 'run ShowOff.new'
+      else
+        file.puts 'require "rack"'
+        file.puts 'showoff_app = ShowOff.new'
+        file.puts 'protected_showoff = Rack::Auth::Basic.new(showoff_app) do |username, password|'
+        file.puts	"\tpassword == '#{password}'"
+        file.puts 'end'
+        file.puts 'run protected_showoff'
+      end
+    end
+
+    modified_something
+  end
+
+  # generate a static version of the site into the gh-pages branch
+  def self.github
+    ShowOff.do_static(nil)
+    `git add static`
+    sha = `git write-tree`.chomp
+    tree_sha = `git rev-parse #{sha}:static`.chomp
+    `git read-tree HEAD`  # reset staging to last-commit
+    ghp_sha = `git rev-parse gh-pages 2>/dev/null`.chomp
+    extra = ghp_sha != 'gh-pages' ? "-p #{ghp_sha}" : ''
+    commit_sha = `echo 'static presentation' | git commit-tree #{tree_sha} #{extra}`.chomp
+    `git update-ref refs/heads/gh-pages #{commit_sha}`
+  end
+
+  # Makes a slide as a string.
+  # [title] title of the slide
+  # [classes] any "classes" to include, such as 'smaller', 'transition', etc.
+  # [content] slide content.  Currently, if this is an array, it will make a bullet list.  Otherwise
+  #           the string value of this will be put in the slide as-is
+  def self.make_slide(title,classes="",content=nil)
+    slide = "!SLIDE #{classes}\n"
+    slide << "# #{title} #\n"
+    slide << "\n"
+    if content
+      if content.kind_of? Array
+        content.each { |x| slide << "* #{x.to_s}\n" }
+      else
+        slide << content.to_s
+      end
+    end
+    slide
+  end
+
+  TYPES = {
+    :default => lambda { |t,size,source,type| make_slide(t,"#{size} #{type}",source) },
+    'title' => lambda { |t,size,dontcare| make_slide(t,size) },
+    'bullets' => lambda { |t,size,dontcare| make_slide(t,"#{size} bullets incremental",["bullets","go","here"])},
+    'smbullets' => lambda { |t,size,dontcare| make_slide(t,"#{size} smbullets incremental",["bullets","go","here","and","here"])},
+    'code' => lambda { |t,size,src| make_slide(t,size,blank?(src) ? "    @@@ Ruby\n    code_here()" : src) },
+    'commandline' => lambda { |t,size,dontcare| make_slide(t,"#{size} commandline","    $ command here\n    output here")},
+    'full-page' => lambda { |t,size,dontcare| make_slide(t,"#{size} full-page","![Image Description](image/ref.png)")},
+  }
+
+
+  # Adds a new slide to a given dir, giving it a number such that it falls after all slides
+  # in that dir.
+  # Options are:
+  # [:dir] - dir where we put the slide (if omitted, slide is output to $stdout)
+  # [:name] - name of the file, without the number prefix. (if omitted, a default is used)
+  # [:title] - title in the slide.  If not specified the source file name is
+  #            used.  If THAT is not specified, uses the value of +:name+.  If THAT is not
+  #            specified, a suitable default is used
+  # [:code] - path to a source file to use as content (force :type to be 'code')
+  # [:number] - true if numbering should be done, false if not
+  # [:type] - the type of slide to create
+  def self.add_slide(options)
+
+    add_new_dir(options[:dir]) if options[:dir] && !File.exists?(options[:dir])
+
+    options[:type] = 'code' if options[:code]
+
+    title = determine_title(options[:title],options[:name],options[:code])
+
+    options[:name] = 'new_slide' if !options[:name]
+
+    size,source = determine_size_and_source(options[:code])
+    type = options[:type] || :default
+    slide = TYPES[type].call(title,size,source)
+
+    if options[:dir]
+      filename = determine_filename(options[:dir],options[:name],options[:number])
+      write_file(filename,slide)
+    else
+      puts slide
+      puts
+    end
+
+  end
+
+  # Adds the given directory to this presentation, appending it to
+  # the end of showoff.json as well
+  def self.add_new_dir(dir)
+    puts "Creating #{dir}..."
+    Dir.mkdir dir
+
+    showoff_json = JSON.parse(File.read(ShowOffUtils.presentation_config_file))
+    showoff_json["section"] = dir
+    File.open(ShowOffUtils.presentation_config_file,'w') do |file|
+      file.puts JSON.generate(showoff_json)
+    end
+    puts "#{ShowOffUtils.presentation_config_file} updated"
+  end
+
+  def self.blank?(string)
+    string.nil? || string.strip.length == 0
+  end
+
+  def self.determine_size_and_source(code)
+    size = ""
+    source = ""
+    if code
+      source,lines,width = read_code(code)
+      size = adjust_size(lines,width)
+    end
+    [size,source]
+  end
+
+  def self.write_file(filename,slide)
+    File.open(filename,'w') do |file|
+      file.puts slide
+    end
+    puts "Wrote #{filename}"
+  end
+
+  def self.determine_filename(slide_dir,slide_name,number)
+    filename = "#{slide_dir}/#{slide_name}.md"
+    if number
+      max = find_next_number(slide_dir)
+      filename = "#{slide_dir}/#{max}_#{slide_name}.md"
+    end
+    filename
+  end
+
+  # Finds the next number in the given dir to
+  # name a slide as the last slide in the dir.
+  def self.find_next_number(slide_dir)
+    max = 0
+    Dir.open(slide_dir).each do |file|
+      if file =~ /(\d+).*\.md/
+        num = $1.to_i
+        max = num if num > max
+      end
+    end
+    max += 1
+    max = "0#{max}" if max < 10
+    max
+  end
+
+  def self.determine_title(title,slide_name,code)
+    if blank?(title)
+      title = slide_name
+      title = File.basename(code) if code
+    end
+    title = "Title here" if blank?(title)
+    title
+  end
+
+  # Determines a more optimal value for the size (e.g. small vs. smaller)
+  # based upon the size of the code being formatted.
+  def self.adjust_size(lines,width)
+    size = ""
+    # These values determined empircally
+    size = "small" if width > 50
+    size = "small" if lines > 15
+    size = "smaller" if width > 57
+    size = "smaller" if lines > 19
+    puts "warning, some lines are too long and the code may be cut off" if width > 65
+    puts "warning, your code is too long and the code may be cut off" if lines > 23
+    size
+  end
+
+  # Reads the code from the source file, returning
+  # the code, indented for markdown, as well as the number of lines
+  # and the width of the largest line
+  def self.read_code(source_file)
+    code = "    @@@ #{lang(source_file)}\n"
+    lines = 0
+    width = 0
+    File.open(source_file) do |code_file|
+      code_file.readlines.each do |line|
+        code += "    #{line}"
+        lines += 1
+        width = line.length if line.length > width
+      end
+    end
+    [code,lines,width]
+  end
+
+  def self.showoff_sections(dir,logger)
+    index = File.join(dir, ShowOffUtils.presentation_config_file)
+    sections = nil
+    if File.exists?(index)
+      data = JSON.parse(File.read(index))
+      logger.debug data
+      if data.is_a?(Hash)
+        sections = data['sections']
+      else
+        sections = data
+      end
+      sections = sections.map do |s|
+        if s.is_a? Hash
+          s['section']
+        else
+          s
+        end
+      end
+    else
+      sections = ["."] # if there's no showoff.json file, make a boring one
+    end
+    sections
+  end
+
+  def self.showoff_title(dir = '.')
+    get_config_option(dir, 'name', "Presentation")
+  end
+
+  def self.showoff_pdf_options(dir = '.')
+    opts = get_config_option(dir, 'pdf_options', {:page_size => 'Letter', :orientation => 'Landscape'})
+    Hash[opts.map {|k, v| [k.to_sym, v]}] # keys must be symbols
+  end
+
+  def self.get_config_option(dir, option, default = nil)
+    index = File.join(dir, ShowOffUtils.presentation_config_file)
+    if File.exists?(index)
+      data = JSON.parse(File.read(index))
+      if data.is_a?(Hash)
+        if default.is_a?(Hash)
+          default.merge(data[option] || default)
+        else
+          data[option] || default
+        end
+      end
+    else
+      default
+    end
+  end
+
+  EXTENSIONS =  {
+    'pl' => 'perl',
+    'rb' => 'ruby',
+    'erl' => 'erlang',
+    # so not exhaustive, but probably good enough for now
+  }
+
+  def self.lang(source_file)
+    ext = File.extname(source_file).gsub(/^\./,'')
+    EXTENSIONS[ext] || ext
+  end
+
+  REQUIRED_GEMS = %w(redcarpet showoff heroku)
+
+  # Creates the file that lists the gems for heroku
+  #
+  # filename  - String name of the file
+  # password  - Boolean to indicate if we are setting a password
+  # force     - Boolean to indicate if we should overwrite the existing file
+  # formatter - Proc/lambda that takes 1 argument, the gem name, and formats it for the file
+  #             This is so we can support both the old .gems and the new bundler Gemfile
+  # header    - Proc/lambda that creates any header information in the file
+  #
+  # Returns a boolean indicating that we had to create the file or not.
+  def self.create_gems_file(filename,password,force,formatter,header=nil)
+    create_file_if_needed(filename,force) do |file|
+      file.puts header.call unless header.nil?
+      REQUIRED_GEMS.each { |gem| file.puts formatter.call(gem) }
+      file.puts formatter.call("rack") if password
+    end
+  end
+
+  # Creates the given filename if it doesn't exist or if force is true
+  #
+  # filename - String name of the file to create
+  # force    - if true, the file will always be created, if false, only create
+  #            if it's not there
+  # block    - takes a block that will be given the file handle to write
+  #            data into the file IF it's being created
+  #
+  # Examples
+  #
+  #   create_file_if_needed("config.ru",false) do |file|
+  #     file.puts "require 'showoff'"
+  #     file.puts "run ShowOff.new"
+  #   end
+  #
+  # Returns true if the file was created
+  def self.create_file_if_needed(filename,force)
+    if !File.exists?(filename) || force
+      File.open(filename, 'w+') do |f|
+        yield f
+      end
+      true
+    else
+      puts "#{filename} exists; not overwriting (see showoff help heroku)"
+      false
+    end
+  end
+end

data/public/css/960.css

@@ -0,0 +1,653 @@
+/*
+  960 Grid System ~ Core CSS.
+  Learn more ~ http://960.gs/
+
+  Licensed under GPL and MIT.
+*/
+
+/*
+  Forces backgrounds to span full width,
+  even if there is horizontal scrolling.
+  Increase this if your layout is wider.
+
+  Note: IE6 works fine without this fix.
+*/
+
+body {
+  min-width: 960px;
+}
+
+/* `Container
+----------------------------------------------------------------------------------------------------*/
+
+.container_12,
+.container_16 {
+  margin-left: auto;
+  margin-right: auto;
+  width: 960px;
+}
+
+/* `Grid >> Global
+----------------------------------------------------------------------------------------------------*/
+
+.grid_1,
+.grid_2,
+.grid_3,
+.grid_4,
+.grid_5,
+.grid_6,
+.grid_7,
+.grid_8,
+.grid_9,
+.grid_10,
+.grid_11,
+.grid_12,
+.grid_13,
+.grid_14,
+.grid_15,
+.grid_16 {
+  display: inline;
+  float: left;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+.push_1, .pull_1,
+.push_2, .pull_2,
+.push_3, .pull_3,
+.push_4, .pull_4,
+.push_5, .pull_5,
+.push_6, .pull_6,
+.push_7, .pull_7,
+.push_8, .pull_8,
+.push_9, .pull_9,
+.push_10, .pull_10,
+.push_11, .pull_11,
+.push_12, .pull_12,
+.push_13, .pull_13,
+.push_14, .pull_14,
+.push_15, .pull_15 {
+  position: relative;
+}
+
+.container_12 .grid_3,
+.container_16 .grid_4 {
+  width: 220px;
+}
+
+.container_12 .grid_6,
+.container_16 .grid_8 {
+  width: 460px;
+}
+
+.container_12 .grid_9,
+.container_16 .grid_12 {
+  width: 700px;
+}
+
+.container_12 .grid_12,
+.container_16 .grid_16 {
+  width: 940px;
+}
+
+/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
+----------------------------------------------------------------------------------------------------*/
+
+.alpha {
+  margin-left: 0;
+}
+
+.omega {
+  margin-right: 0;
+}
+
+/* `Grid >> 12 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .grid_1 {
+  width: 60px;
+}
+
+.container_12 .grid_2 {
+  width: 140px;
+}
+
+.container_12 .grid_4 {
+  width: 300px;
+}
+
+.container_12 .grid_5 {
+  width: 380px;
+}
+
+.container_12 .grid_7 {
+  width: 540px;
+}
+
+.container_12 .grid_8 {
+  width: 620px;
+}
+
+.container_12 .grid_10 {
+  width: 780px;
+}
+
+.container_12 .grid_11 {
+  width: 860px;
+}
+
+/* `Grid >> 16 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_16 .grid_1 {
+  width: 40px;
+}
+
+.container_16 .grid_2 {
+  width: 100px;
+}
+
+.container_16 .grid_3 {
+  width: 160px;
+}
+
+.container_16 .grid_5 {
+  width: 280px;
+}
+
+.container_16 .grid_6 {
+  width: 340px;
+}
+
+.container_16 .grid_7 {
+  width: 400px;
+}
+
+.container_16 .grid_9 {
+  width: 520px;
+}
+
+.container_16 .grid_10 {
+  width: 580px;
+}
+
+.container_16 .grid_11 {
+  width: 640px;
+}
+
+.container_16 .grid_13 {
+  width: 760px;
+}
+
+.container_16 .grid_14 {
+  width: 820px;
+}
+
+.container_16 .grid_15 {
+  width: 880px;
+}
+
+/* `Prefix Extra Space >> Global
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .prefix_3,
+.container_16 .prefix_4 {
+  padding-left: 240px;
+}
+
+.container_12 .prefix_6,
+.container_16 .prefix_8 {
+  padding-left: 480px;
+}
+
+.container_12 .prefix_9,
+.container_16 .prefix_12 {
+  padding-left: 720px;
+}
+
+/* `Prefix Extra Space >> 12 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .prefix_1 {
+  padding-left: 80px;
+}
+
+.container_12 .prefix_2 {
+  padding-left: 160px;
+}
+
+.container_12 .prefix_4 {
+  padding-left: 320px;
+}
+
+.container_12 .prefix_5 {
+  padding-left: 400px;
+}
+
+.container_12 .prefix_7 {
+  padding-left: 560px;
+}
+
+.container_12 .prefix_8 {
+  padding-left: 640px;
+}
+
+.container_12 .prefix_10 {
+  padding-left: 800px;
+}
+
+.container_12 .prefix_11 {
+  padding-left: 880px;
+}
+
+/* `Prefix Extra Space >> 16 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_16 .prefix_1 {
+  padding-left: 60px;
+}
+
+.container_16 .prefix_2 {
+  padding-left: 120px;
+}
+
+.container_16 .prefix_3 {
+  padding-left: 180px;
+}
+
+.container_16 .prefix_5 {
+  padding-left: 300px;
+}
+
+.container_16 .prefix_6 {
+  padding-left: 360px;
+}
+
+.container_16 .prefix_7 {
+  padding-left: 420px;
+}
+
+.container_16 .prefix_9 {
+  padding-left: 540px;
+}
+
+.container_16 .prefix_10 {
+  padding-left: 600px;
+}
+
+.container_16 .prefix_11 {
+  padding-left: 660px;
+}
+
+.container_16 .prefix_13 {
+  padding-left: 780px;
+}
+
+.container_16 .prefix_14 {
+  padding-left: 840px;
+}
+
+.container_16 .prefix_15 {
+  padding-left: 900px;
+}
+
+/* `Suffix Extra Space >> Global
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .suffix_3,
+.container_16 .suffix_4 {
+  padding-right: 240px;
+}
+
+.container_12 .suffix_6,
+.container_16 .suffix_8 {
+  padding-right: 480px;
+}
+
+.container_12 .suffix_9,
+.container_16 .suffix_12 {
+  padding-right: 720px;
+}
+
+/* `Suffix Extra Space >> 12 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .suffix_1 {
+  padding-right: 80px;
+}
+
+.container_12 .suffix_2 {
+  padding-right: 160px;
+}
+
+.container_12 .suffix_4 {
+  padding-right: 320px;
+}
+
+.container_12 .suffix_5 {
+  padding-right: 400px;
+}
+
+.container_12 .suffix_7 {
+  padding-right: 560px;
+}
+
+.container_12 .suffix_8 {
+  padding-right: 640px;
+}
+
+.container_12 .suffix_10 {
+  padding-right: 800px;
+}
+
+.container_12 .suffix_11 {
+  padding-right: 880px;
+}
+
+/* `Suffix Extra Space >> 16 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_16 .suffix_1 {
+  padding-right: 60px;
+}
+
+.container_16 .suffix_2 {
+  padding-right: 120px;
+}
+
+.container_16 .suffix_3 {
+  padding-right: 180px;
+}
+
+.container_16 .suffix_5 {
+  padding-right: 300px;
+}
+
+.container_16 .suffix_6 {
+  padding-right: 360px;
+}
+
+.container_16 .suffix_7 {
+  padding-right: 420px;
+}
+
+.container_16 .suffix_9 {
+  padding-right: 540px;
+}
+
+.container_16 .suffix_10 {
+  padding-right: 600px;
+}
+
+.container_16 .suffix_11 {
+  padding-right: 660px;
+}
+
+.container_16 .suffix_13 {
+  padding-right: 780px;
+}
+
+.container_16 .suffix_14 {
+  padding-right: 840px;
+}
+
+.container_16 .suffix_15 {
+  padding-right: 900px;
+}
+
+/* `Push Space >> Global
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .push_3,
+.container_16 .push_4 {
+  left: 240px;
+}
+
+.container_12 .push_6,
+.container_16 .push_8 {
+  left: 480px;
+}
+
+.container_12 .push_9,
+.container_16 .push_12 {
+  left: 720px;
+}
+
+/* `Push Space >> 12 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .push_1 {
+  left: 80px;
+}
+
+.container_12 .push_2 {
+  left: 160px;
+}
+
+.container_12 .push_4 {
+  left: 320px;
+}
+
+.container_12 .push_5 {
+  left: 400px;
+}
+
+.container_12 .push_7 {
+  left: 560px;
+}
+
+.container_12 .push_8 {
+  left: 640px;
+}
+
+.container_12 .push_10 {
+  left: 800px;
+}
+
+.container_12 .push_11 {
+  left: 880px;
+}
+
+/* `Push Space >> 16 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_16 .push_1 {
+  left: 60px;
+}
+
+.container_16 .push_2 {
+  left: 120px;
+}
+
+.container_16 .push_3 {
+  left: 180px;
+}
+
+.container_16 .push_5 {
+  left: 300px;
+}
+
+.container_16 .push_6 {
+  left: 360px;
+}
+
+.container_16 .push_7 {
+  left: 420px;
+}
+
+.container_16 .push_9 {
+  left: 540px;
+}
+
+.container_16 .push_10 {
+  left: 600px;
+}
+
+.container_16 .push_11 {
+  left: 660px;
+}
+
+.container_16 .push_13 {
+  left: 780px;
+}
+
+.container_16 .push_14 {
+  left: 840px;
+}
+
+.container_16 .push_15 {
+  left: 900px;
+}
+
+/* `Pull Space >> Global
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .pull_3,
+.container_16 .pull_4 {
+  left: -240px;
+}
+
+.container_12 .pull_6,
+.container_16 .pull_8 {
+  left: -480px;
+}
+
+.container_12 .pull_9,
+.container_16 .pull_12 {
+  left: -720px;
+}
+
+/* `Pull Space >> 12 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_12 .pull_1 {
+  left: -80px;
+}
+
+.container_12 .pull_2 {
+  left: -160px;
+}
+
+.container_12 .pull_4 {
+  left: -320px;
+}
+
+.container_12 .pull_5 {
+  left: -400px;
+}
+
+.container_12 .pull_7 {
+  left: -560px;
+}
+
+.container_12 .pull_8 {
+  left: -640px;
+}
+
+.container_12 .pull_10 {
+  left: -800px;
+}
+
+.container_12 .pull_11 {
+  left: -880px;
+}
+
+/* `Pull Space >> 16 Columns
+----------------------------------------------------------------------------------------------------*/
+
+.container_16 .pull_1 {
+  left: -60px;
+}
+
+.container_16 .pull_2 {
+  left: -120px;
+}
+
+.container_16 .pull_3 {
+  left: -180px;
+}
+
+.container_16 .pull_5 {
+  left: -300px;
+}
+
+.container_16 .pull_6 {
+  left: -360px;
+}
+
+.container_16 .pull_7 {
+  left: -420px;
+}
+
+.container_16 .pull_9 {
+  left: -540px;
+}
+
+.container_16 .pull_10 {
+  left: -600px;
+}
+
+.container_16 .pull_11 {
+  left: -660px;
+}
+
+.container_16 .pull_13 {
+  left: -780px;
+}
+
+.container_16 .pull_14 {
+  left: -840px;
+}
+
+.container_16 .pull_15 {
+  left: -900px;
+}
+
+/* `Clear Floated Elements
+----------------------------------------------------------------------------------------------------*/
+
+/* http://sonspring.com/journal/clearing-floats */
+
+.clear {
+  clear: both;
+  display: block;
+  overflow: hidden;
+  visibility: hidden;
+  width: 0;
+  height: 0;
+}
+
+/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */
+
+.clearfix:before,
+.clearfix:after,
+.container_12:before,
+.container_12:after,
+.container_16:before,
+.container_16:after {
+  content: '.';
+  display: block;
+  overflow: hidden;
+  visibility: hidden;
+  font-size: 0;
+  line-height: 0;
+  width: 0;
+  height: 0;
+}
+
+.clearfix:after,
+.container_12:after,
+.container_16:after {
+  clear: both;
+}
+
+/*
+  The following zoom:1 rule is specifically for IE6 + IE7.
+  Move to separate stylesheet if invalid CSS is a problem.
+*/
+
+.clearfix,
+.container_12,
+.container_16 {
+  zoom: 1;
+}