css3-now 0.1.2
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.rdoc +44 -0
- data/Rakefile +68 -0
- data/VERSION +1 -0
- data/lib/css3-now.rb +42 -0
- data/spec/css3-now_spec.rb +73 -0
- data/spec/spec.opts +4 -0
- data/spec/spec_helper.rb +3 -0
- metadata +69 -0
data/README.rdoc
ADDED
@@ -0,0 +1,44 @@
|
|
1
|
+
= CSS3Now
|
2
|
+
|
3
|
+
I'm sick and tired of writing CSS like this ...
|
4
|
+
|
5
|
+
-moz-border-radius: 5px;
|
6
|
+
-webkit-border-radius: 5px;
|
7
|
+
-khtml-border-radius: 5px;
|
8
|
+
border-radius: 5px;
|
9
|
+
|
10
|
+
opacity: 0.7;
|
11
|
+
filter:alpha(opacity=70);
|
12
|
+
|
13
|
+
It's gross.
|
14
|
+
|
15
|
+
So ... I'm making a little gem for post-procssing CSS so I can write my CSS like:
|
16
|
+
|
17
|
+
border-radius: 5px;
|
18
|
+
|
19
|
+
And I'll end up with:
|
20
|
+
|
21
|
+
-moz-border-radius: 5px;
|
22
|
+
-webkit-border-radius: 5px;
|
23
|
+
-khtml-border-radius: 5px;
|
24
|
+
border-radius: 5px;
|
25
|
+
|
26
|
+
I'll keep track of which browsers support what.
|
27
|
+
|
28
|
+
This is basically just a glorified global substitution!
|
29
|
+
|
30
|
+
== Installation
|
31
|
+
|
32
|
+
sudo gem install remi-css3-now --source http://gems.github.com
|
33
|
+
|
34
|
+
== Usage
|
35
|
+
|
36
|
+
require 'css3-now'
|
37
|
+
|
38
|
+
CSS3Now.new("original CSS").to_css
|
39
|
+
|
40
|
+
# Reading from a file
|
41
|
+
CSS3Now.new( File.read('my/stylesheet.css') ).to_css
|
42
|
+
|
43
|
+
# Sinatra example
|
44
|
+
CSS3Now.new( sass(:stylesheet) ).to_css
|
data/Rakefile
ADDED
@@ -0,0 +1,68 @@
|
|
1
|
+
require 'rake'
|
2
|
+
require 'rubygems'
|
3
|
+
require 'rake/rdoctask'
|
4
|
+
require 'spec/rake/spectask'
|
5
|
+
|
6
|
+
puts "\nGem: css3-now\n\n"
|
7
|
+
|
8
|
+
begin
|
9
|
+
require 'jeweler'
|
10
|
+
Jeweler::Tasks.new do |s|
|
11
|
+
s.name = 'css3-now'
|
12
|
+
s.summary = ''
|
13
|
+
s.email = 'remi@remitaylor.com'
|
14
|
+
s.homepage = 'http://github.com/remi/css3-now'
|
15
|
+
s.description = ''
|
16
|
+
s.authors = %w( remi )
|
17
|
+
s.files = FileList['[A-Z]*', '{lib,spec,bin,examples}/**/*']
|
18
|
+
# s.add_dependency 'person-gemname'
|
19
|
+
# s.executables << 'script'
|
20
|
+
# s.rubyforge_project = 'gemname'
|
21
|
+
# s.extra_rdoc_files = %w( README.rdoc )
|
22
|
+
end
|
23
|
+
rescue LoadError
|
24
|
+
puts "Jeweler not available. Install it with: sudo gem install technicalpickles-jeweler -s http://gems.github.com"
|
25
|
+
end
|
26
|
+
|
27
|
+
Spec::Rake::SpecTask.new do |t|
|
28
|
+
t.spec_files = FileList['spec/**/*_spec.rb']
|
29
|
+
end
|
30
|
+
|
31
|
+
desc "Run all examples with RCov"
|
32
|
+
Spec::Rake::SpecTask.new('rcov') do |t|
|
33
|
+
t.spec_files = FileList['spec/**/*_spec.rb']
|
34
|
+
t.rcov = true
|
35
|
+
end
|
36
|
+
|
37
|
+
# require 'hanna'
|
38
|
+
# require 'darkfish-rdoc'
|
39
|
+
|
40
|
+
Rake::RDocTask.new do |rdoc|
|
41
|
+
rdoc.rdoc_dir = 'rdoc'
|
42
|
+
rdoc.title = 'css3-now'
|
43
|
+
rdoc.options << '--line-numbers' << '--inline-source'
|
44
|
+
# rdoc.options += ["--template=#{`allison --path`}"] # sudo gem install allison
|
45
|
+
# rdoc.options += %w( -f darkfish ) # sudo gem install darkfish-rdoc
|
46
|
+
# rdoc.options += %w( -T hanna ) # sudo gem install mislav-hanna
|
47
|
+
rdoc.options += %w( -m README.rdoc ) # the initial page displayed
|
48
|
+
rdoc.rdoc_files.include('README.rdoc')
|
49
|
+
rdoc.rdoc_files.include('lib/**/*.rb')
|
50
|
+
end
|
51
|
+
|
52
|
+
desc 'Confirm that gemspec is $SAFE'
|
53
|
+
task :safe do
|
54
|
+
require 'yaml'
|
55
|
+
require 'rubygems/specification'
|
56
|
+
data = File.read('css3-now.gemspec')
|
57
|
+
spec = nil
|
58
|
+
if data !~ %r{!ruby/object:Gem::Specification}
|
59
|
+
Thread.new { spec = eval("$SAFE = 3\n#{data}") }.join
|
60
|
+
else
|
61
|
+
spec = YAML.load(data)
|
62
|
+
end
|
63
|
+
spec.validate
|
64
|
+
puts spec
|
65
|
+
puts "OK"
|
66
|
+
end
|
67
|
+
|
68
|
+
task :default => :spec
|
data/VERSION
ADDED
@@ -0,0 +1 @@
|
|
1
|
+
0.1.2
|
data/lib/css3-now.rb
ADDED
@@ -0,0 +1,42 @@
|
|
1
|
+
# ...
|
2
|
+
class CSS3Now
|
3
|
+
|
4
|
+
class << self
|
5
|
+
attr_accessor :substitutions
|
6
|
+
end
|
7
|
+
|
8
|
+
@substitutions = [
|
9
|
+
lambda {|css| replace_browser_specific css, 'border-radius' },
|
10
|
+
lambda {|css| replace_browser_specific css, 'box-shadow' },
|
11
|
+
lambda {|css| css.gsub(/opacity: ([\w\.]+);/){ "filter:alpha(opacity=#{ ($1.to_f * 100).to_i }); opacity: #{ $1 };" } }
|
12
|
+
]
|
13
|
+
|
14
|
+
def self.substitution &block
|
15
|
+
@substitutions << block
|
16
|
+
end
|
17
|
+
|
18
|
+
def initialize original_css
|
19
|
+
@original_css = original_css
|
20
|
+
end
|
21
|
+
|
22
|
+
def to_css
|
23
|
+
CSS3Now.substitutions.inject(@original_css) do |css, substitution|
|
24
|
+
css = substitution.call css
|
25
|
+
end
|
26
|
+
end
|
27
|
+
|
28
|
+
def self.replace_browser_specific css, attribute, browsers = nil
|
29
|
+
css.gsub /#{ attribute }:([^;]+);/, browser_specific(attribute, '\1', browsers)
|
30
|
+
end
|
31
|
+
|
32
|
+
private
|
33
|
+
|
34
|
+
def self.browser_specific attribute, value, browsers = nil
|
35
|
+
browsers = [ :moz, :webkit, :khtml ] if browsers.nil?
|
36
|
+
browsers.inject("") do |all, browser|
|
37
|
+
all << "-#{ browser }-#{ attribute }:#{ value }; "
|
38
|
+
all
|
39
|
+
end + "#{ attribute }:#{ value };"
|
40
|
+
end
|
41
|
+
|
42
|
+
end
|
@@ -0,0 +1,73 @@
|
|
1
|
+
require File.dirname(__FILE__) + '/spec_helper'
|
2
|
+
|
3
|
+
describe CSS3Now do
|
4
|
+
|
5
|
+
it 'should replace border-radius' do
|
6
|
+
css = CSS3Now.new("#header {\n border-radius: 5em;\n }").to_css
|
7
|
+
css.should == "#header {\n -moz-border-radius: 5em; -webkit-border-radius: 5em; " +
|
8
|
+
"-khtml-border-radius: 5em; border-radius: 5em;\n }"
|
9
|
+
end
|
10
|
+
|
11
|
+
it 'should work with spaces in value' do
|
12
|
+
css = CSS3Now.new("#header {\n border-radius: 5em 10px -3.4em;\n }").to_css
|
13
|
+
css.should == "#header {\n -moz-border-radius: 5em 10px -3.4em; -webkit-border-radius: 5em 10px -3.4em; " +
|
14
|
+
"-khtml-border-radius: 5em 10px -3.4em; border-radius: 5em 10px -3.4em;\n }"
|
15
|
+
end
|
16
|
+
|
17
|
+
it 'should work with additional characters: -, ., #' do
|
18
|
+
css = CSS3Now.new("#header {\n border-radius: 5em 10px -3.4em #fff;\n }").to_css
|
19
|
+
css.should == "#header {\n -moz-border-radius: 5em 10px -3.4em #fff; -webkit-border-radius: 5em 10px -3.4em #fff; " +
|
20
|
+
"-khtml-border-radius: 5em 10px -3.4em #fff; border-radius: 5em 10px -3.4em #fff;\n }"
|
21
|
+
end
|
22
|
+
|
23
|
+
it 'should grab anything before the semicolon as a value' do
|
24
|
+
css = CSS3Now.new("#header {\n border-radius:( !imporant *Awesomeness* !@\#$% #123 );\n }").to_css
|
25
|
+
css.should == "#header {\n -moz-border-radius:( !imporant *Awesomeness* !@\#$% #123 ); -webkit-border-radius:( !imporant *Awesomeness* !@\#$% #123 ); " +
|
26
|
+
"-khtml-border-radius:( !imporant *Awesomeness* !@\#$% #123 ); border-radius:( !imporant *Awesomeness* !@\#$% #123 );\n }"
|
27
|
+
end
|
28
|
+
|
29
|
+
it 'should work with multiple instances of an attibute' do
|
30
|
+
CSS3Now.new("#x {\n opacity: 0.5;\n } #y {\n opacity: 0.4;\n }").to_css.should ==
|
31
|
+
"#x {\n filter:alpha(opacity=50); opacity: 0.5;\n }" +
|
32
|
+
" #y {\n filter:alpha(opacity=40); opacity: 0.4;\n }"
|
33
|
+
|
34
|
+
css = CSS3Now.new("#header1 {\n border-radius: 1px;\n } " +
|
35
|
+
"#header2 {\n border-radius: 5em;\n }" ).to_css
|
36
|
+
css.should ==
|
37
|
+
"#header1 {\n -moz-border-radius: 1px; -webkit-border-radius: 1px; -khtml-border-radius: 1px; border-radius: 1px;\n } " +
|
38
|
+
"#header2 {\n -moz-border-radius: 5em; -webkit-border-radius: 5em; -khtml-border-radius: 5em; border-radius: 5em;\n }"
|
39
|
+
end
|
40
|
+
|
41
|
+
it 'should replace box-shadow' do
|
42
|
+
css = CSS3Now.new("#header {\n box-shadow: 5em;\n }").to_css
|
43
|
+
css.should == "#header {\n -moz-box-shadow: 5em; -webkit-box-shadow: 5em; " +
|
44
|
+
"-khtml-box-shadow: 5em; box-shadow: 5em;\n }"
|
45
|
+
end
|
46
|
+
|
47
|
+
it 'should replace opacity' do
|
48
|
+
CSS3Now.new("#x {\n opacity: 0.5;\n }").to_css.should == "#x {\n filter:alpha(opacity=50); opacity: 0.5;\n }"
|
49
|
+
end
|
50
|
+
|
51
|
+
it 'should be able to add your own substitutions' do
|
52
|
+
CSS3Now.new("#x { color: white; }").to_css.should == "#x { color: white; }"
|
53
|
+
|
54
|
+
lambda {
|
55
|
+
CSS3Now.substitution do |css|
|
56
|
+
CSS3Now.replace_browser_specific css, :color, [ :moz ]
|
57
|
+
end
|
58
|
+
}.should change(CSS3Now.substitutions, :count)
|
59
|
+
|
60
|
+
CSS3Now.new("#x { color: white; }").to_css.should == "#x { -moz-color: white; color: white; }"
|
61
|
+
end
|
62
|
+
|
63
|
+
it 'should be able to add your own substitutions (2)' do
|
64
|
+
CSS3Now.new("#x { foo: white; }").to_css.should == "#x { foo: white; }"
|
65
|
+
|
66
|
+
CSS3Now.substitution do |css|
|
67
|
+
css.gsub 'white', 'black'
|
68
|
+
end
|
69
|
+
|
70
|
+
CSS3Now.new("#x { foo: white; }").to_css.should == "#x { foo: black; }"
|
71
|
+
end
|
72
|
+
|
73
|
+
end
|
data/spec/spec.opts
ADDED
data/spec/spec_helper.rb
ADDED
metadata
ADDED
@@ -0,0 +1,69 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: css3-now
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
prerelease: false
|
5
|
+
segments:
|
6
|
+
- 0
|
7
|
+
- 1
|
8
|
+
- 2
|
9
|
+
version: 0.1.2
|
10
|
+
platform: ruby
|
11
|
+
authors:
|
12
|
+
- remi
|
13
|
+
autorequire:
|
14
|
+
bindir: bin
|
15
|
+
cert_chain: []
|
16
|
+
|
17
|
+
date: 2009-08-14 00:00:00 -07:00
|
18
|
+
default_executable:
|
19
|
+
dependencies: []
|
20
|
+
|
21
|
+
description: ""
|
22
|
+
email: remi@remitaylor.com
|
23
|
+
executables: []
|
24
|
+
|
25
|
+
extensions: []
|
26
|
+
|
27
|
+
extra_rdoc_files:
|
28
|
+
- README.rdoc
|
29
|
+
files:
|
30
|
+
- README.rdoc
|
31
|
+
- Rakefile
|
32
|
+
- VERSION
|
33
|
+
- lib/css3-now.rb
|
34
|
+
- spec/css3-now_spec.rb
|
35
|
+
- spec/spec.opts
|
36
|
+
- spec/spec_helper.rb
|
37
|
+
has_rdoc: true
|
38
|
+
homepage: http://github.com/remi/css3-now
|
39
|
+
licenses: []
|
40
|
+
|
41
|
+
post_install_message:
|
42
|
+
rdoc_options:
|
43
|
+
- --charset=UTF-8
|
44
|
+
require_paths:
|
45
|
+
- lib
|
46
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
47
|
+
requirements:
|
48
|
+
- - ">="
|
49
|
+
- !ruby/object:Gem::Version
|
50
|
+
segments:
|
51
|
+
- 0
|
52
|
+
version: "0"
|
53
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
54
|
+
requirements:
|
55
|
+
- - ">="
|
56
|
+
- !ruby/object:Gem::Version
|
57
|
+
segments:
|
58
|
+
- 0
|
59
|
+
version: "0"
|
60
|
+
requirements: []
|
61
|
+
|
62
|
+
rubyforge_project:
|
63
|
+
rubygems_version: 1.3.6
|
64
|
+
signing_key:
|
65
|
+
specification_version: 3
|
66
|
+
summary: ""
|
67
|
+
test_files:
|
68
|
+
- spec/css3-now_spec.rb
|
69
|
+
- spec/spec_helper.rb
|