Come for the code, stay for the community

Task: Careers view w/ cards

The current page, built in D7 uses Views Merge Rows, and CSS Injector modules to style the cards.

What's the best way to build this in the new D10 site?

Image
Biotech Careers - Careers view w/ cards

A quick win is using the new Responsive Grid view display, which is now available in core.

A low code approach could be to display fields in views, and customize wrappers, classes, and custom twig output.

The new  theme uses tailwind, so a lot could be achieved this way.

Layout builder could be used to customize a card display mode.

This led to a lot of extra wrapper markup in the output.

The No Markup module can help, but there is still a lot of layers.

SDC can be used for maximum customization of the display mode, but takes the most amount of coding.

If you are resorting to code anyway, it's nice to have it all in one place.

Plus, since the css is automatically loaded with the component, it's quick and efficient to work with.

SDC Display is a module that lets you render entity display modes as an SDC component.

It provides a UI in manage display to configure how the fields populate props and slots.

You can also use tokens to pass in raw values or other entity data.

Project