AKA – Column Rotator
Contents
Requirements
Title | Description | |
---|---|---|
1 | CMS-Managed | This component will be manually managed by an admin user in the CMS. |
2 | Background Color | Admins will be able to select a light grey background |
3 | Number of items | There will be a minimum of three items in the component, with no maximum. Component will always center the columns |
4 | Referenced fields | Admins will manually pages to feature in the component. Component will reference and display the following fields per item:
|
5 | Rotator function | When more than four items are included in the component, the rotator function will be triggered. Users will be able to scroll through the items using the arrows provided. Dot indicators should be used below component to reference rotating path to user. |
6 | Hover state and linking | Each item in the component will feature a hover state to indicate clickable content. Clicking on any item or link in the component will take a user to the page specified by an admin in the CMS. |
CMS Fields
Field Label | Field Type | Required? | Notes | |
---|---|---|---|---|
1 | Background color | checkbox | no | Should allow light grey background when selected |
2 | Eyebrow | single-line text | no | for entire component |
3 | Title | single-line text | yes | for entire component |
4 | Top Link | general link | no | includes link text and URL |
5 | Add Column | treelist | yes | minimum of three; including five or more triggers rotator |
6 | Show Eyebrow | checkbox | no | allows admins to specify eyebrow text per item |
7 | Eyebrow | single line text | no | |
8 | Show Images | checkbox | no | unchecked by default; when checked, page featured images will be pulled in for each column (Dimensions: 425 x 300) |
9 | Show Description | checkbox | no | default is not checked; when checked, each column will reference and display the teaser text |
10 | Bottom Link | general Link | no | admin will enter link text and URL in button |
https://styleguide.asce.org/section-components.html#asgref-components-columns-slider