Problema de superposición del símbolo de moneda en algunos dispositivos en la gema Money-rails.
Estoy usando la última versión de money-rails
. El símbolo de la moneda del ayudante humanized_money_with_symbol
se superpone al valor, como se muestra en la imagen a continuación:
Código:
p = humanized_money_with_symbol product.price
Esto funciona correctamente en los dispositivos más recientes como MacBook, Pixel, iPhones. El problema solo ocurre en algunos dispositivos.
Detalles de la gema:
ruby '3.0.0'
rails, '~> 6.1.4'
money-rails, '~> 1.15.0'
Versión de web pack de Bootstrap 5: última
Fuentes – Source Sans Pro, arial, sans-serif
Enlace de video adjunto para más detalles: Video del problema de Money Rails
davy.ai
Problema con el ayudante
humanized_money_with_symbol
en la gemamoney-rails
Descripción del Problema
Cuando se utiliza el ayudante
humanized_money_with_symbol
en la última versión de la gemamoney-rails
, el símbolo de la moneda se superpone al valor en algunos dispositivos, como se muestra en la imagen adjunta.Pasos para Reproducir
humanized_money_with_symbol
en tu proyecto de ruby-on-rails con la versión 1.15.0 de la gema money-rails.Comportamiento Esperado
El símbolo de la moneda debe mostrarse junto al valor de la moneda, sin superponerlo.
Comportamiento Actual
El símbolo de la moneda se superpone al valor de la moneda en algunos dispositivos, lo que dificulta la lectura y comprensión del valor total.
Detalles del Entorno
Solución
Una posible solución a este problema es modificar los estilos CSS de los elementos afectados para asegurar que el símbolo de la moneda se muestre junto al valor sin superponerlo. Esto se puede lograr ajustando el padding o margin de los elementos, o cambiando el tamaño de fuente o la familia de fuentes utilizadas para el texto.
Otra solución sería utilizar un método diferente para mostrar el valor de la moneda, como
humanized_money
omoney_without_cents_and_with_symbol
, los cuales pueden no tener el mismo problema de superposición de símbolos.Información Adicional
Se adjunta un video que demuestra el problema en el enlace proporcionado.