Support simple background fallback in the background mixin.

This commit is contained in:
Chris Eppstein 2010-11-27 15:34:29 -08:00
parent dd921ea363
commit 35b206a897
4 changed files with 40 additions and 9 deletions

View File

@ -15,12 +15,14 @@
) { ) {
$backgrounds: compact($background-1, $background-2, $background-3, $background-4, $background-5, $backgrounds: compact($background-1, $background-2, $background-3, $background-4, $background-5,
$background-6, $background-7, $background-8, $background-9, $background-10); $background-6, $background-7, $background-8, $background-9, $background-10);
$mult-bgs: -compass-list-size($backgrounds) > 1;
@if $experimental-support-for-svg and prefixed(-svg, $backgrounds) { background: -svg($backgrounds); } $simple-background: if($mult-bgs or prefixed(-css2, $backgrounds), -css2(-compass-nth($backgrounds, last)), false);
@if $experimental-support-for-webkit and prefixed(-webkit, $backgrounds) { background: -webkit($backgrounds); } @if not blank($simple-background) { background: $simple-background; }
@if $experimental-support-for-mozilla and prefixed(-moz, $backgrounds) { background: -moz($backgrounds); } @if $experimental-support-for-svg and prefixed(-svg, $backgrounds) { background: -svg($backgrounds); }
@if $experimental-support-for-pie and (prefixed(-pie, $backgrounds) or -compass-list-size($backgrounds) > 1) { -pie-background: -pie($backgrounds); } @if $experimental-support-for-webkit and prefixed(-webkit, $backgrounds) { background: -webkit($backgrounds); }
background: $backgrounds; @if $experimental-support-for-mozilla and prefixed(-moz, $backgrounds) { background: -moz($backgrounds); }
@if $experimental-support-for-pie and (prefixed(-pie, $backgrounds) or $mult-bgs) { -pie-background: -pie($backgrounds); }
background: $backgrounds;
} }
// Background image property support for vendor prefixing within values. // Background image property support for vendor prefixing within values.

View File

@ -138,10 +138,10 @@ module Compass::SassExtensions::Functions::GradientSupport
Sass::Script::Bool.new(args.any?{|a| a.respond_to?(method)}) Sass::Script::Bool.new(args.any?{|a| a.respond_to?(method)})
end end
%w(webkit moz o ms svg pie).each do |prefix| %w(webkit moz o ms svg pie css2).each do |prefix|
class_eval <<-RUBY, __FILE__, __LINE__ + 1 class_eval <<-RUBY, __FILE__, __LINE__ + 1
def _#{prefix}(*args) def _#{prefix}(*args)
List.new(*args.map! {|a| add_prefix(:to_#{prefix}, a)}, :comma) List.new(*args.map! {|a| add_prefix(:to_#{prefix}, a)})
end end
RUBY RUBY
end end
@ -278,7 +278,7 @@ module Compass::SassExtensions::Functions::GradientSupport
Sass::Script::Bool.new(args.any?{|a| a.respond_to?(method)}) Sass::Script::Bool.new(args.any?{|a| a.respond_to?(method)})
end end
%w(webkit moz o ms svg pie).each do |prefix| %w(webkit moz o ms svg pie css2).each do |prefix|
class_eval <<-RUBY, __FILE__, __LINE__ + 1 class_eval <<-RUBY, __FILE__, __LINE__ + 1
def _#{prefix}(*args) def _#{prefix}(*args)
Sass::Script::List.new(args.map! {|a| add_prefix(:to_#{prefix}, a)}, :comma) Sass::Script::List.new(args.map! {|a| add_prefix(:to_#{prefix}, a)}, :comma)
@ -395,6 +395,9 @@ module Compass::SassExtensions::Functions::GradientSupport
Compass::Logger.new.record(:warning, "PIE does not support radial-gradient.") Compass::Logger.new.record(:warning, "PIE does not support radial-gradient.")
Sass::Script::String.new("-pie-radial-gradient(unsupported)") Sass::Script::String.new("-pie-radial-gradient(unsupported)")
end end
def to_css2(options = self.options)
Sass::Script::String.new("")
end
end end
class LinearGradient < Sass::Script::Literal class LinearGradient < Sass::Script::Literal
@ -437,6 +440,9 @@ module Compass::SassExtensions::Functions::GradientSupport
# the presence of this attribute helps flag when to render a special rule. # the presence of this attribute helps flag when to render a special rule.
Sass::Script::String.new to_s(options) Sass::Script::String.new to_s(options)
end end
def to_css2(options = self.options)
Sass::Script::String.new("")
end
end end
module Functions module Functions
@ -582,6 +588,19 @@ module Compass::SassExtensions::Functions::GradientSupport
end end
end end
def blank(obj)
case obj
when Sass::Script::Bool
Sass::Script::Bool.new !obj.to_bool
when Sass::Script::String
Sass::Script::Bool.new obj.value.strip.size == 0
when Sass::Script::List
Sass::Script::Bool.new obj.value.size == 0 || obj.value.all?{|el| blank(el).to_bool}
else
Sass::Script::Bool.new false
end
end
private private
# After using the sass script parser to parse a string, this reconstructs # After using the sass script parser to parse a string, this reconstructs

View File

@ -2,12 +2,14 @@
background: white url("foo.png"); } background: white url("foo.png"); }
.bg-shortcut-linear-gradient { .bg-shortcut-linear-gradient {
background: white ;
background: white url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background: white url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIi8+PC9saW5lYXJHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
background: white -webkit-gradient(linear, 0% 0%, 100% 100%, color-stop(0%, #dddddd), color-stop(100%, #aaaaaa)); background: white -webkit-gradient(linear, 0% 0%, 100% 100%, color-stop(0%, #dddddd), color-stop(100%, #aaaaaa));
background: white -moz-linear-gradient(top left, #dddddd, #aaaaaa); background: white -moz-linear-gradient(top left, #dddddd, #aaaaaa);
background: white linear-gradient(top left, #dddddd, #aaaaaa); } background: white linear-gradient(top left, #dddddd, #aaaaaa); }
.bg-shortcut-radial-gradient { .bg-shortcut-radial-gradient {
background: white ;
background: white url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHJhZGlhbEdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iMTAwIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIi8+PC9yYWRpYWxHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g'); background: white url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHJhZGlhbEdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iMTAwIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZGRkZGRkIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjYWFhYWFhIi8+PC9yYWRpYWxHcmFkaWVudD48L2RlZnM+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0idXJsKCNncmFkKSIgLz48L3N2Zz4g');
background: white -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, color-stop(0%, #dddddd), color-stop(100%, #aaaaaa)); background: white -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 100, color-stop(0%, #dddddd), color-stop(100%, #aaaaaa));
background: white -moz-radial-gradient(center center, #dddddd, #aaaaaa 100px); background: white -moz-radial-gradient(center center, #dddddd, #aaaaaa 100px);

View File

@ -81,6 +81,14 @@ class SassExtensionsTest < Test::Unit::TestCase
assert evaluate("tan(pi()/2 + 0.0001)").to_f < -1000, evaluate("tan(pi()/2 - 0.0001)") assert evaluate("tan(pi()/2 + 0.0001)").to_f < -1000, evaluate("tan(pi()/2 - 0.0001)")
end end
def test_blank
assert_equal "false", evaluate("blank(true)")
assert_equal "true", evaluate("blank(false)")
assert_equal "true", evaluate("blank('')")
assert_equal "true", evaluate("blank(' ')")
assert_equal "true", evaluate("blank(-compass-space-list(' '))")
end
protected protected
def evaluate(value) def evaluate(value)
Sass::Script::Parser.parse(value, 0, 0).perform(Sass::Environment.new).to_s Sass::Script::Parser.parse(value, 0, 0).perform(Sass::Environment.new).to_s