Source on Github

Shared CSS3 Utilities

This module provides support to the other CSS3 modules. You may want to use it to provide your own support for other CSS3 proposals as they are being worked on and before support is added to compass.

This file can be imported using: @import "compass/css3/shared"

Imports

  1. Browser Support – Provides configuration options for the Compass Browser Support Matrix.

Mixins

view source

=experimental($property, $value, $moz: $experimental-support-for-mozilla, $webkit: $experimental-support-for-webkit, $o: $experimental-support-for-opera, $ms: $experimental-support-for-microsoft, $khtml: $experimental-support-for-khtml, $official: true)
  @if $webkit and $experimental-support-for-webkit
    -webkit-#{$property}: $value
  @if $khtml and $experimental-support-for-khtml
    -khtml-#{$property}: $value
  @if $moz and $experimental-support-for-mozilla
    -moz-#{$property}: $value
  @if $ms and $experimental-support-for-microsoft
    -ms-#{$property}: $value
  @if $o and $experimental-support-for-opera
    -o-#{$property}: $value
  @if $official
    #{$property}: $value
@mixin experimental($property, $value, $moz: $experimental-support-for-mozilla, $webkit: $experimental-support-for-webkit, $o: $experimental-support-for-opera, $ms: $experimental-support-for-microsoft, $khtml: $experimental-support-for-khtml, $official: true) {
  @if $webkit and $experimental-support-for-webkit {
    -webkit-#{$property}: $value;
  }
  @if $khtml and $experimental-support-for-khtml {
    -khtml-#{$property}: $value;
  }
  @if $moz and $experimental-support-for-mozilla {
    -moz-#{$property}: $value;
  }
  @if $ms and $experimental-support-for-microsoft {
    -ms-#{$property}: $value;
  }
  @if $o and $experimental-support-for-opera {
    -o-#{$property}: $value;
  }
  @if $official {
    #{$property}: $value;
  }
}

This mixin provides basic support for CSS3 properties and their corresponding experimental CSS2 properties when the implementations are identical except for the property prefix.

view source

=experimental-value($property, $value, $moz: $experimental-support-for-mozilla, $webkit: $experimental-support-for-webkit, $o: $experimental-support-for-opera, $ms: $experimental-support-for-microsoft, $khtml: $experimental-support-for-khtml, $official: true)
  @if $webkit and $experimental-support-for-webkit
    #{$property}: -webkit-#{$value}
  @if $khtml and $experimental-support-for-khtml
    #{$property}: -khtml-#{$value}
  @if $moz and $experimental-support-for-mozilla
    #{$property}: -moz-#{$value}
  @if $ms and $experimental-support-for-microsoft
    #{$property}: -ms-#{$value}
  @if $o and $experimental-support-for-opera
    #{$property}: -o-#{$value}
  @if $official
    #{$property}: #{$value}
@mixin experimental-value($property, $value, $moz: $experimental-support-for-mozilla, $webkit: $experimental-support-for-webkit, $o: $experimental-support-for-opera, $ms: $experimental-support-for-microsoft, $khtml: $experimental-support-for-khtml, $official: true) {
  @if $webkit and $experimental-support-for-webkit {
    #{$property}: -webkit-#{$value};
  }
  @if $khtml and $experimental-support-for-khtml {
    #{$property}: -khtml-#{$value};
  }
  @if $moz and $experimental-support-for-mozilla {
    #{$property}: -moz-#{$value};
  }
  @if $ms and $experimental-support-for-microsoft {
    #{$property}: -ms-#{$value};
  }
  @if $o and $experimental-support-for-opera {
    #{$property}: -o-#{$value};
  }
  @if $official {
    #{$property}: #{$value};
  }
}

Same as experimental(), but for cases when the property is the same and the value is vendorized