CSS Border Radius não funciona no Safari depois de mudar para gatsby-plugin-imagem
no meu laptop, eu posso ver a fronteira raio da imagem, mas ele parece não funcionar no iphone ou iPad. (i.e. a imagem é quadrada apenas no iPhone / iPad, eu não vejo border-radius:25px a ser aplicada para a imagem)
EDITAR 11-24: lamentamos que este é o trecho de código eu estou usando o estilo-componente
export const MyImageContainer = styled(GatsbyImage)`
cursor: pointer;
border-radius: 25px;
`
Sim, que é um velho 'bug'. Este css hack deve corrigi-lo.
-webkit-mask-image: -webkit-radial-gradient(white, black);
Eu tenho problema semelhante com border radius após a migração para o gatsby-plugin-imagem.
Não sei se isso endereços de sua pergunta, você pode querer adicionar mais detalhes e alguns trechos de código vai ser útil.
Eu estou usando o estilo-componente para o meu projeto. Minha solução foi alvo img
Por exemplo
export const MyImageVariable = styled(GatsbyImage)`
border-radius: 50%;
img {
border-radius:50%;
}
`