Adaptive UI breakpoints missing and docs out of date

[gligoran]

In the change log for rc6 it's mentioned that the adaptive UI breakpoints have changed:

Breaking Changes

Added breakpoints: xs, gt-xs, xl per Material Design spec. Breakpoints sm and gt-sm have changed.

First of all, the docs are still for the pre-rc6 breakpoints (sm = 600px, md = 960px, ...). There's no mention of xs or xl anywhere.

Additionally, there doesn't seem to be CSS classes for hide-gt-xs, show-gt-xs, layout-padding-gt-xs, layout-margin-gt-xs. There might be more, but at least the first 2 are crucial for a successful transition from rc5 to rc6.

Also there, are still inconsistencies I've mentioned in #5576.

[gligoran]

@ThomasBurleson: Here's the fix for hide-xs and show-xs in layout.scss:

SM @l446:

// SMALL SCREEN
.hide, .hide-gt-xs {
&:not(.show-gt-xs):not(.show-sm):not(.show) {
    display: none;
  }
}
.hide-sm:not(.show-sm):not(.show) {
    display: none;
  }
}

MD @L463:

.hide, .hide-gt-xs, .hide-gt-sm {
  &:not(.show-gt-xs):not(.show-gt-sm):not(.show-md):not(.show) {
    display: none;
  }
}

LG @l481:

.hide,.hide-gt-xs, .hide-gt-sm, .hide-gt-md {
  &:not(.show-gt-xs):not(.show-gt-sm):not(.show-gt-md):not(.show-lg):not(.show) {
    display: none;
  }
}

XL @l499:

.hide, .hide-gt-xs, .hide-gt-sm, .hide-gt-md, .hide-gt-lg {
  &:not(.show-gt-xs):not(.show-gt-sm):not(.show-gt-md):not(.show-gt-lg):not(.show-xl):not(.show) {
    display: none;
  }
}

I'm not sure how to fix the layout-padding and layout-margin issues though, if at all.

[ThomasBurleson]

Fixes are pending with #6082