compass-rgbapng 0.1.1 → 0.2.1

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.
data/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # rgbapng - Compass plugin
2
2
 
3
- rgbapng is a Compass plugin for providing cross browser compatible RGBA support. It works by creating single pixel alpha-transparent PNGs on the fly for browsers that don't support RGBA. It uses the pure Ruby ChunkyPNG library resulting in hassle-free installation and deployment.
3
+ rgbapng is a Compass plugin for providing cross-browser* compatible RGBA support. It works by creating single pixel alpha-transparent PNGs on the fly for browsers that don't support RGBA. It uses the pure Ruby ChunkyPNG library resulting in hassle-free installation and deployment.
4
4
 
5
5
  ## Installation
6
6
 
@@ -20,15 +20,16 @@ And then import the mixins to your SASS/SCSS files:
20
20
 
21
21
  ### Configurable variables
22
22
 
23
- There is a single variable that defines the path to which your PNG images will be saved. This defaults to `rgbapng` inside your Compass images directory. Change the path globally with:
23
+ There are two customzable global variables. This first `$rgbapng_path` defines the path to which your PNG images will be saved. This defaults to `rgbapng` inside your Compass images directory. The second `$rgbapng_px_size` defines the pixel square size of the generated png. This defaults to a 5x5 square.
24
24
 
25
25
  $rgbapng_path: 'my_pngs';
26
+ $rgbapng_px_size: 8;
26
27
 
27
28
  ### Mixins
28
29
 
29
30
  There are two mixins available to you.
30
31
 
31
- #### rgba-background($color, [$path])
32
+ #### rgba-background($color, [$path, $pixel])
32
33
 
33
34
  Sets the background property to use the RGBA value, falling back to the compiled PNG.
34
35
 
@@ -39,7 +40,7 @@ Compiles to:
39
40
  background: url('/images/rgbapng/000000bf.png?1282127952');
40
41
  background: rgba(0, 0, 0, 0.75);
41
42
 
42
- #### rgba-background-inline($color)
43
+ #### rgba-background-inline($color, [$pixel])
43
44
 
44
45
  Sets the background property to use the RGBA value, falling back to a base64 encoded image data.
45
46
 
@@ -61,6 +62,16 @@ There are two `Sass::Script` functions which can be used in your SASS:
61
62
  # Returns a String of the base64 encoded image data
62
63
  png_base64(color)
63
64
 
65
+ ## * Cross-browser? Really?
66
+
67
+ OK, caveat time. When I say "cross-browser", what I really mean is all browsers that either natively support RGBA or support alpha-transparent PNGs. What I don't mean, is IE6. If alpha-transparency in IE6 is important to you, here are some suggestions:
68
+
69
+ * Use [DD_BelatedPNG](http://www.dillerdesign.com/experiment/DD_belatedPNG/) JavaScript library to bootstrap PNG support to IE6.
70
+ * Don't use this plugin at all and instead create your own mixin using [Microsoft's proprietary filters](http://dimox.net/cross-browser-rgba-support/) - just make sure you wash your hands afterwards!
71
+ * Be a rebel and either forget about IE6 or serve it up a [universal stylesheet](http://forabeautifulweb.com/blog/about/universal_internet_explorer_6_css).
72
+
73
+ The choice is yours.
74
+
64
75
  ## Credit where it's due
65
76
 
66
77
  * The CSS technique used was initially described by Lea Verou in [Bulletproof, cross-browser RGBA backgrounds, today](http://leaverou.me/2009/02/bulletproof-cross-browser-rgba-backgrounds/).
@@ -7,31 +7,31 @@ require "base64"
7
7
  # to which generated PNGs are saved.
8
8
 
9
9
  module Sass::Script::Functions
10
-
11
- def png_pixelate(c, dir = "rgbapng")
10
+
11
+ def png_pixelate(c, dir = "rgbapng", px = 5)
12
12
  color = ChunkyPNG::Color.rgba(c.red, c.green, c.blue, (c.alpha * 100 * 2.55).round)
13
- image = ChunkyPNG::Image.new(1,1, color)
13
+ image = ChunkyPNG::Image.new(px.to_i, px.to_i, color)
14
14
  dir = dir.is_a?(Sass::Script::String) ? dir.value : dir
15
- file = File.join(dir, ChunkyPNG::Color.to_hex(color).gsub(/^#/, "") + ".png")
15
+ file = File.join(dir, ChunkyPNG::Color.to_hex(color).gsub(/^#/, "") + "-#{ px.to_s }.png")
16
16
  path = File.join(Compass.configuration.images_path, file)
17
-
17
+
18
18
  if !File.exists?(path) || options[:force]
19
- puts "Writing #{file}"
19
+ puts "Writing #{file}" unless options[:quiet]
20
20
  [Compass.configuration.images_path, File.join(Compass.configuration.images_path, dir)].each do |d|
21
- Dir.mkdir(d) unless File.exists?(d)
21
+ Dir.mkdir(d) unless File.exists?(d)
22
22
  end
23
23
  image.save(path)
24
24
  end
25
-
25
+
26
26
  Sass::Script::String.new(file)
27
27
  end
28
28
 
29
- def png_base64(c)
29
+ def png_base64(c, px = 5)
30
30
  color = ChunkyPNG::Color.rgba(c.red, c.green, c.blue, (c.alpha * 100 * 2.55).round)
31
- image = ChunkyPNG::Image.new(1,1, color)
31
+ image = ChunkyPNG::Image.new(px.to_i, px.to_i, color)
32
32
  data = Base64.encode64(image.to_blob).gsub("\n", "")
33
-
33
+
34
34
  Sass::Script::String.new("url('data:image/png;base64,#{data}')")
35
35
  end
36
-
36
+
37
37
  end
@@ -1,17 +1,23 @@
1
- /*
2
- Mixins are slightly modified from Benjamin Doherty's first implementations: http://gist.github.com/377912
3
- rgba-background mixin can now be passed an option $dir variable
4
- */
1
+ // Mixins are slightly modified from Benjamin Doherty's first implementations: http://gist.github.com/377912
2
+ // rgba-background mixin can now be passed an option $dir variable
5
3
 
6
- $rgbapng_path: 'rgbapng';
4
+ $rgbapng_path: 'rgbapng' !default;
5
+ $rgbapng_px_size: 5 !default;
7
6
 
8
- @mixin rgba-background($color, $dir:$rgbapng_path){
9
- background: image_url(png_pixelate($color, $dir));
7
+ @mixin rgba-background($color, $dir:$rgbapng_path, $pixel:$rgbapng_px_size){
8
+ background: rgba-png($color, $dir, $pixel);
10
9
  background: $color;
11
10
  }
12
11
 
13
- @mixin rgba-background-inline($color){
14
- background: png_base64($color);
12
+ @mixin rgba-background-inline($color, $pixel:$rgbapng_px_size){
13
+ background: rgba-inline($color, $pixel);
15
14
  background: $color;
16
15
  }
17
16
 
17
+ @function rgba-png($color, $dir:$rgbapng_path, $pixel:$rgbapng_px_size) {
18
+ @return image_url(png_pixelate($color, $dir, $pixel));
19
+ }
20
+
21
+ @function rgba-inline($color, $pixel:$rgbapng_px_size) {
22
+ @return png_base64($color, $pixel);
23
+ }
metadata CHANGED
@@ -1,94 +1,85 @@
1
- --- !ruby/object:Gem::Specification
1
+ --- !ruby/object:Gem::Specification
2
2
  name: compass-rgbapng
3
- version: !ruby/object:Gem::Version
4
- prerelease: false
5
- segments:
6
- - 0
7
- - 1
8
- - 1
9
- version: 0.1.1
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.2.1
5
+ prerelease:
10
6
  platform: ruby
11
- authors:
7
+ authors:
12
8
  - Aaron Russell
13
9
  - Benjamin Doherty
14
10
  autorequire:
15
11
  bindir: bin
16
12
  cert_chain: []
17
-
18
- date: 2010-08-18 00:00:00 +01:00
19
- default_executable:
20
- dependencies:
21
- - !ruby/object:Gem::Dependency
13
+ date: 2013-06-26 00:00:00.000000000 Z
14
+ dependencies:
15
+ - !ruby/object:Gem::Dependency
22
16
  name: compass
23
- prerelease: false
24
- requirement: &id001 !ruby/object:Gem::Requirement
25
- requirements:
26
- - - ">="
27
- - !ruby/object:Gem::Version
28
- segments:
29
- - 0
30
- - 10
31
- - 0
17
+ requirement: !ruby/object:Gem::Requirement
18
+ none: false
19
+ requirements:
20
+ - - ! '>='
21
+ - !ruby/object:Gem::Version
32
22
  version: 0.10.0
33
23
  type: :runtime
34
- version_requirements: *id001
35
- - !ruby/object:Gem::Dependency
36
- name: chunky_png
37
24
  prerelease: false
38
- requirement: &id002 !ruby/object:Gem::Requirement
39
- requirements:
40
- - - ">="
41
- - !ruby/object:Gem::Version
42
- segments:
43
- - 0
44
- - 8
45
- - 0
25
+ version_requirements: !ruby/object:Gem::Requirement
26
+ none: false
27
+ requirements:
28
+ - - ! '>='
29
+ - !ruby/object:Gem::Version
30
+ version: 0.10.0
31
+ - !ruby/object:Gem::Dependency
32
+ name: chunky_png
33
+ requirement: !ruby/object:Gem::Requirement
34
+ none: false
35
+ requirements:
36
+ - - ! '>='
37
+ - !ruby/object:Gem::Version
46
38
  version: 0.8.0
47
39
  type: :runtime
48
- version_requirements: *id002
49
- description: Compass plugin for providing cross-browser compatible RGBA support by creating transparent PNGs on the fly for browsers that don't support RGBA. Uses the pure Ruby ChunkyPNG library for hassle free install and deployment.
40
+ prerelease: false
41
+ version_requirements: !ruby/object:Gem::Requirement
42
+ none: false
43
+ requirements:
44
+ - - ! '>='
45
+ - !ruby/object:Gem::Version
46
+ version: 0.8.0
47
+ description: Compass plugin for providing cross-browser compatible RGBA support by
48
+ creating transparent PNGs on the fly for browsers that don't support RGBA. Uses
49
+ the pure Ruby ChunkyPNG library for hassle free install and deployment.
50
50
  email: aaron@gc4.co.uk
51
51
  executables: []
52
-
53
52
  extensions: []
54
-
55
53
  extra_rdoc_files: []
56
-
57
- files:
54
+ files:
58
55
  - LICENSE
59
56
  - README.md
60
57
  - lib/rgbapng/functions.rb
61
58
  - lib/rgbapng.rb
62
59
  - lib/stylesheets/_rgbapng.scss
63
- has_rdoc: false
64
60
  homepage: http://github.com/aaronrussell/compass-rgbapng
65
61
  licenses: []
66
-
67
62
  post_install_message:
68
63
  rdoc_options: []
69
-
70
- require_paths:
64
+ require_paths:
71
65
  - lib
72
- required_ruby_version: !ruby/object:Gem::Requirement
73
- requirements:
74
- - - ">="
75
- - !ruby/object:Gem::Version
76
- segments:
77
- - 0
78
- version: "0"
79
- required_rubygems_version: !ruby/object:Gem::Requirement
80
- requirements:
81
- - - ">="
82
- - !ruby/object:Gem::Version
83
- segments:
84
- - 0
85
- version: "0"
66
+ required_ruby_version: !ruby/object:Gem::Requirement
67
+ none: false
68
+ requirements:
69
+ - - ! '>='
70
+ - !ruby/object:Gem::Version
71
+ version: '0'
72
+ required_rubygems_version: !ruby/object:Gem::Requirement
73
+ none: false
74
+ requirements:
75
+ - - ! '>='
76
+ - !ruby/object:Gem::Version
77
+ version: '0'
86
78
  requirements: []
87
-
88
79
  rubyforge_project:
89
- rubygems_version: 1.3.6
80
+ rubygems_version: 1.8.25
90
81
  signing_key:
91
82
  specification_version: 3
92
- summary: Compass plugin for providing cross-browser compatible RGBA support by creating transparent PNGs on the fly for browsers that don't support RGBA.
83
+ summary: Compass plugin for providing cross-browser compatible RGBA support by creating
84
+ transparent PNGs on the fly for browsers that don't support RGBA.
93
85
  test_files: []
94
-