/ / Usando el ecualizador de Foundation con HAML - zurb-foundation, haml, foundation-equalizer

Usando el ecualizador de Foundation con HAML - zurb-foundation, haml, foundation-equalizer

Intento utilizar el ecualizador de cimientos de Zurb para hacer dos columnas de la misma altura.

La sintaxis según el sitio web de la Fundación:

<div class="row" data-equalizer>
<div class="large-6 columns panel" data-equalizer-watch>
...
</div>
<div class="large-6 columns panel" data-equalizer-watch>
...
</div>
</div>

¿Cómo traduzco esto a haml? es posible?

Aquí hay un enlace al sitio web de la Fundación para referencia: http://foundation.zurb.com/sites/docs/v/5.5.3/components/equalizer.html

Respuestas

2 para la respuesta № 1

(Estoy asumiendo con mi respuesta que ya sabes cómo usar HAML.)

Haría que las clases fueran normales, pero los atributos de los datos tienen que ser específicamente hash en HAML. Afortunadamente, la documentación de HAML que acabo de encontrar describe cómo hacer esto: http://haml.info/docs/yardoc/file.REFERENCE.html#html5_custom_data_attributes

HTML5 Custom Data Attributes

HTML5 allows for adding custom non-visible data attributes to elements using attribute names beginning with data-. Custom data attributes can be used in Haml by using the key :data with a Hash value in an attribute hash. Each of the key/value pairs in the Hash will be transformed into a custom data attribute. For example:

%a{:href=>"/posts", :data => {:author_id => 123}} Posts By Author

will render as:

<a data-author-id="123" href="/posts">Posts By Author</a>

Lee esa página para obtener más información.