File tree Expand file tree Collapse file tree
site/content/docs/v2/components Expand file tree Collapse file tree Original file line number Diff line number Diff line change 11{
22 "recommendations" : [
33 " EditorConfig.EditorConfig" ,
4+ " HTMLHint.vscode-htmlhint" ,
45 " streetsidesoftware.code-spell-checker" ,
56 " stylelint.vscode-stylelint"
67 ],
Original file line number Diff line number Diff line change @@ -9,12 +9,28 @@ aliases:
99 - " /components/messages/"
1010---
1111
12+ {{< deprecated-in "2.3.2" >}}
13+
14+ {{< callout warning >}}
15+ The Messages component is deprecated and will be removed in a future major release. Use the info alert pattern (` .alert.alert-info ` ) for new work.
16+ {{< /callout >}}
17+
1218## Overview
1319
14- Messages should be used within other elements to convey helpful information in
15- an unobtrusive way.
20+ Messages are a legacy pattern that should no longer be used for new UI.
21+
22+ ## Recommended replacement
23+
24+ Use an info alert to show contextual static information.
25+
26+ {{< example >}}
27+ <div class =" alert alert-info d-flex align-items-center " role =" alert " >
28+ <i class =" modus-icons notranslate me-1 " aria-hidden =" true " >info</i >
29+ <div >This is an informational alert.</div >
30+ </div >
31+ {{< /example >}}
1632
17- ## Examples
33+ ## Legacy examples
1834
1935To use a message, simply use the ` .message ` class followed by the appropriate ` .message-{theme-color} ` class to apply
2036color. Use an appropriate icon before the text within a message to further convey meaning.
You can’t perform that action at this time.
0 commit comments