Contents

// apropos-bg-variants automatically generates rules for applying image
// variants as CSS backgrounds.
//
// Arguments:
//   $path: path to base image
//   $generate-height: true to have height properties generated for all
//     non-hidpi variants.
// ===========================================================================
=apropos-bg-variants($path, $generate-height: false)
  +apropos-bg-image-with-height($path, $generate-height)
  @each $_variant in image-variants($path)
    $_type: nth-polyfill($_variant, 1)
    $_path: nth-polyfill($_variant, -1)
    $_class: nth-polyfill($_variant, 2)
    $_query: nth-polyfill($_variant, -2)
    @if $_type == "class+media"
      @media #{$_query}
        #{nest($_class, "&")}
          +apropos-bg-image-with-height($_path, $generate-height, $_query)
    @else if $_type == media
      @media #{$_query}
        +apropos-bg-image-with-height($_path, $generate-height, $_query)
    @else if $_type == class
      #{nest($_class, "&")}
        background-image: image-url($_path)

// apropos-bg-image-with-height generates a background-image property and
// optionally generates a height property calculated from the image, if the
// query argument is not hidpi.
//
// Arguments:
//   $path: path to base image
//   $generate-height: true to have height properties generated
//   $query: media query that this image will be used with (height will not be
//     generated if the query is hidpi)
// ===========================================================================
=apropos-bg-image-with-height($path, $generate-height, $query: "")
  background-image: image-url($path)
  @if $generate-height and not (str-contains($query, "dpi") or str-contains($query, "pixel-ratio"))
    height: image-height($path)

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
apropos-0.1.4	stylesheets/apropos/_core.sass
apropos-0.1.3	stylesheets/apropos/_core.sass