Ícones
Notas:
A maioria, se não todos os sites, têm ícones, portanto, há uma maneira simples de fazer referência a ícones para os autores.
Os ícones são mencionados como notação :<iconname>:. Como há diferentes maneiras de implementar ícones no navegador, como classes css simples, fontes de ícone ou SVG, oferecemos uma maneira não invasiva de oferecer suporte a todos eles.
O projeto padronizado inclui um mecanismo automático para inserir SVGs no ícone `<span>`s, pois essa é a maneira mais comum de lidar com os ícones.
Embora alguns ícones precisem estar no código (ícones referenciados em blocos, por exemplo), há momentos em que os autores precisam adicionar e referenciar novos ícones e atualizá-los continuamente. Esses ícones podem e devem estar em uma pasta /icons/ na fonte de conteúdo (por exemplo, Sharepoint ou Google Drive). Esses ícones também podem ser referenciados exatamente da mesma maneira usando a notação :<iconname>:. Isso permitirá que os profissionais de marketing adicionem e atualizem os ícones de que precisam para o conteúdo sem qualquer dependência em uma alteração de código.
Exemplo:
Estrutura de conteúdo:
O :<iconname>: pode ser inserido como parte de todas as construções de Conteúdo Padrão.
Código:
Os ícones são Conteúdo padrão e são estilizados no código CSS específico do projeto. Se houver algum JavaScript necessário para carregar os SVGs, ele poderá ser adaptado conforme necessário.
Este código está incluído na Boilerplate, não há necessidade de copiá-lo.
Consulte o SVG carregando o código