Logo List

πŸ‘¨β€πŸ’Ό I know I repeat myself, but... make the list of logos look like the design in Figma πŸ˜…

Wrapping list

🐨 Implement the correct gap, max-width and alignment on the ul element, according to the Figma specs.
πŸ’° For the max-width, you need to look at larger screens on the design. Since we might be previewing our design on larger viewports, it's nice to already have the correct max-width set up, so it doesn't look ridiculously wide.
πŸ’° Since the tiles seem to be flowing line by line and wrapping, you probably want to look into using πŸ“œ flex-wrap on that ul element.

Logo tile

🐨 Apply the logo tile styles on the a element, based on the Figma design.
πŸ‘¨β€πŸ’Ό Pay attention to the size, background opacity, border-radius and all!
πŸ’° To center the logo inside the tile, you can use make the a tag a grid, and used our now best friend πŸ“œ place-items property.

Please set the playground first

Loading "Logo List"
Loading "Logo List"

Access Denied

You must login or register for the workshop to view and run the tests.

Check out this video to see how the test tab works.