Uploaded image for project: 'Planet4'
  1. Planet4
  2. PLANET-6857

Create a custom spacing block

XMLWordPrintable

    • Icon: Task Task
    • Resolution: Unresolved
    • Icon: Would like Would like
    • None

      Leading with patterns I noticed a blocker for us when we want to use the `core/space` block with a custom height on small, medium and large screens. Unfortunately, WP doesn't offer the way to set different heights between screens.

      In addition, since the height is inline styled and if you want set to for example 80px of height, this will always be rendered qith that value despite of different screens. It is very difficult to lead with our fidelity mockups and release them exactly as they were designed. In most of the cases the space between blocks are different in different screens.

       What we currently have

      <!-- wp:spacer {"height":"80px"} -->
      <div style="height:80px" aria-hidden="true" class="wp-block-spacer"></div> <!-- /wp:spacer -->

      What I suggest

       

      <!-- wp:planet-4/spacer { "small": "16px", "medium": "24px", "height": "36px" } /--> 

      Define the height to different screens and the magic will occur through the CSS.

            Unassigned Unassigned
            dtovbein Dan Tovbein
            Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

              Created:
              Updated: