Bootstrap, flex i hamburger na telefonach

Hej, od razu zaznaczam, że NIE JESTEM frontendowcem.

Mam taki layout: https://codeply.com/v/nZU6s0EkvE
Przede wszystkim nie wiem, czy powinienem robić go w taki sposób, czy za pomocą grida. Moim założeniem jest, żeby boczne menu i treść, zajmowało 100% wysokości. I flex to była jedyna opcja, która mi zadziałała bez scrollbarów.

Gdy zmniejszam ekran, robią się dwa problemy:

1. Treść nie zajmuje już całej wysokości
2. Menu boczne wędruje na górę - to właściwie nie jest problem, poniekąd o to mi chodziło.

Teraz pytanie, jak sobie poradzić z problemem nr 1?
I drugie pytanie, co zrobić, żeby na telefonach menu boczne zmieniło się w hamburgera?

OK, udało mi się to ogarnąć:

<div class="container-fluid p-0 h-100 bg-red">
    <div class="d-flex flex-column h-100">
        <nav class="bg-gray p-1">
            <ul class="nav">
                <li>Menu 1</li>
                <li>Menu 2</li>
            </ul>
        </nav>

        <div class="main flex-grow-1 bg-purple">
            <div class="d-flex flex-md-row flex-column h-100">
                <nav class="d-flex navbar-expand-md navbar-light bg-gray">
                    <div class="">
                        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
                            <span class="navbar-toggler-icon"></span>
                        </button>
                    
                        <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
                            <a class="nav-link active" aria-current="page" href="#">Home</a>
                        </div>
                    </div>
                </nav>
                <div class="flex-grow-1 bg-blue p-2">
                    Content
                </div>
            </div>
        </div>
    </div>


</div>

Zwróćcie uwagę, że pionowy navbar nie ma klasy .navbar. Ta klasa wymusza wycentrowanie poziome, czego nie chcę. Dlatego zamiast tej klasy jest tylko .d-flex (część tego, co jest w .navbar). Wszystko śmiga.