public
Created

Bleed Mixin

  • Download Gist
bleed.scss
SCSS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
@mixin bleed(
$width: $grid-padding,
$sides: left right,
$style: $container-style
) {
@if $border-box-sizing { @include box-sizing(content-box) }
 
@if type-of($width) == 'list' {
$width: filter($width, of);
$width: space(nth($width,1), nth($width,2), $style);
} @else if unitless($width) {
$width: space($width, $style: $style);
}
 
@if $sides == 'all' {
margin: - $width;
padding: $width;
} @else {
@each $side in $sides {
margin-#{$side}: - $width;
padding-#{$side}: $width;
}
}
}

This is just exactly what I've been looking for, thank you :)

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.