Grid should have overrides for phone, mobile and desktop

[barrysteyn]

The Block component of the Grid allows for setting column sizes that apply to desktop only. Mobile overrides whatever block size is specified to be the full size (or in this case, width).

What we need is to have block sizes that can be overridden by mobile and tablet. For example:

<Block classes={'e-row'}>
<Block classes={'brick brick-3 brick-6-tablet brick-12-mobile'}>brick-1</Block>
<Block classes={'brick brick-3 brick-6-tablet brick-12-mobile'}>brick-1</Block>
<Block classes={'brick brick-6 brick-12-tablet brick-12-mobile'}>brick-6</Block>
</Block>

In the above example:

• Desktop, we would have one row, three columns, with size 3, 3, and 6.
• Tablet, we would have two rows, first column would have size 6,6 and last row would have col 12
• Phone, there would be three rows, each row size 12

[birledan]

Hello Barry, you can try the new responsive grid http://getessence.io/core/grid-system. tkanks again for the hint!