Less.js: Colores hexadecimales con opacidad enredados

Creado en 17 jul. 2018  ·  14Comentarios  ·  Fuente: less/less.js

Actualizado a [email protected] después de lo cual los colores opacidad con renderizado como

color de fondo: # 55555599; -> # 55555599 99; (no es válido)
color de fondo: # 5559; -> nº 5559 9; (no es válido)

bug medium priority

Comentario más útil

Actualicé la función color() para reconocer #RRGGBBAA y también hice algunas actualizaciones para mantener los colores en el mismo espacio de color. En el pasado, todo se convertía a hexadecimal simple (si alfa = 1) o rgba() para la compatibilidad del navegador. Ahora, podemos mantener Less más consistente conservando los valores de color tal como se usan. Los colores hexadecimales y las palabras clave ya se emitieron tal como están, pero con mi PR, Less generará hsl() y hsla() tal cual (excepto cuando se fijan valores), e incluso preservará el espacio de color después del color operaciones como darken() o spin() .

Todos 14 comentarios

¿Less incluso admitía la notación hexadecimal rgba antes?

@rjgotten No directamente, no. Pero debería simplemente omitir (preservar) los valores no reconocidos. Probablemente esa sea la regresión.

@rjgotten @tapsaman No creo que esto haya sido una regresión, por mucho que aún no haya sido compatible. Sin embargo, fueron solo algunos cambios de expresiones regulares y cambios en el nodo de color para admitir este formulario. Vea las pruebas en el PR para verificación.

Una cosa que hace es eliminar los colores "no válidos" para compatibilidad futura. No es hasta que intente utilizar un color "no válido" en una operación de color que debería arrojar un error en el momento de la evaluación. Pero Menos en 3.0+ es más indulgente con los valores en las propiedades, por lo que parecía razonable eliminarlo.

Una cosa: ¿debería Less convertir #RRGGBBAA para navegadores incompatibles? A partir de hoy, IE / Edge no tiene soporte, y algunos otros navegadores tampoco. Microsoft no ha dado ninguna indicación de que lo implementarán pronto. Sin embargo, la razón por la que lo implementé es porque definitivamente hubo un problema con el análisis en la función de análisis de color. Tomaba toda la cadena y guardaba el color, pero no avanzaba el analizador si el color era de 4 u 8 caracteres, por lo que estaba repitiendo los últimos dígitos.

EDITAR: Lo que hice fue permitir la conversión del autor al formato rgba() través de rgba(#55555599) .

Aquí hay una lista de pensamientos que tengo en relación con esto.

  • No estoy seguro de que sea el trabajo de Less ser consciente del soporte del navegador.
  • Combinar una función Less con una función CSS "parece" peligroso, pero no puedo decir por qué.
  • _DO_ ya tenemos la función argb() destinada a generar #AARRGGBB .
  • También tenemos una función color() . ¿Admite #AARRGGBB , #ARGB ?
  • color: #AA334455; y color: #A345; son CSS válidos (o aceptables), incluso si no hay muchos navegadores que _ entiendan_ esa forma.
  • Me pregunto si el casting de rbga() es una pendiente resbaladiza. rgb() , hsl() y hsla() son funciones de CSS.
  • Por otro lado, dado que Less es un superconjunto de CSS, rgba() tiene mucho sentido.

tl; dr: Creo que mi primera impresión general es que debemos asegurarnos de que la función color() admita cadenas ARGB de 8 y 4 dígitos, ya que ese parece ser su propósito de todos modos.

Combinar una función Less con una función CSS "parece" peligroso, pero no puedo decir por qué.

Ese barco ha zarpado. rgba() ha existido como una función Less durante mucho tiempo. Pero la razón principal es que puede pasar colores a algo como lighten() . Es decir, rgba() necesita devolver un color internamente. Por lo tanto, funciones como rgba() _deben ser funciones Less si realmente desea utilizar las funciones de color de Less. (por ejemplo, lighten (rgba (50,50,50,0.5), 50%)) De lo contrario, sería una llamada de función desconocida. Tenemos que saber cuál es el color en realidad para poder manipular dicho color.

Me pregunto si el casting de rbga () es una pendiente resbaladiza. rgb (), hsl () y hsla () también son funciones de CSS.

Yeah Yo supongo. Pero el casting es la forma incorrecta de pensarlo. También habilita esta forma: rgba(#777777, 0.5) , que está permitida o estará permitida en los navegadores. No lo extiende a hsla() , eso es cierto, pero la implementación interna es mucho más difícil y tampoco necesaria si tiene un método que funciona.

También tenemos una función color (). ¿Es compatible con #AARRGGBB, #ARGB?

No, gracias por señalar esto. Puedo agregar eso. Aunque estoy confundido, ¿por qué existe esa función?

También habilita esta forma: rgba (# 777777, 0.5), que está permitida o estará permitida en los navegadores.

Para reformular, este formulario es un color válido en CSS: rgba(<Color> [, opacity]) . Entonces no hay razón para no permitir esto.

_DO_ ya tenemos la función argb() destinada a generar #AARRGGBB .

La orden ARGB se utiliza específicamente para los filtros de DirectShow heredados en Internet Explorer.
La sintaxis hexadecimal de 8 o 4 dígitos en CSS es un orden RGBA faik.

La compatibilidad con ambos también hace que sea directamente imposible saber si un #000000FF literal representa un azul completamente transparente (ARGB) o un negro completamente opaco (RGBA).

Mi consejo: elimine el soporte de color ARGB. Solo lo necesitaría para los navegadores IE de la edad de piedra que están fuera de servicio durante mucho tiempo.

Mi consejo: elimine el soporte de color ARGB. Solo lo necesitaría para los navegadores IE de la edad de piedra que están fuera de servicio durante mucho tiempo.

No probamos el soporte en nada menos que IE11, por lo que esta es una buena idea.

@rjgotten ¿Hay otras funciones candidatas (o características) para su desaprobación? Todavía estoy confundido por qué alguien necesitaría escribir un color como una _cadena_ en Less y luego convertirlo en un color usando la función color() . Parece que se agregó hace 4 años.

Todavía estoy confundido por qué alguien necesitaría escribir un color como una cadena en Less y luego convertirlo en un color usando la función color ().

Lo único que puedo imaginar son escenarios de extracción automatizados.
Por ejemplo, un complemento complejo que inspecciona imágenes de fondo SVG y extrae definiciones de color de ellas para que coincida con el uso del color en otras reglas, o algo así.

Un caso marginal bastante profundo, creo.

@rjgotten Desafortunadamente, no pude encontrar ningún historial en los problemas que explican de dónde provienen.

Actualicé la función color() para reconocer #RRGGBBAA y también hice algunas actualizaciones para mantener los colores en el mismo espacio de color. En el pasado, todo se convertía a hexadecimal simple (si alfa = 1) o rgba() para la compatibilidad del navegador. Ahora, podemos mantener Less más consistente conservando los valores de color tal como se usan. Los colores hexadecimales y las palabras clave ya se emitieron tal como están, pero con mi PR, Less generará hsl() y hsla() tal cual (excepto cuando se fijan valores), e incluso preservará el espacio de color después del color operaciones como darken() o spin() .

Poniéndome al día, estoy a bordo. Creo que la función argb() responde a cualquier necesidad del formato antiguo. Este es un buen movimiento.

¿Fue útil esta página
0 / 5 - 0 calificaciones