feat(align): refactoriza directiva

[JSantarelli]

Modifica directiva para permitir:

• Alinear elementos en el eje 'Y'
• Centrar por defecto los elementos en el eje 'X'
• Setear la altura del contenedor que aloja el elemento a alinear (atributo vheight)

Plus:

• Se crea archivo directives.scss para agrupar clases de las directivas.
• Se realiza demo de la directiva en la sección directivas

[andrrrl]

@JSantarelli! está buenísima la funcionalidad! Lo que sigue lo dejo como comentario porque no estoy seguro que sea para pedir un cambio.
No sé si te estaré matando con esto jaja, pero estaba viendo que como tenemos ya la directiva justify esta directiva debería llamarse align para que siga la misma línea. Si es mucho bardo no pasa nada...
Lo que si, hay que ver que no colisione con esa directiva (justify), ya que la misma tiene esto por defecto:
@HostBinding('class.align-items-center') flex2 = true; o sea cuando aplicamos justify, esta siempre centra verticalmente.

[JSantarelli]

Excelente @andrrrl veo de hacer el cambio de nombre, en su momento me generó dudas el hecho de que 'align' ya es un atributo de html y me lo pintaba de rojo al querer utilizarlo (lo mismo pasa en las plex-cards).
Respecto a la colisión con 'justify', es cierto... No sé qué sería lo ideal... supongo que actúen complementándose ambas directivas (como lo hacen las clases css al alinear elementos). El tema es que implicaría refactorizar la directiva justify y asegurarse que no pinche en los lugares en los que se utilizó (y agregar align dado el caso).

[andrrrl]

No estoy seguro (1) si es un error, y (2) si tiene que ver con esta directiva en sí, pero noté ese espacio en blanco en el contenedor. Lo dejo sólo como comentario.

[JSantarelli]

No estoy seguro (1) si es un error, y (2) si tiene que ver con esta directiva en sí, pero noté ese espacio en blanco en el contenedor. Lo dejo sólo como comentario.

Gracias @andrrrl, no sería un error, el contenedor de la izquierda acapara el 100% del alto disponible y los otros dos contenedores están haciendo un cálculo con el viewHeight y no coinciden. Igualmente lo atenué un poquito para evitar dolor de ojos.

[andrrrl]

No estoy seguro (1) si es un error, y (2) si tiene que ver con esta directiva en sí, pero noté ese espacio en blanco en el contenedor. Lo dejo sólo como comentario.

Gracias @andrrrl, no sería un error, el contenedor de la izquierda acapara el 100% del alto disponible y los otros dos contenedores están haciendo un cálculo con el viewHeight y no coinciden. Igualmente lo atenué un poquito para evitar dolor de ojos.

jaja perfecto Julito! queda claro

[andrrrl]

csselente

[liquid36]

🎉 This PR is included in version 7.16.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀