Feedback callouts
When we launch a new feature or a redesign, we like to gather feedback. A feedback callout should accompany these changes for a few weeks after launching. Put the feedback callout at the top of the page where people will see it.
Feedback callouts are different from other types of callouts because they:
- only appear on a page for a few weeks after a new feature launch
- are for major new features introduced by the Web Team
Development info
- Stylesheet location:
/source-v6/styles/components/_callouts.scss
- In WordPress, these callouts need to be added in the text editor (there isn’t a shortcode)
div class="info feedback"
- shouldn’t include a heading
- use the comments Font Awesome icon – use the icon shortcode in WordPress
-
<div class="info feedback"> <i class="fas fa-comments" aria-hidden="true" title="comments"></i><i class="visually-hide">comment icon</i> <p>You're looking at the new transfer site! <a href="mailto:webteam@pcc.edu">Let us know</a> if you have questions, feedback, or praise.</p> </div>
Styling
Feedback callouts have a single solid color, rounded corners, icon and subtle fade-in animation to make them more visible. They should never be in the sidebar.
Responsive behavior
No change.
comments
You’re looking at the new transfer site! Let us know if you have questions, feedback, or praise.