Off-canvas nav bootstrap updates

[danahertzberg]

Motivation

Updates to off-canvas nav require bootstrap updates
Relates to az-digital/az_quickstart#1826

https://github.com/az-digital/arizona-bootstrap/blob/main/scss/_custom-variables.scss#L293-L301
https://github.com/az-digital/arizona-bootstrap/blob/main/scss/_navbar-offcanvas.scss

[danahertzberg]

Mockup idea

HTML

<li class="nav-item nav-item-parent dropdown keep-open show">
      <button class="nav-link dropdown-toggle" id="navbarDropdown4" data-toggle="dropdown" data-display="static" aria-expanded="true">
        Admissions
      </button>
      <div class="dropdown-menu" role="menu" aria-labelledby="navbarDropdown4" style="display: block;">
        <a class="dropdown-item" href="#">Admissions Overview</a>
    <div class="nav-item-parent-wrapper">
        <a class="dropdown-item" href="#">Admissions Overview Parent</a>
        <a class="dropdown-item nav-item-parent material-icons-sharp" href="#">chevron_right</a>
    </div>
    <a class="dropdown-item" href="#">Another action</a>
        
        <a class="dropdown-item" href="#">Something else here</a>
      </div>
    </li>

CSS

.navbar-offcanvas .nav-item .nav-link {
    ...
    border-bottom: solid 1px #6c757d; (gray-600)
}
.navbar-offcanvas .nav-item-parent .nav-link {
    text-transform: none;
}
.dropdown-item {
    ...
    border-bottom: solid 1px #6c757d;
}
.nav-item-parent-wrapper {
    display: flex;
}
a.dropdown-item.nav-item-parent {
    border-left: solid 1px #6c757d;
    font-size: x-large;
    display: flex;
    align-items: center;
    line-height: normal;
    padding-left: 14px !important;
    padding-right: 14px !important;
    max-width: fit-content;
}

Screenshot