sass-media_query_combiner 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,17 @@
1
+ *.gem
2
+ *.rbc
3
+ .bundle
4
+ .config
5
+ .yardoc
6
+ Gemfile.lock
7
+ InstalledFiles
8
+ _yardoc
9
+ coverage
10
+ doc/
11
+ lib/bundler/man
12
+ pkg
13
+ rdoc
14
+ spec/reports
15
+ test/tmp
16
+ test/version_tmp
17
+ tmp
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in sass-media_query_combiner.gemspec
4
+ gemspec
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2012 Aaron Jensen
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
@@ -0,0 +1,90 @@
1
+ # Sass::MediaQueryCombiner
2
+
3
+ Combines all matching media queries while compiling your Sass.
4
+
5
+ If you're using
6
+ Rails 3.1+ or Sprockets, you should use [sprockets-media_query_combiner](https://github.com/aaronjensen/sprockets-media_query_combiner)
7
+
8
+ For example:
9
+
10
+ ```css
11
+ h3 {
12
+ color: orange
13
+ }
14
+ @media (max-width: 480px) {
15
+ h1 {
16
+ color: red
17
+ }
18
+ }
19
+ @media (max-width: 980px) {
20
+ h4 {
21
+ color: black
22
+ }
23
+ }
24
+ @media (max-width: 480px) {
25
+ h2 {
26
+ color: blue
27
+ }
28
+ }
29
+ ```
30
+
31
+ Would end up as (except the whitespace won't be so clean):
32
+
33
+ ```css
34
+ h3 {
35
+ color: orange
36
+ }
37
+ @media (max-width: 480px) {
38
+ h1 {
39
+ color: red
40
+ }
41
+ h2 {
42
+ color: blue
43
+ }
44
+ }
45
+ @media (max-width: 980px) {
46
+ h4 {
47
+ color: black
48
+ }
49
+ }
50
+ ```
51
+
52
+ ### Note
53
+
54
+ **This will change the order of your css, so be aware of that.** All the
55
+ `@media` queries will end up at the end of each css file in the order that
56
+ they are first encountered. In other words, if you're relying on only using
57
+ min-width or only using max-width in a specific order you'll want to be sure
58
+ define your media queries in the right order up front before you use them
59
+ randomly throughout your file.
60
+
61
+ ## Installation
62
+
63
+ Add this line to your application's Gemfile:
64
+
65
+ gem 'sass-media_query_combiner'
66
+
67
+ And then execute:
68
+
69
+ $ bundle
70
+
71
+ Or install it yourself as:
72
+
73
+ $ gem install sass-media_query_combiner
74
+
75
+ ## Usage
76
+
77
+ It should just work as long as `sass-media_query_combiner` is required. If you're using
78
+ `sass --watch` do:
79
+
80
+ ```bash
81
+ sass --watch -r sass-media_query_combiner
82
+ ```
83
+
84
+ ## Contributing
85
+
86
+ 1. Fork it
87
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
88
+ 3. Commit your changes (`git commit -am 'Added some feature'`)
89
+ 4. Push to the branch (`git push origin my-new-feature`)
90
+ 5. Create new Pull Request
@@ -0,0 +1 @@
1
+ require "bundler/gem_tasks"
@@ -0,0 +1,30 @@
1
+ require "sass/media_query_combiner/version"
2
+ require "sass"
3
+
4
+ module Sass
5
+ module MediaQueryCombiner
6
+ def self.combine(css)
7
+ queries = Hash.new { |hash, key| hash[key] = '' }
8
+ pretty = true
9
+
10
+ filtered_data = css.gsub(/\n?(?<query>@media[^{]+){(?<body>(?<braces>(?:[^{}]+)|({\g<braces>}))*)}\n?/m) do |match|
11
+ queries[$1] << $2
12
+ pretty &&= /\n$/m === match
13
+ ''
14
+ end
15
+
16
+ combined = queries.map { |query, body| "#{query}{#{body}}" }.
17
+ join(("\n\n" if pretty))
18
+ "#{filtered_data}#{"\n" if pretty}#{combined}\n"
19
+ end
20
+ end
21
+ end
22
+
23
+ Sass::Engine.class_eval do
24
+ def render_with_combine
25
+ Sass::MediaQueryCombiner.combine(render_without_combine)
26
+ end
27
+ alias_method :render_without_combine, :render
28
+ alias_method :render, :render_with_combine
29
+ alias_method :to_css, :render_with_combine
30
+ end
@@ -0,0 +1,5 @@
1
+ module Sass
2
+ module MediaQueryCombiner
3
+ VERSION = "0.0.1"
4
+ end
5
+ end
@@ -0,0 +1,23 @@
1
+ # -*- encoding: utf-8 -*-
2
+ lib = File.expand_path('../lib', __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require 'sass/media_query_combiner/version'
5
+
6
+ Gem::Specification.new do |gem|
7
+ gem.name = "sass-media_query_combiner"
8
+ gem.version = Sass::MediaQueryCombiner::VERSION
9
+ gem.authors = ["Aaron Jensen"]
10
+ gem.email = ["aaronjensen@gmail.com"]
11
+ gem.description = %q{Automatically combine media queries}
12
+ gem.summary = %q{Sass plugin to combine all like media queries}
13
+ gem.homepage = ""
14
+
15
+ gem.files = `git ls-files`.split($/)
16
+ gem.executables = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
17
+ gem.test_files = gem.files.grep(%r{^(test|spec|features)/})
18
+ gem.require_paths = ["lib"]
19
+
20
+ gem.add_runtime_dependency "sass", "~>3.2.0"
21
+
22
+ gem.add_development_dependency "rspec"
23
+ end
@@ -0,0 +1,43 @@
1
+ require 'spec_helper'
2
+ require 'sass-media_query_combiner'
3
+
4
+ describe "Combiner" do
5
+ it "should with sass" do
6
+ sass = <<SASS
7
+ h3
8
+ color: orange
9
+
10
+ @media (max-width: 480px)
11
+ h1
12
+ color: red
13
+
14
+ @media (max-width: 980px)
15
+ h4
16
+ color: black
17
+
18
+ @media (max-width: 480px)
19
+ h2
20
+ color: blue
21
+
22
+ b
23
+ color: yellow
24
+ SASS
25
+
26
+ Sass::Engine.new(sass).render.should == <<CSS
27
+ h3 {
28
+ color: orange; }
29
+ b {
30
+ color: yellow; }
31
+
32
+ @media (max-width: 480px) {
33
+ h1 {
34
+ color: red; }
35
+ h2 {
36
+ color: blue; } }
37
+
38
+ @media (max-width: 980px) {
39
+ h4 {
40
+ color: black; } }
41
+ CSS
42
+ end
43
+ end
@@ -0,0 +1,17 @@
1
+ # This file was generated by the `rspec --init` command. Conventionally, all
2
+ # specs live under a `spec` directory, which RSpec adds to the `$LOAD_PATH`.
3
+ # Require this file using `require "spec_helper"` to ensure that it is only
4
+ # loaded once.
5
+ #
6
+ # See http://rubydoc.info/gems/rspec-core/RSpec/Core/Configuration
7
+ RSpec.configure do |config|
8
+ config.treat_symbols_as_metadata_keys_with_true_values = true
9
+ config.run_all_when_everything_filtered = true
10
+ config.filter_run :focus
11
+
12
+ # Run specs in random order to surface order dependencies. If you find an
13
+ # order dependency and want to debug it, you can fix the order by providing
14
+ # the seed, which is printed after each run.
15
+ # --seed 1234
16
+ config.order = 'random'
17
+ end
metadata ADDED
@@ -0,0 +1,89 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: sass-media_query_combiner
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.1
5
+ prerelease:
6
+ platform: ruby
7
+ authors:
8
+ - Aaron Jensen
9
+ autorequire:
10
+ bindir: bin
11
+ cert_chain: []
12
+ date: 2012-10-12 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
15
+ name: sass
16
+ requirement: !ruby/object:Gem::Requirement
17
+ none: false
18
+ requirements:
19
+ - - ~>
20
+ - !ruby/object:Gem::Version
21
+ version: 3.2.0
22
+ type: :runtime
23
+ prerelease: false
24
+ version_requirements: !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ~>
28
+ - !ruby/object:Gem::Version
29
+ version: 3.2.0
30
+ - !ruby/object:Gem::Dependency
31
+ name: rspec
32
+ requirement: !ruby/object:Gem::Requirement
33
+ none: false
34
+ requirements:
35
+ - - ! '>='
36
+ - !ruby/object:Gem::Version
37
+ version: '0'
38
+ type: :development
39
+ prerelease: false
40
+ version_requirements: !ruby/object:Gem::Requirement
41
+ none: false
42
+ requirements:
43
+ - - ! '>='
44
+ - !ruby/object:Gem::Version
45
+ version: '0'
46
+ description: Automatically combine media queries
47
+ email:
48
+ - aaronjensen@gmail.com
49
+ executables: []
50
+ extensions: []
51
+ extra_rdoc_files: []
52
+ files:
53
+ - .gitignore
54
+ - Gemfile
55
+ - LICENSE.txt
56
+ - README.md
57
+ - Rakefile
58
+ - lib/sass-media_query_combiner.rb
59
+ - lib/sass/media_query_combiner/version.rb
60
+ - sass-media_query_combiner.gemspec
61
+ - spec/sass-media_query_combiner_spec.rb
62
+ - spec/spec_helper.rb
63
+ homepage: ''
64
+ licenses: []
65
+ post_install_message:
66
+ rdoc_options: []
67
+ require_paths:
68
+ - lib
69
+ required_ruby_version: !ruby/object:Gem::Requirement
70
+ none: false
71
+ requirements:
72
+ - - ! '>='
73
+ - !ruby/object:Gem::Version
74
+ version: '0'
75
+ required_rubygems_version: !ruby/object:Gem::Requirement
76
+ none: false
77
+ requirements:
78
+ - - ! '>='
79
+ - !ruby/object:Gem::Version
80
+ version: '0'
81
+ requirements: []
82
+ rubyforge_project:
83
+ rubygems_version: 1.8.24
84
+ signing_key:
85
+ specification_version: 3
86
+ summary: Sass plugin to combine all like media queries
87
+ test_files:
88
+ - spec/sass-media_query_combiner_spec.rb
89
+ - spec/spec_helper.rb