Fiz algumas alterações na versão mobile mas elas não aparecem no resultado final.
Sim, é possível, desde que trabalhe sempre usando @media no CSS.
Me diz aí, quais alterações gostaria de fazer? Quem sabe consigo te ajudar.
1 curtida
Eu inclui algumas alterações no meu layout padrão, mas elas não são aplicadas. No visualizador do chrome, onde eu testo antes de salvar o código, tava tudo ok. Pensei que fossem os 15min pra atualizar, mas não mudou nada 
/MOBILE SITE/
/Mudar a cor da letra do submenu (dropdown) pra branco ao invés de cinza)/
@media only screen and (max-width: 767px)
.menu.superior .nivel-dois li a, .menu.lateral .nivel-dois li a {
font-size: 14px;
color: white;
}/Tirar o espaço da esquerda do menu no celular/
.nivel-um.active, .menu.superior .nivel-dois, .menu.lateral .nivel-um.active, .menu.lateral .nivel-dois {
display: block;
margin-left: -10px;
}/Adicionar espaço na lateral esquerda do submenu (dropdown)/
@media only screen and (max-width: 767px)
.menu.superior .nivel-dois li, .menu.lateral .nivel-dois li {
padding: 0px 10px;
border: none;
margin-left: 10px;
}/Aumentar o espaço pra logo/
@media only screen and (max-width: 767px)
.conteiner .logo {
margin: 0 0 20px;
height: 100px;
}/Aumentar a logo/
@media only screen and (max-width: 767px)
.logo a {
height: 112px;
}/Ajustes na altura e posição da lupa do buscador/
@media only screen and (max-width: 767px)
.busca .botao-busca {
height: auto;
top: 0px;
right: -4px;
line-height: 28px;
}/Ajuste na altura do background do buscador/
@media only screen and (max-width: 767px)
.busca {
margin: 0 60px -20px 0;
padding: 0;
border: none;
background: none;
}
Faltou os { } (inicial e final) do @media. Como tudo é referente ao max-width: 767px, só necessita colocar uma vez, abrir colchete e fechar no final. Segue arrumado:
/ MOBILE SITE/
/ Mudar a cor da letra do submenu (dropdown) pra branco ao invés de cinza)/
@media only screen and (max-width: 767px) {
.menu.superior .nivel-dois li a, .menu.lateral .nivel-dois li a {
font-size: 14px;
color: white;
}
/ Tirar o espaço da esquerda do menu no celular/
.nivel-um.active, .menu.superior .nivel-dois, .menu.lateral .
nivel-um.active, .menu.lateral .nivel-dois {
display: block;
margin-left: -10px;
}
/ Adicionar espaço na lateral esquerda do submenu (dropdown)/
.menu.superior .nivel-dois li, .menu.lateral .nivel-dois li {
padding: 0px 10px;
border: none;
margin-left: 10px;
}
/ Aumentar o espaço pra logo/
.conteiner .logo {
margin: 0 0 20px;
height: 100px;
}
/ Aumentar a logo/
.logo a {
height: 112px;
}
/ Ajustes na altura e posição da lupa do buscador/
.busca .botao-busca {
height: auto;
top: 0px;
right: -4px;
line-height: 28px;
}
/ Ajuste na altura do background do buscador/
.busca {
margin: 0 60px -20px 0;
padding: 0;
border: none;
background: none;
}
}
5 curtidas
kkkkkkk tão simples!
poxa, muito obrigada 
testei aqui e já tá funcionando!
1 curtida
Que bom! Deixa uns corações aí para nós rsrsrs
1 curtida
a minha duvida é, eu preciso deixar a opção de responsiva pra mobile ativa?
ou posso colocar o codigo em css e não ativar r?
Rafael você poderia me ajudar?
Gostaria de mudar a cor do menu e do carinho da minha loja na versão mobile.
Tem como?
Olá,
Já usei esse código CSS para dar uma customizada nesse botão:
/Alterar cor do ícone menu no celular/
.conteudo-topo .busca-mobile .atalho-menu {
background: #ffffff;
}
Abs e boas vendas!!
Olá, tentei esse código para mudar a cor do texto do menu no celular, além de tentar outros e nada de mudar a cor.
"}
@media only screen and (max-width: 767px) {
.menu.superior .nivel-dois li a, .menu.lateral .nivel-dois li a {
font-size: 14px;
color: #000000 !important;
}"
esse foi o que tentei aqui do tópico e nada, site: https://www.renataamantino.com.br , alguém sabe o que está faltando, por favor?
Boa tarde, @mldesign;
tente estes codigos em editar CSS:
@media only screen and (max-width: 767px)
.conteudo-topo .menu.superior.visible-phone .wrap {
background: #xxxxxx; /aqui no lugar dos x você coloca a cor desejada/
}
@media only screen and (max-width: 767px)
.conteudo-topo .menu.superior.visible-phone:before {
background: # xxxxxx; /aqui no lugar dos x você coloca a cor desejada/
;
}
Espero que consiga.
Abraços!!!
1 curtida