diff --git a/src/views/message/MessageDemo.vue b/src/views/message/MessageDemo.vue index 50bf6d68e..b8aff05fa 100755 --- a/src/views/message/MessageDemo.vue +++ b/src/views/message/MessageDemo.vue @@ -21,6 +21,23 @@ {{msg.content}} +
Inline Messages
+

Message component is used to display inline messages mostly within forms.

+
+
+ Message Content +
+
+ Message Content +
+
+ Message Content +
+
+ Message Content +
+
+
Auto Dismiss
This message will hide in 3 seconds. diff --git a/src/views/message/MessageDoc.vue b/src/views/message/MessageDoc.vue index 0606ebf00..ea8d027cc 100755 --- a/src/views/message/MessageDoc.vue +++ b/src/views/message/MessageDoc.vue @@ -260,6 +260,23 @@ import InlineMessage from 'primevue/inlinemessage'; <h5>Auto Dismiss</h5> <Message severity="warn" :life="3000" :sticky="false">This message will hide in 3 seconds.</Message> +<h5>Inline Messages</h5> +<p>Message component is used to display inline messages mostly within forms.</p> +<div class="p-grid"> + <div class="p-col-12 p-md-3"> + <InlineMessage severity="info">Message Content</InlineMessage> + </div> + <div class="p-col-12 p-md-3"> + <InlineMessage severity="success">Message Content</InlineMessage> + </div> + <div class="p-col-12 p-md-3"> + <InlineMessage severity="warn">Message Content</InlineMessage> + </div> + <div class="p-col-12 p-md-3"> + <InlineMessage severity="error">Message Content</InlineMessage> + </div> +</div> + <h5>Validation Message</h5> <div class="p-formgroup-inline" style="margin-bottom:.5rem"> <label for="username" class="p-sr-only">Username</label>