Añadir botón home en header comprimido

Publicado al menos 4 años hace por Flexygo Team

Publicar un tema
Sin responder
Flexygo Team
Flexygo Team

Buenos días,

¿sería posible incluir un enlace a la página de inicio en el header de la aplicación cuando está comprimida en pantallas móviles?


image


0 Votos


1 Comentarios

Flexygo Team

Flexygo Team publicado al menos 4 años hace

Hola Fran Quero,
Podrías sobrescribir la función estándar del control de navegación de flexygo para añadir más botones añadiéndote un JS al proyecto que se ejecute después del estándar con un código similar a este:


flexygo.ui.wc.FlxNavElement.prototype.setAdditionalButtons = function(mode){
    let<span class="fr-marker" data-id="0" data-type="false" style="display: none; line-height: 0;"></span><span class="fr-marker" data-id="0" data-type="true" style="display: none; line-height: 0;"></span> header = $('body > header');
    if (mode.toLowerCase() == 'nav' && header.find('#buttonMenu').length == 0 && $('flx-nav#mainMenu').length > 0) {
        header.append('<span id="buttonMenu" onclick="flexygo.nav.toggleMobileMenu()" class="flx-icon icon-bullet-list-3"></span>');
    }

    if (mode.toLowerCase() == 'nav' && header.find('#buttonNav').length == 0 && $('flx-nav#mainNav').length > 0) {
        header.append('<div id="miniButton"><i id="buttonMininNav" class="fa fa-indent flipped" onclick="flexygo.nav.toggleNavBar();" ></i></div>');
        header.append('<span id="buttonNav" onclick="flexygo.nav.toggleMobileNav()" class="flx-icon icon-menu"></span>');
//AÑADIR MÁS BOTONES AQUÍ
    }
}


Para que se muestre o se oculte según el tamaño necesitar añadir un ficheros less con unos estilos de este tipo:



#miBotton {
    display: none;
}

@media (max-width: dbSize(medium)) {
 #miBotton {
        order: 4;
        flex: 0 1 auto;
        margin: 8px;
        font-size: 2.5em;
        float: right;
        cursor: pointer;
        display:flex;
        justify-content:center;
        align-items:center;
    }
}


Un saludo,
Rubén

0 Votos

Iniciar sesión o Registrarse para publicar un comentario