Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

mixin para acessibilidade

Pensando em acessibilidade pensei que seria bom ter uma função que fizesse uma distinção entre que fundo você vai colocar e a cor da letra então para deixar tudo separadinho e bem estabelecido, eu criei o mixin

@mixin fundo-e-letra($cor-letra:rgb(17, 25, 68),$cor-fundo:rgb(212, 212, 212)){
  background: $cor-fundo;
  color: $cor-letra;
}

é simples mas pode ser legal ter uma função assim também, sei lá

E podemos usar o constrast-checker (nao sei se o css tem algo do tipo) para ver mais facilmente se aquela cor de letra com esse fundo (imagem ou cor lisa) passam nos testes de acessibilidade, senão, bem pelo menos é mais fácil modificar com o Ctrl+F e buscar o mixin no sass para depois testar, foi o que pensei em fazer

Edit: isso pode acabar sendo um tanto ruim, pois poderia ficar limitado a alterar outros atributos dentro de uma section , de modo as vezes eu quero setar uma cor diferente para um titulo e outra para o conteudo e isso pode atrapalhar mais a legibilidade do código do que ajudar, então não ficaria bom nao hahaha mas aceito alguma sugestão para solucionar isso

2 respostas
solução!

Oi, Hiago, tudo bem?

A sua contribuição é bem-vinda e parabéns por priorizar o contraste de cores. E não acho ela ruim de forma alguma. A questão é se o layout estiver dentro do padrão de cores que você criou no mixin não haverá problema em mudar e pode-se criar outro mixin com outras cores mas focando na acessibilidade.

Entendi, é pensando assim pode ser legal sim, trabalhar com mixins diferentes para situações que diferem um pouco

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software