zine 0.2.0 → 0.3.0

data/lib/zine/page.rb

@@ -12,7 +12,7 @@ module Zine
   # A page on the site where the content comes from a file's markdown, and the
   # destination's location mirrors its own
   class Page
-    attr_reader :formatted_data
+    attr_reader :dest_path, :formatted_data, :source_file, :template_bundle
     # the meta data, passed formatted to the template
     class FormattedData
       include ERB::Util
@@ -28,6 +28,7 @@ module Zine
         @page = { date_rfc3339: front_matter['date'],
                   date_us: parse_date(front_matter['date']),
                   github_name: site_opt['options']['github_name'],
+                  links_array: site_opt['links'],
                   num_items_on_home: site_opt['options']['num_items_on_home'],
                   site_author: site_opt['options']['site_author'],
                   site_description: site_opt['options']['site_description'],
@@ -59,8 +60,10 @@ module Zine
                          :pageDateUS)
 
     def initialize(md_file_name, dest, templates, site_options)
+      @source_file = md_file_name
       file_parts = File.open(md_file_name, 'r').read.split('---')
-      @formatted_data = FormattedData.new(parse_yaml(file_parts[1]),
+      @formatted_data = FormattedData.new(parse_yaml(file_parts[1],
+                                                     md_file_name),
                                           site_options)
       @dest_path = dest
       @raw_text = file_parts[2]
@@ -71,6 +74,7 @@ module Zine
       @header_partial = templates.header
       @footer_partial = templates.footer
       @template = templates.body
+      @template_bundle = templates
     end
 
     def parse_markdown
@@ -81,9 +85,10 @@ module Zine
         smart_quotes: %w(apos apos quot quot),
         syntax_highlighter: 'rouge'
       ).to_html
+      @raw_text = nil
     end
 
-    def parse_yaml(text)
+    def parse_yaml(text, md_file_name)
       YAML.safe_load text
     rescue Psych::Exception
       puts Rainbow("Could not parse front matter for: #{md_file_name}").red

data/lib/zine/post.rb

@@ -4,8 +4,10 @@ module Zine
   # A post - content comes from the markdown, and the destination from the date
   class Post < Page
     def initialize(md_file_name, templates, site_options)
+      @source_file = md_file_name
       file_parts = File.open(md_file_name, 'r').read.split('---')
-      @formatted_data = FormattedData.new(parse_yaml(file_parts[1]),
+      @formatted_data = FormattedData.new(parse_yaml(file_parts[1],
+                                                     md_file_name),
                                           site_options)
       @raw_text = file_parts[2]
       init_templates(templates)
@@ -17,16 +19,25 @@ module Zine
     def make_path_from_date(build_dir)
       page_data = @formatted_data.page
       date = DateTime.parse(page_data[:date_rfc3339])
-      dest_dir = File.join(build_dir,
-                           date.strftime('%Y'),
-                           date.strftime('%-m'))
-      FileUtils.mkdir_p dest_dir
+      @dest_dir = File.join(build_dir,
+                            date.strftime('%Y'),
+                            date.strftime('%-m'))
       slg = Zine::Page.slug(page_data[:title]) + '.html'
-      @dest_path = File.join(dest_dir, slg)
+      @dest_path = File.join(@dest_dir, slg)
     end
 
     def process
+      FileUtils.mkdir_p @dest_dir
       super
+      tag_and_uri_subprocess
+    end
+
+    def process_without_writing
+      parse_markdown
+      tag_and_uri_subprocess
+    end
+
+    def tag_and_uri_subprocess
       page_data = @formatted_data.page
       file_path = rel_path_from_build_dir(@dest_path).to_s
       @formatted_data.uri = URI.join(page_data[:site_URL], file_path).to_s

data/lib/zine/posts_and_headlines.rb

@@ -0,0 +1,202 @@
+require 'zine/data_page'
+require 'zine/post'
+require 'zine/tag'
+
+module Zine
+  # The blog posts and their associate headline files (the home page, an
+  # articles index, and RSS feed)
+  class PostsAndHeadlines
+    def initialize(site, options)
+      @options = options
+      @post_array = []
+      @site = site
+      @tags_by_post = []
+      dir = @options['directories']
+      @guard = Zine::Watcher.new self, dir['build'], dir['source']
+      @guard.start
+      read_post_markdown_files
+      sort_posts_by_date
+    end
+
+    def find_page_from_path(file_path)
+      post_to_rebuild = @post_array.detect do |post|
+        File.expand_path(post.source_file) == file_path
+      end
+      index = @post_array.find_index post_to_rebuild
+      { post: post_to_rebuild, index: index }
+    end
+
+    # The headlines pages - the home page, an articles index, and RSS feed
+    def headline_pages
+      dir = @options['directories']['build']
+      options = @options['options']
+      templates = @options['templates']
+      [{ build_dir: dir, name: 'articles', number: @post_array.size,
+         suffix: '.html', template_name: templates['articles'],
+         title: 'Articles' },
+       { build_dir: dir, name: 'index',
+         number: options['num_items_on_home'], suffix: '.html',
+         template_name: templates['home'], title: 'Home' },
+       { build_dir: dir, name: 'rss',
+         number: options['number_items_in_RSS'], suffix: '.xml',
+         template_name: templates['rss'], title: '' }]
+    end
+
+    def one_new_post(source_file)
+      post_name = @options['templates']['post']
+      @post_array << Zine::Post.new(source_file,
+                                    @site.make_template_bundle(post_name),
+                                    @options)
+      @tags_by_post << @post_array.last.process
+      # TODO: may need to reorder posts by date, and therefor redo tags
+      write_tags_and_headlines
+    end
+
+    # get build file from post or location, delete build, remove form post_array
+    def preview_delete(file_path)
+      page = find_page_from_path file_path
+      if page[:index].nil?
+        directories = @options['directories']
+        full = Pathname(file_path)
+        relative = full.relative_path_from(
+          Pathname(File.absolute_path(directories['source']))
+        )
+        relative_path = File.dirname(relative)
+        file = File.basename(relative, '.md') + '.html'
+        File.delete(File.join(directories['build'], relative_path, file))
+      else
+        File.delete(page[:post].dest_path)
+        @post_array.delete_at(page[:index])
+      end
+    end
+
+    def preview_rebuild(file_path)
+      page = find_page_from_path file_path
+      if page[:index].nil?
+        if File.dirname(file_path) ==
+           File.absolute_path(@options['directories']['posts'])
+          one_new_post file_path
+        else
+          rebuild_page file_path
+        end
+      else
+        rebuild_post page[:post], page[:index]
+      end
+    end
+
+    # the build folder equivalent of a non Markdown file in the source tree
+    # TODO: move from posts & headlines
+    def preview_relative_equivalent(file)
+      directories = @options['directories']
+      source_dir = Pathname(File.absolute_path(directories['source']))
+      build_dir = Pathname(File.absolute_path(directories['build']))
+      file_dir = Pathname(File.dirname(file))
+      File.join build_dir, file_dir.relative_path_from(source_dir)
+    end
+
+    # copy a non Markdown file, TODO: move form posts & headlines
+    def preview_straight_copy(file)
+      FileUtils.cp(file, preview_relative_equivalent(file))
+    end
+
+    # delete a non Markdown file, TODO: move form posts & headlines
+    def preview_straight_delete(file)
+      FileUtils.rm(File.join(
+                     preview_relative_equivalent(file), File.basename(file)
+      ))
+    end
+
+    # rebuild a page that's not a post - doesn't create the file structure for a
+    # new file with new parent folders
+    def rebuild_page(file)
+      @site.write_markdown(@options['templates']['default'],
+                           File.expand_path(@options['directories']['source']),
+                           file)
+    end
+
+    # inserts the new post into the @post_array, builds the file, calls
+    # write_tags_and_headlines to rewrites the headline pages & tags
+    # RSS & home page will be redundant re-builds if not a recent page
+    def rebuild_post(post, index)
+      @post_array[index] = Zine::Post.new post.source_file,
+                                          post.template_bundle, @options
+      @tags_by_post[index] = @post_array[index].process
+      write_tags_and_headlines
+      # TODO: may need to reorder posts by date... means re-doing tags
+    end
+
+    # Read markdown files in the posts folder into an array of Posts
+    def read_post_markdown_files
+      file_name_array = Dir[File.join(@options['directories']['posts'], '*.md')]
+      post_name = @options['templates']['post']
+      file_name_array.each do |file|
+        @post_array << Zine::Post.new(file,
+                                      @site.make_template_bundle(post_name),
+                                      @options)
+      end
+    end
+
+    # Sort the Posts array into date order, newest first
+    def sort_posts_by_date
+      @post_array.sort_by! do |post|
+        post.formatted_data.page[:date_rfc3339]
+      end.reverse!
+      # TODO: .freeze -- currently modified during preview
+    end
+
+    # Process each of the headlines pages
+    def wrangle_headlines
+      headline_pages.each do |page|
+        write_headline page
+      end
+    end
+
+    # Write out the Posts, calls write_tags_and_headlines
+    def write
+      @tags_by_post = []
+      @post_array.each do |post|
+        @tags_by_post << post.process
+      end
+      write_tags_and_headlines
+
+      # end point
+      { posts: @post_array, guard: @guard }
+    end
+
+    # Generate data without writing files (for incremnetal builds & uploads)
+    def writeless
+      @tags_by_post = []
+      @post_array.each do |post|
+        @tags_by_post << post.process_without_writing
+      end
+
+      # end point
+      { posts: @post_array, guard: @guard }
+    end
+
+    # Pass headline data to the DataPage class to write the files
+    def write_headline(page)
+      data = page
+      data[:post_array] = []
+      @post_array.first(page[:number]).each do |post|
+        post_data = post.formatted_data
+        data[:post_array] << { page: post_data.page, html: post_data.html,
+                               uri:  post_data.uri }
+      end
+      data_page = DataPage.new(data,
+                               @site.make_template_bundle(data[:template_name]),
+                               @options, data[:suffix])
+      data_page.write
+    end
+
+    # Write out the tags and headline files
+    def write_tags_and_headlines
+      tag_name = @options['templates']['tag']
+      tag_index_name = @options['templates']['tag_index']
+      tags = Zine::Tag.new @tags_by_post, @site.make_template_bundle(tag_name),
+                           @site.make_template_bundle(tag_index_name), @options
+      tags.write_tags
+      wrangle_headlines
+    end
+  end
+end

data/lib/zine/server.rb

@@ -1,18 +1,25 @@
+require 'highline'
 require 'rainbow'
 require 'rack'
 require 'thin'
+require 'zine/upload'
+require 'zine/watcher'
 
 module Zine
   # Local preview web server
   class Server
-    def initialize(root)
+    # def initialize(_posts, rel_path_build, _rel_path_source, upload_options,
+    def initialize(rel_path_build, upload_options, delete_array, upload_array)
+      @delete_array = delete_array
+      @upload_array = upload_array
+      root = File.absolute_path(rel_path_build)
       motd
-      Thin::Server.start('127.0.0.1', 8080) do
+
+      @thin = Thin::Server.new('127.0.0.1', 8080) do
         use Rack::Static,
             urls: ['/'],
             index: 'index.html',
             root: root
-
         now = Time.now
         a_long_time = 100**4
         run lambda { |_env|
@@ -26,9 +33,34 @@ module Zine
              'Pragma'        => 'no-cache',
              'Expires'       => now - a_long_time
            },
-           File.open(File.join(root, 'index.html'), File::RDONLY)]
+           [File.open(File.join(root, 'index.html'), File::RDONLY)]]
         }
       end
+      @thin.start
+
+      return if upload_options['method'] == 'none' ||
+                (@delete_array.empty? && @upload_array.empty?)
+      cli = HighLine.new
+      answer = cli.ask('Upload files? (Y/n)') { |q| q.default = 'Y' }
+      return if answer != 'Y'
+      file_upload rel_path_build, upload_options
+    end
+
+    # deploy
+    def file_upload(rel_path_build, upload_options)
+      puts Rainbow('Connecting...').green
+      begin
+        upload = Zine::Upload.new rel_path_build, upload_options,
+                                  # @guard.delete_array, @guard.upload_array
+                                  @delete_array, @upload_array
+        upload.delete
+        upload.deploy
+      rescue Errno::ENETUNREACH
+        puts Rainbow("Unable to connect to #{upload_options['host']}").red
+      rescue Net::SSH::AuthenticationFailed
+        puts Rainbow("Authentication failed for #{upload_options['host']}").red
+        puts 'Check your credential file, and maybe run ssh-add?'
+      end
     end
 
     def motd

data/lib/zine/skeleton/source/assets/webicon-rss.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve">
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="23.9995" y1="0" x2="23.9995" y2="48.0005">
+	<stop  offset="0" style="stop-color:#F2A833"/>
+	<stop  offset="1" style="stop-color:#E8621D"/>
+</linearGradient>
+<path fill-rule="evenodd" clip-rule="evenodd" fill="url(#SVGID_1_)" d="M48,42c0,3.313-2.687,6-6,6H6c-3.313,0-6-2.687-6-6V6
+	c0-3.313,2.687-6,6-6h36c3.313,0,6,2.687,6,6V42z"/>
+<path fill="#E8621D" d="M10.016,8.494c0,0,27.276-1.343,29.426,27.41h-5.509c0,0,1.076-20.959-23.917-22.841V8.494z"/>
+<path fill="#E8621D" d="M10.016,18.034c0,0,15.99-0.538,19.08,17.869h-5.508c0,0-0.671-10.883-13.572-13.302V18.034z"/>
+<path fill="#E8621D" d="M13.01,30.021c1.928,0,3.494,1.563,3.494,3.494c0,1.928-1.566,3.493-3.494,3.493
+	c-1.93,0-3.494-1.564-3.494-3.493C9.516,31.585,11.08,30.021,13.01,30.021z"/>
+<path fill="#FFFFFF" d="M10.016,9.597c0,0,27.276-1.343,29.426,27.41h-5.509c0,0,1.076-20.96-23.917-22.842V9.597z"/>
+<path fill="#FFFFFF" d="M10.016,19.138c0,0,15.99-0.539,19.08,17.869h-5.508c0,0-0.671-10.882-13.572-13.304V19.138z"/>
+<path fill="#FFFFFF" d="M13.01,31.125c1.928,0,3.494,1.562,3.494,3.494c0,1.928-1.566,3.493-3.494,3.493
+	c-1.93,0-3.494-1.564-3.494-3.493C9.516,32.688,11.08,31.125,13.01,31.125z"/>
+</svg>

data/lib/zine/skeleton/source/assets/webicon-twitter.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve">
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="23.9995" y1="0" x2="23.9995" y2="48.0005">
+	<stop  offset="0" style="stop-color:#4BD0EF"/>
+	<stop  offset="1" style="stop-color:#29AAE1"/>
+</linearGradient>
+<path fill-rule="evenodd" clip-rule="evenodd" fill="url(#SVGID_1_)" d="M48,42c0,3.313-2.687,6-6,6H6c-3.313,0-6-2.687-6-6V6
+	c0-3.313,2.687-6,6-6h36c3.313,0,6,2.687,6,6V42z"/>
+<path fill="#29AAE1" d="M40.231,13.413c-1.12,0.497-2.323,0.833-3.588,0.984c1.291-0.774,2.28-1.998,2.747-3.457
+	c-1.206,0.716-2.543,1.236-3.968,1.516c-1.139-1.214-2.763-1.972-4.56-1.972c-3.449,0-6.246,2.796-6.246,6.247
+	c0,0.49,0.055,0.966,0.161,1.424c-5.192-0.261-9.795-2.749-12.876-6.528c-0.538,0.923-0.846,1.996-0.846,3.141
+	c0,2.167,1.103,4.08,2.779,5.199c-1.024-0.032-1.987-0.313-2.83-0.781c0,0.026,0,0.053,0,0.079c0,3.026,2.153,5.551,5.011,6.125
+	c-0.525,0.143-1.076,0.219-1.646,0.219c-0.403,0-0.794-0.038-1.176-0.11c0.795,2.48,3.102,4.287,5.835,4.338
+	c-2.138,1.675-4.832,2.675-7.758,2.675c-0.504,0-1.002-0.03-1.491-0.089c2.765,1.773,6.048,2.808,9.576,2.808
+	c11.49,0,17.774-9.519,17.774-17.774c0-0.271-0.006-0.54-0.019-0.809C38.334,15.766,39.394,14.666,40.231,13.413z"/>
+<path fill="#FFFFFF" d="M40.231,14.739c-1.12,0.497-2.323,0.833-3.588,0.984c1.291-0.773,2.28-1.998,2.747-3.456
+	c-1.206,0.716-2.543,1.236-3.968,1.516c-1.139-1.214-2.763-1.972-4.56-1.972c-3.449,0-6.246,2.796-6.246,6.247
+	c0,0.489,0.055,0.966,0.161,1.424c-5.192-0.261-9.795-2.748-12.876-6.527c-0.538,0.923-0.846,1.996-0.846,3.141
+	c0,2.167,1.103,4.079,2.779,5.199c-1.024-0.032-1.987-0.313-2.83-0.781c0,0.026,0,0.052,0,0.079c0,3.027,2.153,5.551,5.011,6.125
+	c-0.525,0.144-1.076,0.219-1.646,0.219c-0.403,0-0.794-0.038-1.176-0.11c0.795,2.481,3.102,4.287,5.835,4.338
+	c-2.138,1.676-4.832,2.675-7.758,2.675c-0.504,0-1.002-0.03-1.491-0.089c2.765,1.773,6.048,2.808,9.576,2.808
+	c11.49,0,17.774-9.519,17.774-17.774c0-0.271-0.006-0.54-0.019-0.808C38.334,17.092,39.394,15.992,40.231,14.739z"/>
+</svg>

data/lib/zine/skeleton/source/screen.css

@@ -1 +1 @@
-*{margin:0;padding:0}html,body{height:100%}body{background-color:#fff;font-family:GillSansRegular,'Gill Sans MT','Gill Sans','Century Gothic',Calibri,'Trebuchet MS',sans-serif;line-height:1.618;color:#333;text-align:center;font-weight:300}#skiptocontent{height:1px;width:1px;position:absolute;overflow:hidden;top:-10px}h1,h2,h3,h4,h5,h6{color:#333;letter-spacing:.1em}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#414f7c;text-decoration:none}h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{color:#212721}h1{font-weight:300;font-size:2.618em;margin:1.809em 0 .809em}h2{font-weight:300;font-size:1.618em;margin:1.809em 0 .809em}h3,h4,h5,h6{font-weight:400;font-size:1em;margin:1.809em 0 .809em}p{margin:1em 0}a{color:#414f7c}a:hover{color:#212721}section{margin-bottom:1.618em}section>section{margin-bottom:3.236em}body>header{width:43em;text-align:center;margin:0 auto 0}body>header a{text-decoration:none;margin-left:.5em;margin-right:.5em}body>header,body>main,body>footer{display:block}body>header a{color:#414f7c}body>header a:hover{color:#212721}body>header a.extra{color:#414f7c;margin-left:1em}body>header a.extra:hover{color:#212721}body>header nav ul li{display:inline;list-style:none}.button{width:30px;height:30px;display:inline-block;background-size:100%;text-indent:-999em;text-align:left;margin:20px}.twitter{background:url('/assets/webicon-twitter-m.png');background-image:url('/assets/webicon-twitter.svg'),none}.rss{background:url('/assets/webicon-rss-m.png');background-image:url('/assets/webicon-rss.svg'),none}main{text-align:left;width:43em;margin:3em auto 2em}main li{margin-left:2.618em}.meta{color:#667}footer{width:43em;color:#667;border-top:4px solid #ddd;margin:3em auto 2em;overflow:hidden}footer .contact{float:left;margin-right:3em}footer .contact a,.tags a{color:#414f7c;text-decoration:none}footer .contact a:hover,.tags a:hover{color:#212721;text-decoration:none}.tags ul li{list-style:none;display:inline;font-variant:small-caps;font-size:1.2em}.archive a{text-decoration:none}ul.archive,ul.archive ul{margin-left:0}ul.archive li,ul.archive ul li{list-style:none;margin-left:0}.post pre{border:1px solid #ddd;background-color:#fff;padding:0 .4em}p.date{color:#667}pre{background-color:#eee;padding:1em;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}code{font-family:Consolas,Menlo,Monaco,'Lucida Console','Courier New',monospace,serif;font-size:.8em}blockquote{margin:2em 2em 2em 1em;padding:0 .75em 0 1.25em;border-left:2px solid #ddd;border-right:0 solid #ddd}@media all and (max-width:736px){body>header,main,footer{width:86%;margin:0 auto 0;padding:12px 24px 12px}p{margin-bottom:2em}.button{width:50px;height:50px;margin:20px}}
+*{margin:0;padding:0}html,body{height:100%}body{background-color:#fff;font-family:GillSansRegular,"Gill Sans MT","Gill Sans","Century Gothic",Calibri,"Trebuchet MS",sans-serif;line-height:1.618;color:#333;text-align:center;font-weight:300}#skiptocontent{height:1px;width:1px;position:absolute;overflow:hidden;top:-10px}h1,h2,h3,h4,h5,h6{color:#333;letter-spacing:0.1em}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#414f7c;text-decoration:none}h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{color:#212721}h1{font-weight:300;font-size:2.618em;margin:1.809em 0 0.809em}h2{font-weight:300;font-size:1.618em;margin:1.809em 0 0.809em}h3,h4,h5,h6{font-weight:400;font-size:1em;margin:1.809em 0 0.809em}p,li{margin:1em 0}ul{margin:0}a{color:#414f7c}a:hover{color:#212721}section{margin-bottom:1.618em}section>section{margin-bottom:3.236em}body>header{width:43em;text-align:center;margin:0 auto 0}body>header a{text-decoration:none;margin-left:0.5em;margin-right:0.5em}body>header,body>main,body>footer{display:block}body>header a{color:#414f7c}body>header a:hover{color:#212721}body>header a.extra{color:#414f7c;margin-left:1em}body>header a.extra:hover{color:#212721}body>header nav ul li{display:inline;list-style:none}.button{width:30px;height:30px;display:inline-block;background-size:100%;text-indent:-999em;text-align:left;margin:20px}.twitter{background:url("/assets/webicon-twitter-m.png");background-image:url("/assets/webicon-twitter.svg"),none}.rss{background:url("/assets/webicon-rss-m.png");background-image:url("/assets/webicon-rss.svg"),none}main{text-align:left;width:43em;margin:3em auto 2em}main li{margin-left:2.618em}.meta{color:#667}footer{width:43em;color:#667;border-top:4px solid #ddd;margin:3em auto 2em;overflow:hidden}footer .column{float:left;width:33%;text-align:left}footer .column ul{list-style:none}footer .column a,.tags a{color:#414f7c;text-decoration:none}footer .column a:hover,.tags a:hover{color:#212721;text-decoration:none}.tags ul li{list-style:none;display:inline;font-variant:small-caps;font-size:1.2em}.archive a{text-decoration:none}ul.archive,ul.archive ul{margin-left:0}ul.archive li,ul.archive ul li{list-style:none;margin-left:0}.post pre{border:1px solid #ddd;background-color:#fff;padding:0 .4em}p.date{color:#667}pre{background-color:#eee;padding:1em;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-pre-wrap;white-space:-o-pre-wrap;word-wrap:break-word}code{font-family:Consolas,Menlo,Monaco,"Lucida Console","Courier New",monospace,serif;font-size:0.8em}blockquote{margin:2em 2em 2em 1em;padding:0 .75em 0 1.25em;border-left:2px solid #ddd;border-right:0px solid #ddd}@media all and (max-width: 736px){body>header,main,footer{width:86%;margin:0 auto 0;padding:12px 24px 12px}p{margin-bottom:2em}.button{width:50px;height:50px;margin:20px}footer .column{width:100%}}

data/lib/zine/skeleton/source/styles/screen.scss

@@ -0,0 +1,291 @@
+$blue: #414f7c;
+$darkGrey: #333;
+$mediumGrey: #667;
+$lightGrey: #ddd;
+$black: #212721;
+$white: #fff;
+$offWhite: #eee;
+
+$backgroundColour: $white;
+$codeBackgroundColour: $offWhite;
+$headingColour: $darkGrey;
+$textColour: $darkGrey;
+$linkColour: $blue;
+$hoverColour: $black;
+$metaAndFooterColour: $mediumGrey;
+$borderColour: $lightGrey;
+
+$desktopWidth: 43em;
+$lightWeight: 300;
+$heavyWeight: 400;
+
+$regularFont: GillSansRegular, 'Gill Sans MT', 'Gill Sans', 'Century Gothic', Calibri, 'Trebuchet MS', sans-serif;
+$monoFont: Consolas, Menlo, Monaco, 'Lucida Console', 'Courier New', monospace, serif;
+
+* {
+  margin: 0;
+  padding: 0;
+}
+
+html, body { height: 100%; }
+
+body {
+  background-color: $backgroundColour;
+  font-family: $regularFont;
+  line-height: 1.618;
+  color: $textColour;
+  text-align: center;
+  font-weight: $lightWeight;
+}
+
+#skiptocontent {
+  height: 1px;
+  width: 1px;
+  position: absolute;
+  overflow: hidden;
+  top: -10px;
+}
+
+h1,h2,h3,h4,h5,h6 {
+	color: $headingColour;
+    letter-spacing: 0.1em;
+    a {
+        color: $linkColour;
+        text-decoration: none;
+    }
+    a:hover {
+        color: $hoverColour;
+    }
+}
+
+h1 {
+    font-weight: $lightWeight;
+    font-size: 2.618em;
+    margin: 1.809em 0 0.809em;
+}
+
+h2 {
+    font-weight: $lightWeight;
+    font-size: 1.618em;
+    margin: 1.809em 0 0.809em;
+}
+
+h3, h4, h5, h6 {
+    font-weight: $heavyWeight;
+    font-size: 1em;
+    margin: 1.809em 0 0.809em;
+}
+
+p, li {
+  margin: 1em 0;
+}
+
+ul {
+  margin: 0;
+}
+
+a { color:$linkColour; }
+a:hover   { color: $hoverColour; }
+
+/* Home */
+section {
+    margin-bottom: 1.618em;
+}
+
+section > section {
+    margin-bottom: 3.236em;
+}
+
+/* Site */
+body > header {
+  width: $desktopWidth;
+  text-align: center;
+  margin: 0 auto 0;
+}
+
+body > header a {
+    text-decoration: none;
+    margin-left: 0.5em;
+    margin-right: 0.5em;
+}
+
+body > header, body > main, body > footer {
+    display: block;
+}
+
+body > header a {
+    color: $linkColour;
+}
+
+body > header a:hover {
+  color: $hoverColour;
+}
+
+body > header a.extra {
+  color: $linkColour;
+  margin-left: 1em;
+}
+
+body > header a.extra:hover {
+  color: $hoverColour;
+}
+
+body > header nav ul li {
+  display: inline;
+  list-style: none;
+}
+
+.button {
+    width: 30px;
+    height: 30px;
+    display: inline-block;
+    background-size: 100%;
+    text-indent: -999em;
+    text-align: left;
+    margin: 20px;
+}
+
+.twitter {
+    background: url('/assets/webicon-twitter-m.png');
+    background-image: url('/assets/webicon-twitter.svg'), none;
+}
+
+.rss {
+    background: url('/assets/webicon-rss-m.png');
+    background-image: url('/assets/webicon-rss.svg'), none;
+}
+
+main {
+  text-align: left;
+  width: $desktopWidth;
+  margin: 3em auto 2em;
+}
+
+main li {
+    margin-left: 2.618em;
+}
+
+.meta {
+  color: $metaAndFooterColour;
+}
+
+footer {
+  width: $desktopWidth;
+  color: $metaAndFooterColour;
+  border-top: 4px solid $borderColour;
+  margin: 3em auto 2em;
+  overflow: hidden;
+}
+
+footer .column {
+  float: left;
+  width: 33%;
+  text-align: left;
+}
+
+footer .column ul { list-style: none; }
+footer .column a, .tags a { color:$linkColour; text-decoration: none; }
+footer .column a:hover, .tags a:hover   { color:$hoverColour; text-decoration: none; }
+
+.tags ul li {
+    list-style: none;
+    display: inline;
+    font-variant: small-caps;
+    font-size:1.2em;
+}
+
+.archive a {
+    text-decoration: none;
+}
+
+ul.archive, ul.archive ul {
+    margin-left: 0;
+}
+
+ul.archive li, ul.archive ul li {
+    list-style: none;
+    margin-left: 0;
+}
+
+/*footer .rss {
+  margin-top: 1.1em;
+  margin-right: -.2em;
+  float: right;
+}
+
+footer .rss img {
+  border: 0;
+}*/
+
+/* Posts */
+
+/* standard */
+.post pre {
+  border: 1px solid $borderColour;
+  background-color: $backgroundColour;
+  padding: 0 .4em;
+}
+
+
+p.date {
+    color: $mediumGrey;
+}
+
+/*.post ul, .post ol {
+  margin-left: 1.35em;
+}*/
+
+pre {
+    background-color: $codeBackgroundColour;
+    padding: 1em;
+    white-space: pre-wrap;
+    /* why necessary */
+    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
+    white-space: -pre-wrap;      /* Opera 4-6 */
+    white-space: -o-pre-wrap;    /* Opera 7 */
+    word-wrap: break-word;
+}
+
+code {
+  font-family: $monoFont;
+  font-size: 0.8em;
+}
+
+/* terminal
+.post pre.terminal {
+  border: 1px solid $borderColour;
+  background-color: $codeBackgroundColour;
+  color: $textColour;
+}
+
+.post pre.terminal code {
+  background-color: $codeBackgroundColour;
+}*/
+
+/* quotes */
+blockquote {
+  margin: 2em 2em 2em 1em;
+  padding: 0 .75em 0 1.25em;
+  border-left: 2px solid $borderColour;
+  border-right: 0px solid $borderColour;
+}
+
+@media all and (max-width: 736px) {
+    /* was max-device-width: 1242px */
+	body > header, main, footer {
+      width:86%;
+      margin: 0 auto 0;
+      padding: 12px 24px 12px;
+	}
+  p {
+    margin-bottom:2em;
+  }
+  .button {
+    width: 50px;
+    height: 50px;
+    margin: 20px;
+  }
+  footer .column {
+    width: 100%;
+  }
+}