├── source
    ├── javascripts
    │   └── all.js
    ├── index.html.erb
    ├── images
    │   ├── prod
    │   │   └── middleman-logo.svg
    │   └── dev
    │   │   └── middleman-logo.svg
    ├── layouts
    │   └── layout.erb
    └── stylesheets
    │   ├── site.css.scss
    │   └── _normalize.scss
├── config.ru
├── Gemfile
├── package.json
├── .gitignore
├── Gulpfile.js
├── config.rb
└── Gemfile.lock


/source/javascripts/all.js:
--------------------------------------------------------------------------------
1 | //= require_tree .


--------------------------------------------------------------------------------
/config.ru:
--------------------------------------------------------------------------------
 1 | require 'middleman-core/load_paths'
 2 | ::Middleman.setup_load_paths
 3 | 
 4 | require 'middleman-core'
 5 | require 'middleman-core/rack'
 6 | 
 7 | require 'fileutils'
 8 | FileUtils.mkdir('log') unless File.exist?('log')
 9 | ::Middleman::Logger.singleton("log/#{ENV['RACK_ENV']}.log")
10 | 
11 | app = ::Middleman::Application.new
12 | 
13 | run ::Middleman::Rack.new(app).to_app
14 | 


--------------------------------------------------------------------------------
/source/index.html.erb:
--------------------------------------------------------------------------------
 1 | ---
 2 | title: Welcome to Middleman
 3 | ---
 4 | 
 5 | <div class="welcome">
 6 |   <div class="logo">
 7 |     <%= image_tag "middleman-logo.svg" %>
 8 |   </div>
 9 |   <h1>Middleman is Running</h1>
10 |   <p class="doc">
11 |     <%= link_to "Read Documentation Online", "https://middlemanapp.com", target: "_blank" %>
12 |   </p><!-- .doc -->
13 | </div><!-- .welcome -->
14 | 


--------------------------------------------------------------------------------
/Gemfile:
--------------------------------------------------------------------------------
 1 | # If you do not have OpenSSL installed, change
 2 | # the following line to use 'http://'
 3 | source 'https://rubygems.org'
 4 | 
 5 | # For faster file watcher updates on Windows:
 6 | gem 'wdm', '~> 0.1.0', platforms: [:mswin, :mingw]
 7 | 
 8 | # Windows does not come with time zone data
 9 | gem 'tzinfo-data', platforms: [:mswin, :mingw, :jruby]
10 | 
11 | # Middleman Gems
12 | gem 'middleman', '>= 4.0.0'
13 | gem 'middleman-livereload'
14 | 
15 | gem 'sassc'
16 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "mm4-ext-pipeline",
 3 |   "version": "0.1.0",
 4 |   "description": "An example of using Middleman v4's external pipeline",
 5 |   "scripts": {
 6 |     "test": "echo \"Error: no test specified\" && exit 1"
 7 |   },
 8 |   "author": "Patrick Fulton",
 9 |   "license": "MIT",
10 |   "devDependencies": {
11 |     "gulp": "^3.9.0",
12 |     "gulp-imagemin": "^2.4.0",
13 |     "gulp-notify": "^2.2.0",
14 |     "gulp-plumber": "^1.0.1"
15 |   }
16 | }
17 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # See http://help.github.com/ignore-files/ for more about ignoring files.
 2 | #
 3 | # If you find yourself ignoring temporary files generated by your text editor
 4 | # or operating system, you probably want to add a global ignore instead:
 5 | # git config --global core.excludesfile ~/.gitignore_global
 6 | 
 7 | # Ignore bundler config
 8 | /.bundle
 9 | 
10 | # Ignore the build directory
11 | /build
12 | 
13 | # Ignore cache
14 | /.sass-cache
15 | /.cache
16 | 
17 | # Ignore .DS_store file
18 | .DS_Store
19 | 
20 | # Ignore node_modules
21 | /node_modules
22 | 


--------------------------------------------------------------------------------
/source/images/prod/middleman-logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500"><path fill="#ECC561" d="M1.3 0h500v500H1.3z"/><path fill="#fff" d="M446 165.2v172.1l-41.7 5.4V233.6l-40.8 76.9h-.9l-43-77.2v119l-49.1 4.4V141.5l52.6 7.4 40.3 76.6 38.3-65.9zm-1-49.5L254 77.2v27.2l191 32.4z"/><path d="M59.9 164.9v170.8l41.7 7.1V234.7l40.8 76.9h.9l43-77.2v116.2l49.2 7.3V141.2l-52.7 7.4-40.3 78.1-38.3-68.8zm-.9-49.2l195-38.5v28.6L59 138.1z" opacity=".25"/><path fill="#fff" d="M445 380.6L254 419v-28.5l191-31z"/><path opacity=".25" d="M59 380.6L254 419v-28.5L59 358.1z"/></svg>


--------------------------------------------------------------------------------
/source/images/dev/middleman-logo.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 500" enable-background="new 0 0 500 500"><g><path fill="#ECC561" d="M1.3 0h500v500H1.3z"/><path fill="#fff" d="M446 165.2v172.1l-41.7 5.4V233.6l-40.8 76.9h-.9l-43-77.2v119l-49.1 4.4V141.5l52.6 7.4 40.3 76.6 38.3-65.9zM445 115.7L254 77.2v27.2l191 32.4z"/><path d="M59.9 164.9v170.8l41.7 7.1V234.7l40.8 76.9h.9l43-77.2v116.2l49.2 7.3V141.2l-52.7 7.4-40.3 78.1-38.3-68.8zM59 115.7l195-38.5v28.6L59 138.1z" opacity=".25"/><path fill="#fff" d="M445 380.6L254 419v-28.5l191-31z"/><path opacity=".25" d="M59 380.6L254 419v-28.5L59 358.1z"/></g></svg>


--------------------------------------------------------------------------------
/Gulpfile.js:
--------------------------------------------------------------------------------
 1 | var gulp = require('gulp'),
 2 |     imagemin = require('gulp-imagemin'),
 3 |     plumber = require('gulp-plumber'),
 4 |     notify = require('gulp-notify');
 5 | 
 6 | gulp.task('imgmin', function () {
 7 |     return gulp.src('source/images/dev/*')
 8 |         .pipe(imagemin({
 9 |             progressive: true,
10 |             svgoPlugins: [{removeViewBox: false}]
11 |         }))
12 |         .pipe(gulp.dest('source/images/prod'));
13 | });
14 | 
15 | gulp.task('watch', function() {
16 |   gulp.watch('source/images/dev/*', ['imgmin']);
17 | });
18 | 
19 | gulp.task('default', ['imgmin', 'watch']);
20 | gulp.task('buildProd', ['imgmin']);
21 | 


--------------------------------------------------------------------------------
/source/layouts/layout.erb:
--------------------------------------------------------------------------------
 1 | <!doctype html>
 2 | <html>
 3 |   <head>
 4 |     <meta content="IE=edge" http-equiv="X-UA-Compatible">
 5 |     <meta charset="utf-8">
 6 |     <meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
 7 | 
 8 |     <!-- Use title if it's in the page YAML frontmatter -->
 9 |     <title><%= current_page.data.title || "Middleman" %></title>
10 | 
11 |     <link href='//fonts.googleapis.com/css?family=Lato:300,400' rel='stylesheet' type='text/css'>
12 | 
13 |     <%= stylesheet_link_tag :site %>
14 |     <%= javascript_include_tag :all %>
15 |   </head>
16 | 
17 |   <body class="<%= page_classes %>">
18 |     <%= yield %>
19 |   </body>
20 | </html>
21 | 


--------------------------------------------------------------------------------
/config.rb:
--------------------------------------------------------------------------------
 1 | ###
 2 | # Page options, layouts, aliases and proxies
 3 | ###
 4 | 
 5 | # Per-page layout changes:
 6 | #
 7 | # With no layout
 8 | page '/*.xml', layout: false
 9 | page '/*.json', layout: false
10 | page '/*.txt', layout: false
11 | 
12 | # With alternative layout
13 | # page "/path/to/file.html", layout: :otherlayout
14 | 
15 | # Proxy pages (http://middlemanapp.com/basics/dynamic-pages/)
16 | # proxy "/this-page-has-no-template.html", "/template-file.html", locals: {
17 | #  which_fake_page: "Rendering a fake page with a local variable" }
18 | 
19 | # General configuration
20 | 
21 | config[:images_dir] = 'images/prod'
22 | 
23 | activate :external_pipeline,
24 |   name: :gulp,
25 |   command: build? ? './node_modules/gulp/bin/gulp.js buildProd' : './node_modules/gulp/bin/gulp.js default',
26 |   source: ".tmp/dist"
27 | 
28 | # Reload the browser automatically whenever files change
29 | configure :development do
30 |   activate :livereload
31 | end
32 | 
33 | ###
34 | # Helpers
35 | ###
36 | 
37 | # Methods defined in the helpers block are available in templates
38 | # helpers do
39 | #   def some_helper
40 | #     "Helping"
41 | #   end
42 | # end
43 | 
44 | # Build-specific configuration
45 | configure :build do
46 |   # Minify CSS on build
47 |   # activate :minify_css
48 | 
49 |   # Minify Javascript on build
50 |   # activate :minify_javascript
51 | 
52 |   # Ignore the source images (pre-optimized)
53 |   ignore 'images/dev/*'
54 | end
55 | 


--------------------------------------------------------------------------------
/source/stylesheets/site.css.scss:
--------------------------------------------------------------------------------
 1 | @charset "utf-8";
 2 | @import "normalize";
 3 | 
 4 | body {
 5 |   background: #ECC561;
 6 |   text-align: center;
 7 |   font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
 8 |   font-size: 1em;
 9 | }
10 | 
11 | .logo img {
12 |   height: 18.75em;
13 |   margin-top: 6em;
14 | }
15 | 
16 | h1 {
17 |   color: rgba(0,0,0,0.5);
18 |   font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
19 |   font-size: 1.8em;
20 |   font-weight: 400;
21 |   margin: 0;
22 | }
23 | 
24 | .doc {
25 |   margin: 3em 0;
26 |   font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
27 |   font-size: 1.1em;
28 |   font-weight: 300;
29 | 
30 |   a {
31 |     border: 1px solid white;
32 |     border-radius: 3px;
33 |     padding: 0.75em 0.7em;
34 |     color: white;
35 |     text-decoration: none;
36 |     transition: color 0.1s linear;
37 |     &:hover {
38 |       background: rgba(0,0,0,0.2);
39 |       color: white;
40 |       transition: all 0.15s linear;
41 |     }
42 |   }
43 | }
44 | 
45 | .welcome {
46 |   -webkit-animation-name: welcome;
47 |   -webkit-animation-duration: .9s;
48 | }
49 | 
50 | @-webkit-keyframes welcome {
51 |   from {
52 |     -webkit-transform: scale(0);
53 |     opacity: 0;
54 |   }
55 |   50% {
56 |    -webkit-transform: scale(0);
57 |    opacity: 0;
58 |   }
59 |   82.5% {
60 |     -webkit-transform: scale(1.03);
61 |     -webkit-animation-timing-function: ease-out;
62 |     opacity: 1;
63 |   }
64 |   to {
65 |     -webkit-transform: scale(1);
66 |   }
67 | }
68 | 


--------------------------------------------------------------------------------
/Gemfile.lock:
--------------------------------------------------------------------------------
  1 | GEM
  2 |   remote: https://rubygems.org/
  3 |   specs:
  4 |     activesupport (4.2.5)
  5 |       i18n (~> 0.7)
  6 |       json (~> 1.7, >= 1.7.7)
  7 |       minitest (~> 5.1)
  8 |       thread_safe (~> 0.3, >= 0.3.4)
  9 |       tzinfo (~> 1.1)
 10 |     addressable (2.4.0)
 11 |     backports (3.6.7)
 12 |     capybara (2.5.0)
 13 |       mime-types (>= 1.16)
 14 |       nokogiri (>= 1.3.3)
 15 |       rack (>= 1.0.0)
 16 |       rack-test (>= 0.5.4)
 17 |       xpath (~> 2.0)
 18 |     coffee-script (2.4.1)
 19 |       coffee-script-source
 20 |       execjs
 21 |     coffee-script-source (1.10.0)
 22 |     compass-import-once (1.0.5)
 23 |       sass (>= 3.2, < 3.5)
 24 |     concurrent-ruby (0.9.2)
 25 |     contracts (0.12.0)
 26 |     em-websocket (0.5.1)
 27 |       eventmachine (>= 0.12.9)
 28 |       http_parser.rb (~> 0.6.0)
 29 |     erubis (2.7.0)
 30 |     eventmachine (1.0.8)
 31 |     execjs (2.6.0)
 32 |     fastimage (1.8.1)
 33 |       addressable (~> 2.3, >= 2.3.5)
 34 |     ffi (1.9.10)
 35 |     haml (4.0.7)
 36 |       tilt
 37 |     hamster (2.0.0)
 38 |       concurrent-ruby (~> 0.8)
 39 |     hashie (3.4.3)
 40 |     http_parser.rb (0.6.0)
 41 |     i18n (0.7.0)
 42 |     json (1.8.3)
 43 |     kramdown (1.9.0)
 44 |     listen (3.0.5)
 45 |       rb-fsevent (>= 0.9.3)
 46 |       rb-inotify (>= 0.9)
 47 |     middleman (4.0.0)
 48 |       coffee-script (~> 2.2)
 49 |       compass-import-once (= 1.0.5)
 50 |       haml (>= 4.0.5)
 51 |       kramdown (~> 1.2)
 52 |       middleman-cli (= 4.0.0)
 53 |       middleman-core (= 4.0.0)
 54 |       sass (>= 3.4.0, < 4.0)
 55 |     middleman-cli (4.0.0)
 56 |       thor (>= 0.17.0, < 2.0)
 57 |     middleman-core (4.0.0)
 58 |       activesupport (~> 4.2)
 59 |       addressable (~> 2.4.0)
 60 |       backports (~> 3.6)
 61 |       bundler (~> 1.1)
 62 |       capybara (~> 2.5.0)
 63 |       contracts (~> 0.12.0)
 64 |       erubis
 65 |       execjs (~> 2.0)
 66 |       fastimage (~> 1.8)
 67 |       hamster (~> 2.0)
 68 |       hashie (~> 3.4)
 69 |       i18n (~> 0.7.0)
 70 |       listen (~> 3.0)
 71 |       padrino-helpers (~> 0.13.0)
 72 |       rack (>= 1.4.5, < 2.0)
 73 |       sass (>= 3.4)
 74 |       tilt (~> 1.4.1)
 75 |       uglifier (~> 2.6)
 76 |     middleman-livereload (3.4.5)
 77 |       em-websocket (~> 0.5.1)
 78 |       middleman-core (>= 3.3)
 79 |       rack-livereload (~> 0.3.15)
 80 |     mime-types (3.0)
 81 |       mime-types-data (~> 3.2015)
 82 |     mime-types-data (3.2015.1120)
 83 |     mini_portile2 (2.0.0)
 84 |     minitest (5.8.3)
 85 |     nokogiri (1.6.7.1)
 86 |       mini_portile2 (~> 2.0.0.rc2)
 87 |     padrino-helpers (0.13.0)
 88 |       i18n (~> 0.6, >= 0.6.7)
 89 |       padrino-support (= 0.13.0)
 90 |       tilt (~> 1.4.1)
 91 |     padrino-support (0.13.0)
 92 |       activesupport (>= 3.1)
 93 |     rack (1.6.4)
 94 |     rack-livereload (0.3.16)
 95 |       rack
 96 |     rack-test (0.6.3)
 97 |       rack (>= 1.0)
 98 |     rb-fsevent (0.9.7)
 99 |     rb-inotify (0.9.5)
100 |       ffi (>= 0.5.0)
101 |     sass (3.4.20)
102 |     sassc (1.8.2)
103 |       bundler
104 |       ffi (~> 1.9.6)
105 |       sass (>= 3.3.0)
106 |     thor (0.19.1)
107 |     thread_safe (0.3.5)
108 |     tilt (1.4.1)
109 |     tzinfo (1.2.2)
110 |       thread_safe (~> 0.1)
111 |     uglifier (2.7.2)
112 |       execjs (>= 0.3.0)
113 |       json (>= 1.8.0)
114 |     xpath (2.0.0)
115 |       nokogiri (~> 1.3)
116 | 
117 | PLATFORMS
118 |   ruby
119 | 
120 | DEPENDENCIES
121 |   middleman (>= 4.0.0)
122 |   middleman-livereload
123 |   sassc
124 |   tzinfo-data
125 |   wdm (~> 0.1.0)
126 | 


--------------------------------------------------------------------------------
/source/stylesheets/_normalize.scss:
--------------------------------------------------------------------------------
  1 | /*! normalize.css v2.0.1 | MIT License | git.io/normalize */
  2 | 
  3 | /* ==========================================================================
  4 |    HTML5 display definitions
  5 |    ========================================================================== */
  6 | 
  7 | /*
  8 |  * Corrects `block` display not defined in IE 8/9.
  9 |  */
 10 | 
 11 | article,
 12 | aside,
 13 | details,
 14 | figcaption,
 15 | figure,
 16 | footer,
 17 | header,
 18 | hgroup,
 19 | nav,
 20 | section,
 21 | summary {
 22 |     display: block;
 23 | }
 24 | 
 25 | /*
 26 |  * Corrects `inline-block` display not defined in IE 8/9.
 27 |  */
 28 | 
 29 | audio,
 30 | canvas,
 31 | video {
 32 |     display: inline-block;
 33 | }
 34 | 
 35 | /*
 36 |  * Prevents modern browsers from displaying `audio` without controls.
 37 |  * Remove excess height in iOS 5 devices.
 38 |  */
 39 | 
 40 | audio:not([controls]) {
 41 |     display: none;
 42 |     height: 0;
 43 | }
 44 | 
 45 | /*
 46 |  * Addresses styling for `hidden` attribute not present in IE 8/9.
 47 |  */
 48 | 
 49 | [hidden] {
 50 |     display: none;
 51 | }
 52 | 
 53 | /* ==========================================================================
 54 |    Base
 55 |    ========================================================================== */
 56 | 
 57 | /*
 58 |  * 1. Sets default font family to sans-serif.
 59 |  * 2. Prevents iOS text size adjust after orientation change, without disabling
 60 |  *    user zoom.
 61 |  */
 62 | 
 63 | html {
 64 |     font-family: sans-serif; /* 1 */
 65 |     -webkit-text-size-adjust: 100%; /* 2 */
 66 |     -ms-text-size-adjust: 100%; /* 2 */
 67 | }
 68 | 
 69 | /*
 70 |  * Removes default margin.
 71 |  */
 72 | 
 73 | body {
 74 |     margin: 0;
 75 | }
 76 | 
 77 | /* ==========================================================================
 78 |    Links
 79 |    ========================================================================== */
 80 | 
 81 | /*
 82 |  * Addresses `outline` inconsistency between Chrome and other browsers.
 83 |  */
 84 | 
 85 | a:focus {
 86 |     outline: thin dotted;
 87 | }
 88 | 
 89 | /*
 90 |  * Improves readability when focused and also mouse hovered in all browsers.
 91 |  */
 92 | 
 93 | a:active,
 94 | a:hover {
 95 |     outline: 0;
 96 | }
 97 | 
 98 | /* ==========================================================================
 99 |    Typography
100 |    ========================================================================== */
101 | 
102 | /*
103 |  * Addresses `h1` font sizes within `section` and `article` in Firefox 4+,
104 |  * Safari 5, and Chrome.
105 |  */
106 | 
107 | h1 {
108 |     font-size: 2em;
109 | }
110 | 
111 | /*
112 |  * Addresses styling not present in IE 8/9, Safari 5, and Chrome.
113 |  */
114 | 
115 | abbr[title] {
116 |     border-bottom: 1px dotted;
117 | }
118 | 
119 | /*
120 |  * Addresses style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
121 |  */
122 | 
123 | b,
124 | strong {
125 |     font-weight: bold;
126 | }
127 | 
128 | /*
129 |  * Addresses styling not present in Safari 5 and Chrome.
130 |  */
131 | 
132 | dfn {
133 |     font-style: italic;
134 | }
135 | 
136 | /*
137 |  * Addresses styling not present in IE 8/9.
138 |  */
139 | 
140 | mark {
141 |     background: #ff0;
142 |     color: #000;
143 | }
144 | 
145 | 
146 | /*
147 |  * Corrects font family set oddly in Safari 5 and Chrome.
148 |  */
149 | 
150 | code,
151 | kbd,
152 | pre,
153 | samp {
154 |     font-family: monospace, serif;
155 |     font-size: 1em;
156 | }
157 | 
158 | /*
159 |  * Improves readability of pre-formatted text in all browsers.
160 |  */
161 | 
162 | pre {
163 |     white-space: pre;
164 |     white-space: pre-wrap;
165 |     word-wrap: break-word;
166 | }
167 | 
168 | /*
169 |  * Sets consistent quote types.
170 |  */
171 | 
172 | q {
173 |     quotes: "\201C" "\201D" "\2018" "\2019";
174 | }
175 | 
176 | /*
177 |  * Addresses inconsistent and variable font size in all browsers.
178 |  */
179 | 
180 | small {
181 |     font-size: 80%;
182 | }
183 | 
184 | /*
185 |  * Prevents `sub` and `sup` affecting `line-height` in all browsers.
186 |  */
187 | 
188 | sub,
189 | sup {
190 |     font-size: 75%;
191 |     line-height: 0;
192 |     position: relative;
193 |     vertical-align: baseline;
194 | }
195 | 
196 | sup {
197 |     top: -0.5em;
198 | }
199 | 
200 | sub {
201 |     bottom: -0.25em;
202 | }
203 | 
204 | /* ==========================================================================
205 |    Embedded content
206 |    ========================================================================== */
207 | 
208 | /*
209 |  * Removes border when inside `a` element in IE 8/9.
210 |  */
211 | 
212 | img {
213 |     border: 0;
214 | }
215 | 
216 | /*
217 |  * Corrects overflow displayed oddly in IE 9.
218 |  */
219 | 
220 | svg:not(:root) {
221 |     overflow: hidden;
222 | }
223 | 
224 | /* ==========================================================================
225 |    Figures
226 |    ========================================================================== */
227 | 
228 | /*
229 |  * Addresses margin not present in IE 8/9 and Safari 5.
230 |  */
231 | 
232 | figure {
233 |     margin: 0;
234 | }
235 | 
236 | /* ==========================================================================
237 |    Forms
238 |    ========================================================================== */
239 | 
240 | /*
241 |  * Define consistent border, margin, and padding.
242 |  */
243 | 
244 | fieldset {
245 |     border: 1px solid #c0c0c0;
246 |     margin: 0 2px;
247 |     padding: 0.35em 0.625em 0.75em;
248 | }
249 | 
250 | /*
251 |  * 1. Corrects color not being inherited in IE 8/9.
252 |  * 2. Remove padding so people aren't caught out if they zero out fieldsets.
253 |  */
254 | 
255 | legend {
256 |     border: 0; /* 1 */
257 |     padding: 0; /* 2 */
258 | }
259 | 
260 | /*
261 |  * 1. Corrects font family not being inherited in all browsers.
262 |  * 2. Corrects font size not being inherited in all browsers.
263 |  * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome
264 |  */
265 | 
266 | button,
267 | input,
268 | select,
269 | textarea {
270 |     font-family: inherit; /* 1 */
271 |     font-size: 100%; /* 2 */
272 |     margin: 0; /* 3 */
273 | }
274 | 
275 | /*
276 |  * Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
277 |  * the UA stylesheet.
278 |  */
279 | 
280 | button,
281 | input {
282 |     line-height: normal;
283 | }
284 | 
285 | /*
286 |  * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
287 |  *    and `video` controls.
288 |  * 2. Corrects inability to style clickable `input` types in iOS.
289 |  * 3. Improves usability and consistency of cursor style between image-type
290 |  *    `input` and others.
291 |  */
292 | 
293 | button,
294 | html input[type="button"], /* 1 */
295 | input[type="reset"],
296 | input[type="submit"] {
297 |     -webkit-appearance: button; /* 2 */
298 |     cursor: pointer; /* 3 */
299 | }
300 | 
301 | /*
302 |  * Re-set default cursor for disabled elements.
303 |  */
304 | 
305 | button[disabled],
306 | input[disabled] {
307 |     cursor: default;
308 | }
309 | 
310 | /*
311 |  * 1. Addresses box sizing set to `content-box` in IE 8/9.
312 |  * 2. Removes excess padding in IE 8/9.
313 |  */
314 | 
315 | input[type="checkbox"],
316 | input[type="radio"] {
317 |     box-sizing: border-box; /* 1 */
318 |     padding: 0; /* 2 */
319 | }
320 | 
321 | /*
322 |  * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
323 |  * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
324 |  *    (include `-moz` to future-proof).
325 |  */
326 | 
327 | input[type="search"] {
328 |     -webkit-appearance: textfield; /* 1 */
329 |     -moz-box-sizing: content-box;
330 |     -webkit-box-sizing: content-box; /* 2 */
331 |     box-sizing: content-box;
332 | }
333 | 
334 | /*
335 |  * Removes inner padding and search cancel button in Safari 5 and Chrome
336 |  * on OS X.
337 |  */
338 | 
339 | input[type="search"]::-webkit-search-cancel-button,
340 | input[type="search"]::-webkit-search-decoration {
341 |     -webkit-appearance: none;
342 | }
343 | 
344 | /*
345 |  * Removes inner padding and border in Firefox 4+.
346 |  */
347 | 
348 | button::-moz-focus-inner,
349 | input::-moz-focus-inner {
350 |     border: 0;
351 |     padding: 0;
352 | }
353 | 
354 | /*
355 |  * 1. Removes default vertical scrollbar in IE 8/9.
356 |  * 2. Improves readability and alignment in all browsers.
357 |  */
358 | 
359 | textarea {
360 |     overflow: auto; /* 1 */
361 |     vertical-align: top; /* 2 */
362 | }
363 | 
364 | /* ==========================================================================
365 |    Tables
366 |    ========================================================================== */
367 | 
368 | /*
369 |  * Remove most spacing between table cells.
370 |  */
371 | 
372 | table {
373 |     border-collapse: collapse;
374 |     border-spacing: 0;
375 | }


--------------------------------------------------------------------------------