-
Notifications
You must be signed in to change notification settings - Fork 395
follow-up improvements to components list page #784
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The selected sidenav treatment in dark mode doesn't look great, does the spec say anything about dark mode? Otherwise LGTM
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
@@ -49,7 +49,7 @@ import {NavigationFocusService} from '../../shared/navigation-focus/navigation-f | |||
// These breakpoint values need to stay in sync with the related Sass variables in | |||
// src/styles/_constants.scss. | |||
const EXTRA_SMALL_WIDTH_BREAKPOINT = 720; | |||
const SMALL_WIDTH_BREAKPOINT = 959; | |||
const SMALL_WIDTH_BREAKPOINT = 939; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think that it's problematic that this small breakpoint was changed so that it no longer matches our Sass small breakpoint (mentioned in the comments above this const):
$small-breakpoint-width: 959px; |
It also no longer matches any of the established Material Design layout breakpoints:
https://material.io/design/layout/responsive-layout-grid.html#breakpoints
I'm looking at reverting this in #257.
- remove `overflow: hidden` that breaks TOC stickiness - made sure to keep the Material Table examples from overflowing afterwards via changes to `component-viewer.scss` - revert change from angular#784 to make small breakpoint 939 instead of 959 as it isn't consistent with our Sass breakpoints or the Material layout spec - use alternative to `router-outlet + *` styling - use constants for more media query breakpoints - add some missing Sass imports - move $sidenav-width to constants - update constants to include different horizontal padding for guides and sidenav content - update copyright year - add stylePreprocessorOptions for shorter Sass imports - add .nvmrc since Angular projects only support NodeJS 12 atm Fixes angular#257
- remove `overflow: hidden` that breaks TOC stickiness - made sure to keep the Material Table examples from overflowing afterwards via changes to `component-viewer.scss` - revert change from angular#784 to make small breakpoint 939 instead of 959 as it isn't consistent with our Sass breakpoints or the Material layout spec - use alternative to `router-outlet + *` styling - use constants for more media query breakpoints - add some missing Sass imports - move $sidenav-width to constants - update constants to include different horizontal padding for guides and sidenav content - update copyright year - add stylePreprocessorOptions for shorter Sass imports - add .nvmrc since Angular projects only support NodeJS 12 atm Fixes angular#257
- remove `overflow: hidden` that breaks TOC stickiness - made sure to keep the Material Table examples from overflowing afterwards via changes to `component-viewer.scss` - revert change from angular#784 to make small breakpoint 939 instead of 959 as it isn't consistent with our Sass breakpoints or the Material layout spec - use alternative to `router-outlet + *` styling - use constants for more media query breakpoints - add some missing Sass imports - move $sidenav-width to constants - update constants to include different horizontal padding for guides and sidenav content - update copyright year - add stylePreprocessorOptions for shorter Sass imports - add .nvmrc since Angular projects only support NodeJS 12 atm Fixes angular#257
- remove `overflow: hidden` that breaks TOC stickiness - made sure to keep the Material Table examples from overflowing afterwards via changes to `component-viewer.scss` - revert change from #784 to make small breakpoint 939 instead of 959 as it isn't consistent with our Sass breakpoints or the Material layout spec - use alternative to `router-outlet + *` styling - use constants for more media query breakpoints - add some missing Sass imports - move $sidenav-width to constants - update constants to include different horizontal padding for guides and sidenav content - update copyright year - add stylePreprocessorOptions for shorter Sass imports - add .nvmrc since Angular projects only support NodeJS 12 atm Fixes #257
follow up of #760