Compass Filter
The filter mixin is used to apply filters to images.
This file can be imported using:
@import "compass/css3/filter"
Imports
- Browser Support – Provides configuration options for the Compass Browser Support Matrix.
Configurable Variables help
$filter-support-threshold
$graceful-usage-threshold
The prefixed support threshold for css filter effects. Defaults to the $graceful-usage-threshold.
Mixins
view sourcefilter($filters)
=filter($filters) +prefixed-properties(css-filters, $filter-support-threshold, (filter: $filters))
@mixin filter($filters) {
@include prefixed-properties(css-filters, $filter-support-threshold, (filter: $filters));
}
Provides cross-browser support for the upcoming (?) css3 filter property.
The filter argument should adhere to the standard css3 syntax for the filter property.
filter-margin-top($width)
=filter-margin-top($width) +apply-filter-margin(top, $width)
@mixin filter-margin-top($width) {
@include apply-filter-margin(top, $width);
}
filter-margin-top
filter-margin-right($width)
=filter-margin-right($width) +apply-filter-margin(right, $width)
@mixin filter-margin-right($width) {
@include apply-filter-margin(right, $width);
}
filter-margin-right
filter-margin-bottom($width)
=filter-margin-bottom($width) +apply-filter-margin(bottom, $width)
@mixin filter-margin-bottom($width) {
@include apply-filter-margin(bottom, $width);
}
filter-margin-bottom
filter-margin-left($width)
=filter-margin-left($width) +apply-filter-margin(left, $width)
@mixin filter-margin-left($width) {
@include apply-filter-margin(left, $width);
}
filter-margin-left
filter-margin($widths)
=filter-margin($widths) +prefixed-properties(css-filters, $filter-support-threshold, (filter-margin: $widths))
@mixin filter-margin($widths) {
@include prefixed-properties(css-filters, $filter-support-threshold, (filter-margin: $widths));
}
filter-margin
color-interpolation-filters($value)
=color-interpolation-filters($value) +prefixed-properties(css-filters, $filter-support-threshold, (color-interpolation-filters: $value))
@mixin color-interpolation-filters($value) {
@include prefixed-properties(css-filters, $filter-support-threshold, (color-interpolation-filters: $value));
}
color-interpolation-filters (auto | sRGB | linearRGB )