Comment on page

Comparison cards

Configuring your comparison cards
In the Theme menu, there are three options for styling comparison cards: Default, Highlighted, and Selected.
Default: this is the default state of the card, and inherits styling from the default theme. No additional configuration is required except adding a comparison card to the step, but additional/differentiating styling can be added if desired.
Highlighted: if an option has been designated as "highlighted" in the question settings, the styling for the highlighted card can be set here.
Selected: styling for when a card has been selected by the user.
Each of the above three configurations can be further styled on a per-UI state basis: default and hover.
The horizontal overflow behavior selector controls how the cards fill the space on the step, and has two settings, wrap and scroll.
  • Wrap: if the container holding the cards exceeds the width allotted for the container of the step, the cards will begin to stack vertically.
  • Scroll: if the cards exceed the width allotted, the a horizontal scroll will become available.
Related pages: Content Types: Comparison