Sha256: 1cc9482f71f59eb7b1ccfd1dd905af7187c64e0ea33f4b6851fab39470d8a06d
Contents?: true
Size: 1.18 KB
Versions: 107
Compression:
Stored size: 1.18 KB
Contents
////
/// @group helpers
////
/// Media query for retina images (device-pixel-ratio)
///
/// @param {Number} $ratio [2] - Device pixel ratio
/// @content Passed content will be outputted within the media query
///
/// @example scss - Providing a @2x image for screens that support it
/// background-image: govuk-image-url("my-image.png");
///
/// @include govuk-device-pixel-ratio {
/// background-image: govuk-image-url("my-image-2x.png");
/// }
///
/// @example scss - Using a custom ratio
/// background-image: govuk-image-url("my-image.png");
///
/// @include govuk-device-pixel-ratio {
/// background-image: govuk-image-url("my-image-2x.png");
/// }
///
/// @include govuk-device-pixel-ratio(3) {
/// background-image: govuk-image-url("my-image-3x.png");
/// }
///
/// @access public
@mixin govuk-device-pixel-ratio($ratio: 2) {
@media only screen and (-webkit-min-device-pixel-ratio: $ratio),
only screen and (min--moz-device-pixel-ratio: $ratio),
only screen and ( min-device-pixel-ratio: $ratio),
only screen and ( min-resolution: #{($ratio*96)}dpi),
only screen and ( min-resolution: #{$ratio}dppx) {
@content;
}
}
Version data entries
107 entries across 107 versions & 3 rubygems