Grid structure per breakpoint

  • strarsis

    (@strarsis)


    6 years, 7 months ago

    The breakpoint handling is quite nice already (could it be adjusted/expanded by the theme using filters btw.?).
    However, for a three-column grid (on desktop) I want to have on tablet breakpoint one grid area full width with its own row and the other two grid areas half-width, sharing the same row, and finally on mobile all the areas under each other in their own rows.
    Currently, the three-columns grid on desktop directly goes to one-column grid on tablet breakpoint.

    Desktop:
    Three columns, with middle column much wider than the other two.

    Tablet:
    Middle column first with full width, own row
    The other two columns, each half-width, on the same row

    Mobile:
    All columns on their own rows.

    As a workaround I could try to use a block style for the grid block and the breakpoints myself. But having this option in editor IMHO is much better.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Simone Maranzana

    (@simo_m)

    6 years, 7 months ago

    Hi there,

    right now if not possible but this is something we already have planned to include in the future.

    Let me know if you have any other suggestions.

    Best,

    Simone

    Thread Starter strarsis

    (@strarsis)

    6 years, 7 months ago

    @simo_m: First of all, this grid block is really great. It is fully customizable, the order can be adjusted and it got an intuitive UI.

    So after some further thought, I think that this kind of custom behaviour belongs indeed into a block style for the grid block. So I will define a new block style for the grid block and add CSS to change the structure and order of the grid areas.

    Thread Starter strarsis

    (@strarsis)

    6 years, 7 months ago

    @simo_m: Grid sections should allow classes! Currently grid section blocks got no classes in editor.

    Also the grid sections and areas got no predictable class like wp-block-grid-section and wp-block-grid-area. And there is a wrapper DIV around the grid areas used that also got an unpredictable class.

    • This reply was modified 6 years, 7 months ago by strarsis.
Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Grid structure per breakpoint’ is closed to new replies.