Episódio

Fluent UI React Trainings: Práticas recomendadas e ícones de estilo

por Oleksandr Fediashov

Fluent UI React Insights e Treinamento

Este tutorial aborda dois tópicos distintos. O primeiro tópico aborda algumas das práticas recomendadas de uso do Griffel CSS-in-JS com ou sem componentes Fluent UI. Vamos aprender sobre padrões de desenvolvimento comuns ao usar Griffel e a melhor maneira de implementá-los. O segundo tópico é um aprofundamento mais avançado sobre as diferentes variantes de ícones que temos no Fluent UI e como usá-las de forma eficaz.

Capítulos

  • 00:00 – Introdução
  • 00:11 - Manual de estilos
  • 01:00 - Limitações de estilos de tempo de execução de Griffel
  • 01:12 - Exemplo de estilo incorreto
  • 02:03 - Enumerar todas as combinações de estilos
  • 03:17 - Estilos em linha
  • 03:52 - Variáveis CSS embutidas
  • 05:19 - Estruturação de definições de estilo
  • 07:09 - Design de tokens e temas
  • 09:22 - Não use !important
  • 11:38 - Combinadores aninhados
  • 16:37 - Recapitulação do ícone
  • 17:25 - Variantes de ícones regulares e preenchidos
  • 18:05 - Ícones de agregação
  • 19:31 - Alternando variantes de ícones ao passar o mouse
  • 20:17 - Manipulação de ícones de componentes de interface do usuário fluente
  • 21:15 - Outro

Desenvolvedor