- Normalemente, ao criar ícones de mídias sociais definimos uma cor, um ícone e um identificador.
- Pode-se utilizar a url como seletor nas classes de ícones de mídias sociais. Por exemplo,
a[href="www.twitter.com"].
- Pode-se colocar o ícone no
:before para evitar tags desnecessárias.
- Recomenda-se utilizar o
*= para uma maior flexibilidade no seletor. Por exemplo, a[href*="twitter"].
- Pode-se utilizar listas no Sass com
@each.
- Ao utilizar listas no Sass não é muito expressivo e dificulta saber do que se trata os valores.
- Os mapas são vetores associativos ou "listas bombadas".
- O Sass suporta mapas desde a versão 3.3.
$nome-mapa: (
key1: value,
key2: value,
key3: (
key3-1: value,
key3-2: value,
)
);
- Recomenda-se utilizar mapas com o menor nível de aninhamento.
- No Sass pode-se utilizar vírgulas no final sem problemas de sintaxe.
- Pode-se utilizar também qualquer tipo de valor aceito pelo Sass. São eles: strings, números, cores, booleanos, listas, mapas, null entre outros.
- Aceita-se quaisquer tipos de dados como chave ou valor.
- Porém, recomenda-se utilizar chaves como strings.
- Existem diversas funções nativas para utilizar mapas.
- A utilização de variáveis em alguns casos é um tanto quanto problemático.
- O Foundation, o Bootstrap 4 e o Ionic utilizam mapas do Sass.
- Recomenda-se utilizar mapas para gerenciar o
z-index dos elementos de uma página.
- Recomenda-se utilizar mapas para tamanhos de breakpoints em sites responsivos.
$screen-size: (
small: 767px,
medium: 992px,
large: 1200px
);
- Recomenda-se utilizar mapas para criar alguns componentes.
