fix(docs-infra): fix padding in sidenav and ensure all nav-items have equal height (#40427)
This commit improves the padding nav-menus and nav-items in the sidenav. It also ensures that all nav-items have the same height, regardless of their level and of whether they have children or not. Co-authored-by: Stefanie Fluin <sjtrimble@gmail.com> PR Close #40427
This commit is contained in:
parent
e6bed90e6e
commit
6e42d67c38
|
@ -6,17 +6,21 @@
|
|||
aio-nav-menu {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 260px;
|
||||
max-width: 268px;
|
||||
@include font-size(13);
|
||||
|
||||
&:first-of-type {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
ul, a {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
aio-nav-item div a {
|
||||
padding-left: 6px;
|
||||
}
|
||||
|
@ -27,7 +31,6 @@ mat-sidenav.mat-sidenav.sidenav {
|
|||
top: 64px;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 0;
|
||||
min-width: 260px;
|
||||
background-color: $superlightgray;
|
||||
border-right: 1px solid $lightgray;
|
||||
|
@ -75,7 +78,7 @@ mat-sidenav-container div.mat-sidenav-content {
|
|||
&:hover {
|
||||
background-color: $lightgray;
|
||||
color: $blue;
|
||||
text-shadow: 0 0 5px #ffffff;
|
||||
text-shadow: 0 0 5px $white;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
|
@ -86,11 +89,6 @@ mat-sidenav-container div.mat-sidenav-content {
|
|||
color: $darkblue;
|
||||
}
|
||||
|
||||
&.level-2 {
|
||||
padding-top: 4px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
span {
|
||||
padding-right: 32px;
|
||||
}
|
||||
|
@ -105,8 +103,6 @@ mat-sidenav-container div.mat-sidenav-content {
|
|||
button.vertical-menu-item {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue