primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-11-25 07:33:41 +03:00
Code Issues Projects Releases Wiki Activity

Updated gutter naming convention and added responsive modifiers

Browse Source
This commit is contained in:
broccolini 2017-06-19 18:52:26 -04:00
parent 9e93a68afd
commit b8e90516f8
1 changed files with 22 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/primer-layout/lib/grid.scss
View File

@ -31,8 +31,9 @@
}
}
// Gutters apply padding and a negative margin to the outside of the container
@mixin gutters ($gutter-width: $spacer3) {
// Gutters
// Apply padding and a negative margin to the outside of the container
@mixin gutters ($gutter-width: $spacer-3) {
margin-right: -$gutter-width;
margin-left: -$gutter-width;
@ -42,6 +43,22 @@
}
}
.gut-sm { @include gutters($spacer-2); }
.gut-md { @include gutters($spacer-3); }
.gut-lg { @include gutters($spacer-4); }
.gutter {
@include gutters($spacer-3);
}
.gutter-condensed {
@include gutters($spacer-2);
}
.gutter-spacious {
@include gutters($spacer-4);
}
@each $breakpoint in map-keys($breakpoints) {
@include breakpoint($breakpoint) {
.gutter-#{$breakpoint} { @include gutters($spacer-3); }
.gutter-#{$breakpoint}-condensed { @include gutters($spacer-2); }
.gutter-#{$breakpoint}-spacious { @include gutters($spacer-4); }
}
}