Como eu faço para editar a cor e o tamanho daquelas abas sombreadas do carousel?
Tentei sobrescrever as classes right e left mas não obtive o resultado desejado.
Desde já obrigado.
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Como eu faço para editar a cor e o tamanho daquelas abas sombreadas do carousel?
Tentei sobrescrever as classes right e left mas não obtive o resultado desejado.
Desde já obrigado.
Oi João, você pode sobrescrever o right e left dos controles com valores negativos, mas lembre-se que dar um overflow:hidden no container do carousel para que o gradiente não vaze para fora dele.
A cor, você precisa gerar um novo gradiente.
Mas antes de qualquer coisa, qual era o resultado que queria e qual foi o gerado?
O que eu tentei:
.left
{
overflow: hidden;
width: 30px;
}
.right
{
overflow: hidden;
width: 30px;
}
Aparentemente funcionou, mas quando eu clico nos botões para girar o carousel, ele parece que estoura, ficando maior o tamanho dele durante a animação. Ai quando acaba a animação ele volta ao normal. Não se deu para entender, é difícil explicar o que acontece. kk
Att. João
Oi João pedro, tudo bem, acho que te entendi errado. Porém, agora que entendi posso te dizer como resolver corretamente. Se o que você quer é diminuir o tamanho, você pode sobrescrever apenas a classe .carousel-control que contém o código comum aos dois controles, como seu tamanho por exemplo.
Você pode fazer:
.carousel-control{
width: 30px;
}
Assim não terá problemas, já testei aqui.
Funcionou muito obrigado Wenderson!