Detalles sobre los cambios de estilo del tema - Comentarios

[quote=“Jarek Radosz, post:28, topic:285364, username:cvx”]
(¿y no es el mismo icono de chevrón? :ojos:)
[/quote]No te equivocas, pero la culpa reside en la diferente forma en que se configuran estos componentes, uno usa d-icon y el otro no se presta a eso en este momento. Me encantaría ver que eso cambie, así que siéntete libre de ayudar si sabes cómo.

[quote=“Jarek Radosz, post:16, topic:285364, username:cvx”]
El elemento botón/resumen ocupa mucho más espacio (anteriormente era un elemento semi-en línea)
[/quote]Con el nuevo estilo necesitará más espacio, pero estoy de acuerdo en que el relleno actual es demasiado.

[quote=“Jarek Radosz, post:28, topic:285364, username:cvx”]
También añadiendo a 2.
Con respecto a la dirección hacia la que apunta el icono: dado que actúa como un interruptor, ¿no tendría sentido invertirlo para que denote el estado actual en lugar de la acción/estado futuro (esto también se aplica al botón “Respuestas”)?
[/quote]Este ha sido un debate continuo entre los diseñadores desde el inicio del interruptor. No hay una respuesta correcta o incorrecta.

Esta fue una de las ideas de la sesión de diseño que personalmente me gustó mucho. Resuelve (algunos de) los comentarios de Sam y cvx. Le daré una oportunidad en la próxima iteración.

Creo que el chevrón quedaría mejor a la izquierda. Creo que la mayoría de la gente no lo verá a la derecha. Parece texto normal (algo así como un bloque de código) a menos que el ratón pase sobre él. Casi me lo pierdo.

(14. ) La reciente adición de un controlador de clics significa que al hacer clic en un enlace, usar el botón de copiar código, intentar expandir una imagen o incluso intentar seleccionar cualquier texto, el bloque de detalles se colapsará…

Estoy totalmente de acuerdo con esto. He (casi) pasado por alto leer varios bloques de detalles en los últimos días. Creo que es porque se parecen a los bloques de código a primera vista.

esto es código

Extraño, hacer clic en un enlace sí funciona para mí. Cierra los detalles pero el enlace también se abre. No he probado los otros escenarios. Y estoy de acuerdo en que podría beneficiarse de un trabajo de JS más refinado

Sobre la posición del chevron, @jordan.vidrine ¿qué opinas?
¿Hago otra iteración? Quizás como lo tenía en mente originalmente, con el triángulo normal en lugar del chevron y solo un fondo al abrir?

Creo que el chevrón todavía debería usarse, pero posicionarlo a la izquierda parece una buena idea.

¿Te refieres a otra cosa? No hemos añadido ningún manejador de clics aquí.

Había un manejador. Charlie lo eliminó hoy en 2c941c4.

¡Ja! Vaya, me preguntaba qué estaba haciendo esto. Justo en el blanco y no lo vi.

Sí, me gustó mucho la idea de poder pasar el ratón por encima de cualquier lugar > resaltar > hacer clic para cerrar, en lugar de solo poder hacer clic en la parte del resumen, pero había pasado por alto la propagación de otros clics

También es muy fácil pasar por alto detalles en las citas, porque el resaltado de fondo es casi invisible y el cheurón está lejos del texto

Algunas reflexiones quisquillosas sobre la última iteración…

¿Debería la flecha estar alineada por la línea base en lugar de centrarse? Me parece mejor que centrar en ejemplos de varias líneas… pero esto puede ser subjetivo:

centrado

Screenshot 2023-11-28 at 9.23.14 AM1186×274 17.1 KB

línea base

Screenshot 2023-11-28 at 9.23.22 AM1214×278 17.3 KB

¿debería el relleno coincidir con las citas? la parte superior se siente un poco apretada en este momento

Screenshot 2023-11-28 at 9.26.05 AM1206×282 17.3 KB

si rellenamos todo el contenedor, quizás deberíamos intentar eliminar cualquier relleno del último elemento… esto podría ser demasiado complicado porque tenemos muchos tipos de contenido… pero quizás algo como:

details > :last-child {
  padding-bottom: 0;
}

Estoy de acuerdo en que deberíamos usar un tono más oscuro cuando esto esté dentro de una cita, para que el fondo no se pierda

Resumen

Este texto estará oculto

Screenshot 2023-11-28 at 9.31.32 AM948×190 1.76 KB

Creo que probablemente podríamos tener algún tipo de variable que pueda ayudar con esto… si details tuviera el fondo establecido por algo como

:root {
  --d-details-bg: var(--primary-100);
}

details {
  background: var(--d-details-bg);
}

entonces una cita puede anularlo… ¿quizás incluso podríamos tener una variable genérica de “necesita ser más oscuro” en una cita? No recuerdo si tenemos otras situaciones como esta…

blockquote {
  --darker-quote-bg: var(--primary-200);
  --d-details-bg: var(--darker-quote-bg);
}

100% esto - si no es la causa actual, eso es solo un error

Me gusta usar algo como rgba(var(--primary-rgb),0.25) para este propósito, ya que simplemente hace que el fondo actual del elemento en el que está incluido sea un poco más oscuro.

En general, siento que la última iteración está muy, muy cerca de estar lista para enviarse

Una pequeña objeción que no estoy seguro de si se puede resolver:

image975×325 54.6 KB

No es un bloqueo en absoluto, pero el panel gris te hace pensar que estás viendo una sola entidad.

Sí, estoy seguro de que podemos resolverlo con quizás un borde o algo para que quede más claro. Le echaré un vistazo hoy.

En general, me gusta. Dicho esto, esta sugerencia me llamó la atención.

Intentar elegir el fondo de un elemento de texto a veces se siente como la búsqueda del tono perfecto de gris claro.

var(--primary-not-so-light-you-cant-see-it-but-not-so-dark-it-looks-clunky)

Pero parece que estás cerca y, en general, me gusta.

Estoy añadiendo el mismo oscurecimiento del fondo para el bloque de código que para la cita en bloque

image1470×430 17.3 KB

Eso debería solucionar el problema @sam

Dos cosas más (15 y 16, si quieres )

• El área real en la que se puede hacer clic del elemento de resumen es más pequeña que el elemento que cambia el cursor y se resalta al pasar el ratón por encima.
• Debido a ese color de fondo al pasar el ratón por encima y al cambio posterior al expandir un elemento, hay un breve destello de color de fondo al expandir un elemento.

editar:

17. Una discrepancia entre una publicación representada y el editor:
    
    

    image704×174 4.63 KB
    
    vs
    
    

    Screenshot 2023-12-05 at 13.04.07866×256 4.95 KB