https://github.com/sha-red/compass-mixins/tree/master/lib
extended with more sass frameworks and as django app.
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
88 lines
3.1 KiB
88 lines
3.1 KiB
12 years ago
|
@import "shared";
|
||
|
|
|
||
|
|
// These defaults make the arguments optional for this mixin
|
||
|
|
// If you like, set different defaults in your project
|
||
|
|
|
||
|
|
$default-text-shadow-color: #aaa !default;
|
||
|
|
$default-text-shadow-h-offset: 0px !default;
|
||
|
|
$default-text-shadow-v-offset: 0px !default;
|
||
|
|
$default-text-shadow-blur: 1px !default;
|
||
|
|
$default-text-shadow-spread: false !default;
|
||
|
|
|
||
|
|
// Provides cross-browser text shadows when one or more shadows are needed.
|
||
|
|
// Each shadow argument should adhere to the standard css3 syntax for the
|
||
|
|
// text-shadow property.
|
||
|
|
//
|
||
|
|
// Note: if any shadow has a spread parameter, this will cause the mixin
|
||
|
|
// to emit the shadow declaration twice, first without the spread,
|
||
|
|
// then with the spread included. This allows you to progressively
|
||
|
|
// enhance the browsers that do support the spread parameter.
|
||
|
|
@mixin text-shadow(
|
||
|
|
$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: compact($default-text-shadow-h-offset $default-text-shadow-v-offset $default-text-shadow-blur $default-text-shadow-spread $default-text-shadow-color);
|
||
|
|
}
|
||
|
|
$shadows-without-spread: join((),(),comma);
|
||
|
|
$shadows: join((),(),comma);
|
||
|
|
$has-spread: false;
|
||
|
|
@each $shadow in compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, $shadow-5,
|
||
|
|
$shadow-6, $shadow-7, $shadow-8, $shadow-9, $shadow-10) {
|
||
|
|
@if length($shadow) > 4 {
|
||
|
|
$has-spread: true;
|
||
|
|
$shadows-without-spread: append($shadows-without-spread, nth($shadow,1) nth($shadow,2) nth($shadow,3) nth($shadow,5));
|
||
|
|
$shadows: append($shadows, $shadow);
|
||
|
|
} else {
|
||
|
|
$shadows-without-spread: append($shadows-without-spread, $shadow);
|
||
|
|
$shadows: append($shadows, $shadow);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
@if $has-spread {
|
||
|
|
text-shadow: $shadows-without-spread;
|
||
|
|
}
|
||
|
|
text-shadow: $shadows;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Provides a single cross-browser CSS text shadow.
|
||
|
|
//
|
||
|
|
// Provides sensible defaults for the color, horizontal offset, vertical offset, blur, and spread
|
||
|
|
// according to the configuration defaults above.
|
||
|
|
@mixin single-text-shadow(
|
||
|
|
$hoff: false,
|
||
|
|
$voff: false,
|
||
|
|
$blur: false,
|
||
|
|
$spread: false,
|
||
|
|
$color: false
|
||
|
|
) {
|
||
|
|
// A lot of people think the color comes first. It doesn't.
|
||
|
|
@if type-of($hoff) == color {
|
||
|
|
$temp-color: $hoff;
|
||
|
|
$hoff: $voff;
|
||
|
|
$voff: $blur;
|
||
|
|
$blur: $spread;
|
||
|
|
$spread: $color;
|
||
|
|
$color: $temp-color;
|
||
|
|
}
|
||
|
|
// Can't rely on default assignment with multiple supported argument orders.
|
||
|
|
$hoff: if($hoff, $hoff, $default-text-shadow-h-offset);
|
||
|
|
$voff: if($voff, $voff, $default-text-shadow-v-offset);
|
||
|
|
$blur: if($blur, $blur, $default-text-shadow-blur );
|
||
|
|
$spread: if($spread, $spread, $default-text-shadow-spread );
|
||
|
|
$color: if($color, $color, $default-text-shadow-color );
|
||
|
|
// We don't need experimental support for this property.
|
||
|
|
@if $color == none or $hoff == none {
|
||
|
|
@include text-shadow(none);
|
||
|
|
} @else {
|
||
|
|
@include text-shadow(compact($hoff $voff $blur $spread $color));
|
||
|
|
}
|
||
|
|
}
|