Añadir botón home en header comprimido

Publicado más de 3 años hace por Flexygo Team

Publicar un tema

Sin responder

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?

0 Votos

1 Comentarios

Flexygo Team publicado más de 3 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