O editor ganha painel de CSS lateral e barra de navegação de elementos

A caixa de estilos, a trilha de elementos pais e a lista de filhos flutuavam sobre o elemento selecionado e cobriam o que estava sendo editado. Agora cada uma tem um lugar fixo, e quem edita escolhe se quer ver.

A lateral de CSS

• Classes ativas, agrupadas por variante (base, sm:, md:, hover:), com remoção por um clique.
• Classes do projeto num bloco separado.
• Sugestões ao digitar, a partir de dois caracteres.
• Valores livres: dez campos (largura, altura, espaçamentos, fonte, cor, fundo, cantos) que aceitam 25px, 1.5rem ou #123456.
• CSS embutido: o atributo style inteiro num campo de texto.
• Estilos calculados: vinte propriedades com o valor que o navegador realmente aplicou.

A barra de navegação

Uma faixa fixa mostra os elementos pais e os filhos do que está selecionado. Um clique sobe ou desce na hierarquia, o que resolve o caso de selecionar um contêiner que está inteiro coberto pelo conteúdo.

Substituir

Ao lado de Copiar e Colar, um botão troca o elemento selecionado pelo bloco copiado.

Os dois painéis começam desligados e a escolha fica guardada no navegador. Valem na barra de edição da página publicada e no editor do painel.

Origem: Core · req-106 · BATCH-106