Menu FSE mobile animowany zjazd wyjazd

Domyślnie zamknięte manu ma display none, zmieniamy mu klasę na display flax tak jak otwarte i nadajemu mu ujemny „top” o jego wysokość , aby schować je nad krawędzią obrazu.
Ustalamy transition dla top.

    #modal-1 {

        transition:top 0.4s;
        top: -277px;/* wysokość menu */
        display: flex;
    }   

Wszystko co pozostaje to gdy jest otwarte i dostaje klase is-menu-open zmieniamy top na 0;

   #modal-1.is-menu-open{
        top: 0px;
   }