css_sprite 1.4.10 → 1.5.0
Sign up to get free protection for your applications and to get access to all the features.
- data/.gitignore +25 -0
- data/.rspec +2 -0
- data/.rvmrc +2 -0
- data/Gemfile +4 -0
- data/LICENSE +22 -0
- data/README.textile +21 -2
- data/Rakefile +2 -24
- data/css_sprite.gemspec +16 -64
- data/lib/css_sprite.rb +6 -2
- data/lib/css_sprite/sprite.rb +51 -65
- data/lib/css_sprite/version.rb +3 -0
- data/spec/app/stylesheets/.gitkeep +0 -0
- data/spec/css_sprite/sprite_spec.rb +33 -27
- data/spec/public/stylesheets/.gitkeep +0 -0
- data/spec/public/stylesheets/sass/css_sprite.sass +37 -0
- data/spec/spec_helper.rb +1 -1
- data/tasks/css_sprite_tasks.rake +5 -5
- metadata +82 -54
- data/spec/app/stylesheets/css_sprite.css +0 -14
- data/spec/app/stylesheets/scss/css_sprite.scss +0 -48
- data/spec/spec.opts +0 -8
data/.gitignore
ADDED
@@ -0,0 +1,25 @@
|
|
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
|
18
|
+
|
19
|
+
spec/public/images/css_sprite.png
|
20
|
+
spec/public/stylesheets/*.css
|
21
|
+
spec/public/stylesheets/*.sass
|
22
|
+
spec/public/stylesheets/*.scss
|
23
|
+
spec/app/stylesheets/*.css
|
24
|
+
spec/app/stylesheets/*.sass
|
25
|
+
spec/app/stylesheets/*.scss
|
data/.rspec
ADDED
data/.rvmrc
ADDED
data/Gemfile
ADDED
data/LICENSE
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
Copyright (c) 2012 Richard Huang
|
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.
|
data/README.textile
CHANGED
@@ -85,6 +85,16 @@ h2. Configuration
|
|
85
85
|
|
86
86
|
There is no need to create any configuration by default. If you want some customizations as follows, you need to define <code>config/css_sprite.yml</code> file.
|
87
87
|
|
88
|
+
h3. Example for rails 3.1
|
89
|
+
|
90
|
+
<pre><code>
|
91
|
+
engine: css.scss
|
92
|
+
image_path: app/assets/images
|
93
|
+
stylesheet_path: app/assets/stylesheets
|
94
|
+
css_images_path: assets
|
95
|
+
disable_optimization: true
|
96
|
+
</code></pre>
|
97
|
+
|
88
98
|
h3. ImageType
|
89
99
|
|
90
100
|
css_sprite uses RMagick to compose the images by default. It uses PaletteMatteType as default image_type, you can change it to any image_type which RMagick supports.
|
@@ -154,7 +164,7 @@ suffix:
|
|
154
164
|
</code></pre>
|
155
165
|
|
156
166
|
<code>engine</code> defines css (default) or sass file to generate.
|
157
|
-
<code>suffix</code> defines the customization styles for specified images.
|
167
|
+
<code>suffix</code> defines the customization styles for specified images.
|
158
168
|
The customization above means if your image filename is button suffixed (e.g. post_button.png), the corresponding class .post_button has the additional style with (outline: 0; border: 0; and so on),
|
159
169
|
if your image filename is icon suffixed (e.g. twitter_icon.png), the correspondiing class .twitter_icon has the additional style with (text-indent: -9999px; cursor: pointer)
|
160
170
|
|
@@ -169,7 +179,16 @@ stylesheet_path: app/stylesheets
|
|
169
179
|
|
170
180
|
By default, image_path is public/images and stylesheet_path is public/stylesheets.
|
171
181
|
|
182
|
+
h3. Compass support (SCSS)
|
183
|
+
|
184
|
+
You can use the following configuration to support compass.
|
185
|
+
|
186
|
+
<pre><code>
|
187
|
+
engine: scss
|
188
|
+
stylesheet_path: app/stylesheets
|
189
|
+
</code></pre>
|
190
|
+
|
172
191
|
|
173
192
|
**************************************************************************
|
174
193
|
|
175
|
-
Copyright (c) 2009 [Richard Huang (flyerhzm@gmail.com)], released under the MIT license
|
194
|
+
Copyright (c) 2009 - 2012 [Richard Huang (flyerhzm@gmail.com)], released under the MIT license
|
data/Rakefile
CHANGED
@@ -1,24 +1,2 @@
|
|
1
|
-
|
2
|
-
require
|
3
|
-
require 'jeweler'
|
4
|
-
|
5
|
-
desc 'Default: run unit tests.'
|
6
|
-
task :default => :spec
|
7
|
-
|
8
|
-
desc "Run all specs in spec directory"
|
9
|
-
Spec::Rake::SpecTask.new(:spec) do |t|
|
10
|
-
t.spec_files = FileList['spec/**/*_spec.rb']
|
11
|
-
end
|
12
|
-
|
13
|
-
Jeweler::Tasks.new do |gemspec|
|
14
|
-
gemspec.name = "css_sprite"
|
15
|
-
gemspec.summary = "css_sprite is a rails plugin/gem to generate css sprite image automatically."
|
16
|
-
gemspec.description = "css_sprite is a rails plugin/gem to generate css sprite image automatically."
|
17
|
-
gemspec.email = "flyerhzm@gmail.com"
|
18
|
-
gemspec.homepage = "http://github.com/flyerhzm/css_sprite"
|
19
|
-
gemspec.authors = ["Richard Huang"]
|
20
|
-
gemspec.files.exclude '.gitignore'
|
21
|
-
gemspec.add_dependency 'rmagick'
|
22
|
-
end
|
23
|
-
Jeweler::GemcutterTasks.new
|
24
|
-
|
1
|
+
#!/usr/bin/env rake
|
2
|
+
require "bundler/gem_tasks"
|
data/css_sprite.gemspec
CHANGED
@@ -1,69 +1,21 @@
|
|
1
|
-
# Generated by jeweler
|
2
|
-
# DO NOT EDIT THIS FILE DIRECTLY
|
3
|
-
# Instead, edit Jeweler::Tasks in Rakefile, and run the gemspec command
|
4
1
|
# -*- encoding: utf-8 -*-
|
2
|
+
require File.expand_path('../lib/css_sprite/version', __FILE__)
|
5
3
|
|
6
|
-
Gem::Specification.new do |
|
7
|
-
|
8
|
-
|
4
|
+
Gem::Specification.new do |gem|
|
5
|
+
gem.authors = ["Richard Huang"]
|
6
|
+
gem.email = ["flyerhzm@gmail.com"]
|
7
|
+
gem.description = %q{css_sprite is a rails plugin/gem to generate css sprite image automatically.}
|
8
|
+
gem.summary = %q{css_sprite is a rails plugin/gem to generate css sprite image automatically.}
|
9
|
+
gem.homepage = "https://github.com/flyerhzm/css_sprite"
|
9
10
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
"README.textile"
|
17
|
-
]
|
18
|
-
s.files = [
|
19
|
-
"MIT-LICENSE",
|
20
|
-
"README.textile",
|
21
|
-
"Rakefile",
|
22
|
-
"VERSION",
|
23
|
-
"css_sprite.gemspec",
|
24
|
-
"lib/automatic.rb",
|
25
|
-
"lib/css_sprite.rb",
|
26
|
-
"lib/css_sprite/sprite.rb",
|
27
|
-
"spec/app/stylesheets/css_sprite.css",
|
28
|
-
"spec/app/stylesheets/scss/css_sprite.scss",
|
29
|
-
"spec/css_sprite/sprite_spec.rb",
|
30
|
-
"spec/public/images/another_css_sprite/no_image",
|
31
|
-
"spec/public/images/css_sprite/gmail_logo.png",
|
32
|
-
"spec/public/images/css_sprite/gmail_logo_active.png",
|
33
|
-
"spec/public/images/css_sprite/hotmail_logo.png",
|
34
|
-
"spec/public/images/css_sprite/icons/facebook_icon.png",
|
35
|
-
"spec/public/images/css_sprite/icons/facebook_icon_hover.png",
|
36
|
-
"spec/public/images/css_sprite/icons/twitter_icon.png",
|
37
|
-
"spec/public/images/css_sprite/icons/twitter_icon_hover.png",
|
38
|
-
"spec/public/images/css_sprite/logos/gmail_logo.png",
|
39
|
-
"spec/public/images/css_sprite/logos/gmail_logo_active.png",
|
40
|
-
"spec/public/images/css_sprite/logos_hover/gmail_logo.png",
|
41
|
-
"spec/public/images/css_sprite/not_image.txt",
|
42
|
-
"spec/spec.opts",
|
43
|
-
"spec/spec_helper.rb",
|
44
|
-
"tasks/css_sprite_tasks.rake"
|
45
|
-
]
|
46
|
-
s.homepage = %q{http://github.com/flyerhzm/css_sprite}
|
47
|
-
s.rdoc_options = ["--charset=UTF-8"]
|
48
|
-
s.require_paths = ["lib"]
|
49
|
-
s.rubygems_version = %q{1.3.6}
|
50
|
-
s.summary = %q{css_sprite is a rails plugin/gem to generate css sprite image automatically.}
|
51
|
-
s.test_files = [
|
52
|
-
"spec/css_sprite/sprite_spec.rb",
|
53
|
-
"spec/spec_helper.rb"
|
54
|
-
]
|
11
|
+
gem.executables = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
|
12
|
+
gem.files = `git ls-files`.split("\n")
|
13
|
+
gem.test_files = `git ls-files -- {test,spec,features}/*`.split("\n")
|
14
|
+
gem.name = "css_sprite"
|
15
|
+
gem.require_paths = ["lib"]
|
16
|
+
gem.version = CssSprite::VERSION
|
55
17
|
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
if Gem::Version.new(Gem::RubyGemsVersion) >= Gem::Version.new('1.2.0') then
|
61
|
-
s.add_runtime_dependency(%q<rmagick>, [">= 0"])
|
62
|
-
else
|
63
|
-
s.add_dependency(%q<rmagick>, [">= 0"])
|
64
|
-
end
|
65
|
-
else
|
66
|
-
s.add_dependency(%q<rmagick>, [">= 0"])
|
67
|
-
end
|
18
|
+
gem.add_dependency("rmagick")
|
19
|
+
gem.add_runtime_dependency("rspec")
|
20
|
+
gem.add_runtime_dependency("mocha")
|
68
21
|
end
|
69
|
-
|
data/lib/css_sprite.rb
CHANGED
@@ -1,6 +1,10 @@
|
|
1
|
-
require 'css_sprite/sprite'
|
2
1
|
require 'rake'
|
2
|
+
require "css_sprite/version"
|
3
3
|
|
4
4
|
unless Rake::Task.task_defined? "css_sprite:build"
|
5
5
|
load File.join(File.dirname(__FILE__), '..', 'tasks', 'css_sprite_tasks.rake')
|
6
|
-
end
|
6
|
+
end
|
7
|
+
|
8
|
+
module CssSprite
|
9
|
+
require 'css_sprite/sprite'
|
10
|
+
end
|
data/lib/css_sprite/sprite.rb
CHANGED
@@ -4,32 +4,34 @@ require 'yaml'
|
|
4
4
|
require 'enumerator'
|
5
5
|
|
6
6
|
class Sprite
|
7
|
-
|
7
|
+
|
8
8
|
def initialize(options={})
|
9
9
|
if File.exist?(File.join(Rails.root, 'config/css_sprite.yml'))
|
10
10
|
@config = YAML::load_file(File.join(Rails.root, 'config/css_sprite.yml'))
|
11
11
|
else
|
12
12
|
@config = options
|
13
13
|
end
|
14
|
-
|
14
|
+
|
15
15
|
@image_path = File.expand_path(File.join(Rails.root, @config['image_path'] || 'public/images'))
|
16
16
|
@stylesheet_path = File.expand_path(File.join(Rails.root, @config['stylesheet_path'] || 'public/stylesheets'))
|
17
17
|
|
18
|
-
@
|
18
|
+
@css_images_path = @config['css_images_path'] ||= "images"
|
19
|
+
@format = @config['format'] ? @config['format'].downcase : "png"
|
20
|
+
@engine = @config['engine'] || "css"
|
19
21
|
end
|
20
|
-
|
22
|
+
|
21
23
|
# execute the css sprite operation
|
22
24
|
def build
|
23
25
|
directories = css_sprite_directories
|
24
26
|
directories.each { |directory| execute(directory) }
|
25
27
|
end
|
26
|
-
|
28
|
+
|
27
29
|
# execute the css sprite operation if stylesheet is expired
|
28
30
|
def check
|
29
31
|
directories = css_sprite_directories
|
30
32
|
directories.each { |directory| execute(directory) if expire?(directory) }
|
31
33
|
end
|
32
|
-
|
34
|
+
|
33
35
|
# output the css sprite image and stylesheet
|
34
36
|
def execute(directory)
|
35
37
|
results = output_image(directory)
|
@@ -38,16 +40,10 @@ class Sprite
|
|
38
40
|
output_stylesheet(directory, results)
|
39
41
|
end
|
40
42
|
end
|
41
|
-
|
43
|
+
|
42
44
|
# detect if the stylesheet is expired or not?
|
43
45
|
def expire?(directory)
|
44
|
-
|
45
|
-
stylesheet_path = dest_sass_path(directory)
|
46
|
-
elsif scss?
|
47
|
-
stylesheet_path = dest_scss_path(directory)
|
48
|
-
else
|
49
|
-
stylesheet_path = dest_css_path(directory)
|
50
|
-
end
|
46
|
+
stylesheet_path = dest_stylesheet_path(directory)
|
51
47
|
return true unless File.exist?(stylesheet_path)
|
52
48
|
stylesheet_mtime = File.new(stylesheet_path).mtime
|
53
49
|
Dir["**/*"].each do |path|
|
@@ -55,7 +51,7 @@ class Sprite
|
|
55
51
|
end
|
56
52
|
return false
|
57
53
|
end
|
58
|
-
|
54
|
+
|
59
55
|
# output stylesheet, sass, scss or css
|
60
56
|
def output_stylesheet(directory, results)
|
61
57
|
if sass?
|
@@ -66,24 +62,24 @@ class Sprite
|
|
66
62
|
output_css(directory, results)
|
67
63
|
end
|
68
64
|
end
|
69
|
-
|
65
|
+
|
70
66
|
# use sass
|
71
67
|
def sass?
|
72
|
-
@
|
68
|
+
@engine =~ /sass$/
|
73
69
|
end
|
74
70
|
|
75
71
|
# use scss
|
76
72
|
def scss?
|
77
|
-
@
|
73
|
+
@engine =~ /scss$/
|
78
74
|
end
|
79
|
-
|
75
|
+
|
80
76
|
# detect all the css sprite directories. e.g. public/images/css_sprite, public/images/widget_css_sprite
|
81
77
|
def css_sprite_directories
|
82
78
|
Dir.entries(@image_path).collect do |d|
|
83
79
|
File.join(@image_path, d) if File.directory?(File.join(@image_path, d)) and d =~ /css_sprite$/
|
84
80
|
end.compact
|
85
81
|
end
|
86
|
-
|
82
|
+
|
87
83
|
# output the css sprite image and return all the images properies.
|
88
84
|
def output_image(directory)
|
89
85
|
results = []
|
@@ -107,7 +103,7 @@ class Sprite
|
|
107
103
|
end
|
108
104
|
results
|
109
105
|
end
|
110
|
-
|
106
|
+
|
111
107
|
# opitmize the css sprite image
|
112
108
|
def optimize_image(directory)
|
113
109
|
unless @config['disable_optimization']
|
@@ -122,9 +118,9 @@ class Sprite
|
|
122
118
|
def output_css(directory, results)
|
123
119
|
unless results.empty?
|
124
120
|
dest_image_name = dest_image_name(directory)
|
125
|
-
|
121
|
+
dest_stylesheet_path = dest_stylesheet_path(directory)
|
126
122
|
dest_image_time = File.new(dest_image_path(directory)).mtime
|
127
|
-
File.open(
|
123
|
+
File.open(dest_stylesheet_path, 'w') do |f|
|
128
124
|
if @config['suffix']
|
129
125
|
@config['suffix'].each do |key, value|
|
130
126
|
cns = class_names(results, :suffix => key)
|
@@ -136,10 +132,10 @@ class Sprite
|
|
136
132
|
end
|
137
133
|
end
|
138
134
|
end
|
139
|
-
|
135
|
+
|
140
136
|
f.print class_names(results).join(",\n")
|
141
|
-
f.print " \{\n background: url('
|
142
|
-
|
137
|
+
f.print " \{\n background: url('/#{@css_images_path}/#{dest_image_name}?#{dest_image_time.to_i}') no-repeat;\n\}\n"
|
138
|
+
|
143
139
|
results.each do |result|
|
144
140
|
f.print "#{class_name(result[:name])} \{"
|
145
141
|
f.print " background-position: #{-result[:x]}px #{-result[:y]}px;"
|
@@ -150,14 +146,14 @@ class Sprite
|
|
150
146
|
end
|
151
147
|
end
|
152
148
|
end
|
153
|
-
|
149
|
+
|
154
150
|
# output the css sprite sass file
|
155
151
|
def output_sass(directory, results)
|
156
152
|
unless results.empty?
|
157
153
|
dest_image_name = dest_image_name(directory)
|
158
|
-
|
154
|
+
dest_stylesheet_path = dest_stylesheet_path(directory)
|
159
155
|
dest_image_time = File.new(dest_image_path(directory)).mtime
|
160
|
-
File.open(
|
156
|
+
File.open(dest_stylesheet_path, 'w') do |f|
|
161
157
|
if @config['suffix']
|
162
158
|
@config['suffix'].each do |key, value|
|
163
159
|
cns = class_names(results, :suffix => key)
|
@@ -169,10 +165,10 @@ class Sprite
|
|
169
165
|
end
|
170
166
|
end
|
171
167
|
end
|
172
|
-
|
168
|
+
|
173
169
|
f.print class_names(results).join(",\n")
|
174
|
-
f.print " \n background: url('
|
175
|
-
|
170
|
+
f.print " \n background: url('/#{@css_images_path}/#{dest_image_name}?#{dest_image_time.to_i}') no-repeat\n"
|
171
|
+
|
176
172
|
results.each do |result|
|
177
173
|
f.print "#{class_name(result[:name])}\n"
|
178
174
|
f.print " background-position: #{-result[:x]}px #{-result[:y]}px\n"
|
@@ -182,14 +178,14 @@ class Sprite
|
|
182
178
|
end
|
183
179
|
end
|
184
180
|
end
|
185
|
-
|
181
|
+
|
186
182
|
# output the css sprite scss file
|
187
183
|
def output_scss(directory, results)
|
188
184
|
unless results.empty?
|
189
185
|
dest_image_name = dest_image_name(directory)
|
190
|
-
|
186
|
+
dest_stylesheet_path = dest_stylesheet_path(directory)
|
191
187
|
dest_image_time = File.new(dest_image_path(directory)).mtime
|
192
|
-
File.open(
|
188
|
+
File.open(dest_stylesheet_path, 'w') do |f|
|
193
189
|
if @config['suffix']
|
194
190
|
@config['suffix'].each do |key, value|
|
195
191
|
cns = class_names(results, :suffix => key)
|
@@ -201,10 +197,10 @@ class Sprite
|
|
201
197
|
end
|
202
198
|
end
|
203
199
|
end
|
204
|
-
|
200
|
+
|
205
201
|
f.print class_names(results).join(",\n")
|
206
|
-
f.print " \{\n background: url('
|
207
|
-
|
202
|
+
f.print " \{\n background: url('/#{@css_images_path}/#{dest_image_name}?#{dest_image_time.to_i}') no-repeat;\n\}\n"
|
203
|
+
|
208
204
|
results.each do |result|
|
209
205
|
f.print "#{class_name(result[:name])} \{\n"
|
210
206
|
f.print " background-position: #{-result[:x]}px #{-result[:y]}px;\n"
|
@@ -215,7 +211,7 @@ class Sprite
|
|
215
211
|
end
|
216
212
|
end
|
217
213
|
end
|
218
|
-
|
214
|
+
|
219
215
|
# get all the class names within the same css sprite image
|
220
216
|
def class_names(results, options={})
|
221
217
|
options = {:count_per_line => 5}.merge(options)
|
@@ -226,12 +222,12 @@ class Sprite
|
|
226
222
|
end
|
227
223
|
class_names
|
228
224
|
end
|
229
|
-
|
225
|
+
|
230
226
|
# get the css class name from image name
|
231
227
|
def class_name(name)
|
232
228
|
".#{name.gsub('/', ' .').gsub(/[_-]hover\b/, ':hover').gsub(/[_-]active\b/, '.active')}"
|
233
229
|
end
|
234
|
-
|
230
|
+
|
235
231
|
# read all images under the css sprite directory
|
236
232
|
def all_images(directory)
|
237
233
|
images = []
|
@@ -242,32 +238,22 @@ class Sprite
|
|
242
238
|
end
|
243
239
|
images
|
244
240
|
end
|
245
|
-
|
241
|
+
|
246
242
|
# destination css sprite image path
|
247
243
|
def dest_image_path(directory)
|
248
244
|
directory + "." + @format
|
249
245
|
end
|
250
|
-
|
246
|
+
|
251
247
|
# destination css sprite image name
|
252
248
|
def dest_image_name(directory)
|
253
249
|
File.basename(directory) + "." + @format
|
254
250
|
end
|
255
|
-
|
256
|
-
# destination css file path
|
257
|
-
def dest_css_path(directory)
|
258
|
-
File.join(@stylesheet_path, File.basename(directory) + '.css')
|
259
|
-
end
|
260
251
|
|
261
|
-
# destination
|
262
|
-
def
|
263
|
-
File.join(@stylesheet_path,
|
252
|
+
# destination stylesheet file path
|
253
|
+
def dest_stylesheet_path(directory)
|
254
|
+
File.join(@stylesheet_path, File.basename(directory) + "." + @engine)
|
264
255
|
end
|
265
256
|
|
266
|
-
# destination scss file path
|
267
|
-
def dest_scss_path(directory)
|
268
|
-
File.join(@stylesheet_path, File.basename(directory) + '.scss')
|
269
|
-
end
|
270
|
-
|
271
257
|
# append src_image to the dest_image with position (x, y)
|
272
258
|
def composite_images(dest_image, src_image, x, y)
|
273
259
|
width = [src_image.columns + x, dest_image.columns].max
|
@@ -277,20 +263,20 @@ class Sprite
|
|
277
263
|
image.composite!(src_image, x, y, Magick::CopyCompositeOp)
|
278
264
|
image
|
279
265
|
end
|
280
|
-
|
266
|
+
|
281
267
|
# get the Magick::Image
|
282
268
|
def get_image(image_filename)
|
283
269
|
Magick::Image::read(image_filename).first
|
284
270
|
end
|
285
|
-
|
271
|
+
|
286
272
|
# get image properties, including name, width and height
|
287
273
|
def image_properties(image, directory)
|
288
274
|
name = get_image_name(image, directory)
|
289
275
|
need_wh?(image, directory) ? {:name => name, :width => image.columns, :height => image.rows} : {:name => name}
|
290
276
|
end
|
291
|
-
|
277
|
+
|
292
278
|
# check if the hover class needs width and height
|
293
|
-
# if the hover class has the same width and height property with not hover class,
|
279
|
+
# if the hover class has the same width and height property with not hover class,
|
294
280
|
# then the hover class does not need width and height
|
295
281
|
def need_wh?(image, directory)
|
296
282
|
name = get_image_name(image, directory)
|
@@ -303,16 +289,16 @@ class Sprite
|
|
303
289
|
end
|
304
290
|
return true
|
305
291
|
end
|
306
|
-
|
292
|
+
|
307
293
|
# get the image name substracting base directory and extname
|
308
294
|
def get_image_name(image, directory)
|
309
295
|
directory_length = directory.length + 1
|
310
296
|
extname_length = File.extname(image.filename).length
|
311
297
|
image.filename.slice(directory_length...-extname_length)
|
312
298
|
end
|
313
|
-
|
314
|
-
# test if the filename contains a hover or active.
|
315
|
-
# e.g. icons/twitter_hover, icons_hover/twitter
|
299
|
+
|
300
|
+
# test if the filename contains a hover or active.
|
301
|
+
# e.g. icons/twitter_hover, icons_hover/twitter
|
316
302
|
# e.g. icons/twitter_active, icons_active/twitter
|
317
303
|
[:active, :hover].each do |method|
|
318
304
|
class_eval <<-EOF
|
@@ -321,5 +307,5 @@ class Sprite
|
|
321
307
|
end
|
322
308
|
EOF
|
323
309
|
end
|
324
|
-
|
310
|
+
|
325
311
|
end
|
File without changes
|
@@ -1,31 +1,31 @@
|
|
1
|
-
require
|
1
|
+
require 'spec_helper'
|
2
2
|
|
3
3
|
describe Sprite do
|
4
4
|
before(:all) do
|
5
5
|
@sprite = Sprite.new
|
6
6
|
@directory_path = File.join(IMAGE_PATH, 'css_sprite')
|
7
7
|
end
|
8
|
-
|
8
|
+
|
9
9
|
describe "build" do
|
10
10
|
it "should build css_sprite image and css" do
|
11
11
|
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
12
12
|
Sprite.new.build
|
13
13
|
end
|
14
|
-
|
14
|
+
|
15
15
|
it "should build css_sprite image and sass" do
|
16
16
|
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
17
17
|
Sprite.new('engine' => 'sass').build
|
18
18
|
end
|
19
|
-
|
19
|
+
|
20
20
|
it "should build another image_type" do
|
21
21
|
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
22
22
|
Sprite.new('image_type' => 'PaletteType').build
|
23
23
|
end
|
24
|
-
|
24
|
+
|
25
25
|
it "should disable image optimization" do
|
26
26
|
Sprite.new('disable_optimization' => true).build
|
27
27
|
end
|
28
|
-
|
28
|
+
|
29
29
|
it "should build another image optimization" do
|
30
30
|
Sprite.any_instance.expects(:system).with("optipng -o 1 #{IMAGE_PATH}/css_sprite.png").returns(true)
|
31
31
|
Sprite.new('optimization' => "optipng -o 1").build
|
@@ -35,13 +35,13 @@ describe Sprite do
|
|
35
35
|
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
36
36
|
Sprite.new('stylesheet_path' => 'app/stylesheets').build
|
37
37
|
end
|
38
|
-
|
38
|
+
|
39
39
|
it "should build css_sprite image and scss" do
|
40
40
|
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
41
41
|
Sprite.new('engine' => 'scss', 'stylesheet_path' => 'app/stylesheets').build
|
42
42
|
end
|
43
43
|
end
|
44
|
-
|
44
|
+
|
45
45
|
describe "css_sprite_directories" do
|
46
46
|
it "should read two direcoties" do
|
47
47
|
expected_directories = [File.join(IMAGE_PATH, 'another_css_sprite'),
|
@@ -49,13 +49,13 @@ describe Sprite do
|
|
49
49
|
@sprite.css_sprite_directories.should == expected_directories
|
50
50
|
end
|
51
51
|
end
|
52
|
-
|
52
|
+
|
53
53
|
describe "output_image" do
|
54
54
|
it "should output a css_sprite image for a directory" do
|
55
55
|
@sprite.output_image(File.join(IMAGE_PATH, 'css_sprite'))
|
56
56
|
end
|
57
57
|
end
|
58
|
-
|
58
|
+
|
59
59
|
describe "all_images" do
|
60
60
|
it "should read all images from a directory" do
|
61
61
|
expected_images = [File.join(IMAGE_PATH, 'css_sprite/icons/twitter_icon.png'),
|
@@ -75,13 +75,13 @@ describe Sprite do
|
|
75
75
|
end
|
76
76
|
end
|
77
77
|
end
|
78
|
-
|
78
|
+
|
79
79
|
describe "class_names" do
|
80
80
|
before(:all) do
|
81
|
-
@results = [{:name => 'gmail_logo'}, {:name => 'hotmail_logo'}, {:name => 'yahoo_logo'},
|
81
|
+
@results = [{:name => 'gmail_logo'}, {:name => 'hotmail_logo'}, {:name => 'yahoo_logo'},
|
82
82
|
{:name => 'gmail_button'}, {:name => 'hotmail_button'}, {:name => 'yahoo_button'}]
|
83
83
|
end
|
84
|
-
|
84
|
+
|
85
85
|
it "should get class_names with default options" do
|
86
86
|
@sprite.class_names(@results).should == [".gmail_logo, .hotmail_logo, .yahoo_logo, .gmail_button, .hotmail_button", ".yahoo_button"]
|
87
87
|
end
|
@@ -89,21 +89,21 @@ describe Sprite do
|
|
89
89
|
it "should get class_names with 3 count_per_line" do
|
90
90
|
@sprite.class_names(@results, :count_per_line => 3).should == [".gmail_logo, .hotmail_logo, .yahoo_logo", ".gmail_button, .hotmail_button, .yahoo_button"]
|
91
91
|
end
|
92
|
-
|
92
|
+
|
93
93
|
it "should get specified class_names with suffix" do
|
94
94
|
@sprite.class_names(@results, :suffix => 'logo').should == [".gmail_logo, .hotmail_logo, .yahoo_logo"]
|
95
95
|
end
|
96
96
|
end
|
97
|
-
|
97
|
+
|
98
98
|
describe "class_name" do
|
99
99
|
it "should get class_name with simple name" do
|
100
100
|
@sprite.class_name("twitter_icon").should == ".twitter_icon"
|
101
101
|
end
|
102
|
-
|
102
|
+
|
103
103
|
it "should get class_name with parent class" do
|
104
104
|
@sprite.class_name("icons/twitter_icon").should == ".icons .twitter_icon"
|
105
105
|
end
|
106
|
-
|
106
|
+
|
107
107
|
it "should get class_name with hover class" do
|
108
108
|
@sprite.class_name("icons/twitter_icon_hover").should == ".icons .twitter_icon:hover"
|
109
109
|
@sprite.class_name("icons/twitter-icon-hover").should == ".icons .twitter-icon:hover"
|
@@ -111,14 +111,14 @@ describe Sprite do
|
|
111
111
|
@sprite.class_name("twitter_hover_icon_hover").should == ".twitter_hover_icon:hover"
|
112
112
|
@sprite.class_name("logos_hover/gmail_logo").should == ".logos:hover .gmail_logo"
|
113
113
|
end
|
114
|
-
|
114
|
+
|
115
115
|
it "should get class_name with active class" do
|
116
116
|
@sprite.class_name("gmail_logo_active").should == ".gmail_logo.active"
|
117
117
|
@sprite.class_name("logos_active/gmail_logo").should == ".logos.active .gmail_logo"
|
118
118
|
@sprite.class_name("logos/gmail_logo_active").should == ".logos .gmail_logo.active"
|
119
119
|
end
|
120
120
|
end
|
121
|
-
|
121
|
+
|
122
122
|
describe "dest_image_path" do
|
123
123
|
it "should get css_sprite image path for a directory" do
|
124
124
|
@sprite.dest_image_path(File.join(IMAGE_PATH, 'css_sprite')).should == File.join(IMAGE_PATH, 'css_sprite.png')
|
@@ -131,24 +131,30 @@ describe Sprite do
|
|
131
131
|
end
|
132
132
|
end
|
133
133
|
|
134
|
-
describe "
|
134
|
+
describe "dest_stylesheet_path for css" do
|
135
135
|
it "should get css_sprite css path for a directory" do
|
136
|
-
|
136
|
+
Sprite.new("engine" => "css").dest_stylesheet_path(File.join(IMAGE_PATH, 'css_sprite')).should == File.join(STYLESHEET_PATH, 'css_sprite.css')
|
137
|
+
end
|
138
|
+
end
|
139
|
+
|
140
|
+
describe "dest_stylesheet_path for sass" do
|
141
|
+
it "should get sass_sprite css path for a directory" do
|
142
|
+
Sprite.new("engine" => "sass").dest_stylesheet_path(File.join(IMAGE_PATH, 'css_sprite')).should == File.join(STYLESHEET_PATH, 'css_sprite.sass')
|
137
143
|
end
|
138
144
|
end
|
139
145
|
|
140
|
-
describe "
|
146
|
+
describe "dest_stylesheet_path for scss" do
|
141
147
|
it "should get sass_sprite css path for a directory" do
|
142
|
-
|
148
|
+
Sprite.new("engine" => "scss").dest_stylesheet_path(File.join(IMAGE_PATH, 'css_sprite')).should == File.join(STYLESHEET_PATH, 'css_sprite.scss')
|
143
149
|
end
|
144
150
|
end
|
145
|
-
|
151
|
+
|
146
152
|
describe "get_image" do
|
147
153
|
it "should get a image" do
|
148
154
|
@sprite.get_image(File.join(IMAGE_PATH, 'css_sprite/gmail_logo.png')).class.should == Magick::Image
|
149
155
|
end
|
150
156
|
end
|
151
|
-
|
157
|
+
|
152
158
|
describe "image_properties" do
|
153
159
|
it "should get image properties" do
|
154
160
|
image = @sprite.get_image(File.join(@directory_path, 'gmail_logo.png'))
|
@@ -160,7 +166,7 @@ describe Sprite do
|
|
160
166
|
@sprite.image_properties(image, @directory_path).should == {:name => 'icons/twitter_icon', :width => 14, :height => 14}
|
161
167
|
end
|
162
168
|
end
|
163
|
-
|
169
|
+
|
164
170
|
describe "composite_images" do
|
165
171
|
it "should composite two images into one horizontally" do
|
166
172
|
image1 = @sprite.get_image(File.join(@directory_path, 'gmail_logo.png'))
|
@@ -168,7 +174,7 @@ describe Sprite do
|
|
168
174
|
image = @sprite.composite_images(image1, image2, image1.columns, 0)
|
169
175
|
@sprite.image_properties(image, @directory_path).should == {:name => nil, :width => 206, :height => 36}
|
170
176
|
end
|
171
|
-
|
177
|
+
|
172
178
|
it "should composite two images into one verically" do
|
173
179
|
image1 = @sprite.get_image(File.join(@directory_path, 'gmail_logo.png'))
|
174
180
|
image2 = @sprite.get_image(File.join(@directory_path, 'hotmail_logo.png'))
|
File without changes
|
@@ -0,0 +1,37 @@
|
|
1
|
+
.logos:hover .gmail_logo, .logos .gmail_logo.active, .logos .gmail_logo, .icons .twitter_icon:hover, .icons .twitter_icon,
|
2
|
+
.icons .facebook_icon:hover, .icons .facebook_icon, .hotmail_logo, .gmail_logo.active, .gmail_logo
|
3
|
+
background: url('/images/css_sprite.png?1290606320') no-repeat
|
4
|
+
.logos:hover .gmail_logo
|
5
|
+
background-position: 0px 0px
|
6
|
+
.logos .gmail_logo.active
|
7
|
+
background-position: 0px -41px
|
8
|
+
width: 52px
|
9
|
+
height: 18px
|
10
|
+
.logos .gmail_logo
|
11
|
+
background-position: 0px -64px
|
12
|
+
width: 103px
|
13
|
+
height: 36px
|
14
|
+
.icons .twitter_icon:hover
|
15
|
+
background-position: 0px -105px
|
16
|
+
.icons .twitter_icon
|
17
|
+
background-position: 0px -124px
|
18
|
+
width: 14px
|
19
|
+
height: 14px
|
20
|
+
.icons .facebook_icon:hover
|
21
|
+
background-position: 0px -143px
|
22
|
+
width: 21px
|
23
|
+
height: 21px
|
24
|
+
.icons .facebook_icon
|
25
|
+
background-position: 0px -169px
|
26
|
+
width: 14px
|
27
|
+
height: 14px
|
28
|
+
.hotmail_logo
|
29
|
+
background-position: 0px -188px
|
30
|
+
width: 103px
|
31
|
+
height: 36px
|
32
|
+
.gmail_logo.active
|
33
|
+
background-position: 0px -229px
|
34
|
+
.gmail_logo
|
35
|
+
background-position: 0px -270px
|
36
|
+
width: 103px
|
37
|
+
height: 36px
|
data/spec/spec_helper.rb
CHANGED
data/tasks/css_sprite_tasks.rake
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
require 'rbconfig'
|
2
2
|
|
3
|
-
namespace :css_sprite do
|
3
|
+
namespace :css_sprite do
|
4
4
|
desc "build css sprite image once"
|
5
5
|
task :build do
|
6
6
|
require File.join(File.dirname(__FILE__), '../lib/css_sprite/sprite.rb')
|
@@ -9,7 +9,7 @@ namespace :css_sprite do
|
|
9
9
|
|
10
10
|
desc "restart css sprite server"
|
11
11
|
task :restart => [:stop, :start]
|
12
|
-
|
12
|
+
|
13
13
|
desc "start css sprite server"
|
14
14
|
task :start do
|
15
15
|
automatic_script = File.join(File.dirname(__FILE__), '..', 'lib', 'automatic.rb')
|
@@ -24,14 +24,14 @@ namespace :css_sprite do
|
|
24
24
|
pid = fork do
|
25
25
|
exec "ruby #{automatic_script}"
|
26
26
|
end
|
27
|
-
|
27
|
+
|
28
28
|
sleep(1)
|
29
29
|
File.open("#{Rails.root}/tmp/pids/css_sprite.pid", "w") { |f| f << pid }
|
30
30
|
puts "css_sprite server started sucessfully."
|
31
31
|
end
|
32
32
|
end
|
33
33
|
end
|
34
|
-
|
34
|
+
|
35
35
|
desc "stop css sprite server"
|
36
36
|
task :stop do
|
37
37
|
if Config::CONFIG['host_os'] =~ /mswin|mingw/
|
@@ -58,5 +58,5 @@ namespace :css_sprite do
|
|
58
58
|
end
|
59
59
|
end
|
60
60
|
end
|
61
|
-
|
61
|
+
|
62
62
|
end
|
metadata
CHANGED
@@ -1,43 +1,61 @@
|
|
1
|
-
--- !ruby/object:Gem::Specification
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
2
|
name: css_sprite
|
3
|
-
version: !ruby/object:Gem::Version
|
4
|
-
|
5
|
-
|
6
|
-
- 1
|
7
|
-
- 4
|
8
|
-
- 10
|
9
|
-
version: 1.4.10
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 1.5.0
|
5
|
+
prerelease:
|
10
6
|
platform: ruby
|
11
|
-
authors:
|
7
|
+
authors:
|
12
8
|
- Richard Huang
|
13
9
|
autorequire:
|
14
10
|
bindir: bin
|
15
11
|
cert_chain: []
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
dependencies:
|
20
|
-
- !ruby/object:Gem::Dependency
|
12
|
+
date: 2012-01-04 00:00:00.000000000Z
|
13
|
+
dependencies:
|
14
|
+
- !ruby/object:Gem::Dependency
|
21
15
|
name: rmagick
|
16
|
+
requirement: &70303733426760 !ruby/object:Gem::Requirement
|
17
|
+
none: false
|
18
|
+
requirements:
|
19
|
+
- - ! '>='
|
20
|
+
- !ruby/object:Gem::Version
|
21
|
+
version: '0'
|
22
|
+
type: :runtime
|
22
23
|
prerelease: false
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
24
|
+
version_requirements: *70303733426760
|
25
|
+
- !ruby/object:Gem::Dependency
|
26
|
+
name: rspec
|
27
|
+
requirement: &70303733426300 !ruby/object:Gem::Requirement
|
28
|
+
none: false
|
29
|
+
requirements:
|
30
|
+
- - ! '>='
|
31
|
+
- !ruby/object:Gem::Version
|
32
|
+
version: '0'
|
30
33
|
type: :runtime
|
31
|
-
|
34
|
+
prerelease: false
|
35
|
+
version_requirements: *70303733426300
|
36
|
+
- !ruby/object:Gem::Dependency
|
37
|
+
name: mocha
|
38
|
+
requirement: &70303733425880 !ruby/object:Gem::Requirement
|
39
|
+
none: false
|
40
|
+
requirements:
|
41
|
+
- - ! '>='
|
42
|
+
- !ruby/object:Gem::Version
|
43
|
+
version: '0'
|
44
|
+
type: :runtime
|
45
|
+
prerelease: false
|
46
|
+
version_requirements: *70303733425880
|
32
47
|
description: css_sprite is a rails plugin/gem to generate css sprite image automatically.
|
33
|
-
email:
|
48
|
+
email:
|
49
|
+
- flyerhzm@gmail.com
|
34
50
|
executables: []
|
35
|
-
|
36
51
|
extensions: []
|
37
|
-
|
38
|
-
|
39
|
-
-
|
40
|
-
|
52
|
+
extra_rdoc_files: []
|
53
|
+
files:
|
54
|
+
- .gitignore
|
55
|
+
- .rspec
|
56
|
+
- .rvmrc
|
57
|
+
- Gemfile
|
58
|
+
- LICENSE
|
41
59
|
- MIT-LICENSE
|
42
60
|
- README.textile
|
43
61
|
- Rakefile
|
@@ -46,8 +64,8 @@ files:
|
|
46
64
|
- lib/automatic.rb
|
47
65
|
- lib/css_sprite.rb
|
48
66
|
- lib/css_sprite/sprite.rb
|
49
|
-
-
|
50
|
-
- spec/app/stylesheets
|
67
|
+
- lib/css_sprite/version.rb
|
68
|
+
- spec/app/stylesheets/.gitkeep
|
51
69
|
- spec/css_sprite/sprite_spec.rb
|
52
70
|
- spec/public/images/another_css_sprite/no_image
|
53
71
|
- spec/public/images/css_sprite/gmail_logo.png
|
@@ -61,39 +79,49 @@ files:
|
|
61
79
|
- spec/public/images/css_sprite/logos/gmail_logo_active.png
|
62
80
|
- spec/public/images/css_sprite/logos_hover/gmail_logo.png
|
63
81
|
- spec/public/images/css_sprite/not_image.txt
|
64
|
-
- spec/
|
82
|
+
- spec/public/stylesheets/.gitkeep
|
83
|
+
- spec/public/stylesheets/sass/css_sprite.sass
|
65
84
|
- spec/spec_helper.rb
|
66
85
|
- tasks/css_sprite_tasks.rake
|
67
|
-
|
68
|
-
homepage: http://github.com/flyerhzm/css_sprite
|
86
|
+
homepage: https://github.com/flyerhzm/css_sprite
|
69
87
|
licenses: []
|
70
|
-
|
71
88
|
post_install_message:
|
72
|
-
rdoc_options:
|
73
|
-
|
74
|
-
require_paths:
|
89
|
+
rdoc_options: []
|
90
|
+
require_paths:
|
75
91
|
- lib
|
76
|
-
required_ruby_version: !ruby/object:Gem::Requirement
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
requirements:
|
85
|
-
- -
|
86
|
-
- !ruby/object:Gem::Version
|
87
|
-
|
88
|
-
- 0
|
89
|
-
version: "0"
|
92
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
93
|
+
none: false
|
94
|
+
requirements:
|
95
|
+
- - ! '>='
|
96
|
+
- !ruby/object:Gem::Version
|
97
|
+
version: '0'
|
98
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
99
|
+
none: false
|
100
|
+
requirements:
|
101
|
+
- - ! '>='
|
102
|
+
- !ruby/object:Gem::Version
|
103
|
+
version: '0'
|
90
104
|
requirements: []
|
91
|
-
|
92
105
|
rubyforge_project:
|
93
|
-
rubygems_version: 1.
|
106
|
+
rubygems_version: 1.8.10
|
94
107
|
signing_key:
|
95
108
|
specification_version: 3
|
96
109
|
summary: css_sprite is a rails plugin/gem to generate css sprite image automatically.
|
97
|
-
test_files:
|
110
|
+
test_files:
|
111
|
+
- spec/app/stylesheets/.gitkeep
|
98
112
|
- spec/css_sprite/sprite_spec.rb
|
113
|
+
- spec/public/images/another_css_sprite/no_image
|
114
|
+
- spec/public/images/css_sprite/gmail_logo.png
|
115
|
+
- spec/public/images/css_sprite/gmail_logo_active.png
|
116
|
+
- spec/public/images/css_sprite/hotmail_logo.png
|
117
|
+
- spec/public/images/css_sprite/icons/facebook_icon.png
|
118
|
+
- spec/public/images/css_sprite/icons/facebook_icon_hover.png
|
119
|
+
- spec/public/images/css_sprite/icons/twitter_icon.png
|
120
|
+
- spec/public/images/css_sprite/icons/twitter_icon_hover.png
|
121
|
+
- spec/public/images/css_sprite/logos/gmail_logo.png
|
122
|
+
- spec/public/images/css_sprite/logos/gmail_logo_active.png
|
123
|
+
- spec/public/images/css_sprite/logos_hover/gmail_logo.png
|
124
|
+
- spec/public/images/css_sprite/not_image.txt
|
125
|
+
- spec/public/stylesheets/.gitkeep
|
126
|
+
- spec/public/stylesheets/sass/css_sprite.sass
|
99
127
|
- spec/spec_helper.rb
|
@@ -1,14 +0,0 @@
|
|
1
|
-
.logos:hover .gmail_logo, .gmail_logo, .hotmail_logo, .icons .twitter_icon:hover, .icons .facebook_icon:hover,
|
2
|
-
.icons .twitter_icon, .icons .facebook_icon, .gmail_logo.active, .logos .gmail_logo, .logos .gmail_logo.active {
|
3
|
-
background: url('/images/css_sprite.png?1278833054') no-repeat;
|
4
|
-
}
|
5
|
-
.logos:hover .gmail_logo { background-position: 0px 0px; }
|
6
|
-
.gmail_logo { background-position: 0px -41px; width: 103px; height: 36px; }
|
7
|
-
.hotmail_logo { background-position: 0px -82px; width: 103px; height: 36px; }
|
8
|
-
.icons .twitter_icon:hover { background-position: 0px -123px; }
|
9
|
-
.icons .facebook_icon:hover { background-position: 0px -142px; width: 21px; height: 21px; }
|
10
|
-
.icons .twitter_icon { background-position: 0px -168px; width: 14px; height: 14px; }
|
11
|
-
.icons .facebook_icon { background-position: 0px -187px; width: 14px; height: 14px; }
|
12
|
-
.gmail_logo.active { background-position: 0px -206px; }
|
13
|
-
.logos .gmail_logo { background-position: 0px -247px; width: 103px; height: 36px; }
|
14
|
-
.logos .gmail_logo.active { background-position: 0px -288px; width: 52px; height: 18px; }
|
@@ -1,48 +0,0 @@
|
|
1
|
-
.logos:hover .gmail_logo, .gmail_logo, .hotmail_logo, .icons .twitter_icon:hover, .icons .facebook_icon:hover,
|
2
|
-
.icons .twitter_icon, .icons .facebook_icon, .gmail_logo.active, .logos .gmail_logo, .logos .gmail_logo.active {
|
3
|
-
background: url('/images/css_sprite.png?1278833054') no-repeat;
|
4
|
-
}
|
5
|
-
.logos:hover .gmail_logo {
|
6
|
-
background-position: 0px 0px;
|
7
|
-
}
|
8
|
-
.gmail_logo {
|
9
|
-
background-position: 0px -41px;
|
10
|
-
width: 103px;
|
11
|
-
height: 36px;
|
12
|
-
}
|
13
|
-
.hotmail_logo {
|
14
|
-
background-position: 0px -82px;
|
15
|
-
width: 103px;
|
16
|
-
height: 36px;
|
17
|
-
}
|
18
|
-
.icons .twitter_icon:hover {
|
19
|
-
background-position: 0px -123px;
|
20
|
-
}
|
21
|
-
.icons .facebook_icon:hover {
|
22
|
-
background-position: 0px -142px;
|
23
|
-
width: 21px;
|
24
|
-
height: 21px;
|
25
|
-
}
|
26
|
-
.icons .twitter_icon {
|
27
|
-
background-position: 0px -168px;
|
28
|
-
width: 14px;
|
29
|
-
height: 14px;
|
30
|
-
}
|
31
|
-
.icons .facebook_icon {
|
32
|
-
background-position: 0px -187px;
|
33
|
-
width: 14px;
|
34
|
-
height: 14px;
|
35
|
-
}
|
36
|
-
.gmail_logo.active {
|
37
|
-
background-position: 0px -206px;
|
38
|
-
}
|
39
|
-
.logos .gmail_logo {
|
40
|
-
background-position: 0px -247px;
|
41
|
-
width: 103px;
|
42
|
-
height: 36px;
|
43
|
-
}
|
44
|
-
.logos .gmail_logo.active {
|
45
|
-
background-position: 0px -288px;
|
46
|
-
width: 52px;
|
47
|
-
height: 18px;
|
48
|
-
}
|