condensed box-shadow and text-shadow mixins to no longer have multiple-text-shadows or multiple-box-shadows mixins as they were unncessary

This commit is contained in:
B Mathis 2010-11-23 00:10:45 -06:00
parent 17ab1d3820
commit d34e05c4ec
2 changed files with 56 additions and 96 deletions

View File

@ -24,56 +24,7 @@ $default-box-shadow-spread : false !default;
// The default shadow inset: inset or false (for standard shadow). // The default shadow inset: inset or false (for standard shadow).
$default-box-shadow-inset : false !default; $default-box-shadow-inset : false !default;
// Provides cross-browser CSS box shadows for Webkit, Gecko, and CSS3. // Provides cross-browser for Webkit, Gecko, and CSS3 box shadows when one or more box shadows are needed.
// Arguments are color, horizontal offset, vertical offset, blur length, spread length, and inset.
@mixin single-box-shadow(
$color : $default-box-shadow-color,
$hoff : $default-box-shadow-h-offset,
$voff : $default-box-shadow-v-offset,
$blur : $default-box-shadow-blur,
$spread : $default-box-shadow-spread,
$inset : $default-box-shadow-inset
) {
@if not ($inset == true or $inset == false or $inset == inset) {
@warn "$inset expected to be true or the inset keyword. Got #{$inset} instead. Using: inset";
}
@if $color == none {
@include multiple-box-shadows(none);
} @else {
$full : $hoff $voff;
@if $blur { $full: $full $blur; }
@if $spread { $full: $full $spread; }
@if $color { $full: $full $color; }
@if $inset { $full: inset $full; }
@include multiple-box-shadows($full);
}
}
// Provides cross-browser box shadows when one or more box shadows are needed.
@mixin multiple-box-shadows(
$shadow-1 : default,
$shadow-2 : false,
$shadow-3 : false,
$shadow-4 : false,
$shadow-5 : false,
$shadow-6 : false,
$shadow-7 : false,
$shadow-8 : false,
$shadow-9 : false,
$shadow-10: false
) {
@if $shadow-1 == default {
$shadow-1 : -compass-space-list(compact(if($default-box-shadow-inset, inset), $default-box-shadow-h-offset, $default-box-shadow-v-offset, $default-box-shadow-blur, $default-box-shadow-spread, $default-box-shadow-color));
}
$shadow : compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9, $shadow-10);
@include experimental(box-shadow, $shadow,
-moz, -webkit, -o, not -ms, not -khtml, official
);
}
@mixin box-shadow( @mixin box-shadow(
$shadow-1 : default, $shadow-1 : default,
$shadow-2 : false, $shadow-2 : false,
@ -102,10 +53,38 @@ $default-box-shadow-inset : false !default;
); );
} }
@else { @else {
@include multiple-box-shadows( @if $shadow-1 == default {
$shadow-1, $shadow-2, $shadow-3, $shadow-1 : -compass-space-list(compact(if($default-box-shadow-inset, inset), $default-box-shadow-h-offset, $default-box-shadow-v-offset, $default-box-shadow-blur, $default-box-shadow-spread, $default-box-shadow-color));
$shadow-4, $shadow-5, $shadow-6, }
$shadow-7, $shadow-8, $shadow-9, $shadow-10 $shadow : compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9, $shadow-10);
@include experimental(box-shadow, $shadow,
-moz, -webkit, -o, not -ms, not -khtml, official
); );
} }
}
// Provides a single cross-browser CSS box shadow for Webkit, Gecko, and CSS3.
// Includes default arguments for color, horizontal offset, vertical offset, blur length, spread length, and inset.
@mixin single-box-shadow(
$color : $default-box-shadow-color,
$hoff : $default-box-shadow-h-offset,
$voff : $default-box-shadow-v-offset,
$blur : $default-box-shadow-blur,
$spread : $default-box-shadow-spread,
$inset : $default-box-shadow-inset
) {
@if not ($inset == true or $inset == false or $inset == inset) {
@warn "$inset expected to be true or the inset keyword. Got #{$inset} instead. Using: inset";
}
@if $color == none {
@include box-shadow(none);
} @else {
$full : $hoff $voff;
@if $blur { $full: $full $blur; }
@if $spread { $full: $full $spread; }
@if $color { $full: $full $color; }
@if $inset { $full: inset $full; }
@include box-shadow($full);
}
} }

View File

@ -8,43 +8,7 @@ $default-text-shadow-h-offset: 0px !default;
$default-text-shadow-v-offset: 0px !default; $default-text-shadow-v-offset: 0px !default;
$default-text-shadow-blur: 1px !default; $default-text-shadow-blur: 1px !default;
// Provides CSS text shadows.
// Arguments are color, horizontal offset, vertical offset, and blur
@mixin single-text-shadow(
$color: $default-text-shadow-color,
$hoff: $default-text-shadow-h-offset,
$voff: $default-text-shadow-v-offset,
$blur: $default-text-shadow-blur
) {
// XXX I'm surprised we don't need experimental support for this property.
@if $color == none {
text-shadow: none;
} @else {
text-shadow: $color $hoff $voff $blur;
}
}
// Provides cross-browser text shadows when one or more shadows are needed. // Provides cross-browser text shadows when one or more shadows are needed.
@mixin multiple-text-shadows(
$shadow-1 : default,
$shadow-2 : false,
$shadow-3 : false,
$shadow-4 : false,
$shadow-5 : false,
$shadow-6 : false,
$shadow-7 : false,
$shadow-8 : false,
$shadow-9 : false,
$shadow-10: false
) {
@if $shadow-1 == default {
$shadow-1: $default-text-shadow-color $default-text-shadow-h-offset $default-text-shadow-v-offset $default-text-shadow-blur;
}
text-shadow: compact($shadow-1, $shadow-2, $shadow-3,
$shadow-4, $shadow-5, $shadow-6,
$shadow-7, $shadow-8, $shadow-9, $shadow-10);
}
@mixin text-shadow( @mixin text-shadow(
$shadow-1 : default, $shadow-1 : default,
$shadow-2 : false, $shadow-2 : false,
@ -70,10 +34,27 @@ $default-text-shadow-blur: 1px !default;
if($shadow-4, $shadow-4, $default-text-shadow-blur) if($shadow-4, $shadow-4, $default-text-shadow-blur)
); );
} @else { } @else {
@include multiple-text-shadows( @if $shadow-1 == default {
$shadow-1, $shadow-2, $shadow-3, $shadow-1: $default-text-shadow-color $default-text-shadow-h-offset $default-text-shadow-v-offset $default-text-shadow-blur;
$shadow-4, $shadow-5, $shadow-6, }
$shadow-7, $shadow-8, $shadow-9, $shadow-10 text-shadow: compact($shadow-1, $shadow-2, $shadow-3,
); $shadow-4, $shadow-5, $shadow-6,
$shadow-7, $shadow-8, $shadow-9, $shadow-10);
} }
} }
// Provides a single cross-browser CSS text shadow.
// Includes default arguments for color, horizontal offset, vertical offset, and blur
@mixin single-text-shadow(
$color: $default-text-shadow-color,
$hoff: $default-text-shadow-h-offset,
$voff: $default-text-shadow-v-offset,
$blur: $default-text-shadow-blur
) {
// XXX I'm surprised we don't need experimental support for this property.
@if $color == none {
text-shadow: none;
} @else {
text-shadow: $color $hoff $voff $blur;
}
}