Component Name:  CDC Announcement Banner

Fields:  CDC Global Announcement Banner Text

Options:  Able to add links via the rich text field "CDC Global Announcement Banner Text"

Details:  The CDC Announcement Banner is managed as a text property field, labeled "CDC Global Announcement Banner Text" under the CDC section of the CDC Home Page (Project Firstline).

When the "CDC Global Announcement Banner Text" field is set, the CDC Announcement Banner will automatically be displayed on all CDC pages through their layouts. 

The CDC Announcement Banner is also displayed based upon the user's browser session. When the banner is closed by clicking the "x" at the far right of the banner, Javascript is ran which updates the browser's session data to remember that the banner was close and should be hidden on subsequent page loads. This functionality is subject to the end-user's browser settings and data clearing.

Component Name:  CDC Landing Hero

Fields:  CDC Desktop Landing Hero Image, CDC Mobile Landing Hero Image

Details:  Contained full-width Hero component to display an image. In example content, all text and logos are a part of the image. Two image fields are included to select an image for mobile devices and desktop devices.

Mobile image

Recommended width: 750px (height is to client's discretion)

Desktop image

Recommended width: 1440px (height is to client's discretion)

Component Name:  CDC Intro Block

Fields:  Heading, Content, Image, Background Color

Options:  Background Color [ Light-Blue | Purple ], Enable Top Margin

Details:  Background Color is displayed for Heading text, where the font is white and the background color is the selected color, either Light-Blue or Purple.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images: 

Recommented size: 700px x 462px;

Aspect Ratio: 3:2

Component Name:  CDC FAQ Accordion

Fields:  Heading, Text Blocks

Options: Enable Top Margin

Details:  The expanding and collapsing accordion component accepts CDC Text Blocks and CDC Plain Text Blocks for the "Text Blocks" field. New "CDC Plain Text Block" is introduced to provide a simple content block that contains the Heading text and Content text necessary to render the CDC FAQ Accordion sections.

Clicking the Heading text for an accordion section will expand the section to reveal the Content text. Re-clicking the Heading will collapse the Content section. Only one section is open at a time. Opening a second section, when another is already open, will collapse the open section and expand the newly clicked section.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Component Name: CDC News Block

Fields: Override Latest News, Background Color, Enable Top Margin

Options: Background Color [ Orange | Purple | Blue | Teal ], Enable Top Margin [ Yes | No ]

Details:  "Override Latest News" field can optionally be left empty. If Override Latest News field is left empty, by default the component will render the newest CDC News Page found under the "Latest News Root for CDC" page which is a field on the CDC Home Page (Project Firstline) in the CDC tab of the content properties. The latest news page is determined based upon the "Date" field of CDC News Pages.

The "Latest News Root for CDC" field is a page reference in which any page type can be selected. If no news pages exists under the root, the component is not rendered.

The "Override Latest News" field accepts only CDC News Pages. If a news page is selected, it will be rendered in the component.

The Enable Top Margin checkbox can be selected to add additional margin to the top of tcomponent.

Images:

Recommended size;  500px x 400px

Aspect Ratio: 5:4

Component Name:  CDC Three Across News Articles

Fields:  Articles, Background Color, Enable Top Margin

Options:  Background Color [ Light Blue | Teal ], Enable Top Margin [ Yes | No ]

Details:  The "Articles" field accepts CDC News Pages. Additionally, the "Articles" field can accept "CDC Resource" pages in order to support Embedded Youtube Video content, Download content, and External Link content. Items selected in the "Articles" field will render in the order they appear.

Optionally, if the "Articles" field is left empty, the latest CDC News Pages will be automatically selected in order of newest to oldest from the "Latest News Root for CDC" field of the CDC Home Page (Project Firstline) in the "CDC" tab of the content properties. If no Articles are selected and the Latest News Root for CDC field is empty for the CDC homepage, then the compoent is not rendered.

Selected Articles will be displayed in the order they appear in the CMS editor.  When the Articles field is left empty and news pages are selected automatically, they will appear in order of newst to oldest based upon the "Date" field of the pages. Additionally, when news is automatically retrieved, the "Max Cards to Display for Auto-Retrieved CDC News" field is used to limit the number of news cards to display. The limit can be set from 3 to 999.

For CDC News Pages, clicking the image or the card's heading text will link the CDC News Page.

Optionally, for CDC Resources, clicking the image or the card's heaing text will have a result based upon the resource type. Embedded You Video's will reveal a video modal, while Download and External link resources will link to the content.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images: 

500px x 350px

Aspect Ratio: 10:7

Component Name:  CDC Intro Text

Fields:  Heading, Content, Button

Options:  Enable Top Margin

Details:  This text component will display the Heading text, Content text, and the selected Button. The Button is optional. If the button is not present, the text will span the full width of the container. If the button is present, the button will display to the right of the text for desktop devices and below the text for mobile devices.

The Button field accepts "Button Block" and "CDC Register Button Block" content.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Component Name: CDC Alternating Image Text Block

Fields: Image, Title, Text, Link, Link Label, Link Target, Flip Horizontally, Color Theme

Options:  Flip Horizontally [ Yes | No ], Color Theme [ Blue | Gold ], Enable Top Margin [ Yes | No ]

Details:  This component allows the rendering of Text, Image, and Link content to be displayed in an alternating fashion, by using the "Flip Horizontally" checkbox and displaying multiple Alternating Image Text Blocks in series. Additionally, the component can be displayed with either a Blue Background or a Gold Background.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images: 

Recommended size: 500 x 400

Aspect Ratio: 5:4

Component Name:  CDC Featured Resources

Fields:  Heading, Resources, Background Color

Options:  Background Color [ Blue | Gold ], Enable Top Margin

Details:  This component displays CDC Resource pages in a 3 column card layout with a solid color background of either Blue or Gold. For each card, the image, icon and text are clickable. The click behavior for each card depends on the content of the particular CDC Resource. Embedded Youtube Video resource content will reveal a video modal when clicked. Resources with Download content and with External Link content will link the content accordingly.

Each card will render any "Source" and/or "Topics" CDC Taxonomy tags that set for their respective CDC Resource page. The Source tags will be rendered first, followed by any Topics tags. 

If a CDC Resource does not have any Embedded Youtube Video content, External Link content, or Download content, the card will link the the CDC Resource page directly when clicked.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images:

Recommended size: 500px x 330px

Aspect Ratio: 3:2

Component Name:  CDC Four Across Insights Block

Fields:  Resources

Options:  Enable Top Margin [ Yes | No ]

Details:  This component displays CDC Resource pages in a 4 column card layout. For each card, the image, icon and text are clickable. The click behavior for each card depends on the content of the particular CDC Resource. Embedded Youtube Video resource content will reveal a video modal when clicked. Resources with Download content and with External Link content will link the content accordingly.

If a CDC Resource does not have any Embedded Youtube Video content, External Link content, or Download content, the card will link the the CDC Resource page directly when clicked.

At the lower right-hand corner of each card, an Add This social media share button is available to share the CDC Resource content. The social media share button will reveal the Add This modal to share the content. For Download and External Link resource content, the respective url link will be shared. For Embedded Youtube Video resource content, the Url from the "Embeded Content URL" field is shared. If embedded content, download content, and external content is not set for the CDC Resource, a link to the resource item directly is linked.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images:

Recommended size: 500px x 550px

Aspect Ratio: 1 : 1.1

Component Name: CDC Four Across News Cards

Fields: Heading, News Cards

Options:  Enable Top Margin

Details:  This component displays CDC News Pages in a 4 column card layout. Each card has a semi-transparent purple overaly that covers the bottom half of the card. The overlay contains the Heading text and summary text from the news page. When hovering over a card, the semi-transparent overlay expands to cover the entire card. Clicking either the heading or summary text will link to the CDC News Page. 

The summary text for each card is derived from the "Intro Text" field of the corresponding CDC News Page. If the "Intro Text" field is empty for a news page, the "Content" field is used to generate the summary text. If the "Content" field is empty, then the "Description" field is used to generate the summary text.

The summary text is truncated to a maximum 225 characters in length for when the overlay is at half-height of the card (no-hover). When the overlay is at full height of the card (hover), the summary text is truncated to a maximum 600 characters.

When the summary text is trucated, the text is appended with ellipse (...).

At the lower right-hand corner of each card, an Add This social media share button is available to share the CDC News Page. The social media share button will reveal the Add This modal to share the CDC News Page.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images:

Recommended size: 280px x 400px

Aspect Ratio: 10:7

Component Name:  CDC Resource Carousel

Fields:  Heading, Resources

Options:  Enable Top Margin [ Yes | No ]

Details:  The CDC Resource Carousel displays CDC Resource pages in a 4 column card layout with carousel slide and pagination functionality. Immediately to the left and right of the carousel slide are previous slide and next slide buttons (< and > symbols) respectively. Below the carousel slide are pagination buttons indicated by circles. The orange circle is the current slide, and the hollow blue cirecles are the other slide pagination buttons.

For each card, the image, icon and text are clickable. The click behavior for each card depends on the content of the particular CDC Resource. Embedded Youtube Video resource content will reveal a video modal when clicked. Resources with Download content and with External Link content will link the content accordingly.

If a CDC Resource does not have any Embedded Youtube Video content, External Link content, or Download content, the card will link the the CDC Resource page directly when clicked.

At the lower right-hand corner of each card, an Add This social media share button is available to share the CDC Resource content. The social media share button will reveal the Add This modal to share the content. For Download and External Link resource content, the respective url link will be shared. For Embedded Youtube Video resource content, the Url from the "Embeded Content URL" field is shared. If embedded content, download content, and external content is not set for the CDC Resource, a link to the resource item directly is linked.

Each card will display any "Source" and/or "Topics" CDC Taxonomy tags that set for their respective CDC Resource page. The Source tags will be displayed first, followed by any Topics tags. 

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Images: 

Recommended size: 500 x 350

Aspect Ratio: 10:7

Component Name:  CDC Testimonial Block

Fields:  Heading, Sub-Heading, Cards

Options:  2, 3, or 4 Cards

Details:  The CDC Testimonial Block components displays CDC Testimonial Cards. Between 2 and 4 cards are displayed in a side-by-side layout. Each CDC Testimonial Card will render all available content for each card.

CDC Testimonial Cards contain the following content: Photo, Text, Author, Organization, and Enable Top Margin. The Enable Top Margin field has no effect on how the cards are displayed within the CDC Testimonial Block and only has an effect, when CDC Testimonial Cards are displayed individually on a page at a block directly.

Images: 

Recommended size: 150px x 150px

Aspect Ratio: 1:1

Component Name: CDC Testimonial Card

Fields: Photo, Text, Author, Organization

Details:  The CDC Testimonial Card block can be displayed directly onto a CDC Page as a Block component. 

When one CDC Testimonial Card is displayed directly as a block component, the card will be the full width of its container.

When two CDC Testimonial Card blocks are displayed in series directly, the cards will be displayed side-by-side, roughly half the width of their container.

A third CDC Testimonial Card block will have the full width of its container when displayed.

Component Name:  CDC Quote with Author Block

Fields:  Text, Author

Options:  Enable Top Margin

Details:  CDC Quote with Author Block is a stand-alone quote block that displays quote text followed by an optional Author line. The quote text will start with quotation marks displayed underneath the first word of the text.

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Component Name: CDC Green CTA Banner

Fields: CTA Background Image, CTA Logo Image, Text, Buttons, Enable Top Margin

Details: CTA Logo Image and Buttons are optional fields. The Green CTA Banner can functionally be displayed with just the CTA Background Image and Text. 

The Buttons field accepts one "Button Block" content item. 

The Enable Top Margin checkbox can be selected to add additional margin to the top of the component.

Right Image: 

Recommended size: 600 x 338

Aspect Ratio: 16:9

Left Logo:  

It is static and will not change sizes between different screens.  The current size on the demo page is 422px x 80px