Arches: ACC & Bootstrap

Arches:ACC & Bootstrap

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/acc_boot.css, line 8837

5.7.5.1.5 CTA Highlight
experimental

The CTA Highlight component is used to create a highlighted call-to-action section.

Example s

Modifier: inverted

This modifier class is used to create an inverted version of the CTA Highlight component, which can be applied when a dark background is present.

The Value of UX and Member Engagement

Accusantium iure non nam quaerat nesciunt ad. Vero nobis ea quo laudantium eum esse. Officiis eum nemo id minus ut itaque et et beatae. Voluptas est incidunt.

caution:
This item is not finalized and might be subject to change
NOTE:
The CTA Highlight component is effective for drawing attention to important calls-to-action on a website or application. When using the 'inverted' modifier class, it provides a visually striking effect when placed on a dark background. 
<div data-item="cta-callout" class="[modifier class] c_white color_inherit font_0 isolation_isolate m-b_4 m-t_n4 m-x_4 m-x_5:lg p_4 p_5:lg reading-typography relative z_1">
      <h2 data-item="cta-title" class="font_medium m-t_0">The Value of UX and Member Engagement</h2>
      <p data-item="cta-description" class="font-size_up-1 lh_2">Accusantium iure non nam quaerat nesciunt ad. Vero nobis ea quo laudantium eum esse. Officiis eum nemo id minus ut itaque et et beatae. Voluptas est incidunt.</p>
      <div class="grid justify_center">
        <button  class="btn btn-primary not-link">Get Started</button>
      </div>
</div>
Copy Code