[RISOLTO] Cassiopeia Template: modificare breakpoints del menu

[sgiobbio]

Vorrei che il menu del template Cassiopeia diventasse collassato sugli schermi iPad con vertical layout.

Il sito web è https://yorkies.convivium.club/
il template è Cassiopeia (Cassiopeia_child, per poter effettuare gli override css)

Allego 2 screenshot estratti da strumenti per sviluppatori - analizza:

 il primo mostra il menu non collassato
 il secondo mostra il risultato che vorrei ottenere

La regola css evidenziata dalla freccia in rosso sembrerebbe essere quella giusta:
 infatti se modifico  min-width: 768px  in  min-width: 992px  il layout cambia

Però se introduco questa nuova regola modificata in user.css di cassiopeia_child non ha nessun effetto:

Codice: [Seleziona]

@media (min-width: 992px){
.navbar-expand-md {
  flex-wrap: nowrap!important;
  justify-content: flex-start!important;
}
}

Qualcuno mi sa dire dove sbaglio?

[xplosion]

Ciao,
Prova questo codice:

Codice: [Seleziona]

@media (min-width: 768px) and (max-width: 991px) {
    .navbar-expand-md .navbar-collapse:not(.show) {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .navbar-expand-md .navbar-toggler {
        display: block !important;
    }
}

[sgiobbio]

Grazie xplosion.
Il codice suggerito funziona perfettamente!

[xplosion]

Questo bug l'avevo segnalato da maggio, ma non ancora risolto.
https://github.com/joomla/joomla-cms/issues/37926

P.S. Il codice non è mio, ma è stato fornito sul forum tedesco di Joomla.