Ajuste do Menu Conta: Mobile

Para quem:

  1. Quer deixar o menu aparecendo no mobile,
  2. Inserir a opção Sair no Menu
  3. Diminuir o tamanho do espaço e da fonte das Abas
  4. Apresentar a lista de desejos nas Abas

Código

<style>
@media only screen and (max-width: 767px){    
    body.pagina-conta .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3,
    body.pagina-conta-endereco .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3, 
    body.pagina-pedido-listar .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3,
    body.pagina-pedido .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3, 
    body.pagina-favorito-listar .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3 
    {
        display:block;
    }

    body.pagina-conta .abas-conta li a, 
    body.pagina-conta-endereco .abas-conta li a, 
    body.pagina-pedido-listar .abas-conta li a,
    body.pagina-pedido .abas-conta li a,
    body.pagina-favorito-listar .abas-conta li a
    {
        font-size: 14px!important;
        padding: 5px 5px;
    }
    body.pagina-conta .abas-conta li a i, 
    body.pagina-conta-endereco .abas-conta li a i, 
    body.pagina-pedido-listar .abas-conta li a i,
    body.pagina-pedido .abas-conta li a i,
    body.pagina-favorito-listar .abas-conta li a i
    {
        width: 20px!important;
        font-size: 14px!important;
    }
    
    .abas-conta li {
        margin-right: 5px;
    }

    .abas-conta li.hidden-phone {
        display:block!important;
    }
    
    .abas-conta li a {
        font-size: 14px!important;
        padding: 5px 5px;
    }
}
</style>

<script>
$(function(){
    $(':has(.pagina-conta, .pagina-conta-endereco, .pagina-pedido-listar, .pagina-pedido, .pagina-favorito-listar ) .conteiner > .secao-principal.row-fluid.sem-coluna > .coluna.span3 ul.menu-simples').append('<li><a href="/conta/logout" title="Produtos marcados na lista de desejos"><i class="icon-signout cor-secundaria"></i> Sair</a></li>');
})
</script>

Instalação

caso apareça no menu o sair 2x, basta remover ou comentar o javascript;

image

pode ser que seja necessário outros ajustes, no meu tive que mudar o tamanho da fonte (todos os font-size no css) para 12px.

8 curtidas

Como sempre salvando com ótimas modificações Leonardo :pray:

Muito top o código! Valew!
Uma dúvida, no meu está sem os ícones. oq pode ser?

 .caixa-sombreada ul.menu-simples i {
    display: inline-block!important;
}

2 curtidas

Ficou perfeito!! :scream:

A única coisa que notei é que quando clico no coração na listagem do produto ele não seleciona/adiciona aos favoritos. Parece que ele está numa camada abaixo, n sei.

Consegue me ajudar nisso?

Algum bug no tema, pelo que parece.

Vc consegue resolver esse bug no tema?

olha dei uma olhada por alto, e acho que consigo, porem podemos acertar um valor para esse trabalho, caso tenha interesse, te mando meu contato e valor via whatsapp.

No meu não funcionou! :frowning:

vejo que funcionou perfeitamente.

2 curtidas

A minha loja está assim? Aqui não aparece dessa forma :sob:

sim isso é sua loja
quando o cliente está logado e acessando dados dos pedidos