This component has two different variants. The type of the page, the available number of links, and whether the links are external or internal will determine which component to use in each case.
If the available number of Discover more links is 3 or less the layouts below should be used.
To build this component we use a “Grid (6-6)” . In the "Slotted left" we add a "Headline 2" with the text "Discover more" and we add the teasers to the "Slotted right". As a background, "Split Gradient" should be used on evergreen pages and "Roche Grey 1 / 100" on story pages.
If the links are internal "Variant A without image" teaser should be used. If the links are external "Variant D without image" teaser should be used.
Teaser: Teaser (Manual)
Teaser layout: Variant A without image
Background: Split Gradient
Teaser: Teaser External (Manual)
Teaser layout: Variant D without image
Background: Split Gradient
Teaser: Teaser (Manual)
Teaser layout: Variant A without image
Background: Roche Grey 1 / 100
Teaser: Teaser External (Manual)
Teaser layout: Variant D without image
Background: Roche Grey 1 / 100
If the available number of Discover more links is 4 or more the layouts below should be used.
To build this component, we use a "Grid (12)". First, we add a "Headline 2" with the text "Discover more" then we add the teasers to a "Teaser Wall". "Theme aware" should be used as a background color both on evergreen and story pages.
If the links are internal "Variant A without image" teaser should be used. If the links are external "Variant D without image" teaser should be used.
Teaser: Teaser (Manual)
Teaser layout: Variant A without image
Background: Roche Grey 1 / 100
Teaser: Teaser External (Manual)
Teaser layout: Variant D without image
Background: Roche Grey 1 / 100
6-6 Grid
H2 on both sides (Downloads, Discover more)
Download teaser on the left
Internal/External teaser on the right
No background color