p0c-website

Proof of concepts for fun and profit
git clone https://git.in0rdr.ch/p0c-website.git
Log | Files | Refs | Pull requests |Archive | README | LICENSE

_prefixer.scss (1664B)


      1 @charset "UTF-8";
      2 
      3 /// A mixin for generating vendor prefixes on non-standardized properties.
      4 ///
      5 /// @param {String} $property
      6 ///   Property to prefix
      7 ///
      8 /// @param {*} $value
      9 ///   Value to use
     10 ///
     11 /// @param {List} $prefixes
     12 ///   Prefixes to define
     13 ///
     14 /// @example scss - Usage
     15 ///   .element {
     16 ///     @include prefixer(border-radius, 10px, webkit ms spec);
     17 ///   }
     18 ///
     19 /// @example css - CSS Output
     20 ///   .element {
     21 ///     -webkit-border-radius: 10px;
     22 ///     -moz-border-radius: 10px;
     23 ///     border-radius: 10px;
     24 ///   }
     25 ///
     26 /// @require {variable} $prefix-for-webkit
     27 /// @require {variable} $prefix-for-mozilla
     28 /// @require {variable} $prefix-for-microsoft
     29 /// @require {variable} $prefix-for-opera
     30 /// @require {variable} $prefix-for-spec
     31 
     32 @mixin prefixer($property, $value, $prefixes) {
     33   @each $prefix in $prefixes {
     34     @if $prefix == webkit {
     35       @if $prefix-for-webkit {
     36         -webkit-#{$property}: $value;
     37       }
     38     } @else if $prefix == moz {
     39       @if $prefix-for-mozilla {
     40         -moz-#{$property}: $value;
     41       }
     42     } @else if $prefix == ms {
     43       @if $prefix-for-microsoft {
     44         -ms-#{$property}: $value;
     45       }
     46     } @else if $prefix == o {
     47       @if $prefix-for-opera {
     48         -o-#{$property}: $value;
     49       }
     50     } @else if $prefix == spec {
     51       @if $prefix-for-spec {
     52         #{$property}: $value;
     53       }
     54     } @else  {
     55       @warn "Unrecognized prefix: #{$prefix}";
     56     }
     57   }
     58 }
     59 
     60 @mixin disable-prefix-for-all() {
     61   $prefix-for-webkit:    false !global;
     62   $prefix-for-mozilla:   false !global;
     63   $prefix-for-microsoft: false !global;
     64   $prefix-for-opera:     false !global;
     65   $prefix-for-spec:      false !global;
     66 }