The frontend is built up on a design system. All low level components are defined there and are organised as:
- Atoms: Atoms are the basic building blocks of all matter
- Molecules: Molecules are groups of two or more atoms held together by chemical bonds
- Organisms: Organisms are assemblies of molecules functioning together as a unit
- Layouts: Layouts are components used as wrappers
- Decorators: Decorators are utility wrappers like aspect ratios or lazy loading
You can check it out here.
For display content of the DXP the components of the design system are assembled to higher components in the front end.
All components are self contained. This means they can be displayed anywhere and always behave in the same way. This allow the components to be fully nested. Higher level components are combinations of lower leve components.
The following components can be used in the DXP:
- Accordion (and Accordion item)
- File
- Gallery
- Grid
- Headline
- Image Text
- Page reference
- Remote Video
- Slideshow (and Slide)
- Teaser box
- Two columns
- Video
- Video text
The following are not components, but can be used for display in DXP:
- Anchor
- Block reference
- Image
Text