Skip to content
Permalink
Browse files

feat(grids): Add top level gutter classes (#2900)

  • Loading branch information...
brandonferrua committed Nov 1, 2017
1 parent 1fa23d0 commit b6d7fd54b23f325e17a3fe03d8135a3441df521c
Showing with 291 additions and 139 deletions.
  1. +110 −0 ui/utilities/grid/_deprecate.scss
  2. +1 −1 ui/utilities/grid/_doc.scss
  3. +180 −138 ui/utilities/grid/_index.scss
@@ -0,0 +1,110 @@
// Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
// Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license

@include deprecate('4.0.0', 'Use .slds-{size}-nowrap instead') {

.slds-nowrap_small,
.slds-nowrap--small {
@include mq-small-min {
@include flex-item(expand);
@include flex-wrap(false);
}
}

.slds-nowrap_medium,
.slds-nowrap--medium {
@include mq-medium-min {
@include flex-item(expand);
@include flex-wrap(false);
}
}

.slds-nowrap_large,
.slds-nowrap--large {
@include mq-large-min {
@include flex-item(expand);
@include flex-wrap(false);
}
}
}


@include deprecate('4.0.0', 'Use spacing utilities instead instead of .slds-col--padded-*') {

.slds-col_padded,
.slds-col--padded {
padding: {
right: $spacing-small;
left: $spacing-small;
}
}

.slds-col_padded-medium,
.slds-col--padded-medium {
padding: {
right: $spacing-medium;
left: $spacing-medium;
}
}

.slds-col_padded-large,
.slds-col--padded-large {
padding: {
right: $spacing-large;
left: $spacing-large;
}
}

.slds-col_padded-around,
.slds-col--padded-around {
padding: $spacing-small;
}

.slds-col_padded-around-medium,
.slds-col--padded-around-medium {
padding: $spacing-medium;
}

.slds-col_padded-around-large,
.slds-col--padded-around-large {
padding: $spacing-large;
}
}

@include deprecate('4.0.0', 'Use .slds-col--rule-<position> instead of .slds-col-rule--*') {

.slds-col-rule {
@include mq-large-min {

&_top,
&--top {
border-top: 1px solid $color-border-separator;
}

&_right,
&--right {
border-right: 1px solid $color-border-separator;
}

&_bottom,
&--bottom {
border-bottom: 1px solid $color-border-separator;
}

&_left,
&--left {
border-left: 1px solid $color-border-separator;
}
}
}
}

@include deprecate('4.0.0', 'Use slds-align_absolute-center instead') {

.slds-align-content-center {

flex: 1;
align-self: center;
justify-content: center;
}
}
@@ -28,7 +28,7 @@
*
* @utility
* @name grid
* @selector [class*='slds-grid']
* @selector [class*='slds-grid'], [class*='slds-wrap'], [class*='slds-nowrap'], [class*='slds-gutters'], .slds-col, [class*='slds-col-'], .slds-has-flexi-truncate, .slds-no-flex, .slds-no-space, [class*='slds-grow'], [class*='slds-shrink'], [class*='slds-container']
* @support dev-ready
* @layout responsive
*/
Oops, something went wrong.

0 comments on commit b6d7fd5

Please sign in to comment.
You can’t perform that action at this time.