isso/docs/_static/css/neat/grid/_visual-grid.scss
2013-11-25 16:57:18 +01:00

42 lines
1.1 KiB
SCSS

@mixin grid-column-gradient($values...) {
background-image: deprecated-webkit-gradient(linear, left top, left bottom, $values);
background-image: -webkit-linear-gradient(left, $values);
background-image: -moz-linear-gradient(left, $values);
background-image: -ms-linear-gradient(left, $values);
background-image: -o-linear-gradient(left, $values);
background-image: unquote("linear-gradient(left, #{$values})");
}
@if $visual-grid == true or $visual-grid == yes {
body:before {
content: '';
display: inline-block;
@include grid-column-gradient(gradient-stops($grid-columns));
height: 100%;
left: 0;
margin: 0 auto;
max-width: $max-width;
opacity: $visual-grid-opacity;
position: fixed;
right: 0;
width: 100%;
pointer-events: none;
@if $visual-grid-index == back {
z-index: -1;
}
@else if $visual-grid-index == front {
z-index: 9999;
}
@each $breakpoint in $visual-grid-breakpoints {
@if $breakpoint != nil {
@include media($breakpoint) {
@include grid-column-gradient(gradient-stops($grid-columns));
}
}
}
}
}