Você não está errado, mas a culpa reside na maneira diferente como esses componentes são configurados, um usando o d-icon e o outro não se prestando a isso no momento. Adoraria ver isso mudar, então sinta-se à vontade para ajudar se souber como.
Com o novo estilo, ele precisará de mais espaço, mas concordo que o preenchimento atual é excessivo.
Este tem sido um debate contínuo entre os designers desde a criação do alternador. Não há resposta certa ou errada.
Esta foi uma das ideias da sessão de design que eu pessoalmente gostei muito. Ela resolve (algumas) observações de Sam e cvx. Vou tentar isso na próxima iteração.
Eu acho que o chevron ficaria melhor à esquerda. Acho que a maioria das pessoas não o verá à direita. Ele se parece com texto normal (meio que como um bloco de código) a menos que o mouse passe sobre ele. Quase não o notei.
(14. ) A adição recente de um manipulador de clique significa que clicar em um link, usar o botão copiar código, tentar expandir uma imagem ou até mesmo tentar selecionar qualquer texto resultará no colapso do bloco de detalhes…
Concordo plenamente com isso. Eu (quase) deixei de ler vários blocos de detalhes nos últimos dias. Acho que é porque eles se parecem com blocos de código à primeira vista.
Estranho, clicar em um link funciona para mim. Ele fecha os detalhes, mas o link também abre. Não tentei os outros cenários. E concordo que pode ser feito com um trabalho de JS mais refinado
Sobre a posição do chevron, @jordan.vidrine o que você acha?
Devo fazer outra iteração? Talvez como eu tinha em mente originalmente, com o triângulo regular em vez de chevron e apenas um fundo quando aberto?
Sim, eu realmente gostei da ideia de poder pairar em qualquer lugar \u003e destacar \u003e clicar para fechar, em vez de só poder clicar na parte do resumo, mas eu não tinha percebido a propagação de outros cliques
Algumas observações detalhistas sobre a última iteração…
A seta deve ser alinhada pela linha de base em vez de centralizada? Isso me parece melhor do que centralizar em exemplos de várias linhas… mas isso pode ser subjetivo:
se preenchermos todo o contêiner, talvez devêssemos tentar remover qualquer preenchimento do último elemento… isso pode ser muito complicado porque temos muitos tipos de conteúdo… mas talvez algo como:
detalhes > :last-child {
padding-bottom: 0;
}
Concordo que devemos usar um tom mais escuro quando isso estiver dentro de uma citação, para que o fundo não se perca
então uma citação pode substituí-lo… talvez pudéssemos até ter uma variável genérica “precisa ser mais escuro” em uma citação? não me lembro se temos outras situações como essa…
Eu gosto de usar algo como rgba(var(--primary-rgb),0.25) para este propósito, pois apenas torna o fundo atual do elemento em que está incluído um pouco mais escuro.
A área clicável real do elemento de resumo é menor que o elemento que muda o cursor e destaca ao passar o mouse
Por causa dessa cor de fundo ao passar o mouse e da mudança seguinte ao expandir um elemento – há um breve flash de cor de fundo ao expandir um elemento
editar:
Uma discrepância entre uma postagem renderizada e o composer: