html5_layout 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. data/.gitignore +4 -0
  2. data/Gemfile +4 -0
  3. data/Gemfile.lock +107 -0
  4. data/README.markdown +29 -0
  5. data/Rakefile +2 -0
  6. data/features/html5_layout.feature +43 -0
  7. data/features/step_definitions/common_steps.rb +37 -0
  8. data/features/step_definitions/rails_setup_steps.rb +6 -0
  9. data/features/support/env.rb +6 -0
  10. data/features/support/matchers.rb +7 -0
  11. data/html5_layout.gemspec +26 -0
  12. data/lib/generators/html5_layout/USAGE +22 -0
  13. data/lib/generators/html5_layout/html5_layout_generator.rb +40 -0
  14. data/lib/generators/html5_layout/templates/app/stylesheets/_html5_reset.sass +333 -0
  15. data/lib/generators/html5_layout/templates/app/stylesheets/_text.sass +49 -0
  16. data/lib/generators/html5_layout/templates/app/stylesheets/application.sass +63 -0
  17. data/lib/generators/html5_layout/templates/app/stylesheets/grid.sass +20 -0
  18. data/lib/generators/html5_layout/templates/app/stylesheets/handheld.sass +5 -0
  19. data/lib/generators/html5_layout/templates/config/compass.rb +17 -0
  20. data/lib/generators/html5_layout/templates/config/initializers/compass.rb +3 -0
  21. data/lib/generators/html5_layout/templates/dd_belatedpng.js +328 -0
  22. data/lib/generators/html5_layout/templates/handheld.css +7 -0
  23. data/lib/generators/html5_layout/templates/jquery-1.4.2.min.js +154 -0
  24. data/lib/generators/html5_layout/templates/layout.html.erb +58 -0
  25. data/lib/generators/html5_layout/templates/layout_helper.rb +22 -0
  26. data/lib/generators/html5_layout/templates/modernizr-1.5.min.js +28 -0
  27. data/lib/generators/html5_layout/templates/stylesheet.css +170 -0
  28. data/lib/html5_layout.rb +3 -0
  29. data/lib/html5_layout/version.rb +3 -0
  30. metadata +163 -0
@@ -0,0 +1,4 @@
1
+ pkg/*
2
+ *.gem
3
+ .bundle
4
+ tmp/
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source "http://rubygems.org"
2
+
3
+ # Specify your gem's dependencies in html5_layout.gemspec
4
+ gemspec
@@ -0,0 +1,107 @@
1
+ PATH
2
+ remote: .
3
+ specs:
4
+ html5_layout (0.0.1)
5
+ bundler (~> 1.0.2)
6
+ cucumber (~> 0.9.4)
7
+ rails (~> 3.0.1)
8
+ rspec (~> 2.0.1)
9
+
10
+ GEM
11
+ remote: http://rubygems.org/
12
+ specs:
13
+ abstract (1.0.0)
14
+ actionmailer (3.0.1)
15
+ actionpack (= 3.0.1)
16
+ mail (~> 2.2.5)
17
+ actionpack (3.0.1)
18
+ activemodel (= 3.0.1)
19
+ activesupport (= 3.0.1)
20
+ builder (~> 2.1.2)
21
+ erubis (~> 2.6.6)
22
+ i18n (~> 0.4.1)
23
+ rack (~> 1.2.1)
24
+ rack-mount (~> 0.6.12)
25
+ rack-test (~> 0.5.4)
26
+ tzinfo (~> 0.3.23)
27
+ activemodel (3.0.1)
28
+ activesupport (= 3.0.1)
29
+ builder (~> 2.1.2)
30
+ i18n (~> 0.4.1)
31
+ activerecord (3.0.1)
32
+ activemodel (= 3.0.1)
33
+ activesupport (= 3.0.1)
34
+ arel (~> 1.0.0)
35
+ tzinfo (~> 0.3.23)
36
+ activeresource (3.0.1)
37
+ activemodel (= 3.0.1)
38
+ activesupport (= 3.0.1)
39
+ activesupport (3.0.1)
40
+ arel (1.0.1)
41
+ activesupport (~> 3.0.0)
42
+ builder (2.1.2)
43
+ cucumber (0.9.4)
44
+ builder (~> 2.1.2)
45
+ diff-lcs (~> 1.1.2)
46
+ gherkin (~> 2.2.9)
47
+ json (~> 1.4.6)
48
+ term-ansicolor (~> 1.0.5)
49
+ diff-lcs (1.1.2)
50
+ erubis (2.6.6)
51
+ abstract (>= 1.0.0)
52
+ gherkin (2.2.9)
53
+ json (~> 1.4.6)
54
+ term-ansicolor (~> 1.0.5)
55
+ i18n (0.4.2)
56
+ json (1.4.6)
57
+ mail (2.2.9)
58
+ activesupport (>= 2.3.6)
59
+ i18n (~> 0.4.1)
60
+ mime-types (~> 1.16)
61
+ treetop (~> 1.4.8)
62
+ mime-types (1.16)
63
+ polyglot (0.3.1)
64
+ rack (1.2.1)
65
+ rack-mount (0.6.13)
66
+ rack (>= 1.0.0)
67
+ rack-test (0.5.6)
68
+ rack (>= 1.0)
69
+ rails (3.0.1)
70
+ actionmailer (= 3.0.1)
71
+ actionpack (= 3.0.1)
72
+ activerecord (= 3.0.1)
73
+ activeresource (= 3.0.1)
74
+ activesupport (= 3.0.1)
75
+ bundler (~> 1.0.0)
76
+ railties (= 3.0.1)
77
+ railties (3.0.1)
78
+ actionpack (= 3.0.1)
79
+ activesupport (= 3.0.1)
80
+ rake (>= 0.8.4)
81
+ thor (~> 0.14.0)
82
+ rake (0.8.7)
83
+ rspec (2.0.1)
84
+ rspec-core (~> 2.0.1)
85
+ rspec-expectations (~> 2.0.1)
86
+ rspec-mocks (~> 2.0.1)
87
+ rspec-core (2.0.1)
88
+ rspec-expectations (2.0.1)
89
+ diff-lcs (>= 1.1.2)
90
+ rspec-mocks (2.0.1)
91
+ rspec-core (~> 2.0.1)
92
+ rspec-expectations (~> 2.0.1)
93
+ term-ansicolor (1.0.5)
94
+ thor (0.14.4)
95
+ treetop (1.4.8)
96
+ polyglot (>= 0.3.1)
97
+ tzinfo (0.3.23)
98
+
99
+ PLATFORMS
100
+ ruby
101
+
102
+ DEPENDENCIES
103
+ bundler (~> 1.0.2)
104
+ cucumber (~> 0.9.4)
105
+ html5_layout!
106
+ rails (~> 3.0.1)
107
+ rspec (~> 2.0.1)
@@ -0,0 +1,29 @@
1
+ # HTML5 Layout Generator for Rails 3
2
+
3
+ It is a HTML5 layuout generator that generates the layout file based upon the HTML5 Boilerplate (http://github.com/paulirish/html5-boilerplate) code.
4
+
5
+ The generator takes one argument which will be the name of the layout and stylesheet files. If no argument is passed then it defaults to "application".
6
+
7
+ ### Usage info:
8
+ rails g html5_layout -h
9
+
10
+ ### Example:
11
+ rails generate html5_layout admin
12
+
13
+ This will create:
14
+ create public/stylesheets/admin.css
15
+ create public/stylesheets/handheld.css
16
+ create public/javascripts/modernizr-1.5.min.js
17
+ create public/javascripts/jquery-1.4.2.min.js
18
+ create public/javascripts/dd_belatedpng.js
19
+ create app/views/layouts/admin.html.erb
20
+
21
+ rails g html5_layout --sass
22
+
23
+ This will add two gems, compass and compass-960-plugin, in the Gemfile. So, you need to run `bundle install`.
24
+ The generator will also add 3 layout helpers to use in the views.
25
+ * To set the title of the page, you can call `<%= title "The page title" %>`
26
+ * To add js files in the layout, use `<% javascript "foo, bar" %>`
27
+ * To add stylesheet files, use `<% stylesheet "foo, bar" %>`
28
+
29
+ This generator is heavily based upon the Ryan Bates's NiftyGenerators.
@@ -0,0 +1,2 @@
1
+ require 'bundler'
2
+ Bundler::GemHelper.install_tasks
@@ -0,0 +1,43 @@
1
+ Feature: HTML5 Boilerplate Layout Generator
2
+ In order to have a layout
3
+ As a rails developer
4
+ I want to generate a simple html5 layout
5
+
6
+ Scenario: Generate normal application layout
7
+ Given a new Rails app
8
+ When I run "rails g html5_layout -f"
9
+ Then I should see "stylesheet_link_tag "application"" in file "app/views/layouts/application.html.erb"
10
+ And I should see "stylesheet_link_tag "handheld"" in file "app/views/layouts/application.html.erb"
11
+ # And I should see file "app/helpers/layout_helper.rb"
12
+ # And I should see file "app/helpers/error_messages_helper.rb"
13
+ And I should see file "public/stylesheets/application.css"
14
+ And I should see file "public/stylesheets/handheld.css"
15
+ And I should see file "public/javascripts/dd_belatedpng.js"
16
+ And I should see file "public/javascripts/jquery-1.4.2.min.js"
17
+ And I should see file "public/javascripts/modernizr-1.5.min.js"
18
+ And I should see file "app/helpers/layout_helper.rb"
19
+
20
+ Scenario: Generate named layout
21
+ Given a new Rails app
22
+ When I run "rails g html5_layout foo -f"
23
+ Then I should see "stylesheet_link_tag "foo"" in file "app/views/layouts/foo.html.erb"
24
+ And I should see "stylesheet_link_tag "handheld"" in file "app/views/layouts/foo.html.erb"
25
+ And I should see file "public/stylesheets/foo.css"
26
+ And I should see file "app/helpers/layout_helper.rb"
27
+ And I should see "foo" in file "app/views/layouts/foo.html.erb"
28
+
29
+ Scenario: Generate normal application layout with the sass option
30
+ Given a new Rails app
31
+ When I run "rails g html5_layout -f --sass"
32
+ Then I should see "stylesheet_link_tag "application"" in file "app/views/layouts/application.html.erb"
33
+ And I should see "stylesheet_link_tag "handheld"" in file "app/views/layouts/application.html.erb"
34
+ And I should see file "app/stylesheets/application.sass"
35
+ And I should see file "app/stylesheets/handheld.sass"
36
+ And I should see file "config/compass.rb"
37
+ And I should see file "config/initializers/compass.rb"
38
+ And I should see "gem "compass", ">=0.10.5"" in file "Gemfile"
39
+ And I should see "gem "compass-960-plugin", ">=0.10.0"" in file "Gemfile"
40
+ And I should see file "public/javascripts/dd_belatedpng.js"
41
+ And I should see file "public/javascripts/jquery-1.4.2.min.js"
42
+ And I should see file "public/javascripts/modernizr-1.5.min.js"
43
+ And I should see file "app/helpers/layout_helper.rb"
@@ -0,0 +1,37 @@
1
+ When /^I run "([^\"]*)"$/ do |command|
2
+ system("cd #{@current_directory} && #{command}").should be_true
3
+ end
4
+
5
+ When /^I add "([^\"]*)" to file "([^\"]*)"$/ do |content, short_path|
6
+ path = File.join(@current_directory, short_path)
7
+ File.should exist(path)
8
+ File.open(path, 'a') { |f| f.write(content + "\n") }
9
+ end
10
+
11
+ Then /^I should see file "([^\"]*)"$/ do |path|
12
+ File.should exist(File.join(@current_directory, path))
13
+ end
14
+
15
+ Then /^I should see "(.*)" in file "([^\"]*)"$/ do |content, short_path|
16
+ path = File.join(@current_directory, short_path)
17
+ File.should exist(path)
18
+ File.readlines(path).join.should include(content)
19
+ end
20
+
21
+ Then /^I should see the following files$/ do |table|
22
+ table.raw.flatten.each do |path|
23
+ File.should exist(File.join(@current_directory, path))
24
+ end
25
+ end
26
+
27
+ Then /^I should see the following in file "([^\"]*)"$/ do |short_path, table|
28
+ path = File.join(@current_directory, short_path)
29
+ File.should exist(path)
30
+ table.raw.flatten.each do |content|
31
+ File.readlines(path).join.should include(content)
32
+ end
33
+ end
34
+
35
+ Then /^I should successfully run "([^\"]*)"$/ do |command|
36
+ system("cd #{@current_directory} && #{command}").should be_true
37
+ end
@@ -0,0 +1,6 @@
1
+ Given /^a new Rails app$/ do
2
+ FileUtils.mkdir_p("tmp")
3
+ system("rails new tmp/rails_app").should be_true
4
+ system("ln -s ../../../lib/generators tmp/rails_app/lib/generators").should be_true
5
+ @current_directory = File.expand_path("tmp/rails_app")
6
+ end
@@ -0,0 +1,6 @@
1
+ require 'cucumber'
2
+ require 'rspec'
3
+
4
+ Before do
5
+ FileUtils.rm_rf "tmp/rails_app"
6
+ end
@@ -0,0 +1,7 @@
1
+ RSpec::Matchers.define :exist do |path|
2
+ match do
3
+ File.exist?(path)
4
+ end
5
+ failure_message_for_should { "Expected #{path} to exist but no file found" }
6
+ failure_message_for_should_not { "Expected #{path} to not exist but file was found" }
7
+ end
@@ -0,0 +1,26 @@
1
+ # -*- encoding: utf-8 -*-
2
+ $:.push File.expand_path("../lib", __FILE__)
3
+ require "html5_layout/version"
4
+
5
+ Gem::Specification.new do |s|
6
+ s.name = "html5_layout"
7
+ s.version = Html5Layout::VERSION
8
+ s.platform = Gem::Platform::RUBY
9
+ s.authors = ["Millisami"]
10
+ s.email = ["millisami@gmail.com"]
11
+ s.homepage = "http://rubygems.org/gems/html5_layout_generator"
12
+ s.summary = %q{Rails layout generator based upon the HTML5 Boilerplate Layout}
13
+ s.description = %q{Generates HTML5 Boilerplate layout for Rails 3 app}
14
+
15
+ s.rubyforge_project = "html5_layout"
16
+
17
+ s.files = `git ls-files`.split("\n")
18
+ s.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
19
+ s.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
20
+ s.require_paths = ["lib"]
21
+
22
+ s.add_dependency('rails', '~> 3.0.1')
23
+ s.add_dependency('cucumber', '~> 0.9.4')
24
+ s.add_dependency('rspec', '~> 2.0.1')
25
+ s.add_dependency('bundler', '~> 1.0.2')
26
+ end
@@ -0,0 +1,22 @@
1
+ Description:
2
+ This generates the layout file based upon the HTML5 Boilerplate (http://github.com/paulirish/html5-boilerplate) code.
3
+ The generator takes one argument which will be the name of the layout and stylesheet files. If no argument is passed then it defaults to "application".
4
+
5
+ Help:
6
+ rails g html5_layout -h
7
+
8
+ Example:
9
+ rails generate html5_layout admin
10
+
11
+ This will create:
12
+ create public/stylesheets/admin.css
13
+ create public/stylesheets/handheld.css
14
+ create public/javascripts/modernizr-1.5.min.js
15
+ create public/javascripts/jquery-1.4.2.min.js
16
+ create public/javascripts/dd_belatedpng.js
17
+ create app/views/layouts/admin.html.erb
18
+
19
+ rails g html5_layout --sass
20
+
21
+ This will add two gems, compass and compass-960-plugin, in the Gemfile. So, you need to run `bundle install`.
22
+ The generator will also add layout helpers to use.
@@ -0,0 +1,40 @@
1
+ require 'rails/generators/base'
2
+ class Html5LayoutGenerator < Rails::Generators::Base
3
+
4
+ def self.source_root
5
+ @source_root ||= File.join(File.dirname(__FILE__), 'templates')
6
+ end
7
+
8
+ argument :layout_name, :type => :string, :default => "application"
9
+ class_option :stylesheet, :type => :boolean, :default => true, :desc => "Include stylesheet file"
10
+ class_option :sass, :type => :boolean, :desc => "Include the SASS version for CSS"
11
+ # class_option :haml, :type => :boolean, :desc => "Include the SASS version for CSS"
12
+
13
+ def generate_layout
14
+ if options.sass?
15
+ directory 'app'
16
+ gem 'compass', '>=0.10.5'
17
+ gem 'compass-960-plugin', '>=0.10.0'
18
+ directory 'config'
19
+ else
20
+ copy_file "stylesheet.css", "public/stylesheets/#{file_name}.css" if options.stylesheet?
21
+ copy_file "handheld.css", "public/stylesheets/handheld.css" if options.stylesheet?
22
+ end
23
+ copy_file "modernizr-1.5.min.js", "public/javascripts/modernizr-1.5.min.js"
24
+ copy_file "jquery-1.4.2.min.js", "public/javascripts/jquery-1.4.2.min.js"
25
+ copy_file "dd_belatedpng.js", "public/javascripts/dd_belatedpng.js"
26
+
27
+ template "layout.html.erb", "app/views/layouts/#{file_name}.html.erb"
28
+ copy_file 'layout_helper.rb', 'app/helpers/layout_helper.rb'
29
+ end
30
+
31
+ private
32
+
33
+ def file_name
34
+ layout_name.underscore
35
+ end
36
+
37
+ def app_name
38
+ Rails.application.class.name
39
+ end
40
+ end
@@ -0,0 +1,333 @@
1
+ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video
2
+ margin: 0
3
+ padding: 0
4
+ border: 0
5
+ outline: 0
6
+ font-size: 100%
7
+ vertical-align: baseline
8
+ background: transparent
9
+
10
+ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
11
+ display: block
12
+
13
+ nav ul
14
+ list-style: none
15
+
16
+ blockquote, q
17
+ quotes: none
18
+
19
+ blockquote
20
+ &:before, &:after
21
+ content: ''
22
+ content: none
23
+
24
+ q
25
+ &:before, &:after
26
+ content: ''
27
+ content: none
28
+
29
+ a
30
+ margin: 0
31
+ padding: 0
32
+ font-size: 100%
33
+ vertical-align: baseline
34
+ background: transparent
35
+
36
+ ins
37
+ background-color: #ff9
38
+ color: #000
39
+ text-decoration: none
40
+
41
+ mark
42
+ background-color: #ff9
43
+ color: #000
44
+ font-style: italic
45
+ font-weight: bold
46
+
47
+ del
48
+ text-decoration: line-through
49
+
50
+ abbr[title], dfn[title]
51
+ border-bottom: 1px dotted
52
+ cursor: help
53
+
54
+ // tables still need cellspacing="0" in the markup
55
+
56
+ table
57
+ border-collapse: collapse
58
+ border-spacing: 0
59
+
60
+ hr
61
+ display: block
62
+ height: 1px
63
+ border: 0
64
+ border-top: 1px solid #ccc
65
+ margin: 1em 0
66
+ padding: 0
67
+
68
+ input, select
69
+ vertical-align: middle
70
+
71
+ // END RESET CSS
72
+
73
+ body
74
+ font: 13px/1.231 sans-serif
75
+ *font-size: small
76
+
77
+ // hack retained to preserve specificity
78
+
79
+ select, input, textarea, button
80
+ font: 99% sans-serif
81
+
82
+ // normalize monospace sizing
83
+ // en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome
84
+
85
+ pre, code, kbd, samp
86
+ font-family: monospace, sans-serif
87
+
88
+ // minimal base styles
89
+
90
+ body, select, input, textarea
91
+ // #444 looks better than black: twitter.com/H_FJ/statuses/11800719859
92
+ color: #444
93
+ // Headers (h1,h2,etc) have no default font-size or margin,
94
+ // you'll want to define those yourself.
95
+
96
+ h1, h2, h3, h4, h5, h6
97
+ font-weight: bold
98
+
99
+ // always force a scrollbar in non-IE
100
+
101
+ html
102
+ overflow-y: scroll
103
+
104
+ // Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test
105
+
106
+ a
107
+ &:hover
108
+ outline: none
109
+ &:active
110
+ outline: none
111
+ color: #607890
112
+ color: #607890
113
+ &:visited
114
+ color: #607890
115
+ &:hover
116
+ color: #036
117
+
118
+ ul
119
+ margin-left: 1.8em
120
+
121
+ ol
122
+ margin-left: 1.8em
123
+ list-style-type: decimal
124
+
125
+ small
126
+ font-size: 85%
127
+
128
+ strong, th
129
+ font-weight: bold
130
+
131
+ td
132
+ vertical-align: top
133
+ img
134
+ vertical-align: top
135
+
136
+ sub
137
+ vertical-align: sub
138
+ font-size: smaller
139
+
140
+ sup
141
+ vertical-align: super
142
+ font-size: smaller
143
+
144
+ pre
145
+ padding: 15px
146
+ // www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/
147
+ white-space: pre
148
+ // CSS2
149
+ white-space: pre-wrap
150
+ // CSS 2.1
151
+ white-space: pre-line
152
+ // CSS 3 (and 2.1 as well, actually)
153
+ word-wrap: break-word
154
+ // IE
155
+
156
+ textarea
157
+ overflow: auto
158
+
159
+ // thnx ivannikolic! www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/
160
+
161
+ .ie6 legend, .ie7 legend
162
+ margin-left: -7px
163
+
164
+ // thnx ivannikolic!
165
+
166
+ // align checkboxes, radios, text inputs with their label
167
+ // by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css
168
+
169
+ input
170
+ &[type="radio"]
171
+ vertical-align: text-bottom
172
+ &[type="checkbox"]
173
+ vertical-align: bottom
174
+
175
+ .ie7 input[type="checkbox"]
176
+ vertical-align: baseline
177
+
178
+ .ie6 input
179
+ vertical-align: text-bottom
180
+
181
+ // hand cursor on clickable input elements
182
+
183
+ label
184
+ cursor: pointer
185
+
186
+ input
187
+ &[type=button], &[type=submit]
188
+ cursor: pointer
189
+
190
+ button
191
+ cursor: pointer
192
+ margin: 0
193
+
194
+ // webkit browsers add a 2px margin outside the chrome of form elements
195
+
196
+ input, select, textarea
197
+ margin: 0
198
+
199
+ // colors for form validity
200
+
201
+ input:valid, textarea:valid
202
+
203
+ input:invalid, textarea:invalid
204
+ border-radius: 1px
205
+ -moz-box-shadow: 0px 0px 5px red
206
+ -webkit-box-shadow: 0px 0px 5px red
207
+ box-shadow: 0px 0px 5px red
208
+
209
+ .no-boxshadow
210
+ input:invalid, textarea:invalid
211
+ background-color: #f0dddd
212
+
213
+ // These selection declarations have to be separate.
214
+ * No text-shadow: twitter.com/miketaylr/status/12228805301
215
+ * Also: hot pink.
216
+
217
+
218
+ ::-moz-selection, ::selection
219
+ background: #FF5E99
220
+ color: #fff
221
+ text-shadow: none
222
+
223
+ // j.mp/webkit-tap-highlight-color
224
+
225
+ a:link
226
+ -webkit-tap-highlight-color: #FF5E99
227
+
228
+ // make buttons play nice in IE:
229
+ * www.viget.com/inspire/styling-the-button-element-in-internet-explorer/
230
+
231
+ button
232
+ width: auto
233
+ overflow: visible
234
+
235
+ // bicubic resizing for non-native sized IMG:
236
+ * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
237
+
238
+ .ie7 img
239
+ -ms-interpolation-mode: bicubic
240
+
241
+ //
242
+ * Non-semantic helper classes
243
+
244
+ // for image replacement
245
+
246
+ .ir
247
+ display: block
248
+ text-indent: -999em
249
+ overflow: hidden
250
+ background-repeat: no-repeat
251
+ text-align: left
252
+ direction: ltr
253
+
254
+ // Hide for both screenreaders and browsers
255
+ * css-discuss.incutio.com/wiki/Screenreader_Visibility
256
+
257
+ .hidden
258
+ display: none
259
+ visibility: hidden
260
+
261
+ // Hide only visually, but have it available for screenreaders
262
+ * www.webaim.org/techniques/css/invisiblecontent/
263
+ * Solution from: j.mp/visuallyhidden - Thanks Jonathan Neal!
264
+
265
+ .visuallyhidden
266
+ position: absolute !important
267
+ clip: rect(1px 1px 1px 1px)
268
+ // IE6, IE7
269
+ clip: rect(1px, 1px, 1px, 1px)
270
+
271
+ // Hide visually and from screenreaders, but maintain layout
272
+
273
+ .invisible
274
+ visibility: hidden
275
+
276
+ // >> The Magnificent CLEARFIX << j.mp/phayesclearfix
277
+
278
+ .clearfix
279
+ &:after
280
+ content: "\0020"
281
+ display: block
282
+ height: 0
283
+ clear: both
284
+ visibility: hidden
285
+ zoom: 1
286
+
287
+ // Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page
288
+
289
+ // print styles
290
+ @media print
291
+ *
292
+ background: transparent !important
293
+ color: #444 !important
294
+ text-shadow: none
295
+ a
296
+ color: #444 !important
297
+ text-decoration: underline
298
+ &:visited
299
+ color: #444 !important
300
+ text-decoration: underline
301
+ &:after
302
+ content: " (" attr(href) ")"
303
+ abbr:after
304
+ content: " (" attr(title) ")"
305
+ .ir a:after
306
+ content: ""
307
+ // Don't show links for images
308
+ pre, blockquote
309
+ border: 1px solid #999
310
+ page-break-inside: avoid
311
+ img
312
+ page-break-inside: avoid
313
+ @page
314
+ margin: 0.5cm
315
+
316
+ p, h2, h3
317
+ orphans: 3
318
+ widows: 3
319
+ h2, h3
320
+ page-break-after: avoid
321
+
322
+
323
+ @media all and (orientation:portrait)
324
+
325
+
326
+ @media all and (orientation:landscape)
327
+
328
+
329
+ // Grade-A Mobile Browsers
330
+ @media screen and (max-device-width: 480px)
331
+ html
332
+ -webkit-text-size-adjust: none
333
+ -ms-text-size-adjust: none