vigetlabs / wordpress-site-starter

2 stars 0 forks source link

[#5] Logo Grid UI #28

Closed empee3 closed 2 months ago

empee3 commented 2 months ago

Summary

This PR pulls in Blueprint styles for the Logo Grid Component.

Issues

Testing Instructions

  1. Create a new page or edit an existing page
  2. Insert the Logo Grid block
  3. Upload photos to the image blocks inside of the component
  4. Verify that:
    • Images resize correctly in the grid
    • Columns are responsive (two columns until large breakpoint, then four columns to match Blueprint)
    • Justification can be changed on the component and images will be positioned accordingly

Screenshots

Two columns:

Screenshot 2024-04-24 at 3 43 44 PM

Four columns:

Screenshot 2024-04-24 at 3 43 29 PM

With Aspect Ratio:

Screenshot 2024-04-25 at 10 50 55 AM

empee3 commented 2 months ago

I may be overthinking, but should we also add an aspect ratio to the images to keep them a consistent height? This could be assumed from Blueprint, but the placeholder images are all of the same height and width.

nathan-schmidt-viget commented 2 months ago

@empee3 Agreed it looks a bit weird without an aspect ratio. If we can set them in TW so the img is set to object-fit: contain; the parent element as the aspect ratio that would be awesome.