refactor(docs-infra): scope nav-item styles to the <aio-nav-item> element (#40704)

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 #40704
This commit is contained in:
George Kalpakas 2021-02-05 12:48:56 +02:00 committed by Alex Rickabaugh
parent e043e52a4f
commit c9a40257d4

View File

@ -3,24 +3,6 @@
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);
}
}
}
}