Esses dias um amigo me mostrou um tweet do @sulco sobre como debuggar html, de uma forma bem simples!
Sabe aquele Select componente ou aquele dropdown que usamos e as vezes queremos alterar seu estilo, com ele aberto?
Sempre que tentamos selecioná-lo, acaba fechando, sumindo, desfazendo! Dá uma raiva!
Então hoje apresento algo que até poucos dias atrás não conhecia: “emulate a focused page”
Através do console de desenvolvedor, conseguimos ativar essa função!
Dá uma olhada como é fácil fazer:
Fica bem mais fácil assim né?
Então, resumindo:
Como habilitar focused page no chrome
- Abra o “inspecionar elemento” (F12)
- Digite Ctrl + P ou [⌘]+[P] no Mac
- Escreva “> Emulate a focused page”
- Ative-a e estará pronto para usar!
Agora ficou muito mais fácil estilizar e mexer em componentes assim!
