Do / Don’t lists are included as a child component.
The default notification is white and blue. This is used to signify information that should be noted.
For example, instructions to not copy and paste content directly into a form.
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "default", id: "65a92d900c984" }) }}A green notification is used to signify positive news or an update to information with a favourable outcome.
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "green", id: "65a92d900cc2f" }) }}An amber notification is used to signify an update to key information.
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "amber", id: "65a92d900ccbc" }) }}A red notification is used to signify news of concern, danger or information that requires an immediate action. eed
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "red", id: "65a92d900cd55" }) }}A grey notification is currently often used for quotes.
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "grey", id: "668fa5cd42aec" }) }}In some cases, an notification does not require a title (exclusions are the do / don’t notification).
For example, a message based upon users interactions. As this message confirms a positive outcome, a green notification has been utilised.
{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "green-no-title", id: "65a92d900cda5" }) }}The use of links and bold text within the notification (including descriptions is permitted.
The notification component allow us to highlight content depending on its severity in order to draw the eye to the content.
You can choose from:
A (left aligned) alert component is now a notification component.
e.g. A green (left aligned) alert (with / without a title) component is now a green notification component (with / without a title).
An info box component is now a notification component.
e.g. A green (left aligned) info box (with / without a title) component is now a green notification component (with / without a title).
Previously known as a do / don’t component on the ‘citizen site’.
e.g. a Do / Don’t component is now default notification list with ticks / default notification with crosses (or a mixture of the two).
The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.