Fiserv moves more than money Fiserv moves more than money Fiserv moves more than money
Promo Banner V2
Synopsis: The promo banner component allows authors to create promotional callouts within the page.
Content fields:
Desktop Background Image, Mobile Background Image, Aria label, Title, Description, Analytics Name
Options:
Mode: Gradient, Transparent.
Desktop Image Position: Center (Default), Top, Bottom.
Mob Image Position: Center (Default), Top, Bottom.
Mode color: None, Fiserv Navy, Black, White.
Opacity: 60%, 75%, 90% (Only for Transparent variant).
Text Position: Left, Right (Only for Gradient Variant).
Usage: All pages.
Note: (This component should be authored without Container Component) This should be used as an example only. There will be additional requirements related to each individual component usage and page design, such as font treatments, padding and margin requirements, ADA compliance etc. so please use the below examples for reference only to demonstrate core function.
Scenario 1
Promo Banner V2 - Gradient (Variation) - Mode color (Fiserv navy) - Text position (Left).
Ingredients: Promo Banner V2
Scenario 2
Promo Banner V2 - Gradient (Variation) - Mode color (Black) - Text position (Left).
Ingredients: Promo Banner V2
Scenario 3
Promo Banner V2 - Gradient (Variation) - Mode color (White) - Text position (Left).
Ingredients: Promo Banner V2
Scenario 4
Promo Banner V2 - Gradient (Variation) - Mode color (Fiserv navy) - Text position (Right).
Ingredients: Promo Banner V2
Scenario 5
Promo Banner V2 - Gradient (Variation) - Mode color (Black) - Text position (Right).
Ingredients: Promo Banner V2
Scenario 6
Promo Banner V2 - Gradient (Variation) - Mode color (White) - Text position (Right).
Ingredients: Promo Banner V2
Scenario 7
Promo Banner V2 - Transperent (Variation) - Mode color (Fiserv navy) - Opacity (60%).
Ingredients: Promo Banner V2
Scenario 8
Promo Banner V2 - Transperent (Variation) - Mode color (White) - Opacity (75%).
Ingredients: Promo Banner V2
Scenario 9
Promo Banner V2 - Transperent (Variation) - Mode color (Black) - Opacity (90%).
Ingredients: Promo Banner V2