message: refactor(docs-infra): scope nav-item styles to the `<aio-nav-item>` element
  This commit ensures that all styles for the sidenav nav-items (which are
  defined in `_sidenav.scss`) only apply to elements inside an
  `<aio-nav-item>` element. This will prevent the styles accidentally
  taking effect on a different part of the app.
  PR Close
diff: transition: none;
  }
  -aio-nav-menu {
  - display: block;
  - margin: 0 auto;
  - max-width: 268px;
  -
  - &:first-of-type {
  - margin-top: 16px;
  - }
  -
  - &:last-of-type {
  - margin-bottom: 16px;
  - }
  -
  - ul, a {
  - margin: 0;
  - }
  -}
  -
  mat-sidenav-container.sidenav-container {
  background-color: $white;
  min-height: 100%;
  @@ -72,6 +54,24 @@ mat-sidenav-container.sidenav-container {
  }
  }
  +aio-nav-menu {
  + display: block;
  + margin: 0 auto;
  + max-width: 268px;
  +
  + &:first-of-type {
  + margin-top: 16px;
  + }
  +
  + &:last-of-type {
  + margin-bottom: 16px;
  + }
  +
  + ul, a {
  + margin: 0;
  + }
  +
  + aio-nav-item {
  .vertical-menu-item {
  box-sizing: border-box;
  color: $darkgray;
  @@ -188,3 +188,5 @@ button.vertical-menu-item {
  @include rotate(90deg);
  }
  }
  + }
  +}
  